From bd616e2b91d43eac93597d5429943ae6fd2a1ef4 Mon Sep 17 00:00:00 2001
From: atanasster <atanasster@gmail.com>
Date: Wed, 17 Mar 2021 05:39:12 -0400
Subject: [PATCH] fix: convert class Sring to string in attributes

---
 .../src/babel/extract-attributes.ts           | 12 ++++---
 .../src/misc/component-attributes.ts          | 36 ++++---------------
 2 files changed, 14 insertions(+), 34 deletions(-)

diff --git a/core/instrument/src/babel/extract-attributes.ts b/core/instrument/src/babel/extract-attributes.ts
index 96f4f3386..af7b1f30d 100644
--- a/core/instrument/src/babel/extract-attributes.ts
+++ b/core/instrument/src/babel/extract-attributes.ts
@@ -5,6 +5,9 @@ interface StoryAttribute {
   value: any;
 }
 
+export const getAttribueValue = (value: any): string =>
+  value instanceof String ? value.toString() : value;
+
 const nodeToValue = (node: any): any => {
   if (node) {
     switch (node.type) {
@@ -76,8 +79,8 @@ export const extractAttributes = (
             const name: string = propNode.key
               ? propNode.key.name ?? propNode.key.value
               : propNode.property?.name || propNode.name;
-
-            return { ...acc, [name]: attribute.value };
+            const value = getAttribueValue(attribute.value);
+            return { ...acc, [name]: value };
           } else {
             return acc;
           }
@@ -88,7 +91,7 @@ export const extractAttributes = (
     }
     const attribute = nodeToAttribute(node);
     if (attribute) {
-      return attribute.value;
+      return getAttribueValue(attribute.value);
     }
   }
   return undefined;
@@ -100,9 +103,10 @@ export const collectAttributes = (node: any): Record<string, string> => {
       if (!attribute.value) {
         //console.log(attribute);
       } else if (attribute.value.type === 'StringLiteral') {
+        const value = getAttribueValue(attribute.value.value);
         return {
           ...acc,
-          [attribute.name.name]: attribute.value.value,
+          [attribute.name.name]: value,
         };
       } else if (attribute.value.type === 'JSXExpressionContainer') {
         return {
diff --git a/core/instrument/src/misc/component-attributes.ts b/core/instrument/src/misc/component-attributes.ts
index 7b4fa01f4..32928c38c 100644
--- a/core/instrument/src/misc/component-attributes.ts
+++ b/core/instrument/src/misc/component-attributes.ts
@@ -1,48 +1,24 @@
 import { Story, Document } from '@component-controls/core';
 
-const componentName = (
-  component: string | Record<string, unknown> | undefined,
-) => {
-  if (component) {
-    if (typeof component === 'string') {
-      return component;
-    }
-    if (typeof component.toString === 'function') {
-      return component.toString();
-    }
-  }
-  return undefined;
-};
 export const componentsFromParams = (
   element: (Document | Story) & { of?: string },
 ): string[] => {
   const result = [];
   const { component } = element;
-  const name = componentName(component as string);
-  if (name) {
-    // transform to string
-    element.component = name;
-    result.push(name);
+  if (component) {
+    result.push(component as string);
   }
-  const { of: componentShorthand } = element;
-  const ofName = componentName(componentShorthand);
+  const { of: ofName } = element;
   if (ofName) {
     result.push(ofName);
   }
   const { subcomponents } = element;
   if (typeof subcomponents === 'string') {
-    result.push(subcomponents);
+    result.push(subcomponents as string);
   }
   if (typeof subcomponents === 'object') {
-    element.subcomponents = Object.keys(subcomponents).reduce(
-      (acc, key) => ({
-        ...acc,
-        [key]: componentName(subcomponents[key] as string),
-      }),
-      {},
-    );
-    Object.keys(element.subcomponents).forEach(key =>
-      result.push((element.subcomponents as any)[key]),
+    Object.keys(subcomponents).forEach(key =>
+      result.push((subcomponents as any)[key] as string),
     );
   }
   return result;