From b22a67806988e7957c9898b5fe558160b6c81d36 Mon Sep 17 00:00:00 2001 From: Tomoya Kashifuku Date: Tue, 7 Oct 2025 09:20:46 +0900 Subject: [PATCH 1/3] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20extract=20getTableLink?= =?UTF-8?q?Href=20function=20from=20the=20CommandPalette=20component?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../CommandPaletteOptions/TableOptions.tsx | 7 +------ .../erd-core/src/features/erd/utils/index.ts | 1 + .../erd/utils/url/getTableLinkHref.test.ts | 16 ++++++++++++++++ .../features/erd/utils/url/getTableLinkHref.ts | 7 +++++++ .../erd-core/src/features/erd/utils/url/index.ts | 1 + 5 files changed, 26 insertions(+), 6 deletions(-) create mode 100644 frontend/packages/erd-core/src/features/erd/utils/url/getTableLinkHref.test.ts create mode 100644 frontend/packages/erd-core/src/features/erd/utils/url/getTableLinkHref.ts create mode 100644 frontend/packages/erd-core/src/features/erd/utils/url/index.ts diff --git a/frontend/packages/erd-core/src/features/erd/components/ERDRenderer/CommandPalette/CommandPaletteOptions/TableOptions.tsx b/frontend/packages/erd-core/src/features/erd/components/ERDRenderer/CommandPalette/CommandPaletteOptions/TableOptions.tsx index 774ba1712d..91b3914a7b 100644 --- a/frontend/packages/erd-core/src/features/erd/components/ERDRenderer/CommandPalette/CommandPaletteOptions/TableOptions.tsx +++ b/frontend/packages/erd-core/src/features/erd/components/ERDRenderer/CommandPalette/CommandPaletteOptions/TableOptions.tsx @@ -3,17 +3,12 @@ import { Command } from 'cmdk' import { type FC, useCallback, useEffect } from 'react' import { useSchemaOrThrow } from '../../../../../../stores' import { useTableSelection } from '../../../../hooks' +import { getTableLinkHref } from '../../../../utils/url/getTableLinkHref' import { useCommandPaletteOrThrow } from '../CommandPaletteProvider' import type { CommandPaletteSuggestion } from '../types' import { getSuggestionText } from '../utils' import styles from './CommandPaletteOptions.module.css' -const getTableLinkHref = (activeTableName: string) => { - const searchParams = new URLSearchParams(window.location.search) - searchParams.set('active', activeTableName) - return `?${searchParams.toString()}` -} - type Props = { suggestion: CommandPaletteSuggestion | null } diff --git a/frontend/packages/erd-core/src/features/erd/utils/index.ts b/frontend/packages/erd-core/src/features/erd/utils/index.ts index b8724f86f8..c2f1455eca 100644 --- a/frontend/packages/erd-core/src/features/erd/utils/index.ts +++ b/frontend/packages/erd-core/src/features/erd/utils/index.ts @@ -5,3 +5,4 @@ export * from './cookieUtils' export * from './createHash' export * from './highlightNodesAndEdges' export * from './isTableNode' +export * from './url' diff --git a/frontend/packages/erd-core/src/features/erd/utils/url/getTableLinkHref.test.ts b/frontend/packages/erd-core/src/features/erd/utils/url/getTableLinkHref.test.ts new file mode 100644 index 0000000000..55e3e646d0 --- /dev/null +++ b/frontend/packages/erd-core/src/features/erd/utils/url/getTableLinkHref.test.ts @@ -0,0 +1,16 @@ +import { describe, expect, it } from 'vitest' +import { getTableLinkHref } from './getTableLinkHref' + +it('should return the "active" query parameter with the table name', () => { + window.location.search = '' + + expect(getTableLinkHref('users')).toBe('?active=users') +}) + +describe('when other query parameters are present', () => { + it('should preserve existing query parameters', () => { + window.location.search = '?page=2&sort=asc' + + expect(getTableLinkHref('users')).toBe('?page=2&sort=asc&active=users') + }) +}) diff --git a/frontend/packages/erd-core/src/features/erd/utils/url/getTableLinkHref.ts b/frontend/packages/erd-core/src/features/erd/utils/url/getTableLinkHref.ts new file mode 100644 index 0000000000..284a11ba70 --- /dev/null +++ b/frontend/packages/erd-core/src/features/erd/utils/url/getTableLinkHref.ts @@ -0,0 +1,7 @@ +import type { QueryParam } from '../../../../schemas' + +export const getTableLinkHref = (activeTableName: string) => { + const searchParams = new URLSearchParams(window.location.search) + searchParams.set('active' satisfies QueryParam, activeTableName) + return `?${searchParams.toString()}` +} diff --git a/frontend/packages/erd-core/src/features/erd/utils/url/index.ts b/frontend/packages/erd-core/src/features/erd/utils/url/index.ts new file mode 100644 index 0000000000..a9b2e2cb4e --- /dev/null +++ b/frontend/packages/erd-core/src/features/erd/utils/url/index.ts @@ -0,0 +1 @@ +export * from './getTableLinkHref' From 528b9ce070be5660ea8fc1192d38095cdcc5e1cc Mon Sep 17 00:00:00 2001 From: Tomoya Kashifuku Date: Tue, 7 Oct 2025 09:36:55 +0900 Subject: [PATCH 2/3] =?UTF-8?q?=E2=9C=A8=20add=20hash=20schema?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../packages/erd-core/src/schemas/hash/index.ts | 2 ++ .../erd-core/src/schemas/hash/schemas.test.ts | 16 ++++++++++++++++ .../erd-core/src/schemas/hash/schemas.ts | 9 +++++++++ .../packages/erd-core/src/schemas/hash/types.ts | 4 ++++ frontend/packages/erd-core/src/schemas/index.ts | 1 + 5 files changed, 32 insertions(+) create mode 100644 frontend/packages/erd-core/src/schemas/hash/index.ts create mode 100644 frontend/packages/erd-core/src/schemas/hash/schemas.test.ts create mode 100644 frontend/packages/erd-core/src/schemas/hash/schemas.ts create mode 100644 frontend/packages/erd-core/src/schemas/hash/types.ts diff --git a/frontend/packages/erd-core/src/schemas/hash/index.ts b/frontend/packages/erd-core/src/schemas/hash/index.ts new file mode 100644 index 0000000000..68de05596a --- /dev/null +++ b/frontend/packages/erd-core/src/schemas/hash/index.ts @@ -0,0 +1,2 @@ +export * from './schemas' +export * from './types' diff --git a/frontend/packages/erd-core/src/schemas/hash/schemas.test.ts b/frontend/packages/erd-core/src/schemas/hash/schemas.test.ts new file mode 100644 index 0000000000..03ae8ab425 --- /dev/null +++ b/frontend/packages/erd-core/src/schemas/hash/schemas.test.ts @@ -0,0 +1,16 @@ +import { parse } from 'valibot' +import { expect, it } from 'vitest' +import { hashSchema } from './schemas' + +it('should pass valid texts', () => { + expect(parse(hashSchema, 'users__columns__id')).toBe('users__columns__id') + expect(parse(hashSchema, 'user_posts__columns__post_id')).toBe( + 'user_posts__columns__post_id', + ) +}) + +it('should throw error with invalid texts', () => { + expect(() => parse(hashSchema, '')).toThrowError() + expect(() => parse(hashSchema, 'users')).toThrowError() + expect(() => parse(hashSchema, 'a__b__c')).toThrowError() +}) diff --git a/frontend/packages/erd-core/src/schemas/hash/schemas.ts b/frontend/packages/erd-core/src/schemas/hash/schemas.ts new file mode 100644 index 0000000000..caeeb1182c --- /dev/null +++ b/frontend/packages/erd-core/src/schemas/hash/schemas.ts @@ -0,0 +1,9 @@ +import { custom } from 'valibot' + +export const hashSchema = custom<`${string}__columns__${string}`>( + (input): input is `${string}__columns__${string}` => { + if (typeof input !== 'string') return false + const parts = input.split('__columns__') + return parts.length === 2 + }, +) diff --git a/frontend/packages/erd-core/src/schemas/hash/types.ts b/frontend/packages/erd-core/src/schemas/hash/types.ts new file mode 100644 index 0000000000..8a5cdf74d4 --- /dev/null +++ b/frontend/packages/erd-core/src/schemas/hash/types.ts @@ -0,0 +1,4 @@ +import type { InferOutput } from 'valibot' +import type { hashSchema } from './schemas' + +export type Hash = InferOutput diff --git a/frontend/packages/erd-core/src/schemas/index.ts b/frontend/packages/erd-core/src/schemas/index.ts index 981ddbf8b5..91585aee14 100644 --- a/frontend/packages/erd-core/src/schemas/index.ts +++ b/frontend/packages/erd-core/src/schemas/index.ts @@ -1,3 +1,4 @@ +export * from './hash' export * from './queryParam' export * from './showMode' export * from './version' From 8b2c94671939466e943741dbbf654c9a7a52935f Mon Sep 17 00:00:00 2001 From: Tomoya Kashifuku Date: Tue, 7 Oct 2025 09:46:14 +0900 Subject: [PATCH 3/3] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20extract=20getTableColu?= =?UTF-8?q?mnElementId?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../TableDetail/Columns/ColumnsItem/ColumnsItem.tsx | 6 ++---- .../src/features/erd/utils/url/getTableColumnElementId.ts | 6 ++++++ .../packages/erd-core/src/features/erd/utils/url/index.ts | 1 + 3 files changed, 9 insertions(+), 4 deletions(-) create mode 100644 frontend/packages/erd-core/src/features/erd/utils/url/getTableColumnElementId.ts diff --git a/frontend/packages/erd-core/src/features/erd/components/ERDContent/components/TableNode/TableDetail/Columns/ColumnsItem/ColumnsItem.tsx b/frontend/packages/erd-core/src/features/erd/components/ERDContent/components/TableNode/TableDetail/Columns/ColumnsItem/ColumnsItem.tsx index 333e160ab5..ef20127755 100644 --- a/frontend/packages/erd-core/src/features/erd/components/ERDContent/components/TableNode/TableDetail/Columns/ColumnsItem/ColumnsItem.tsx +++ b/frontend/packages/erd-core/src/features/erd/components/ERDContent/components/TableNode/TableDetail/Columns/ColumnsItem/ColumnsItem.tsx @@ -7,6 +7,7 @@ import { useUserEditingOrThrow, } from '../../../../../../../../../stores' import { useDiffStyle } from '../../../../../../../../diff/hooks/useDiffStyle' +import { getTableColumnElementId } from '../../../../../../../utils/url/getTableColumnElementId' import { BlinkCircle } from '../../BlinkCircle/BlinkCircle' import styles from './ColumnsItem.module.css' import { Comment } from './Comment' @@ -16,9 +17,6 @@ import { NotNull } from './NotNull' import { PrimaryKey } from './PrimaryKey' import { Type } from './Type' -const columnElementId = (tableName: string, columnName: string) => - `${tableName}__columns__${columnName}` - type Props = { tableId: string column: Column @@ -32,7 +30,7 @@ export const ColumnsItem: FC = ({ constraints, focusedElementId, }) => { - const elementId = columnElementId(tableId, column.name) + const elementId = getTableColumnElementId(tableId, column.name) const { operations } = useSchemaOrThrow() const { showDiff } = useUserEditingOrThrow() diff --git a/frontend/packages/erd-core/src/features/erd/utils/url/getTableColumnElementId.ts b/frontend/packages/erd-core/src/features/erd/utils/url/getTableColumnElementId.ts new file mode 100644 index 0000000000..e55465f21c --- /dev/null +++ b/frontend/packages/erd-core/src/features/erd/utils/url/getTableColumnElementId.ts @@ -0,0 +1,6 @@ +import type { Hash } from '../../../../schemas' + +export const getTableColumnElementId = ( + tableName: string, + columnName: string, +): Hash => `${tableName}__columns__${columnName}` diff --git a/frontend/packages/erd-core/src/features/erd/utils/url/index.ts b/frontend/packages/erd-core/src/features/erd/utils/url/index.ts index a9b2e2cb4e..115b7b1924 100644 --- a/frontend/packages/erd-core/src/features/erd/utils/url/index.ts +++ b/frontend/packages/erd-core/src/features/erd/utils/url/index.ts @@ -1 +1,2 @@ +export * from './getTableColumnElementId' export * from './getTableLinkHref'