downloads page

frontend/src/pages/index.tsx

@@ -1,10 +1,14 @@
-import { ReactElement } from "react";
-import { Configs } from "./Configs";
+import {ReactElement} from 'react';
+import {Configs} from './Configs';
 import {
-    Chat20Regular,
-    DataUsageSettings20Regular,
-    DocumentSettings20Regular,
-    Home20Regular, Info20Regular, Settings20Regular, Storage20Regular
+  ArrowDownload20Regular,
+  Chat20Regular,
+  DataUsageSettings20Regular,
+  DocumentSettings20Regular,
+  Home20Regular,
+  Info20Regular,
+  Settings20Regular,
+  Storage20Regular
 } from '@fluentui/react-icons';
 import {Home} from './Home';
 import {Chat} from './Chat';
@@ -12,63 +16,71 @@ import {Models} from './Models';
 import {Train} from './Train';
 import {Settings} from './Settings';
 import {About} from './About';
+import {Downloads} from './Downloads';
 
 type NavigationItem = {
-    label: string;
-    path: string;
-    icon: ReactElement;
-    element: ReactElement;
-    top: boolean;
+  label: string;
+  path: string;
+  icon: ReactElement;
+  element: ReactElement;
+  top: boolean;
 };
 
 export const pages: NavigationItem[] = [
-    {
-        label: "Home",
-        path: "/",
-        icon:<Home20Regular />,
-        element: <Home />,
-        top: true,
-    },
-    {
-        label: "Chat",
-        path: "/chat",
-        icon:<Chat20Regular />,
-        element: <Chat />,
-        top:true
-    },
-    {
-        label: "Configs",
-        path: "/configs",
-        icon:<DocumentSettings20Regular />,
-        element: <Configs />,
-        top:true
-    },
-    {
-        label: "Models",
-        path: "/models",
-        icon:<DataUsageSettings20Regular />,
-        element: <Models />,
-        top:true
-    },
-    {
-        label: "Train",
-        path: "/train",
-        icon:<Storage20Regular />,
-        element: <Train />,
-        top:true
-    },
-    {
-        label: "Settings",
-        path: "/settings",
-        icon:<Settings20Regular />,
-        element: <Settings />,
-        top:false
-    },
-    {
-        label: "About",
-        path: "/about",
-        icon:<Info20Regular />,
-        element: <About />,
-        top:false
-    }
+  {
+    label: 'Home',
+    path: '/',
+    icon: <Home20Regular/>,
+    element: <Home/>,
+    top: true
+  },
+  {
+    label: 'Chat',
+    path: '/chat',
+    icon: <Chat20Regular/>,
+    element: <Chat/>,
+    top: true
+  },
+  {
+    label: 'Configs',
+    path: '/configs',
+    icon: <DocumentSettings20Regular/>,
+    element: <Configs/>,
+    top: true
+  },
+  {
+    label: 'Models',
+    path: '/models',
+    icon: <DataUsageSettings20Regular/>,
+    element: <Models/>,
+    top: true
+  },
+  {
+    label: 'Downloads',
+    path: '/downloads',
+    icon: <ArrowDownload20Regular/>,
+    element: <Downloads/>,
+    top: true
+  },
+  {
+    label: 'Train',
+    path: '/train',
+    icon: <Storage20Regular/>,
+    element: <Train/>,
+    top: true
+  },
+  {
+    label: 'Settings',
+    path: '/settings',
+    icon: <Settings20Regular/>,
+    element: <Settings/>,
+    top: false
+  },
+  {
+    label: 'About',
+    path: '/about',
+    icon: <Info20Regular/>,
+    element: <About/>,
+    top: false
+  }
 ];