Allow deeply nested objects to have media

Without this change, we can’t pass something like `product.attributes.color` as the “model”. This allows us to do some really weird things, like allow only the first child of some object to have media (e.x.: `model === ‘parent.children[0]’`). This does NOT prevent problems where the model doesn’t exist (you’ll get an error: `TypeError: Cannot read property 'medias_single' of undefined`), but that’s something that the developer should check (make sure you have the right path). The Typy package has some other neat things it can do, if you’re interested: https://github.com/flexdinesh/typy Signed-off-by: Micheal Mand <[email protected]>
arturmamedov · Nov 1, 2018 · 773f160 · 773f160
1 parent a475153
commit 773f160
Show file tree

Hide file tree

Showing 7 changed files with 26,049 additions and 24,244 deletions.
diff --git a/.gitignore b/.gitignore
@@ -10,5 +10,6 @@ yarn-error.log
 .env
 composer.lock
 package-lock.json
+yarn.lock
 .phpunit.result.cache
 .php_cs.cache
diff --git a/Modules/Media/Assets/js/mixins/MultipleFileSelector.js b/Modules/Media/Assets/js/mixins/MultipleFileSelector.js
@@ -1,29 +1,35 @@
+import t from 'typy';
+
 export default {
     methods: {
         selectMultipleFile(event, model) {
-            if (typeof this[model].medias_multi === 'undefined') {
-                this.$set(model, 'medias_multi', {});
+            const entity = t(this, model).safeObject;
+
+            if (typeof entity.medias_multi === 'undefined') {
+                this.$set(entity, 'medias_multi', {});
             }
 
-            if (typeof this[model].medias_multi[event.zone] === 'undefined') {
-                this.$set(this[model].medias_multi, event.zone, { files: [], orders: '' });
+            if (typeof entity.medias_multi[event.zone] === 'undefined') {
+                this.$set(entity.medias_multi, event.zone, { files: [], orders: '' });
             }
 
             if (event.id !== null && event.id !== undefined) {
-                const medias = new Set(this[model].medias_multi[event.zone].files);
+                const medias = new Set(entity.medias_multi[event.zone].files);
                 medias.add(event.id);
-                this.$set(this[model].medias_multi[event.zone], 'files', [...medias]);
+                this.$set(entity.medias_multi[event.zone], 'files', [...medias]);
             }
         },
         unselectFile(event, model) {
+            const entity = t(this, model).safeObject;
+
             if (event.id !== null && event.id !== undefined) {
-                const medias = new Set(this[model].medias_multi[event.zone].files);
+                const medias = new Set(entity.medias_multi[event.zone].files);
                 medias.delete(event.id);
-                this.$set(this[model].medias_multi[event.zone], 'files', [...medias]);
+                this.$set(entity.medias_multi[event.zone], 'files', [...medias]);
             }
 
-            if (this[model].medias_multi[event.zone].files.length === 0) {
-                this.$delete(this[model].medias_multi, event.zone);
+            if (entity.medias_multi[event.zone].files.length === 0) {
+                this.$delete(entity.medias_multi, event.zone);
             }
         },
     },

diff --git a/Modules/Media/Assets/js/mixins/SingleFileSelector.js b/Modules/Media/Assets/js/mixins/SingleFileSelector.js
@@ -1,18 +1,22 @@
+import t from 'typy';
+
 export default {
     methods: {
         selectSingleFile(event, model) {
-            if (typeof this[model].medias_single === 'undefined') {
-                this.$set(this[model], 'medias_single', {});
+            const entity = t(this, model).safeObject;
+
+            if (typeof entity.medias_single === 'undefined') {
+                this.$set(entity, 'medias_single', {});
             }
 
-            if (typeof this[model].medias_single[event.zone] === 'undefined') {
-                this.$set(this[model].medias_single, event.zone, null);
+            if (typeof entity.medias_single[event.zone] === 'undefined') {
+                this.$set(entity.medias_single, event.zone, null);
             }
 
             if (event.id !== null && event.id !== undefined) {
-                this.$set(this[model].medias_single, event.zone, event.id);
+                this.$set(entity.medias_single, event.zone, event.id);
             } else {
-                this.$delete(this[model].medias_single, event.zone);
+                this.$delete(entity.medias_single, event.zone);
             }
         },
     },

diff --git a/package.json b/package.json
@@ -29,6 +29,7 @@
     "form-backend-validation": "^2.3.3",
     "lodash": "^4.17.10",
     "moment": "^2.22.2",
+    "typy": "^2.0.1",
     "vue": "^2.5.16",
     "vue-data-tables": "^3.4.0",
     "vue-events": "^3.1.0",

diff --git a/public/css/app.css b/public/css/app.css