Pass active view ID to ListView schema and optimize localStorage key handling

Author: hotlong

apps/console/src/components/ObjectView.tsx

@@ -96,6 +96,7 @@ export function ObjectView({ dataSource, objects, onEdit }: any) {
         // Use standard ListView for supported types
         const listViewSchema: ListViewSchema = {
             type: 'list-view',
+            id: activeView.id, // Pass the View ID to the schema
             objectName: objectDef.name,
             viewType: activeView.type,
             fields: activeView.columns,

packages/plugin-list/src/ListView.tsx

@@ -40,29 +40,33 @@ export const ListView: React.FC<ListViewProps> = ({
   const [sortOrder, setSortOrder] = React.useState<'asc' | 'desc'>(schema.sort?.[0]?.order || 'asc');
   const [showFilters, setShowFilters] = React.useState(false);
 
+  const storageKey = React.useMemo(() => {
+    return schema.id 
+      ? `listview-${schema.objectName}-${schema.id}-view`
+      : `listview-${schema.objectName}-view`;
+  }, [schema.objectName, schema.id]);
+
   // Load saved view preference
   React.useEffect(() => {
     try {
-      const storageKey = `listview-${schema.objectName}-view`;
       const savedView = localStorage.getItem(storageKey);
       if (savedView && ['grid', 'list', 'kanban', 'calendar', 'chart'].includes(savedView)) {
         setCurrentView(savedView as ViewType);
       }
     } catch (error) {
       console.warn('Failed to load view preference from localStorage:', error);
     }
-  }, [schema.objectName]);
+  }, [storageKey]);
 
   const handleViewChange = React.useCallback((view: ViewType) => {
     setCurrentView(view);
     try {
-      const storageKey = `listview-${schema.objectName}-view`;
       localStorage.setItem(storageKey, view);
     } catch (error) {
       console.warn('Failed to save view preference to localStorage:', error);
     }
     onViewChange?.(view);
-  }, [schema.objectName, onViewChange]);
+  }, [storageKey, onViewChange]);
 
   const handleSearchChange = React.useCallback((value: string) => {
     setSearchTerm(value);