From 8522d91ede2945dc319ca48b2b048cf7b1d1cada Mon Sep 17 00:00:00 2001 From: "ryota.sasazawa" Date: Thu, 26 Dec 2024 18:49:05 +0900 Subject: [PATCH 1/3] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Rename=20cliVersion=20?= =?UTF-8?q?to=20version?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../erd-web/app/erd/p/[...slug]/erdViewer.tsx | 6 +++--- frontend/packages/cli/src/App.tsx | 6 +++--- .../AppBar/CopyLinkButton/CopyLinkButton.tsx | 10 +++++----- .../HelpButton/ReleaseVersion.module.css | 2 +- .../AppBar/HelpButton/ReleaseVersion.tsx | 19 +++++++++---------- .../ERDRenderer/ERDContent/ERDContent.tsx | 18 +++++++++--------- .../RelatedTables/RelatedTables.tsx | 10 +++++----- .../TableNode/TableDetail/TableDetail.tsx | 8 ++++---- .../Toolbar/FitviewButton/FitviewButton.tsx | 10 +++++----- .../Toolbar/ShowModeMenu/ShowModeMenu.tsx | 10 +++++----- .../Toolbar/TidyUpButton/TidyUpButton.tsx | 10 +++++----- .../Toolbar/ZoomControls/ZoomControls.tsx | 18 +++++++++--------- .../components/ERDRenderer/ERDRenderer.tsx | 10 +++++----- .../TableNameMenuButton.tsx | 8 ++++---- .../TableNameMenuButton/VisibilityButton.tsx | 10 +++++----- .../src/providers/CliVersionProvider.tsx | 10 +++++----- .../erd-core/src/schemas/cliVersion/types.ts | 4 ---- .../packages/erd-core/src/schemas/index.ts | 2 +- .../schemas/{cliVersion => version}/index.ts | 0 .../{cliVersion => version}/schemas.ts | 7 ++----- .../erd-core/src/schemas/version/types.ts | 4 ++++ 21 files changed, 89 insertions(+), 93 deletions(-) delete mode 100644 frontend/packages/erd-core/src/schemas/cliVersion/types.ts rename frontend/packages/erd-core/src/schemas/{cliVersion => version}/index.ts (100%) rename frontend/packages/erd-core/src/schemas/{cliVersion => version}/schemas.ts (70%) create mode 100644 frontend/packages/erd-core/src/schemas/version/types.ts diff --git a/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx b/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx index de06f20b2..54b37d87b 100644 --- a/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx +++ b/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx @@ -4,8 +4,8 @@ import type { DBStructure } from '@liam-hq/db-structure' import { CliVersionProvider, ERDRenderer, - cliVersionSchema, initDBStructureStore, + versionSchema, } from '@liam-hq/erd-core' import { useEffect } from 'react' import * as v from 'valibot' @@ -28,11 +28,11 @@ export default function ERDViewer({ date: process.env.NEXT_PUBLIC_RELEASE_DATE, displayedOn: 'web', } - const cliVersion = v.parse(cliVersionSchema, cliVersionData) + const version = v.parse(versionSchema, cliVersionData) return (
- +
diff --git a/frontend/packages/cli/src/App.tsx b/frontend/packages/cli/src/App.tsx index 002d924c7..7c2167c79 100644 --- a/frontend/packages/cli/src/App.tsx +++ b/frontend/packages/cli/src/App.tsx @@ -2,8 +2,8 @@ import { dbStructureSchema } from '@liam-hq/db-structure' import { CliVersionProvider, ERDRenderer, - cliVersionSchema, initDBStructureStore, + versionSchema, } from '@liam-hq/erd-core' import * as v from 'valibot' @@ -34,7 +34,7 @@ const cliVersionData = { date: import.meta.env.VITE_CLI_VERSION_DATE, displayedOn: 'cli', } -const cliVersion = v.parse(cliVersionSchema, cliVersionData) +const version = v.parse(versionSchema, cliVersionData) function getSidebarStateFromCookie(): boolean { const cookies = document.cookie.split('; ').map((cookie) => cookie.split('=')) @@ -46,7 +46,7 @@ function App() { const defaultSidebarOpen = getSidebarStateFromCookie() return ( - + ) diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx index e8f388af1..f8f9a4fff 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx @@ -13,7 +13,7 @@ import { type FC, useCallback } from 'react' export const CopyLinkButton: FC = () => { const toast = useToast() - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleCopyUrl = useCallback(() => { navigator.clipboard .writeText(window.location.href) @@ -31,13 +31,13 @@ export const CopyLinkButton: FC = () => { }) }) - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && clickLogEvent({ element: 'copyLinkButton', - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) - }, [toast, cliVersion]) + }, [toast, version]) return ( diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.module.css b/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.module.css index 60f2c826d..55fc529ca 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.module.css +++ b/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.module.css @@ -1,4 +1,4 @@ -.cliVersion { +.version { margin: var(--spacing-2); border-radius: var(--border-radius-full); background: var(--pane-muted-background); 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 index 35ea183ad..646fe92f9 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.tsx @@ -3,9 +3,9 @@ import type { FC } from 'react' import styles from './ReleaseVersion.module.css' export const ReleaseVersion: FC = () => { - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() - // Example output for cliVersion: + // Example output for version: // - Released version: // v0.0.11 (2024-12-19) // - Unreleased version: @@ -15,22 +15,21 @@ export const ReleaseVersion: FC = () => { // - "Released version" means the current Git hash matches a tagged release. // - "Unreleased version" includes a short Git hash prefix to indicate changes since the last release. return ( -
- {cliVersion.displayedOn === 'cli' ? ( +
+ {version.displayedOn === 'cli' ? ( <> - {`v${cliVersion.version}`} + {`v${version.version}`} {' '} - {cliVersion.isReleasedGitHash || - `+ ${cliVersion.gitHash.slice(0, 7)} `} + {version.isReleasedGitHash || `+ ${version.gitHash.slice(0, 7)} `} - {`(${cliVersion.date})`} + {`(${version.date})`} ) : ( <> - {cliVersion.gitHash.slice(0, 7)} + {version.gitHash.slice(0, 7)} - {`(${cliVersion.date})`} + {`(${version.date})`} )}
diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx index cf7bcb335..f37adcd37 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx @@ -64,19 +64,19 @@ export const ERDContentInner: FC = ({ useSyncHighlightsActiveTableChange() useSyncHiddenNodesChange() - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleNodeClick = useCallback( (tableId: string) => { updateActiveTableName(tableId) - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && selectTableLogEvent({ ref: 'mainArea', tableId, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) }, - [cliVersion], + [version], ) const handlePaneClick = useCallback(() => { @@ -116,16 +116,16 @@ export const ERDContentInner: FC = ({ const operationId = `id_${new Date().getTime()}` for (const node of nodes) { const tableId = node.id - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && repositionTableLogEvent({ tableId, operationId, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) } }, - [cliVersion], + [version], ) const panOnDrag = [1, 2] diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx index 4f153ccd9..a51eb63bf 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx @@ -26,7 +26,7 @@ export const RelatedTables: FC = ({ table }) => { showMode: 'TABLE_NAME', }) const { getNodes } = useReactFlow() - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleClick = useCallback(() => { const visibleNodeIds: string[] = nodes.map((node) => node.id) const mainPaneNodes = getNodes() @@ -36,13 +36,13 @@ export const RelatedTables: FC = ({ table }) => { replaceHiddenNodeIds(hiddenNodeIds) updateActiveTableName(undefined) - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && openRelatedTablesLogEvent({ tableId: table.name, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) - }, [nodes, getNodes, table.name, cliVersion]) + }, [nodes, getNodes, table.name, version]) return (
diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx index 0bfef408a..bf9dddf73 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx @@ -15,13 +15,13 @@ type Props = { } export const TableDetail: FC = ({ table }) => { - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleDrawerClose = () => { - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && clickLogEvent({ element: 'closeTableDetailButton', - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) } diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx index 3b96979cd..39cb45dd4 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx @@ -9,18 +9,18 @@ import { type FC, useCallback } from 'react' export const FitviewButton: FC = () => { const { fitView } = useReactFlow() const { showMode } = useUserEditingStore() - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleClick = useCallback(() => { - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && toolbarActionLogEvent({ element: 'fitview', showMode, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) fitView() - }, [fitView, showMode, cliVersion]) + }, [fitView, showMode, version]) return ( diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx index b8a3b1eb2..d0b0f6e08 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx @@ -25,7 +25,7 @@ const OPTION_LIST: { value: ShowMode; label: string }[] = [ export const ShowModeMenu: FC = () => { const { showMode } = useUserEditingStore() - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleChangeValue = useCallback( (value: string) => { const parsed = safeParse(showModeSchema, value) @@ -33,16 +33,16 @@ export const ShowModeMenu: FC = () => { if (parsed.success) { updateShowMode(parsed.output) - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && toolbarActionLogEvent({ element: 'changeShowMode', showMode: value, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) } }, - [cliVersion], + [version], ) return ( diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx index a9996bffb..28e333bbb 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx @@ -11,17 +11,17 @@ export const TidyUpButton: FC = () => { const { getNodes, getEdges } = useReactFlow() const { handleLayout } = useAutoLayout() const { showMode } = useUserEditingStore() - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleClick = useCallback(() => { - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && toolbarActionLogEvent({ element: 'tidyUp', showMode, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) handleLayout(getNodes(), getEdges()) - }, [handleLayout, showMode, getNodes, getEdges, cliVersion]) + }, [handleLayout, showMode, getNodes, getEdges, version]) return ( diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx index 5659a071a..e8b036505 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx @@ -11,31 +11,31 @@ export const ZoomControls: FC = () => { const zoomLevel = useStore((store) => store.transform[2]) const { zoomIn, zoomOut } = useReactFlow() const { showMode } = useUserEditingStore() - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleClickZoomOut = useCallback(() => { - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && toolbarActionLogEvent({ element: 'zoom', zoomLevel: zoomLevel.toFixed(2), showMode, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) zoomOut() - }, [zoomOut, zoomLevel, showMode, cliVersion]) + }, [zoomOut, zoomLevel, showMode, version]) const handleClickZoomIn = useCallback(() => { - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && toolbarActionLogEvent({ element: 'zoom', zoomLevel: zoomLevel.toFixed(2), showMode: showMode, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) zoomIn() - }, [zoomIn, zoomLevel, showMode, cliVersion]) + }, [zoomIn, zoomLevel, showMode, version]) return (
diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx index c06e71661..569bad4ca 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx @@ -31,19 +31,19 @@ export const ERDRenderer: FC = ({ defaultSidebarOpen = false }) => { showMode, }) - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleChangeOpen = useCallback( (open: boolean) => { setOpen(open) - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && toggleLogEvent({ element: 'leftPane', isShow: open, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) }, - [cliVersion], + [version], ) return ( diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx index 0ac06d7c6..e44b69163 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx @@ -17,15 +17,15 @@ export const TableNameMenuButton: FC = ({ node }) => { // TODO: Move handleClickMenuButton outside of TableNameMenuButton // after logging is complete - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleClickMenuButton = (tableId: string) => () => { updateActiveTableName(tableId) - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && selectTableLogEvent({ ref: 'leftPane', tableId, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) } diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx index eefb56803..708568631 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx @@ -11,21 +11,21 @@ type Props = { } export const VisibilityButton: FC = ({ tableName, hidden }) => { - const { cliVersion } = useCliVersion() + const { version } = useCliVersion() const handleClick = useCallback( (event: MouseEvent) => { event.stopPropagation() toggleHiddenNodeId(tableName) - cliVersion.displayedOn === 'cli' && + version.displayedOn === 'cli' && toggleLogEvent({ element: 'tableNameMenuButton', isShow: !!hidden, tableId: tableName, - cliVer: cliVersion.version, - appEnv: cliVersion.envName, + cliVer: version.version, + appEnv: version.envName, }) }, - [tableName, hidden, cliVersion], + [tableName, hidden, version], ) return ( diff --git a/frontend/packages/erd-core/src/providers/CliVersionProvider.tsx b/frontend/packages/erd-core/src/providers/CliVersionProvider.tsx index db45cff87..634e2399e 100644 --- a/frontend/packages/erd-core/src/providers/CliVersionProvider.tsx +++ b/frontend/packages/erd-core/src/providers/CliVersionProvider.tsx @@ -1,8 +1,8 @@ -import type { CliVersion } from '@/schemas/cliVersion' +import type { Version } from '@/schemas/version' import { type FC, type ReactNode, createContext, useContext } from 'react' interface CliVersionContextProps { - cliVersion: CliVersion + version: Version } const CliVersionContext = createContext( @@ -18,11 +18,11 @@ export const useCliVersion = (): CliVersionContextProps => { } export const CliVersionProvider: FC<{ - cliVersion: CliVersion + version: Version children: ReactNode -}> = ({ cliVersion, children }) => { +}> = ({ version, children }) => { return ( - + {children} ) diff --git a/frontend/packages/erd-core/src/schemas/cliVersion/types.ts b/frontend/packages/erd-core/src/schemas/cliVersion/types.ts deleted file mode 100644 index 7022dd2be..000000000 --- a/frontend/packages/erd-core/src/schemas/cliVersion/types.ts +++ /dev/null @@ -1,4 +0,0 @@ -import type { InferOutput } from 'valibot' -import type { cliVersionSchema } from './schemas' - -export type CliVersion = InferOutput diff --git a/frontend/packages/erd-core/src/schemas/index.ts b/frontend/packages/erd-core/src/schemas/index.ts index 678e96828..79dc7a89c 100644 --- a/frontend/packages/erd-core/src/schemas/index.ts +++ b/frontend/packages/erd-core/src/schemas/index.ts @@ -1,3 +1,3 @@ -export * from './cliVersion' +export * from './version' export * from './queryParam' export * from './showMode' diff --git a/frontend/packages/erd-core/src/schemas/cliVersion/index.ts b/frontend/packages/erd-core/src/schemas/version/index.ts similarity index 100% rename from frontend/packages/erd-core/src/schemas/cliVersion/index.ts rename to frontend/packages/erd-core/src/schemas/version/index.ts diff --git a/frontend/packages/erd-core/src/schemas/cliVersion/schemas.ts b/frontend/packages/erd-core/src/schemas/version/schemas.ts similarity index 70% rename from frontend/packages/erd-core/src/schemas/cliVersion/schemas.ts rename to frontend/packages/erd-core/src/schemas/version/schemas.ts index 8579c1b2a..146613dac 100644 --- a/frontend/packages/erd-core/src/schemas/cliVersion/schemas.ts +++ b/frontend/packages/erd-core/src/schemas/version/schemas.ts @@ -6,7 +6,7 @@ const webVersionSchema = v.object({ displayedOn: v.literal('web'), }) -const innerCliVersionSchema = v.object({ +const cliVersionSchema = v.object({ version: v.string(), gitHash: v.string(), envName: v.string(), @@ -15,7 +15,4 @@ const innerCliVersionSchema = v.object({ displayedOn: v.literal('cli'), }) -export const cliVersionSchema = v.union([ - webVersionSchema, - innerCliVersionSchema, -]) +export const versionSchema = v.union([webVersionSchema, cliVersionSchema]) diff --git a/frontend/packages/erd-core/src/schemas/version/types.ts b/frontend/packages/erd-core/src/schemas/version/types.ts new file mode 100644 index 000000000..b1f6a657c --- /dev/null +++ b/frontend/packages/erd-core/src/schemas/version/types.ts @@ -0,0 +1,4 @@ +import type { InferOutput } from 'valibot' +import type { versionSchema } from './schemas' + +export type Version = InferOutput From 17746fd001336be37600e2040c7085445b3bc9b6 Mon Sep 17 00:00:00 2001 From: "ryota.sasazawa" Date: Thu, 26 Dec 2024 18:56:09 +0900 Subject: [PATCH 2/3] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Rename=20CliVersionPro?= =?UTF-8?q?vider=20to=20VersionProvider?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .changeset/selfish-candles-boil.md | 6 ++++ .../erd-web/app/erd/p/[...slug]/erdViewer.tsx | 10 +++---- frontend/packages/cli/src/App.tsx | 10 +++---- .../AppBar/CopyLinkButton/CopyLinkButton.tsx | 4 +-- .../AppBar/HelpButton/ReleaseVersion.tsx | 4 +-- .../ERDRenderer/ERDContent/ERDContent.tsx | 4 +-- .../RelatedTables/RelatedTables.tsx | 4 +-- .../TableNode/TableDetail/TableDetail.tsx | 4 +-- .../Toolbar/FitviewButton/FitviewButton.tsx | 4 +-- .../Toolbar/ShowModeMenu/ShowModeMenu.tsx | 4 +-- .../Toolbar/TidyUpButton/TidyUpButton.tsx | 4 +-- .../Toolbar/ZoomControls/ZoomControls.tsx | 4 +-- .../components/ERDRenderer/ERDRenderer.tsx | 4 +-- .../TableNameMenuButton.tsx | 4 +-- .../TableNameMenuButton/VisibilityButton.tsx | 4 +-- .../src/providers/CliVersionProvider.tsx | 29 ------------------- .../packages/erd-core/src/providers/index.ts | 2 +- .../src/providers/versionProvider.tsx | 29 +++++++++++++++++++ 18 files changed, 70 insertions(+), 64 deletions(-) create mode 100644 .changeset/selfish-candles-boil.md delete mode 100644 frontend/packages/erd-core/src/providers/CliVersionProvider.tsx create mode 100644 frontend/packages/erd-core/src/providers/versionProvider.tsx diff --git a/.changeset/selfish-candles-boil.md b/.changeset/selfish-candles-boil.md new file mode 100644 index 000000000..34c041796 --- /dev/null +++ b/.changeset/selfish-candles-boil.md @@ -0,0 +1,6 @@ +--- +"@liam-hq/erd-core": patch +"@liam-hq/cli": patch +--- + +♻️ Rename cliVersion to version diff --git a/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx b/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx index 54b37d87b..856c809f9 100644 --- a/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx +++ b/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx @@ -2,7 +2,7 @@ import type { DBStructure } from '@liam-hq/db-structure' import { - CliVersionProvider, + VersionProvider, ERDRenderer, initDBStructureStore, versionSchema, @@ -23,18 +23,18 @@ export default function ERDViewer({ initDBStructureStore(dbStructure) }, [dbStructure]) - const cliVersionData = { + const versionData = { gitHash: process.env.NEXT_PUBLIC_GIT_HASH, date: process.env.NEXT_PUBLIC_RELEASE_DATE, displayedOn: 'web', } - const version = v.parse(versionSchema, cliVersionData) + const version = v.parse(versionSchema, versionData) return (
- + - +
) } diff --git a/frontend/packages/cli/src/App.tsx b/frontend/packages/cli/src/App.tsx index 7c2167c79..d66279388 100644 --- a/frontend/packages/cli/src/App.tsx +++ b/frontend/packages/cli/src/App.tsx @@ -1,6 +1,6 @@ import { dbStructureSchema } from '@liam-hq/db-structure' import { - CliVersionProvider, + VersionProvider, ERDRenderer, initDBStructureStore, versionSchema, @@ -25,7 +25,7 @@ async function loadSchemaContent() { loadSchemaContent() -const cliVersionData = { +const versionData = { version: import.meta.env.VITE_CLI_VERSION_VERSION, gitHash: import.meta.env.VITE_CLI_VERSION_GIT_HASH, envName: import.meta.env.VITE_CLI_VERSION_ENV_NAME, @@ -34,7 +34,7 @@ const cliVersionData = { date: import.meta.env.VITE_CLI_VERSION_DATE, displayedOn: 'cli', } -const version = v.parse(versionSchema, cliVersionData) +const version = v.parse(versionSchema, versionData) function getSidebarStateFromCookie(): boolean { const cookies = document.cookie.split('; ').map((cookie) => cookie.split('=')) @@ -46,9 +46,9 @@ function App() { const defaultSidebarOpen = getSidebarStateFromCookie() return ( - + - + ) } diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx index f8f9a4fff..eaa85295e 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/CopyLinkButton/CopyLinkButton.tsx @@ -1,5 +1,5 @@ import { clickLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { Button, TooltipContent, @@ -13,7 +13,7 @@ import { type FC, useCallback } from 'react' export const CopyLinkButton: FC = () => { const toast = useToast() - const { version } = useCliVersion() + const { version } = useVersion() const handleCopyUrl = useCallback(() => { navigator.clipboard .writeText(window.location.href) 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 index 646fe92f9..580076a82 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/AppBar/HelpButton/ReleaseVersion.tsx @@ -1,9 +1,9 @@ -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import type { FC } from 'react' import styles from './ReleaseVersion.module.css' export const ReleaseVersion: FC = () => { - const { version } = useCliVersion() + const { version } = useVersion() // Example output for version: // - Released version: diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx index f37adcd37..e7ed87974 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/ERDContent.tsx @@ -1,6 +1,6 @@ import { selectTableLogEvent } from '@/features/gtm/utils' import { repositionTableLogEvent } from '@/features/gtm/utils/repositionTableLogEvent' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { updateActiveTableName, useUserEditingActiveStore } from '@/stores' import { Background, @@ -64,7 +64,7 @@ export const ERDContentInner: FC = ({ useSyncHighlightsActiveTableChange() useSyncHiddenNodesChange() - const { version } = useCliVersion() + const { version } = useVersion() const handleNodeClick = useCallback( (tableId: string) => { updateActiveTableName(tableId) diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx index a51eb63bf..232e85809 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/RelatedTables/RelatedTables.tsx @@ -1,6 +1,6 @@ import { convertDBStructureToNodes } from '@/components/ERDRenderer/convertDBStructureToNodes' import { openRelatedTablesLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { replaceHiddenNodeIds, updateActiveTableName, @@ -26,7 +26,7 @@ export const RelatedTables: FC = ({ table }) => { showMode: 'TABLE_NAME', }) const { getNodes } = useReactFlow() - const { version } = useCliVersion() + const { version } = useVersion() const handleClick = useCallback(() => { const visibleNodeIds: string[] = nodes.map((node) => node.id) const mainPaneNodes = getNodes() diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx index bf9dddf73..b8b622830 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableDetail/TableDetail.tsx @@ -1,5 +1,5 @@ import { clickLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import type { Table } from '@liam-hq/db-structure' import { DrawerClose, DrawerTitle, IconButton, XIcon } from '@liam-hq/ui' import type { FC } from 'react' @@ -15,7 +15,7 @@ type Props = { } export const TableDetail: FC = ({ table }) => { - const { version } = useCliVersion() + const { version } = useVersion() const handleDrawerClose = () => { version.displayedOn === 'cli' && clickLogEvent({ diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx index 39cb45dd4..23e731c5d 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/FitviewButton/FitviewButton.tsx @@ -1,5 +1,5 @@ import { toolbarActionLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { useUserEditingStore } from '@/stores' import { IconButton, Scan } from '@liam-hq/ui' import { ToolbarButton } from '@radix-ui/react-toolbar' @@ -9,7 +9,7 @@ import { type FC, useCallback } from 'react' export const FitviewButton: FC = () => { const { fitView } = useReactFlow() const { showMode } = useUserEditingStore() - const { version } = useCliVersion() + const { version } = useVersion() const handleClick = useCallback(() => { version.displayedOn === 'cli' && diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx index d0b0f6e08..42add5cf1 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ShowModeMenu/ShowModeMenu.tsx @@ -1,5 +1,5 @@ import { toolbarActionLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { type ShowMode, showModeSchema } from '@/schemas/showMode' import { updateShowMode, useUserEditingStore } from '@/stores' import { @@ -25,7 +25,7 @@ const OPTION_LIST: { value: ShowMode; label: string }[] = [ export const ShowModeMenu: FC = () => { const { showMode } = useUserEditingStore() - const { version } = useCliVersion() + const { version } = useVersion() const handleChangeValue = useCallback( (value: string) => { const parsed = safeParse(showModeSchema, value) diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx index 28e333bbb..0e4979506 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/TidyUpButton/TidyUpButton.tsx @@ -1,5 +1,5 @@ import { toolbarActionLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { useUserEditingStore } from '@/stores' import { IconButton, TidyUpIcon } from '@liam-hq/ui' import { ToolbarButton } from '@radix-ui/react-toolbar' @@ -11,7 +11,7 @@ export const TidyUpButton: FC = () => { const { getNodes, getEdges } = useReactFlow() const { handleLayout } = useAutoLayout() const { showMode } = useUserEditingStore() - const { version } = useCliVersion() + const { version } = useVersion() const handleClick = useCallback(() => { version.displayedOn === 'cli' && toolbarActionLogEvent({ diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx index e8b036505..b9276dcd4 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/Toolbar/ZoomControls/ZoomControls.tsx @@ -1,5 +1,5 @@ import { toolbarActionLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { useUserEditingStore } from '@/stores' import { IconButton, Minus, Plus } from '@liam-hq/ui' import { ToolbarButton } from '@radix-ui/react-toolbar' @@ -11,7 +11,7 @@ export const ZoomControls: FC = () => { const zoomLevel = useStore((store) => store.transform[2]) const { zoomIn, zoomOut } = useReactFlow() const { showMode } = useUserEditingStore() - const { version } = useCliVersion() + const { version } = useVersion() const handleClickZoomOut = useCallback(() => { version.displayedOn === 'cli' && diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx index 569bad4ca..183276fda 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/ERDRenderer.tsx @@ -8,7 +8,7 @@ import styles from './ERDRenderer.module.css' import { LeftPane } from './LeftPane' import '@/styles/globals.css' import { toggleLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { useDBStructureStore, useUserEditingStore } from '@/stores' import { CardinalityMarkers } from './CardinalityMarkers' // biome-ignore lint/nursery/useImportRestrictions: Fixed in the next PR. @@ -31,7 +31,7 @@ export const ERDRenderer: FC = ({ defaultSidebarOpen = false }) => { showMode, }) - const { version } = useCliVersion() + const { version } = useVersion() const handleChangeOpen = useCallback( (open: boolean) => { setOpen(open) diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx index e44b69163..92ec5b2c7 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/TableNameMenuButton.tsx @@ -1,5 +1,5 @@ import { selectTableLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { updateActiveTableName } from '@/stores' import { SidebarMenuButton, SidebarMenuItem, Table2 } from '@liam-hq/ui' import clsx from 'clsx' @@ -17,7 +17,7 @@ export const TableNameMenuButton: FC = ({ node }) => { // TODO: Move handleClickMenuButton outside of TableNameMenuButton // after logging is complete - const { version } = useCliVersion() + const { version } = useVersion() const handleClickMenuButton = (tableId: string) => () => { updateActiveTableName(tableId) version.displayedOn === 'cli' && diff --git a/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx b/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx index 708568631..1b88216c4 100644 --- a/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx +++ b/frontend/packages/erd-core/src/components/ERDRenderer/LeftPane/TableNameMenuButton/VisibilityButton.tsx @@ -1,5 +1,5 @@ import { toggleLogEvent } from '@/features/gtm/utils' -import { useCliVersion } from '@/providers' +import { useVersion } from '@/providers' import { toggleHiddenNodeId } from '@/stores' import { Eye, EyeClosed, SidebarMenuAction } from '@liam-hq/ui' import { type FC, type MouseEvent, useCallback } from 'react' @@ -11,7 +11,7 @@ type Props = { } export const VisibilityButton: FC = ({ tableName, hidden }) => { - const { version } = useCliVersion() + const { version } = useVersion() const handleClick = useCallback( (event: MouseEvent) => { event.stopPropagation() diff --git a/frontend/packages/erd-core/src/providers/CliVersionProvider.tsx b/frontend/packages/erd-core/src/providers/CliVersionProvider.tsx deleted file mode 100644 index 634e2399e..000000000 --- a/frontend/packages/erd-core/src/providers/CliVersionProvider.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import type { Version } from '@/schemas/version' -import { type FC, type ReactNode, createContext, useContext } from 'react' - -interface CliVersionContextProps { - version: Version -} - -const CliVersionContext = createContext( - undefined, -) - -export const useCliVersion = (): CliVersionContextProps => { - const context = useContext(CliVersionContext) - if (!context) { - throw new Error('useCliVersion must be used within a CliVersionProvider') - } - return context -} - -export const CliVersionProvider: FC<{ - version: Version - children: ReactNode -}> = ({ version, children }) => { - return ( - - {children} - - ) -} diff --git a/frontend/packages/erd-core/src/providers/index.ts b/frontend/packages/erd-core/src/providers/index.ts index 9a99577bf..bfbc33767 100644 --- a/frontend/packages/erd-core/src/providers/index.ts +++ b/frontend/packages/erd-core/src/providers/index.ts @@ -1 +1 @@ -export * from './CliVersionProvider' +export * from './versionProvider' diff --git a/frontend/packages/erd-core/src/providers/versionProvider.tsx b/frontend/packages/erd-core/src/providers/versionProvider.tsx new file mode 100644 index 000000000..7b8c6e8b0 --- /dev/null +++ b/frontend/packages/erd-core/src/providers/versionProvider.tsx @@ -0,0 +1,29 @@ +import type { Version } from '@/schemas/version' +import { type FC, type ReactNode, createContext, useContext } from 'react' + +interface VersionContextProps { + version: Version +} + +const VersionContext = createContext( + undefined, +) + +export const useVersion = (): VersionContextProps => { + const context = useContext(VersionContext) + if (!context) { + throw new Error('useVersion must be used within a VersionProvider') + } + return context +} + +export const VersionProvider: FC<{ + version: Version + children: ReactNode +}> = ({ version, children }) => { + return ( + + {children} + + ) +} From 09aeae46ec68aae9a62a3e447c072b9cf7a58648 Mon Sep 17 00:00:00 2001 From: "ryota.sasazawa" Date: Thu, 26 Dec 2024 19:01:29 +0900 Subject: [PATCH 3/3] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Run=20format?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx | 2 +- frontend/packages/cli/src/App.tsx | 2 +- frontend/packages/erd-core/src/providers/versionProvider.tsx | 4 +--- 3 files changed, 3 insertions(+), 5 deletions(-) diff --git a/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx b/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx index 856c809f9..eb7aaf88f 100644 --- a/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx +++ b/frontend/apps/erd-web/app/erd/p/[...slug]/erdViewer.tsx @@ -2,8 +2,8 @@ import type { DBStructure } from '@liam-hq/db-structure' import { - VersionProvider, ERDRenderer, + VersionProvider, initDBStructureStore, versionSchema, } from '@liam-hq/erd-core' diff --git a/frontend/packages/cli/src/App.tsx b/frontend/packages/cli/src/App.tsx index d66279388..c96bde332 100644 --- a/frontend/packages/cli/src/App.tsx +++ b/frontend/packages/cli/src/App.tsx @@ -1,7 +1,7 @@ import { dbStructureSchema } from '@liam-hq/db-structure' import { - VersionProvider, ERDRenderer, + VersionProvider, initDBStructureStore, versionSchema, } from '@liam-hq/erd-core' diff --git a/frontend/packages/erd-core/src/providers/versionProvider.tsx b/frontend/packages/erd-core/src/providers/versionProvider.tsx index 7b8c6e8b0..bbb695855 100644 --- a/frontend/packages/erd-core/src/providers/versionProvider.tsx +++ b/frontend/packages/erd-core/src/providers/versionProvider.tsx @@ -5,9 +5,7 @@ interface VersionContextProps { version: Version } -const VersionContext = createContext( - undefined, -) +const VersionContext = createContext(undefined) export const useVersion = (): VersionContextProps => { const context = useContext(VersionContext)