fixed styles destructuring support

Author: Barzilay, Oshri (ob143h)

lib/rules/no-unused-styles.js

@@ -36,24 +36,9 @@ module.exports = Components.detect((context, components) => {
       }
     },
 
-    ArrayExpression: function (arrayNode) {
-      if (arrayNode && arrayNode.elements && arrayNode.elements.length) {
-        arrayNode.elements
-          .flatMap((node) => {
-            const styleRef = astHelpers.getPotentialStyleReferenceFromArrayExpression(node);
-            return styleRef ? [styleRef] : [];
-          })
-          .forEach((styleRef) => {
-            styleReferences.add(styleRef);
-          });
-      }
-    },
-
-    JSXExpressionContainer: function (node) {
-      const styleRef = astHelpers.getPotentialStyleReferenceFromJSXExpressionContainer(node);
-      if (styleRef) {
-        styleReferences.add(styleRef);
-      }
+    VariableDeclarator: function (node) {
+      const styleRefs = astHelpers.getPotentialDestructuredStyleReferences(node);
+      styleRefs.forEach(styleReferences.add, styleReferences);
     },
 
     CallExpression: function (node) {
@@ -68,9 +53,7 @@ module.exports = Components.detect((context, components) => {
     'Program:exit': function () {
       const list = components.all();
       if (Object.keys(list).length > 0) {
-        styleReferences.forEach((reference) => {
-          styleSheets.markAsUsed(reference);
-        });
+        styleReferences.forEach(styleSheets.markAsUsed, styleSheets);
         reportUnusedStyles(styleSheets.getUnusedReferences());
       }
     },

lib/util/stylesheet.js

@@ -30,13 +30,7 @@ StyleSheets.prototype.markAsUsed = function (fullyQualifiedName) {
   const styleSheetName = nameSplit[0];
   const styleSheetProperty = nameSplit[1];
 
-  if (nameSplit.length === 1) {
-    Object.keys(this.styleSheets).forEach((key) => {
-      this.styleSheets[key] = this.styleSheets[key].filter(
-        (property) => property.key.name !== styleSheetName
-      );
-    });
-  } else if (this.styleSheets[styleSheetName]) {
+  if (this.styleSheets[styleSheetName]) {
     this.styleSheets[styleSheetName] = this.styleSheets[styleSheetName].filter(
       (property) => property.key.name !== styleSheetProperty
     );
@@ -122,6 +116,14 @@ const astHelpers = {
     );
   },
 
+  getDestructuringAssignmentParts: function (node) {
+    if (node && node.id && node.id.type === 'ObjectPattern' && node.id.properties && node.init) {
+      return [node.init.name, node.id.properties];
+    }
+
+    return [null, null];
+  },
+
   getStyleSheetName: function (node) {
     if (node && node.parent && node.parent.id) {
       return node.parent.id.name;
@@ -470,24 +472,16 @@ const astHelpers = {
     }
   },
 
-  getPotentialStyleReferenceFromArrayExpression: function (node) {
-    if (node && node.type === 'Identifier' && node.name) {
-      return node.name;
-    }
-  },
+  getPotentialDestructuredStyleReferences: function (node) {
+    const [styleSheetName, properties] = this.getDestructuringAssignmentParts(node);
 
-  getPotentialStyleReferenceFromJSXExpressionContainer: function (node) {
-    if (
-      node
-      && node.expression
-      && node.expression.type === 'Identifier'
-      && node.expression.name
-      && node.parent
-      && node.parent.name
-      && ['style', 'textStyle'].includes(node.parent.name.name)
-    ) {
-      return node.expression.name;
-    }
+    return styleSheetName && properties
+      ? properties.flatMap((property) =>
+          property.key && property.key.type === 'Identifier' && property.key.name
+            ? `${styleSheetName}.${property.key.name}`
+            : []
+        )
+      : [];
   },
 
   isEitherShortHand: function (property1, property2) {