Merge remote-tracking branch 'upstream/main' into refactor/861-detail-render-performance

Author: chysis

package-lock.json

@@ -73,7 +73,7 @@
     "@octokit/plugin-throttling": "^4.1.0",
     "@octokit/rest": "^19.0.3",
     "@octokit/types": "^13.5.0",
-    "reflect-metadata": "^0.1.13",
-    "tsyringe": "^4.7.0"
+    "inversify": "^7.10.0",
+    "reflect-metadata": "^0.2.2"
   }
 }

packages/analysis-engine/package.json

@@ -0,0 +1,8 @@
+import "reflect-metadata";
+
+import { Container } from "inversify";
+
+import PluginOctokit from "./pluginOctokit";
+
+export const diContainer = new Container();
+diContainer.bind(PluginOctokit).toSelf().inSingletonScope();

packages/analysis-engine/src/container.ts

@@ -0,0 +1,3 @@
+export const DI_IDENTIFIERS = {
+  OctokitOptions: Symbol.for("OctokitOptions"),
+} as const;

packages/analysis-engine/src/diIdentifiers.ts

@@ -1,9 +1,9 @@
 import "reflect-metadata";
 
-import { container } from "tsyringe";
-
 import { buildCommitDict } from "./commit.util";
+import { diContainer } from "./container";
 import { buildCSMDict } from "./csm";
+import { DI_IDENTIFIERS } from "./diIdentifiers";
 import getCommitRaws from "./parser";
 import { PluginOctokit } from "./pluginOctokit";
 import { buildStemDict } from "./stem";
