geo intergation

apps/web/src/components/navbar/DatabaseManagement/dbConnectionSelector.tsx

 import React, { useEffect, useState } from 'react';
-import { Add, Delete, Settings } from '@mui/icons-material';
+import { Add, Delete, Settings, StorageOutlined } from '@mui/icons-material';
 import { useAppDispatch, useSchemaGraph, useSessionCache, useAuthorizationCache } from '@graphpolaris/shared/lib/data-access';
 import { deleteSaveState, selectSaveState } from '@graphpolaris/shared/lib/data-access/store/sessionSlice';
 import { SettingsForm } from './forms/settings';
@@ -10,6 +10,7 @@ import { clearQB } from '@graphpolaris/shared/lib/data-access/store/querybuilder
 import { clearSchema } from '@graphpolaris/shared/lib/data-access/store/schemaSlice';
 import { DatabaseStatus, SaveStateI, nilUUID, wsDeleteState } from '@graphpolaris/shared/lib/data-access/broker';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@graphpolaris/shared/lib/components/tooltip';
+import { Icon } from '@graphpolaris/shared';
 
 export default function DatabaseSelector({}) {
   const dispatch = useAppDispatch();
@@ -70,7 +71,7 @@ export default function DatabaseSelector({}) {
   }, [connecting]);
 
   return (
-    <div className="menu-walkthrough">
+    <div className="menu-walkthrough ml-4">
       <TooltipProvider delayDuration={1000}>
         {settingsMenuOpen !== undefined && (
           <SettingsForm
@@ -96,14 +97,15 @@ export default function DatabaseSelector({}) {
                     <p className="ml-2 truncate">Connecting to {session.saveStates[session.currentSaveState].name}</p>
                   </>
                 ) : session.currentSaveState && session.currentSaveState in session.saveStates && session.currentSaveState !== nilUUID ? (
-                  <>
-                    <div
-                      className={`h-2 w-2 rounded-full ${
-                        session.testedSaveState[session.currentSaveState] === DatabaseStatus.tested ? 'bg-success-500' : 'bg-danger-500'
-                      }`}
-                    />
+                  <div className="flex items-center">
+                    <Icon component={<StorageOutlined />} size={20} />
+                    <div className="absolute bottom-0 left-0 transform translate-x-2 -translate-y-2">
+                      <div
+                        className={`h-2 w-2 rounded-full ${session.testedSaveState[session.currentSaveState] === DatabaseStatus.tested ? 'bg-success-500' : 'bg-danger-500'}`}
+                      />
+                    </div>
                     <p className="ml-2 truncate">Connected DB: {session.saveStates[session.currentSaveState].name}</p>
-                  </>
+                  </div>
                 ) : session.saveStates === undefined ? (
                   <>
                     <LoadingSpinner />