Merge pull request #395 from liam-hq/refactor_cli_version

Fix and Refactor cliVersion
liam-hq · Dec 26, 2024 · 033f956 · 033f956
2 parents e513b08 + d10e628
commit 033f956
Show file tree

Hide file tree

Showing 16 changed files with 125 additions and 104 deletions.
diff --git a/.changeset/nine-snakes-beg.md b/.changeset/nine-snakes-beg.md
@@ -0,0 +1,6 @@
+---
+"@liam-hq/erd-core": patch
+"@liam-hq/cli": patch
+---
+
+🐛: Fix ReleaseVersion display
diff --git a/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx b/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx
@@ -24,10 +24,7 @@ export default function ERDViewer({
   }, [dbStructure])
 
   const cliVersionData = {
-    version: '',
     gitHash: process.env.NEXT_PUBLIC_GIT_HASH,
-    envName: '',
-    isReleasedGitHash: false,
     date: process.env.NEXT_PUBLIC_RELEASE_DATE,
     displayedOn: 'web',
   }

diff --git a/frontend/packages/cli/src/App.tsx b/frontend/packages/cli/src/App.tsx
@@ -32,7 +32,7 @@ const cliVersionData = {
   isReleasedGitHash:
     import.meta.env.VITE_CLI_VERSION_IS_RELEASED_GIT_HASH === '1',
   date: import.meta.env.VITE_CLI_VERSION_DATE,
-  displayedOn: 'web',
+  displayedOn: 'cli',
 }
 const cliVersion = v.parse(cliVersionSchema, cliVersionData)
 

diff --git a/...end/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx b/...end/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx
@@ -31,12 +31,13 @@ export const CopyLinkButton: FC = () => {
         })
       })
 
-    clickLogEvent({
-      element: 'copyLinkButton',
-      cliVer: cliVersion.version,
-      appEnv: cliVersion.envName,
-    })
-  }, [toast, cliVersion.version, cliVersion.envName])
+    cliVersion.displayedOn === 'cli' &&
+      clickLogEvent({
+        element: 'copyLinkButton',
+        cliVer: cliVersion.version,
+        appEnv: cliVersion.envName,
+      })
+  }, [toast, cliVersion])
 
   return (
     <TooltipProvider>

diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.tsx
@@ -24,12 +24,13 @@ export const ReleaseVersion: FC = () => {
             {cliVersion.isReleasedGitHash ||
               `+ ${cliVersion.gitHash.slice(0, 7)} `}
           </span>
-          <span>{cliVersion.date && ` (${cliVersion.date})`}</span>
+          <span>{`(${cliVersion.date})`}</span>
         </>
       ) : (
         <>
           <span>{cliVersion.gitHash.slice(0, 7)}</span>
-          <span>{cliVersion.date && ` (${cliVersion.date})`}</span>
+          <span> </span>
+          <span>{`(${cliVersion.date})`}</span>
         </>
       )}
     </div>

diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx
@@ -68,14 +68,15 @@ export const ERDContentInner: FC<Props> = ({
   const handleNodeClick = useCallback(
     (tableId: string) => {
       updateActiveTableName(tableId)
-      selectTableLogEvent({
-        ref: 'mainArea',
-        tableId,
-        cliVer: cliVersion.version,
-        appEnv: cliVersion.envName,
-      })
+      cliVersion.displayedOn === 'cli' &&
+        selectTableLogEvent({
+          ref: 'mainArea',
+          tableId,
+          cliVer: cliVersion.version,
+          appEnv: cliVersion.envName,
+        })
     },
-    [cliVersion.version, cliVersion.envName],
+    [cliVersion],
   )
 
   const handlePaneClick = useCallback(() => {
@@ -115,15 +116,16 @@ export const ERDContentInner: FC<Props> = ({
       const operationId = `id_${new Date().getTime()}`
       for (const node of nodes) {
         const tableId = node.id
-        repositionTableLogEvent({
-          tableId,
-          operationId,
-          cliVer: cliVersion.version,
-          appEnv: cliVersion.envName,
-        })
+        cliVersion.displayedOn === 'cli' &&
+          repositionTableLogEvent({
+            tableId,
+            operationId,
+            cliVer: cliVersion.version,
+            appEnv: cliVersion.envName,
+          })
       }
     },
-    [cliVersion.version, cliVersion.envName],
+    [cliVersion],
   )
 
   const panOnDrag = [1, 2]

diff --git a/...c/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx b/...c/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx
@@ -36,12 +36,13 @@ export const RelatedTables: FC<Props> = ({ table }) => {
 
     replaceHiddenNodeIds(hiddenNodeIds)
     updateActiveTableName(undefined)
-    openRelatedTablesLogEvent({
-      tableId: table.name,
-      cliVer: cliVersion.version,
-      appEnv: cliVersion.envName,
-    })
-  }, [nodes, getNodes, table.name, cliVersion.version, cliVersion.envName])
+    cliVersion.displayedOn === 'cli' &&
+      openRelatedTablesLogEvent({
+        tableId: table.name,
+        cliVer: cliVersion.version,
+        appEnv: cliVersion.envName,
+      })
+  }, [nodes, getNodes, table.name, cliVersion])
 
   return (
     <div className={styles.wrapper}>

diff --git a/...ages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx b/...ages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx
@@ -17,11 +17,12 @@ type Props = {
 export const TableDetail: FC<Props> = ({ table }) => {
   const { cliVersion } = useCliVersion()
   const handleDrawerClose = () => {
-    clickLogEvent({
-      element: 'closeTableDetailButton',
-      cliVer: cliVersion.version,
-      appEnv: cliVersion.envName,
-    })
+    cliVersion.displayedOn === 'cli' &&
+      clickLogEvent({
+        element: 'closeTableDetailButton',
+        cliVer: cliVersion.version,
+        appEnv: cliVersion.envName,
+      })
   }
 
   return (

diff --git a/...es/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx b/...es/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx
@@ -12,14 +12,15 @@ export const FitviewButton: FC = () => {
   const { cliVersion } = useCliVersion()
 
   const handleClick = useCallback(() => {
-    toolbarActionLogEvent({
-      element: 'fitview',
-      showMode,
-      cliVer: cliVersion.version,
-      appEnv: cliVersion.envName,
-    })
+    cliVersion.displayedOn === 'cli' &&
+      toolbarActionLogEvent({
+        element: 'fitview',
+        showMode,
+        cliVer: cliVersion.version,
+        appEnv: cliVersion.envName,
+      })
     fitView()
-  }, [fitView, showMode, cliVersion.version, cliVersion.envName])
+  }, [fitView, showMode, cliVersion])
 
   return (
     <ToolbarButton asChild onClick={handleClick}>

diff --git a/...ages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx b/...ages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx
@@ -33,15 +33,16 @@ export const ShowModeMenu: FC = () => {
       if (parsed.success) {
         updateShowMode(parsed.output)
 
-        toolbarActionLogEvent({
-          element: 'changeShowMode',
-          showMode: value,
-          cliVer: cliVersion.version,
-          appEnv: cliVersion.envName,
-        })
+        cliVersion.displayedOn === 'cli' &&
+          toolbarActionLogEvent({
+            element: 'changeShowMode',
+            showMode: value,
+            cliVer: cliVersion.version,
+            appEnv: cliVersion.envName,
+          })
       }
     },
-    [cliVersion.version, cliVersion.envName],
+    [cliVersion],
   )
 
   return (

diff --git a/...ages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx b/...ages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx
@@ -13,21 +13,15 @@ export const TidyUpButton: FC = () => {
   const { showMode } = useUserEditingStore()
   const { cliVersion } = useCliVersion()
   const handleClick = useCallback(() => {
-    toolbarActionLogEvent({
-      element: 'tidyUp',
-      showMode,
-      cliVer: cliVersion.version,
-      appEnv: cliVersion.envName,
-    })
+    cliVersion.displayedOn === 'cli' &&
+      toolbarActionLogEvent({
+        element: 'tidyUp',
+        showMode,
+        cliVer: cliVersion.version,
+        appEnv: cliVersion.envName,
+      })
     handleLayout(getNodes(), getEdges())
-  }, [
-    handleLayout,
-    showMode,
-    getNodes,
-    getEdges,
-    cliVersion.version,
-    cliVersion.envName,
-  ])
+  }, [handleLayout, showMode, getNodes, getEdges, cliVersion])
 
   return (
     <ToolbarButton asChild>

diff --git a/...ages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx b/...ages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx
@@ -14,26 +14,28 @@ export const ZoomControls: FC = () => {
   const { cliVersion } = useCliVersion()
 
   const handleClickZoomOut = useCallback(() => {
-    toolbarActionLogEvent({
-      element: 'zoom',
-      zoomLevel: zoomLevel.toFixed(2),
-      showMode,
-      cliVer: cliVersion.version,
-      appEnv: cliVersion.envName,
-    })
+    cliVersion.displayedOn === 'cli' &&
+      toolbarActionLogEvent({
+        element: 'zoom',
+        zoomLevel: zoomLevel.toFixed(2),
+        showMode,
+        cliVer: cliVersion.version,
+        appEnv: cliVersion.envName,
+      })
     zoomOut()
-  }, [zoomOut, zoomLevel, showMode, cliVersion.version, cliVersion.envName])
+  }, [zoomOut, zoomLevel, showMode, cliVersion])
 
   const handleClickZoomIn = useCallback(() => {
-    toolbarActionLogEvent({
-      element: 'zoom',
-      zoomLevel: zoomLevel.toFixed(2),
-      showMode: showMode,
-      cliVer: cliVersion.version,
-      appEnv: cliVersion.envName,
-    })
+    cliVersion.displayedOn === 'cli' &&
+      toolbarActionLogEvent({
+        element: 'zoom',
+        zoomLevel: zoomLevel.toFixed(2),
+        showMode: showMode,
+        cliVer: cliVersion.version,
+        appEnv: cliVersion.envName,
+      })
     zoomIn()
-  }, [zoomIn, zoomLevel, showMode, cliVersion.version, cliVersion.envName])
+  }, [zoomIn, zoomLevel, showMode, cliVersion])
 
   return (
     <div className={styles.wrapper}>

diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx
@@ -35,14 +35,15 @@ export const ERDRenderer: FC<Props> = ({ defaultSidebarOpen = false }) => {
   const handleChangeOpen = useCallback(
     (open: boolean) => {
       setOpen(open)
-      toggleLogEvent({
-        element: 'leftPane',
-        isShow: open,
-        cliVer: cliVersion.version,
-        appEnv: cliVersion.envName,
-      })
+      cliVersion.displayedOn === 'cli' &&
+        toggleLogEvent({
+          element: 'leftPane',
+          isShow: open,
+          cliVer: cliVersion.version,
+          appEnv: cliVersion.envName,
+        })
     },
-    [cliVersion.version, cliVersion.envName],
+    [cliVersion],
   )
 
   return (

diff --git a/.../erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx b/.../erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx
@@ -20,12 +20,13 @@ export const TableNameMenuButton: FC<Props> = ({ node }) => {
   const { cliVersion } = useCliVersion()
   const handleClickMenuButton = (tableId: string) => () => {
     updateActiveTableName(tableId)
-    selectTableLogEvent({
-      ref: 'leftPane',
-      tableId,
-      cliVer: cliVersion.version,
-      appEnv: cliVersion.envName,
-    })
+    cliVersion.displayedOn === 'cli' &&
+      selectTableLogEvent({
+        ref: 'leftPane',
+        tableId,
+        cliVer: cliVersion.version,
+        appEnv: cliVersion.envName,
+      })
   }
 
   return (

diff --git a/...ges/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx b/...ges/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx
@@ -16,15 +16,16 @@ export const VisibilityButton: FC<Props> = ({ tableName, hidden }) => {
     (event: MouseEvent) => {
       event.stopPropagation()
       toggleHiddenNodeId(tableName)
-      toggleLogEvent({
-        element: 'tableNameMenuButton',
-        isShow: !!hidden,
-        tableId: tableName,
-        cliVer: cliVersion.version,
-        appEnv: cliVersion.envName,
-      })
+      cliVersion.displayedOn === 'cli' &&
+        toggleLogEvent({
+          element: 'tableNameMenuButton',
+          isShow: !!hidden,
+          tableId: tableName,
+          cliVer: cliVersion.version,
+          appEnv: cliVersion.envName,
+        })
     },
-    [tableName, hidden, cliVersion.version, cliVersion.envName],
+    [tableName, hidden, cliVersion],
   )
 
   return (

diff --git a/frontend/packages/erd-core/src/schemas/cliVersion/schemas.ts b/frontend/packages/erd-core/src/schemas/cliVersion/schemas.ts
@@ -1,10 +1,21 @@
 import * as v from 'valibot'
 
-export const cliVersionSchema = v.object({
+const webVersionSchema = v.object({
+  gitHash: v.string(),
+  date: v.string(),
+  displayedOn: v.literal('web'),
+})
+
+const innerCliVersionSchema = v.object({
   version: v.string(),
   gitHash: v.string(),
   envName: v.string(),
   isReleasedGitHash: v.boolean(),
   date: v.string(),
-  displayedOn: v.picklist(['cli', 'web']),
+  displayedOn: v.literal('cli'),
 })
+
+export const cliVersionSchema = v.union([
+  webVersionSchema,
+  innerCliVersionSchema,
+])