From bc2118da83159b266c2dc6ecd808b29c4a1b8b69 Mon Sep 17 00:00:00 2001
From: MH4GF <h.miyagi.cnw@gmail.com>
Date: Fri, 20 Dec 2024 17:53:28 +0900
Subject: [PATCH] fix: Fixed problem with active tables not being highlighted
 in LeftPane when opened via query parameter

---
 frontend/.changeset/thirty-cats-smash.md               |  6 ++++++
 .../TableNameMenuButton/TableNameMenuButton.tsx        | 10 +++++-----
 2 files changed, 11 insertions(+), 5 deletions(-)
 create mode 100644 frontend/.changeset/thirty-cats-smash.md

diff --git a/frontend/.changeset/thirty-cats-smash.md b/frontend/.changeset/thirty-cats-smash.md
new file mode 100644
index 000000000..0a9ff2c57
--- /dev/null
+++ b/frontend/.changeset/thirty-cats-smash.md
@@ -0,0 +1,6 @@
+---
+"@liam-hq/erd-core": patch
+"@liam-hq/cli": patch
+---
+
+🐛 Fixed problem with active tables not being highlighted in LeftPane when opened via query parameter
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 1cf927de7..8604b39d3 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,6 +1,6 @@
 import { selectTableLogEvent } from '@/features/gtm/utils'
 import { useCliVersion } from '@/providers'
-import { updateActiveTableName, useUserEditingStore } from '@/stores'
+import { updateActiveTableName } from '@/stores'
 import { SidebarMenuButton, SidebarMenuItem, Table2 } from '@liam-hq/ui'
 import clsx from 'clsx'
 import type { FC } from 'react'
@@ -13,9 +13,6 @@ type Props = {
 }
 
 export const TableNameMenuButton: FC<Props> = ({ node }) => {
-  const {
-    active: { tableName },
-  } = useUserEditingStore()
   const name = node.data.table.name
 
   // TODO: Move handleClickMenuButton outside of TableNameMenuButton
@@ -33,7 +30,10 @@ export const TableNameMenuButton: FC<Props> = ({ node }) => {
   return (
     <SidebarMenuItem>
       <SidebarMenuButton
-        className={clsx(styles.button, name === tableName && styles.active)}
+        className={clsx(
+          styles.button,
+          node.data.isActiveHighlighted && styles.active,
+        )}
         asChild
       >
         <div