Merge pull request #459 from changelia/feature/runpod-ui

Feature/runpod UI

apps/ui/src/Route.tsx

@@ -109,7 +109,7 @@ import EditScheduleModal from 'modals/EditScheduleModal'
 import VoiceOptionsModal from 'modals/VoiceOptionsModal'
 import LlmSettingsModal from 'modals/LlmSettingsModal'
 import { InviteUsers, CreateUserAccess } from 'pages/InviteUsers'
-import { Pods, PodsContent } from 'pages/Pods'
+import { Pods, PodsContent, MainPod } from 'pages/Pods'
 import Subnets from 'pages/Subnets'
 
 
@@ -418,7 +418,7 @@ const Route = () => {
               </Router>
 
               <Router path='pods' element={<Pods />} key={document.location.href}>
-                {/* <Router index element={<Pods />} key={document.location.href} /> */}
+                <Router index element={<MainPod />} key={document.location.href} />
                 <Router
                   path={'create-pod'}
                   element={<PodsContent />}

apps/ui/src/pages/Navigation/MainNavigation.tsx

@@ -35,7 +35,8 @@ import Tooltip from 'share-ui/components/Tooltip/Tooltip'
 import Chats from 'share-ui/components/Icon/Icons/components/Chats'
 import Integrations from 'share-ui/components/Icon/Icons/components/integrations'
 import FineTuning from 'share-ui/components/Icon/Icons/components/FineTuning'
-import Book from 'share-ui/components/Icon/Icons/components/Book'
+// eslint-disable-next-line import/no-named-as-default
+import Cloud from 'share-ui/components/Icon/Icons/components/Cloud'
 
 const MainNavigation = ({ user }: { user: any }) => {
   const domainEnv = import.meta.env
@@ -193,7 +194,7 @@ const MainNavigation = ({ user }: { user: any }) => {
             isActive={includes(active, 'pods')}
             onClick={() => onHandleClick('/pods')}
           >
-            <Book size={30} />
+            <Cloud size={30} fill={includes(active, 'pods') ? '#ffffff' : '#000000'} />
             {includes(active, 'pods') && <StyledCorner />}
           </StyledLi>
         </Tooltip>
@@ -362,6 +363,11 @@ const StyledSessionIcon = styled(Session)`
     fill: ${({ theme }) => theme.body.iconColor};
   }
 `
+export const StyledCloudOutlineIcon = styled(Cloud)`
+  path {
+    fill: ${({ theme }) => theme.body.iconColor};
+  }
+`
 const StyledBottomSection = styled.div`
   margin-top: auto;
 

apps/ui/src/share-ui/components/Icon/Icons/components/Cloud.tsx

@@ -0,0 +1,26 @@
+/* eslint-disable */
+/* tslint:disable */
+import * as React from 'react'
+export interface Cloud extends React.SVGAttributes<SVGElement> {
+  size?: string | number
+}
+const Cloud: React.FC<Cloud> = ({ size, ...props }) => (
+    <svg fill="#000000" width={ size || "20" } height={ size || "20" } {...props} version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" 
+         viewBox="0 0 485 485" xmlSpace="preserve">
+    <g>
+        <path d="M485,214.04c0-39.199-28.706-71.819-66.201-77.947c-11.771-51.31-57.693-88.639-111.478-88.639
+            c-48.103,0-90.977,30.346-107.368,74.864c-55.911,12.776-100.346,57.227-112.081,114.524C38.376,243.191,0,285.59,0,336.783
+            c0,55.561,45.202,100.763,100.763,100.763h264.602c55.561,0,100.763-45.202,100.763-100.763c0-20.852-6.369-40.242-17.261-56.334
+            C471.077,266.202,485,241.528,485,214.04z M307.321,77.454c42.765,0,78.79,31.97,83.798,74.365l1.564,13.24h13.332
+            c27.01,0,48.984,21.973,48.984,48.98c0,18.897-10.598,35.657-27.051,43.832c-14.023-11.145-31.071-18.641-49.695-21.031
+            c-13.857-67.654-73.302-117.397-143.4-118.233C249.819,93.616,277.171,77.454,307.321,77.454z M365.364,407.546H100.763
+            C61.744,407.546,30,375.802,30,336.783s31.746-70.763,70.768-70.763H114.1l1.564-13.24
+            c7.018-59.398,57.488-104.191,117.399-104.191s110.382,44.792,117.399,104.191l1.564,13.24h13.332
+            c39.021,0,70.768,31.744,70.768,70.763S404.383,407.546,365.364,407.546z"/>
+    </g>
+    </svg>
+)
+Cloud.displayName = 'Book'
+export default Cloud
+/* tslint:enable */
+/* eslint-enable */