Merge pull request #46 from optimistdigital/simple-repeatable-support

OptimistDigital/NovaSimpleRepeatable support, Minor reworks
outl1ne · Jan 28, 2021 · f359eff · f359eff
2 parents 9424251 + ac880bc
commit f359eff
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 34 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,17 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.7.0] - 2021-01-28
+
+### Added
+
+- Added a new vue component for `LocaleTabs` -> `nova-translatable-locale-tabs`
+- Added `nova-simple-repeatable` support
+
+### Changed
+
+- Simplified `fill` method, removed duplicate code.
+
 ## [1.6.12] - 2021-01-21
 
 ### Changed

diff --git a/dist/js/translatable-field.js b/dist/js/translatable-field.js
diff --git a/resources/js/components/FormField.vue b/resources/js/components/FormField.vue
@@ -68,39 +68,11 @@ export default {
 
     fill(formData) {
       try {
-        if (this.isFlexible) {
-          if (this.isFile) {
-            alert('Sorry, nova-translatable File and Image fields inside Flexible currently do not work.');
-            return;
-          }
-
-          const data = {};
-          const originalAttribute = this.field.translatable.original_attribute;
-
-          for (const locale of this.locales) {
-            const tempFormData = new FormData();
-            const field = this.fields[locale.key];
-            field.fill(tempFormData);
-
-            const formDataKeys = Array.from(tempFormData.keys());
-            for (const rawKey of formDataKeys) {
-              const [key, value] = this.getKeyAndValue(rawKey, locale, tempFormData);
+        if (this.isFlexible && this.isFile)
+          return alert('Sorry, nova-translatable File and Image fields inside Flexible currently do not work.');
 
-              if (key.endsWith(originalAttribute + `[${locale.key}]`)) {
-                const isArray = this.isKeyAnArray(rawKey);
-
-                if (isArray) {
-                  if (!data[locale.key]) data[locale.key] = [];
-                  data[locale.key].push(value);
-                } else {
-                  data[locale.key] = value;
-                }
-              }
-            }
-          }
-          formData.append(originalAttribute, JSON.stringify(data));
-          return;
-        }
+        const data = {};
+        const originalAttribute = this.field.translatable.original_attribute;
 
         for (const locale of this.locales) {
           const tempFormData = new FormData();
@@ -110,9 +82,22 @@ export default {
           const formDataKeys = Array.from(tempFormData.keys());
           for (const rawKey of formDataKeys) {
             const [key, value] = this.getKeyAndValue(rawKey, locale, tempFormData);
-            formData.append(key, value);
+
+            if (this.isFlexible || this.isSimpleRepeatable) {
+              if (this.isKeyAnArray(rawKey)) {
+                if (!data[locale.key]) data[locale.key] = [];
+                data[locale.key].push(value);
+              } else {
+                data[locale.key] = value;
+              }
+            } else {
+              formData.append(key, value);
+            }
           }
         }
+
+        if (this.isFlexible || this.isSimpleRepeatable) formData.append(originalAttribute, JSON.stringify(data));
+        return;
       } catch (e) {
         console.error(e);
       }

diff --git a/resources/js/mixins/TranslatableField.js b/resources/js/mixins/TranslatableField.js
@@ -57,6 +57,15 @@ export default {
       return this.$parent && this.$parent.field && this.$parent.field.component === 'nova-flexible-content';
     },
 
+    isSimpleRepeatable() {
+      return (
+        this.$parent &&
+        this.$parent.$parent &&
+        this.$parent.$parent.field &&
+        this.$parent.$parent.field.component === 'simple-repeatable'
+      );
+    },
+
     isFile() {
       return ['file-field'].includes(this.field.translatable.original_component);
     },

diff --git a/resources/js/translatable-field.js b/resources/js/translatable-field.js
@@ -1,9 +1,11 @@
 import FormField from './components/FormField';
 import DetailField from './components/DetailField';
 import IndexField from './components/IndexField';
+import LocaleTabs from './components/LocaleTabs';
 
 Nova.booting((Vue, router, store) => {
   Vue.component('index-translatable-field', IndexField);
   Vue.component('form-translatable-field', FormField);
   Vue.component('detail-translatable-field', DetailField);
+  Vue.component('nova-translatable-locale-tabs', LocaleTabs);
 });