refactor: remove union discriminator between Component and Story (#1922)

This is no longer useful in public APIs since we no longer mix them up in the same list.
fwouts · Aug 13, 2023 · 35806fb · 35806fb
1 parent 3bd8836
commit 35806fb
Show file tree

Hide file tree

Showing 25 changed files with 129 additions and 192 deletions.
diff --git a/api/src/rpcs.ts b/api/src/rpcs.ts
@@ -37,15 +37,13 @@ export type Component = {
   componentId: string;
   start: number;
   end: number;
-  kind: "component";
   exported: boolean;
 };
 
 export type Story = {
   componentId: string;
   start: number;
   end: number;
-  kind: "story";
   args: {
     start: number;
     end: number;

diff --git a/chromeless/src/preview.ts b/chromeless/src/preview.ts
@@ -128,10 +128,13 @@ export async function startPreview({
       const { components, stories } = await workspace.detectComponents({
         filePaths: [filePath],
       });
-      const matchingDetectedComponent =
-        components.find((c) => componentId === c.componentId) ||
-        stories.find((c) => componentId === c.componentId);
-      if (!matchingDetectedComponent) {
+      const matchingDetectedComponent = components.find(
+        (c) => componentId === c.componentId
+      );
+      const matchingDetectedStory = stories.find(
+        (c) => componentId === c.componentId
+      );
+      if (!matchingDetectedComponent && !matchingDetectedStory) {
         throw new Error(
           `Component may be previewable but was not detected by framework plugin: ${componentId}`
         );
@@ -145,14 +148,13 @@ export async function startPreview({
         computePropsResponse.types
       );
       if (!propsAssignmentSource) {
-        propsAssignmentSource =
-          matchingDetectedComponent.kind === "story"
-            ? "properties = null"
-            : await generatePropsAssignmentSource(
-                props,
-                autogenCallbackProps.keys,
-                computePropsResponse.types
-              );
+        propsAssignmentSource = matchingDetectedStory
+          ? "properties = null"
+          : await generatePropsAssignmentSource(
+              props,
+              autogenCallbackProps.keys,
+              computePropsResponse.types
+            );
       }
       const donePromise = new Promise<void>((resolve, reject) => {
         onRenderingDone = resolve;

diff --git a/component-analyzer/api/src/api.ts b/component-analyzer/api/src/api.ts
@@ -28,7 +28,6 @@ export interface BaseComponent {
 }
 
 export interface Component extends BaseComponent {
-  kind: "component";
   exported: boolean;
   extractProps: () => Promise<ComponentProps>;
 }
@@ -39,7 +38,6 @@ export interface ComponentProps {
 }
 
 export interface Story extends BaseComponent {
-  kind: "story";
   args: {
     start: number;
     end: number;

diff --git a/component-analyzer/react/src/extract-component.spec.ts b/component-analyzer/react/src/extract-component.spec.ts
@@ -110,12 +110,10 @@ export const AlsoNotAStory = {
     expect(await extract(APP_TSX)).toMatchObject([
       {
         componentId: "App.tsx:DeclaredFunction",
-        kind: "component",
         exported: false,
       },
       {
         componentId: "App.tsx:ConstantFunction",
-        kind: "component",
         exported: false,
       },
       // Note: this isn't detected as of October 2021.
@@ -126,37 +124,30 @@ export const AlsoNotAStory = {
       // },
       {
         componentId: "App.tsx:ClassComponent1",
-        kind: "component",
         exported: false,
       },
       {
         componentId: "App.tsx:ClassComponent2",
-        kind: "component",
         exported: false,
       },
       {
         componentId: "App.tsx:ForwardRef",
-        kind: "component",
         exported: false,
       },
       {
         componentId: "App.tsx:NextComponent",
-        kind: "component",
         exported: false,
       },
       {
         componentId: "App.tsx:Pure",
-        kind: "component",
         exported: true,
       },
       {
         componentId: "App.tsx:NotObjectProps",
-        kind: "component",
         exported: true,
       },
       {
         componentId: "App.tsx:MissingType",
-        kind: "component",
         exported: true,
       },
     ]);
@@ -176,12 +167,10 @@ const ConstantFunction = () => <div>Hello, World!</div>;
     expect(await extract(APP_TSX)).toMatchObject([
       {
         componentId: "App.tsx:DeclaredFunction",
-        kind: "component",
         exported: false,
       },
       {
         componentId: "App.tsx:ConstantFunction",
-        kind: "component",
         exported: false,
       },
     ]);
@@ -201,7 +190,6 @@ export default A;
     expect(await extract(APP_TSX)).toMatchObject([
       {
         componentId: "App.tsx:A",
-        kind: "component",
         exported: true,
       },
     ]);
@@ -219,7 +207,6 @@ export default () => {
     expect(await extract(APP_TSX)).toMatchObject([
       {
         componentId: "App.tsx:default",
-        kind: "component",
         exported: true,
       },
     ]);
@@ -237,7 +224,6 @@ export default function test(){
     expect(await extract(APP_TSX)).toMatchObject([
       {
         componentId: "App.tsx:test",
-        kind: "component",
         exported: true,
       },
     ]);
@@ -255,7 +241,6 @@ export default function(){
     expect(await extract(APP_TSX)).toMatchObject([
       {
         componentId: "App.tsx:default",
-        kind: "component",
         exported: true,
       },
     ]);
@@ -293,23 +278,25 @@ export const NotStory = (props) => <Button {...props} />;
     expect(extractedStories).toMatchObject([
       {
         componentId: "App.stories.tsx:Primary",
-        kind: "story",
         args: null,
         associatedComponent: {
           componentId: "App.tsx:default",
         },
       },
       {
         componentId: "App.stories.tsx:NotStory",
-        kind: "component",
         exported: true,
       },
     ]);
-    const storyInfo = extractedStories[0];
-    if (storyInfo?.kind !== "story" || !storyInfo.associatedComponent) {
+    const story = extractedStories[0];
+    if (
+      !story ||
+      !("associatedComponent" in story) ||
+      !story.associatedComponent
+    ) {
       throw new Error();
     }
-    expect(await storyInfo.associatedComponent.extractProps()).toEqual({
+    expect(await story.associatedComponent.extractProps()).toEqual({
       props: objectType({
         label: STRING_TYPE,
       }),
@@ -337,13 +324,11 @@ export const NotStory = (props) => <Button {...props} />;
     expect(extractedStories).toMatchObject([
       {
         componentId: "App.stories.tsx:Primary",
-        kind: "story",
         args: null,
         associatedComponent: null,
       },
       {
         componentId: "App.stories.tsx:NotStory",
-        kind: "component",
         exported: true,
       },
     ]);
@@ -373,12 +358,10 @@ Primary.args = {
     expect(extractedStories).toMatchObject([
       {
         componentId: "App.stories.tsx:Template",
-        kind: "component",
         exported: false,
       },
       {
         componentId: "App.stories.tsx:Primary",
-        kind: "story",
         args: {
           value: object([
             {
@@ -398,11 +381,15 @@ Primary.args = {
         },
       },
     ]);
-    const storyInfo = extractedStories[1];
-    if (storyInfo?.kind !== "story" || !storyInfo.associatedComponent) {
+    const story = extractedStories[1];
+    if (
+      !story ||
+      !("associatedComponent" in story) ||
+      !story.associatedComponent
+    ) {
       throw new Error();
     }
-    expect(await storyInfo.associatedComponent.extractProps()).toEqual({
+    expect(await story.associatedComponent.extractProps()).toEqual({
       props: objectType({
         label: STRING_TYPE,
       }),
@@ -434,12 +421,10 @@ Primary.args = {
     expect(extractedStories).toMatchObject([
       {
         componentId: "App.stories.tsx:Template",
-        kind: "component",
         exported: false,
       },
       {
         componentId: "App.stories.tsx:Primary",
-        kind: "story",
         args: {
           value: object([
             {
@@ -485,7 +470,6 @@ export function NotStory() {}
     expect(extractedStories).toMatchObject([
       {
         componentId: "App.stories.tsx:Example",
-        kind: "story",
         args: {
           value: object([
             {
@@ -501,18 +485,21 @@ export function NotStory() {}
       },
       {
         componentId: "App.stories.tsx:NoArgs",
-        kind: "story",
         args: null,
         associatedComponent: {
           componentId: "App.tsx:default",
         },
       },
     ]);
-    const storyInfo = extractedStories[0];
-    if (storyInfo?.kind !== "story" || !storyInfo.associatedComponent) {
+    const story = extractedStories[0];
+    if (
+      !story ||
+      !("associatedComponent" in story) ||
+      !story.associatedComponent
+    ) {
       throw new Error();
     }
-    expect(await storyInfo.associatedComponent.extractProps()).toEqual({
+    expect(await story.associatedComponent.extractProps()).toEqual({
       props: objectType({
         label: STRING_TYPE,
       }),
@@ -546,7 +533,6 @@ export function NotStory() {}
     expect(extractedStories).toMatchObject([
       {
         componentId: "App.stories.tsx:Example",
-        kind: "story",
         args: {
           value: object([
             {
@@ -560,7 +546,6 @@ export function NotStory() {}
       },
       {
         componentId: "App.stories.tsx:NoArgs",
-        kind: "story",
         args: null,
         associatedComponent: null,
       },

diff --git a/component-analyzer/react/src/extract-component.ts b/component-analyzer/react/src/extract-component.ts
@@ -97,7 +97,6 @@ export async function extractReactComponents(
       );
       return {
         ...baseComponent,
-        kind: "story",
         args: storyArgs
           ? {
               start: storyArgs.getStart(),
@@ -111,7 +110,6 @@ export async function extractReactComponents(
     if (signature) {
       return {
         ...baseComponent,
-        kind: "component",
         exported: isExported,
         extractProps: async () =>
           analyzeReactComponent(
@@ -159,7 +157,7 @@ export async function extractReactComponents(
             path.join(rootDir, filePath)
           )
         ).find((c) => c.componentId === componentId);
-        if (component?.kind !== "component") {
+        if (!component || !("extractProps" in component)) {
           return {
             props: UNKNOWN_TYPE,
             types: {},

diff --git a/component-analyzer/react/src/index.ts b/component-analyzer/react/src/index.ts
@@ -51,7 +51,7 @@ export const createComponentAnalyzer = factoryWithDefaultOptions(
             rootDir,
             absoluteFilePath
           )) {
-            if (componentOrStory.kind === "component") {
+            if ("extractProps" in componentOrStory) {
               components.push(componentOrStory);
             } else {
               stories.push(componentOrStory);

diff --git a/core/src/detect-components.ts b/core/src/detect-components.ts
@@ -164,7 +164,6 @@ async function detectComponentsCore(
       componentId: component.componentId,
       start,
       end,
-      kind: "component",
       exported: component.exported,
     });
   }
@@ -174,7 +173,6 @@ async function detectComponentsCore(
       componentId: story.componentId,
       start,
       end,
-      kind: "story",
       args: story.args,
       associatedComponentId: story.associatedComponent?.componentId || null,
     });

diff --git a/core/src/find-files.spec.ts b/core/src/find-files.spec.ts
@@ -25,9 +25,9 @@ describe("find files", () => {
     await fs.writeFile(path.join(dirPath, "b a r", "foo"), "", "utf8");
     await fs.writeFile(path.join(dirPath, "b a r", "qux", "foo"), "", "utf8");
     expect(await findFiles(dirPath, "**/*")).toEqual([
-      path.join(path.join(dirPath, "foo")),
       path.join(path.join(dirPath, "b a r", "foo")),
       path.join(path.join(dirPath, "bar", "foo")),
+      path.join(path.join(dirPath, "foo")),
     ]);
     expect(await findFiles(path.join(dirPath, "bar"), "**/*")).toEqual([
       path.join(path.join(dirPath, "bar", "foo")),

diff --git a/core/src/find-files.ts b/core/src/find-files.ts
@@ -29,7 +29,7 @@ export async function findFiles(
   if (!normalizedRootDirPath.endsWith("/")) {
     normalizedRootDirPath += "/";
   }
-  return files.filter((f) => f.startsWith(normalizedRootDirPath));
+  return files.filter((f) => f.startsWith(normalizedRootDirPath)).sort();
 }
 
 async function findGitRoot(