Merge pull request #21 from Agenta-AI/fix_sidebar

Fix sidebar
Agenta-AI · May 22, 2023 · 1fe2afc · 1fe2afc
2 parents ed3e534 + 4dba3c1
commit 1fe2afc
Showing 1 changed file with 64 additions and 38 deletions.
diff --git a/agenta-web/src/components/Sidebar/Sidebar.tsx b/agenta-web/src/components/Sidebar/Sidebar.tsx
@@ -16,51 +16,77 @@ const Sidebar: React.FC = () => {
   } = theme.useToken();
 
   return (
-    <Sider width={180} style={{ paddingTop: '40px', paddingLeft: '30px', paddingRight: '10px', background: colorBgContainer }}>
+    <Sider width={180} style={{ paddingTop: '40px', paddingLeft: '10px', paddingRight: '10px', background: colorBgContainer }}>
 
       <Menu
         mode="inline"
         defaultSelectedKeys={['1']}
-        defaultOpenKeys={['sub1']}
         style={{ borderRight: 0 }}
       >
-        <Tooltip placement="right" title="Experiment with real data and optimize your parameters including prompts, methods, and configuration settings.">
-          <Menu.Item key="1" icon={<RocketOutlined />} onClick={() => navigate('/playground')}>
-            Playground
-          </Menu.Item>
-        </Tooltip>
-        <Tooltip placement="right" title="Create and manage datasets for evaluation purposes.">
-          <Menu.Item key="2" icon={<DatabaseOutlined />} onClick={() => navigate('/datasets')}>
-            Datasets
-          </Menu.Item>
-        </Tooltip>
-
-        <Tooltip placement="right" title="Perform 1-to-1 variant comparisons on datasets to identify superior options.">
-          <Menu.Item key="3" icon={<LineChartOutlined />} onClick={() => navigate('/evaluations')}>
-            Evaluate
-          </Menu.Item>
-        </Tooltip>
-        <Tooltip placement="right" title="Analyze the evaluation outcomes to determine the most effective variants.">
-          <Menu.Item key="4" icon={<BarChartOutlined />} onClick={() => navigate('/results')}>
-            Results
-          </Menu.Item>
-        </Tooltip>
-        <Tooltip placement="right" title="Establish VectorDB Knowledge Bases and upload pertinent documents.">
-          <Menu.Item key="5" icon={<FileTextOutlined />} onClick={() => navigate('/vectordb')} disabled={true}>
-            VectorDB
-          </Menu.Item>
-        </Tooltip>
-
-        <Tooltip placement="right" title="Transition the optimal variant into the production environment.">
-          <Menu.Item key="6" icon={<CloudUploadOutlined />} onClick={() => navigate('/deployements')} disabled={true}>
+        <Menu.Item key="1" icon={<RocketOutlined />} onClick={() => navigate('/playground')}>
+          <Tooltip placement="right" title="Experiment with real data and optimize your parameters including prompts, methods, and configuration settings.">
+            <div style={{ width: '100%' }}>
+              Playground
+            </div>
+          </Tooltip>
+
+        </Menu.Item>
+        <Menu.Item key="2" icon={<DatabaseOutlined />} onClick={() => navigate('/datasets')}>
+          <Tooltip placement="right" title="Create and manage datasets for evaluation purposes.">
+            <div style={{ width: '100%' }}>
+
+              Datasets
+            </div>
+          </Tooltip>
+
+        </Menu.Item>
+        <Menu.Item key="3" icon={<LineChartOutlined />} onClick={() => navigate('/evaluations')}>
+
+          <Tooltip placement="right" title="Perform 1-to-1 variant comparisons on datasets to identify superior options.">
+            <div style={{ width: '100%' }}>
+
+              Evaluate
+            </div>
+
+          </Tooltip>
+
+        </Menu.Item>
+        <Menu.Item key="4" icon={<BarChartOutlined />} onClick={() => navigate('/results')}>
+          <Tooltip placement="right" title="Analyze the evaluation outcomes to determine the most effective variants.">
+            <div style={{ width: '100%' }}>
+
+              Results
+            </div>
+          </Tooltip>
+
+        </Menu.Item>
+        <Menu.Item key="5" icon={<FileTextOutlined />} onClick={() => navigate('/vectordb')} disabled={true}>
+          <Tooltip placement="right" title="Establish VectorDB Knowledge Bases and upload pertinent documents.">
+            <div style={{ width: '100%' }}>
+
+              VectorDB
+            </div>
+          </Tooltip>
+
+        </Menu.Item>
+
+        <Menu.Item key="6" icon={<CloudUploadOutlined />} onClick={() => navigate('/deployements')} disabled={true}>
+          <Tooltip placement="right" title="Transition the optimal variant into the production environment.">
+            <div style={{ width: '100%' }}>
+            </div>
+
             Deployment
-          </Menu.Item>
-        </Tooltip>
-        <Tooltip placement="right" title="Monitor production logs to ensure seamless operations.">
-          <Menu.Item key="7" icon={<MonitorOutlined />} onClick={() => navigate('/logs')} disabled={true}>
-            Monitoring
-          </Menu.Item>
-        </Tooltip>
+          </Tooltip>
+        </Menu.Item>
+
+        <Menu.Item key="7" icon={<MonitorOutlined />} onClick={() => navigate('/logs')} disabled={true}>
+          <Tooltip placement="right" title="Monitor production logs to ensure seamless operations.">
+            <div style={{ width: '100%' }}>
+              Monitoring
+            </div>
+          </Tooltip>
+
+        </Menu.Item>
 
       </Menu>
     </Sider >