chore: refactor repository into package info field

core/instrument/src/babel/csf-stories.ts

@@ -44,6 +44,7 @@ export const extractCSFStories = (
     stories: {},
     kinds: {},
     components: {},
+    packages: {},
   };
   traverse(ast as any, {
     ExportDefaultDeclaration: (path: any) => {

core/instrument/src/babel/extract-component.ts

@@ -3,23 +3,28 @@ import {
   StoriesStore,
   StoryComponent,
   StoriesKind,
+  PackageInfo,
 } from '@component-controls/specification';
-import { createHash } from 'crypto';
+import { hashStoreId } from '../misc/hashStore';
 import { followImports } from './follow-imports';
 import { packageInfo } from '../misc/package-info';
 import { propsInfo } from '../misc/props-info';
 import { InstrumentOptions } from '../types';
 
+interface ComponentParseData {
+  component?: StoryComponent;
+  componentPackage?: PackageInfo;
+}
 const globalCache: {
-  [filePath: string]: StoryComponent;
+  [filePath: string]: ComponentParseData;
 } = {};
 export const extractComponent = async (
   componentName: string,
   filePath: string,
   source?: string,
   options?: InstrumentOptions,
   initialAST?: File,
-): Promise<StoryComponent | undefined> => {
+): Promise<ComponentParseData> => {
   const cacheKey = `${filePath}-${componentName}`;
   if (globalCache[cacheKey]) {
     return globalCache[cacheKey];
@@ -33,6 +38,7 @@ export const extractComponent = async (
   );
   const { components } = options || {};
   let component: StoryComponent;
+  let componentPackage: PackageInfo | undefined;
   if (follow) {
     component = {
       name: componentName,
@@ -45,13 +51,10 @@ export const extractComponent = async (
       component.source = follow.source;
       component.loc = follow.loc;
     }
-    const repository = await packageInfo(
+    componentPackage = await packageInfo(
       follow.originalFilePath,
       options?.components?.package,
     );
-    if (repository !== undefined) {
-      component.repository = repository;
-    }
   } else {
     component = {
       name: componentName,
@@ -69,8 +72,8 @@ export const extractComponent = async (
       component.info = info;
     }
   }
-  globalCache[filePath] = component;
-  return component;
+  globalCache[filePath] = { component, componentPackage };
+  return globalCache[filePath];
 };
 
 export const extractStoreComponent = async (
@@ -86,17 +89,21 @@ export const extractStoreComponent = async (
     const componentNames = Object.keys(kind.components);
     if (componentNames) {
       for (const componentName of componentNames) {
-        const component = await extractComponent(
+        const { component, componentPackage } = await extractComponent(
           componentName,
           filePath,
           source,
           options,
           initialAST,
         );
         if (component) {
-          const componentKey = createHash('md5')
-            .update(`${component.request ?? filePath}-${componentName}`)
-            .digest('hex');
+          if (componentPackage) {
+            store.packages[componentPackage.fileHash] = componentPackage;
+            component.package = componentPackage.fileHash;
+          }
+          const componentKey = hashStoreId(
+            `${component.request ?? filePath}-${componentName}`,
+          );
           store.components[componentKey] = component;
           kind.components[componentName] = componentKey;
         }

core/instrument/src/babel/mdx-stories.ts

@@ -62,12 +62,13 @@ export const extractMDXStories = (
 
   const store: Required<Pick<
     ParseStorieReturnType,
-    'stories' | 'kinds' | 'components' | 'exports'
+    'stories' | 'kinds' | 'components' | 'exports' | 'packages'
   >> = {
     stories: {},
     kinds: {},
     components: {},
     exports: {},
+    packages: {},
   };
   const { transformMDX } = _options.mdx;
   traverse(ast as any, {

core/instrument/src/index.ts

@@ -126,9 +126,10 @@ const parseSource = async (
         }
       }
     }
-    const repository = await packageInfo(filePath, options.stories.package);
-    if (repository) {
-      kind.repository = repository;
+    const storyPackage = await packageInfo(filePath, options.stories.package);
+    if (storyPackage) {
+      store.packages[storyPackage.fileHash] = storyPackage;
+      kind.package = storyPackage.fileHash;
     }
   }
   for (const key of Object.keys(store.stories)) {
@@ -198,7 +199,7 @@ export const parseStories = async (
       filePath,
       mergedOptions,
     );
-    const { stories, kinds, components, exports } = store;
+    const { stories, kinds, components, exports, packages } = store;
     const exportsSource = extractStoryExports(exports);
     let transformed = source;
     if (transformMDX && exportsSource) {
@@ -209,6 +210,7 @@ export const parseStories = async (
       stories,
       kinds,
       components,
+      packages,
     };
   } else {
     const store = await parseSource(

core/instrument/src/misc/hashStore.ts

@@ -0,0 +1,6 @@
+import { createHash } from 'crypto';
+
+export const hashStoreId = (name: string) =>
+  createHash('md5')
+    .update(name)
+    .digest('hex');

core/instrument/src/misc/package-info.ts

@@ -5,7 +5,8 @@ import readJson from 'read-package-json';
 import hostedGitInfo from 'hosted-git-info';
 //@ts-ignore
 import parseRepositoryURL from '@hutson/parse-repository-url';
-import { Repository } from '@component-controls/specification';
+import { PackageInfo } from '@component-controls/specification';
+import { hashStoreId } from './hashStore';
 import { PackageInfoOptions } from '../types';
 
 const traverseFolder = (
@@ -66,7 +67,7 @@ export interface PackageInfoReturnType {
 export const packageInfo = async (
   filePath?: string,
   opts?: PackageInfoOptions | false,
-): Promise<Repository | undefined> => {
+): Promise<PackageInfo | undefined> => {
   if (filePath) {
     const { fileName, packageJSON } =
       (await getPackageJson(filePath, opts)) || {};
@@ -99,24 +100,22 @@ export const packageInfo = async (
             )
             .replace('{committish}', templates.committish || 'master');
         };
-        const result: Repository = {};
-        const {
-          storeBrowseLink,
-          storeDocsLink,
-          storeIssuesLink,
-          storePackageName,
-        } = opts || {};
+        const { name, version } = packageJSON;
+        const result: PackageInfo = {
+          fileHash: hashStoreId(fileName),
+          name,
+          version,
+          repository: {},
+        };
+        const { storeBrowseLink, storeDocsLink, storeIssuesLink } = opts || {};
         if (storeBrowseLink) {
-          result.browse = fillTemplate(templates.browsefiletemplate);
+          result.repository.browse = fillTemplate(templates.browsefiletemplate);
         }
         if (storeDocsLink) {
-          result.docs = fillTemplate(templates.docstemplate);
+          result.repository.docs = fillTemplate(templates.docstemplate);
         }
         if (storeIssuesLink) {
-          result.issues = fillTemplate(templates.bugstemplate);
-        }
-        if (storePackageName) {
-          result.name = packageJSON.name;
+          result.repository.issues = fillTemplate(templates.bugstemplate);
         }
         return result;
       }

core/instrument/src/types.ts

@@ -66,7 +66,6 @@ export const defaultPackageOptions: PackageInfoOptions = {
   storeBrowseLink: true,
   storeDocsLink: true,
   storeIssuesLink: true,
-  storePackageName: true,
 };
 
 export const defaultComponentOptions: ComponentOptions = {
@@ -93,11 +92,6 @@ export interface PackageInfoOptions {
    */
   packageJsonName?: string;
 
-  /**
-   * Whether to save the package name in the repository field
-   */
-  storePackageName?: boolean;
-
   /**
    * Whether to save the link for browsing the file in the repository field
    */

core/loader/src/loader.ts

@@ -25,6 +25,7 @@ module.exports.pitch = async function() {
     addStoriesKind({
       stories: store.stories,
       components: store.components,
+      packages: store.packages,
       kinds: Object.keys(store.kinds).reduce(
         (acc, key) => ({
           ...acc,

core/specification/src/components.ts

@@ -1,4 +1,4 @@
-import { CodeLocation, Repository } from './utility';
+import { CodeLocation } from './utility';
 
 export type TypeValue =
   | 'any'
@@ -123,9 +123,10 @@ export interface StoryComponent {
   loc?: CodeLocation;
 
   /**
-   * component project repository information
+   * lookup into the global store of PackageInfo package.json
    */
-  repository?: Repository;
+  package?: string;
+
   /**
    * the source code of the component file, extracted byt the AST instrumenting loaders
    */

core/specification/src/stories.ts

@@ -1,4 +1,4 @@
-import { CodeLocation, Repository, StoryRenderFn } from './utility';
+import { CodeLocation, PackageInfo, StoryRenderFn } from './utility';
 import { StoryComponent } from './components';
 import { ComponentControls } from './controls';
 
@@ -198,9 +198,9 @@ export interface StoriesKind {
   fileName?: string;
 
   /**
-   * project repository information
+   * lookup into the global store of PackageInfo package.json
    */
-  repository?: Repository;
+  package?: string;
 
   /**
    * lookup into the global store.components
@@ -260,6 +260,13 @@ export interface StoryStories {
   [id: string]: Story;
 }
 
+/**
+ * list of repositories
+ */
+export interface StoryPackages {
+  [id: string]: PackageInfo;
+}
+
 /**
  * store of stories information in memory after the loader is applied
  */
@@ -276,4 +283,10 @@ export interface StoriesStore {
    * list of components used in stories
    */
   components: StoryComponents;
+
+  /**
+   * list of package.json files and their data
+   * used by the components and the stories of the project
+   */
+  packages: StoryPackages;
 }

core/specification/src/utility.ts

@@ -19,28 +19,51 @@ export interface CodeLocation {
 }
 
 /**
+ * package.json
  * information about the repository of the stories and components
  *
  */
-export interface Repository {
+export interface PackageInfo {
   /**
-   * package name
+   * file name hash of package.json
    */
-  name?: string;
+  fileHash: string;
   /**
-   * link for browsing the file
+   * package name
    */
-  browse?: string;
+  name?: string;
 
   /**
-   * link for project readme
+   * package version
    */
-  docs?: string;
+  version?: string;
 
   /**
-   * link for filing issues with the project
+   * repository information extracted from the "repository" field in package.json.
+   *  example:
+   * "repository": {
+   *   "type": "git",
+   *   "url": "https://github.com/ccontrols/component-controls.git",
+   *   "directory": "core/specification"
+   * },
+
    */
-  issues?: string;
+  repository: {
+    /**
+     * link for browsing the file
+     */
+    browse?: string;
+
+    /**
+     * link for project readme
+     */
+    docs?: string;
+
+    /**
+     * link for filing issues with the project
+     */
+    issues?: string;
+  };
 }
 
 /**

core/store/src/serialization/load-store.ts

@@ -23,6 +23,7 @@ export const loadStoryStore = (): StoriesStore | undefined => {
           kinds: {},
           stories: {},
           components: {},
+          packages: {},
         };
         stores.forEach(store => {
           if (Object.keys(store.kinds).length > 0) {
@@ -72,6 +73,9 @@ export const loadStoryStore = (): StoriesStore | undefined => {
               Object.keys(store.components).forEach(key => {
                 globalStore.components[key] = store.components[key];
               });
+              Object.keys(store.packages).forEach(key => {
+                globalStore.packages[key] = store.packages[key];
+              });
             });
           }
         });