ui frotneedn fixes

frontend/src/components/navigation/ModuleNavigationTabs.tsx

@@ -6,7 +6,7 @@
 
 import React from 'react';
 import { Link, useLocation } from 'react-router';
-import { Tabs, TabList, Tab } from '../ui/tabs/Tabs';
+import Button from '../ui/button/Button';
 
 export interface NavigationTab {
   label: string;
@@ -32,34 +32,22 @@ export default function ModuleNavigationTabs({ tabs, className = '' }: ModuleNav
   const activeTabId = activeTab?.path || tabs[0]?.path || '';
 
   return (
-    <div className={`mb-6 ${className}`}>
-      <Tabs defaultTab={activeTabId}>
-        {(activeTabId, setActiveTab) => (
-          <TabList className="bg-gray-100 dark:bg-gray-900">
-            {tabs.map((tab) => {
-              const isActive = activeTabId === tab.path || location.pathname.startsWith(tab.path + '/');
-              
-              return (
-                <Link
-                  key={tab.path}
-                  to={tab.path}
-                  onClick={() => setActiveTab(tab.path)}
-                  className="flex-1"
-                >
-                  <Tab
-                    tabId={tab.path}
-                    isActive={isActive}
-                    className="flex items-center justify-center gap-2"
-                  >
-                    {tab.icon && <span className="flex-shrink-0">{tab.icon}</span>}
-                    <span>{tab.label}</span>
-                  </Tab>
-                </Link>
-              );
-            })}
-          </TabList>
-        )}
-      </Tabs>
+    <div className={`inline-flex gap-2 p-2 rounded-lg bg-gray-50 dark:bg-gray-800/50 shadow-sm border border-gray-200 dark:border-gray-700 ${className}`}>
+      {tabs.map((tab) => {
+        const isActive = activeTabId === tab.path || location.pathname.startsWith(tab.path + '/');
+        
+        return (
+          <Link key={tab.path} to={tab.path}>
+            <Button
+              variant={isActive ? 'primary' : 'secondary'}
+              size="sm"
+              startIcon={tab.icon}
+            >
+              {tab.label}
+            </Button>
+          </Link>
+        );
+      })}
     </div>
   );
 }