Primary key icon

frontend/packages/cli/src/cli/smoke.test.ts

@@ -7,7 +7,7 @@ const execAsync = promisify(exec)
 beforeAll(async () => {
   await execAsync('rm -rf ./dist-cli/ ./node_modules/.tmp')
   await execAsync('pnpm run build')
-}, 20000 /* 20 seconds for setup */)
+}, 30000 /* 30 seconds for setup */)
 
 describe('CLI Smoke Test', () => {
   it('should run the CLI command without errors', async () => {

frontend/packages/db-structure/src/parser/__snapshots__/index.test.ts.snap

@@ -105,7 +105,7 @@ exports[`parse > should parse schema.rb to JSON correctly 1`] = `
           "increment": false,
           "name": "id",
           "notNull": false,
-          "primary": false,
+          "primary": true,
           "type": "varchar",
           "unique": false,
         },

frontend/packages/db-structure/src/parser/schemarb/converter.ts

@@ -14,7 +14,7 @@ export const convertToDBStructure = (data: any): DBStructure => {
           increment: false,
           name: field.name,
           notNull: 'nullable' in field ? !field.nullable : false,
-          primary: false,
+          primary: field.PK || false,
           type: field.type.type_name,
           unique: false,
         }

frontend/packages/db-structure/src/parser/schemarb/index.test.ts

@@ -11,7 +11,7 @@ describe(processor, () => {
           users: aTable({
             name: 'users',
             columns: {
-              id: aColumn(),
+              id: aColumn({ primary: true }),
               ...override?.columns,
             },
           }),
@@ -27,7 +27,7 @@ describe(processor, () => {
 
       const expected = userTable({
         columns: {
-          id: aColumn(),
+          id: aColumn({ primary: true }),
           name: aColumn({
             name: 'name',
             type: 'string',
@@ -48,7 +48,7 @@ describe(processor, () => {
 
       const expected = userTable({
         columns: {
-          id: aColumn(),
+          id: aColumn({ primary: true }),
           name: aColumn({
             name: 'name',
             type: 'string',
@@ -69,7 +69,7 @@ describe(processor, () => {
 
       const expected = userTable({
         columns: {
-          id: aColumn(),
+          id: aColumn({ primary: true }),
           name: aColumn({
             name: 'name',
             type: 'string',

frontend/packages/db-structure/src/parser/schemarb/parser.js

@@ -2318,7 +2318,8 @@ function peg$parse(input, options) {
       if (!idField) {
         table.fields.unshift({
           name: "id",
-          type: { type_name: "varchar" }
+          type: { type_name: "varchar" },
+          PK: true,
         });
       }
       data.tables.push(table);

frontend/packages/db-structure/src/parser/schemarb/parser.pegjs

@@ -30,7 +30,8 @@
       if (!idField) {
         table.fields.unshift({
           name: "id",
-          type: { type_name: "varchar" }
+          type: { type_name: "varchar" },
+          PK: true,
         });
       }
       data.tables.push(table);

frontend/packages/erd-core/package.json

@@ -12,6 +12,7 @@
     "@biomejs/biome": "1.9.3",
     "@liam/configs": "workspace:*",
     "@liam/db-structure": "workspace:*",
+    "@liam/ui": "workspace:*",
     "@types/react": "18",
     "typed-css-modules": "0.9.1",
     "typescript": "5"

frontend/packages/erd-core/src/components/ERDRenderer/ERDContent/TableNode/TableNode.tsx

@@ -1,4 +1,5 @@
 import type { Table } from '@liam/db-structure'
+import { KeyRound } from '@liam/ui'
 import type { Node, NodeProps } from '@xyflow/react'
 import type { FC } from 'react'
 import styles from './TableNode.module.css'
@@ -18,6 +19,17 @@ export const TableNode: FC<Props> = ({ data: { table } }) => {
       <ul>
         {Object.values(table.columns).map((column) => (
           <li key={column.name}>
+            <span>
+              {column.primary && (
+                <KeyRound
+                  width={16}
+                  height={16}
+                  role="img"
+                  aria-label="Primary Key"
+                />
+              )}
+            </span>
+            <span> </span>
             <span>{column.name}</span>
             <span> </span>
             <span>{column.type}</span>

frontend/packages/ui/src/icons/index.ts

@@ -2,3 +2,4 @@ export * from './InfoIcon'
 export * from './XIcon'
 export * from './FacebookIcon'
 export * from './LinkedInIcon'
+export { KeyRound } from 'lucide-react'