feat: add usage details for tokens, functions, objects and JSXElements

Author: matheusdc

README.md

@@ -26,6 +26,8 @@ import { getPackagesUsages } from 'pkg-usage';
 const usages: PackageUsage[] = getPackagesUsages({
   packages: ['react'],
   fileGlobs: `**/**.ts`,
+  packageJsonCWD: './package.json',
+
 });
 
 console.log(usages);
@@ -34,11 +36,42 @@ console.log(usages);
 Package Usage types
 
 ```ts
+
+export type JSXElementUsage = {
+  line: number;
+  props: string[];
+  text: string;
+};
+
+export type CallExpressionUsage = {
+  line: number;
+  text: string;
+};
+
+export type ValueUsage = {
+  line: number;
+  text: string;
+};
+
+export type PropertyAccessExpressionUsage = {
+  line: number;
+  property: string;
+  text: string;
+};
+
+export type Usages =
+  | JSXElementUsage[]
+  | (CallExpressionUsage | PropertyAccessExpressionUsage | ValueUsage)[];
+
+export type Import = {
+  name: string;
+  usages: Usages;
+};
+
 export type FileUsage = {
   name: string;
   filePath: string;
-  defaultImport: string | undefined;
-  namedImports: string[];
+  imports: Import[];
 };
 
 export type PackageUsage = {

example/bla.ts

@@ -1,3 +1,5 @@
-import { apiX, apiB, apiC } from 'bla';
+import { apiA, apiB, apiC } from 'bla';
 
-const a = bla;
+const a = apiA;
+
+console.log(apiB);

example/package.json

@@ -5,7 +5,9 @@
   "author": "Luis Takahashi",
   "license": "MIT",
   "dependencies": {
-    "bla": "^0.0.1"
+    "bla": "^0.0.1",
+    "ts-morph": "^14.0.0",
+    "@scoped/package": "1.5.0"
   },
   "peerDependencies": {
     "@scoped/package": "^4.3.5"

example/run-in-ci.js

@@ -1,9 +1,15 @@
-const { getPackagesUsages } = require('../dist');
+const { getPackagesUsages } = require('../dist/src/index');
 
 /**
  * You could use the result in many use cases example:
  *
  * - To fill an S3 with every usage of the desired builds
  * - To block the CI if the package is not being used
  */
-const result = getPackagesUsages();
+const result = getPackagesUsages({
+  packages: ['bla', '@scoped/package'],
+  fileGlobs: './*{.ts,.tsx}',
+  packageJsonCWD: './package.json',
+});
+
+console.log(JSON.stringify(result, null, 2));

example/something.ts

@@ -0,0 +1,19 @@
+import SomeDefaultImport, { AwesomeStuff, CoolStuff } from '@scoped/package';
+import coolApi, { apiD } from 'bla';
+
+export const Comp = () => {
+  const data = apiD();
+
+  coolApi.run();
+
+  return (
+    <>
+      <AwesomeStuff first={1} second="2" />
+      <CoolStuff first={2} second="4" />
+      <CoolStuff second="4" />
+      <SomeDefaultImport first={1} second="2" third={data}></SomeDefaultImport>
+      <SomeDefaultImport first={1} third="3" forth={data}></SomeDefaultImport>
+      <SomeDefaultImport second={1}></SomeDefaultImport>
+    </>
+  );
+};

example/something.tsx

@@ -1,7 +1,102 @@
-import { Project, SourceFile } from 'ts-morph';
+import {
+  ImportDeclaration,
+  Project,
+  ReferencedSymbol,
+  SourceFile,
+  SyntaxKind,
+} from 'ts-morph';
 
-import { getPackageVersion, nonNullish } from './helpers';
-import { FileUsage, PackageUsage, Options } from './types';
+import {
+  getJSXElementProps,
+  getPackageVersion,
+  getProperty,
+  isCallExpression,
+  isJSXElement,
+  isPropertyAccessExpression,
+  isValue,
+  line,
+  nonNullish,
+  print,
+} from './helpers';
+
+import {
+  PackageUsage,
+  Options,
+  JSXElementUsage,
+  Import,
+  CallExpressionUsage,
+  PropertyAccessExpressionUsage,
+  FileUsage,
+} from './types';
+
+const getDetailsFromImports = (importDeclaration: ImportDeclaration) => {
+  const defaultReferences = importDeclaration
+    .getDefaultImport()
+    ?.findReferences();
+
+  const namedReferences = importDeclaration
+    .getNamedImports()
+    .map((named) =>
+      named.getLastChildByKindOrThrow(SyntaxKind.Identifier).findReferences()
+    );
+
+  const propsList = [
+    ...getDetailsFromReferences(defaultReferences),
+    ...namedReferences.map(getDetailsFromReferences).flat(),
+  ];
+
+  return propsList;
+};
+
+const getDetailsFromReferences = (
+  references: ReferencedSymbol[] = []
+): Import[] =>
+  references.map((referencedSymbol) => ({
+    name: referencedSymbol.getDefinition().getNode().getText(),
+    usages: referencedSymbol
+      .getReferences()
+      .flatMap(
+        (
+          reference
+        ):
+          | JSXElementUsage
+          | CallExpressionUsage
+          | PropertyAccessExpressionUsage
+          | never[] => {
+          if (isValue(reference)) {
+            return {
+              line: line(reference),
+              text: print(reference),
+            };
+          }
+
+          if (isCallExpression(reference)) {
+            return {
+              line: line(reference),
+              text: print(reference),
+            };
+          }
+
+          if (isPropertyAccessExpression(reference)) {
+            return {
+              line: line(reference),
+              property: getProperty(reference),
+              text: print(reference),
+            };
+          }
+
+          if (isJSXElement(reference)) {
+            return {
+              line: line(reference),
+              props: getJSXElementProps(reference),
+              text: print(reference),
+            };
+          }
+
+          return [];
+        }
+      ),
+  }));
 
 function getPackageUsage(
   pkg: string,
@@ -21,14 +116,12 @@ function getPackageUsage(
     return undefined;
   }
 
-  const namedImports = importDeclaration.getNamedImports();
-  const defaultImport = importDeclaration.getDefaultImport();
+  const imports = getDetailsFromImports(importDeclaration);
 
   return {
     name: sourceFile.getBaseName(),
     filePath: sourceFile.getFilePath(),
-    defaultImport: defaultImport?.getText(),
-    namedImports: namedImports.map((a) => a.getName()),
+    imports,
   };
 }
 

src/core.ts

@@ -1,6 +1,7 @@
 import pkgup from 'pkg-up';
 
 import { readFileSync } from 'fs';
+import { ReferenceEntry, SyntaxKind } from 'ts-morph';
 
 // istanbul ignore next
 function getPackageJson(packageJsonCWD?: string) {
@@ -38,3 +39,47 @@ export function getPackageVersion(pkg: string, packageJsonCWD?: string) {
 export function nonNullish<Value>(v: Value): v is NonNullable<Value> {
   return v !== undefined && v !== null;
 }
+
+export const getJSXElementProps = (reference: ReferenceEntry) =>
+  reference
+    .getNode()
+    .getParentOrThrow()
+    .getFirstChildByKindOrThrow(SyntaxKind.JsxAttributes)
+    .getChildrenOfKind(SyntaxKind.JsxAttribute)
+    .map((attribute) =>
+      attribute.getFirstChildByKindOrThrow(SyntaxKind.Identifier).getText()
+    );
+
+export const getProperty = (reference: ReferenceEntry) =>
+  reference
+    .getNode()
+    .getParentOrThrow()
+    .getLastChildByKindOrThrow(SyntaxKind.Identifier)
+    .getText();
+
+export const isJSXElement = (reference: ReferenceEntry) =>
+  reference.getNode().getParentOrThrow().getKind() ===
+    SyntaxKind.JsxOpeningElement ||
+  reference.getNode().getParentOrThrow().getKind() ===
+    SyntaxKind.JsxSelfClosingElement;
+
+export const isValue = (reference: ReferenceEntry) =>
+  reference.getNode().getParentOrThrow().getKind() ===
+    SyntaxKind.VariableDeclaration ||
+  reference.getNode().getParentOrThrow().getKind() ===
+    SyntaxKind.ExpressionStatement ||
+  reference.getNode().getParentOrThrow().getKind() === SyntaxKind.SyntaxList;
+
+export const isCallExpression = (reference: ReferenceEntry) =>
+  reference.getNode().getParentOrThrow().getKind() ===
+  SyntaxKind.CallExpression;
+
+export const isPropertyAccessExpression = (reference: ReferenceEntry) =>
+  reference.getNode().getParentOrThrow().getKind() ===
+  SyntaxKind.PropertyAccessExpression;
+
+export const print = (reference: ReferenceEntry) =>
+  reference.getNode().getParentOrThrow().getFullText();
+
+export const line = (reference: ReferenceEntry) =>
+  reference.getNode().getStartLineNumber();

src/helpers.ts

@@ -7,8 +7,16 @@ export type Options = {
 export type FileUsage = {
   name: string;
   filePath: string;
-  defaultImport: string | undefined;
-  namedImports: string[];
+  imports: Import[];
+};
+
+export type Usages =
+  | JSXElementUsage[]
+  | (CallExpressionUsage | PropertyAccessExpressionUsage | ValueUsage)[];
+
+export type Import = {
+  name: string;
+  usages: Usages;
 };
 
 export type PackageUsage = {
@@ -17,3 +25,25 @@ export type PackageUsage = {
   files?: FileUsage[];
   version?: string;
 };
+
+export type JSXElementUsage = {
+  line: number;
+  props: string[];
+  text: string;
+};
+
+export type CallExpressionUsage = {
+  line: number;
+  text: string;
+};
+
+export type ValueUsage = {
+  line: number;
+  text: string;
+};
+
+export type PropertyAccessExpressionUsage = {
+  line: number;
+  property: string;
+  text: string;
+};