@@ -36,24 +36,20 @@ export class AnalysisEngine {
     this.gitLog = gitLog;
     this.baseBranchName = baseBranchName;
     this.isDebugMode = isDebugMode;
-    container.register("OctokitOptions", {
-      useValue: {
-        owner,
-        repo,
-        options: {
-          auth,
-        },
-      },
+    diContainer.rebindSync(DI_IDENTIFIERS.OctokitOptions).toConstantValue({
+      owner,
+      repo,
+      options: { auth },
     });
-    this.octokit = container.resolve(PluginOctokit);
+    this.octokit = diContainer.get(PluginOctokit);
   };
 
   public analyzeGit = async () => {
     let isPRSuccess = true;
     if (this.isDebugMode) console.log("baseBranchName: ", this.baseBranchName);
 
     const commitRaws = getCommitRaws(this.gitLog);
-    if (this.isDebugMode){
+    if (this.isDebugMode) {
       console.log("commitRaws: ", commitRaws);
     }
 
@@ -88,7 +84,6 @@ export class AnalysisEngine {
   };
 
   public updateArgs = (args: AnalysisEngineArgs) => {
-    if (container.isRegistered("OctokitOptions")) container.clearInstances();
     this.insertArgs(args);
   };
 }

packages/analysis-engine/src/index.ts

@@ -2,19 +2,21 @@ import type { OctokitOptions } from "@octokit/core/dist-types/types";
 import { throttling } from "@octokit/plugin-throttling";
 import type { ThrottlingOptions } from "@octokit/plugin-throttling/dist-types/types";
 import { Octokit, type RestEndpointMethodTypes } from "@octokit/rest";
-import { inject, singleton } from "tsyringe";
+import { inject, injectable } from "inversify";
+
+import { DI_IDENTIFIERS } from "./diIdentifiers";
 
 type PullsListResponseData = RestEndpointMethodTypes["pulls"]["get"]["response"];
 type PullsListCommitsResponseData = RestEndpointMethodTypes["pulls"]["listCommits"]["response"];
 
-@singleton()
+@injectable()
 export class PluginOctokit extends Octokit.plugin(throttling) {
   private owner: string;
 
   private repo: string;
 
   constructor(
-    @inject("OctokitOptions")
+    @inject(DI_IDENTIFIERS.OctokitOptions)
     props: {
       owner: string;
       repo: string;
@@ -55,13 +57,13 @@ export class PluginOctokit extends Octokit.plugin(throttling) {
   private _getPullRequest = async (pullNumber: number) => {
     const { owner, repo } = this;
 
-    const pullRequestDetail:PullsListResponseData = await this.rest.pulls.get({
+    const pullRequestDetail: PullsListResponseData = await this.rest.pulls.get({
       owner,
       repo,
       pull_number: pullNumber,
     });
 
-    const pullRequestCommits:PullsListCommitsResponseData = await this.rest.pulls.listCommits({
+    const pullRequestCommits: PullsListCommitsResponseData = await this.rest.pulls.listCommits({
       owner,
       repo,
       pull_number: pullNumber,
@@ -73,11 +75,12 @@ export class PluginOctokit extends Octokit.plugin(throttling) {
     };
   };
 
-
-  public getPullRequests = async (): Promise<{
-    detail: PullsListResponseData,
-    commitDetails: PullsListCommitsResponseData
-  }[]> => {
+  public getPullRequests = async (): Promise<
+    {
+      detail: PullsListResponseData;
+      commitDetails: PullsListCommitsResponseData;
+    }[]
+  > => {
     const { owner, repo } = this;
 
     const { data } = await this.rest.pulls.list({

packages/analysis-engine/src/pluginOctokit.ts

@@ -101,17 +101,17 @@
     "classnames": "^2.3.2",
     "d3": "^7.6.1",
     "dayjs": "^1.11.5",
+    "inversify": "^7.10.0",
     "jest": "^29.6.4",
     "md5": "^2.3.0",
     "nanoid": "^4.0.0",
     "react": "^18.1.0",
     "react-dom": "^18.1.0",
     "react-spinners": "^0.13.8",
     "react-virtualized": "^9.22.5",
-    "reflect-metadata": "^0.1.13",
+    "reflect-metadata": "^0.2.2",
     "svg-parser": "^2.0.4",
     "ts-jest": "^29.1.1",
-    "tsyringe": "^4.7.0",
     "zustand": "^4.5.5"
   }
 }

packages/view/package.json

@@ -1,17 +1,16 @@
 import "reflect-metadata";
-import { container } from "tsyringe";
 import { useEffect, useRef } from "react";
 import BounceLoader from "react-spinners/BounceLoader";
 
 import MonoLogo from "assets/monoLogo.svg";
 import { BranchSelector, Statistics, TemporalFilter, ThemeSelector, VerticalClusterList } from "components";
 import "./App.scss";
-import type IDEPort from "ide/IDEPort";
 import { useAnalayzedData } from "hooks";
 import { RefreshButton } from "components/RefreshButton";
 import type { IDESentEvents } from "types/IDESentEvents";
 import { useBranchStore, useDataStore, useGithubInfo, useLoadingStore, useThemeStore } from "store";
 import { THEME_INFO } from "components/ThemeSelector/ThemeSelector.const";
+import { initializeIDEConnection } from "services";
 
 const App = () => {
   const initRef = useRef<boolean>(false);
@@ -21,7 +20,6 @@ const App = () => {
   const { handleGithubInfo } = useGithubInfo();
   const { loading, setLoading } = useLoadingStore();
   const { theme } = useThemeStore();
-  const ideAdapter = container.resolve<IDEPort>("IDEAdapter");
 
   useEffect(() => {
     if (initRef.current === false) {
@@ -31,13 +29,10 @@ const App = () => {
         handleGithubInfo,
       };
       setLoading(true);
-      ideAdapter.addIDESentEventListener(callbacks);
-      ideAdapter.sendFetchAnalyzedDataMessage();
-      ideAdapter.sendFetchBranchListMessage();
-      ideAdapter.sendFetchGithubInfo();
+      initializeIDEConnection(callbacks);
       initRef.current = true;
     }
-  }, [handleChangeAnalyzedData, handleChangeBranchList, handleGithubInfo, ideAdapter, setLoading]);
+  }, [handleChangeAnalyzedData, handleChangeBranchList, handleGithubInfo, setLoading]);
 
   if (loading) {
     return (