Cleanup names in webUI (#4607)

* Fix _ in labels

* Capitalize camera names in system

* Update storage to link to cameras and share name styling with rest of ui

web/src/routes/Storage.jsx

@@ -4,6 +4,7 @@ import Heading from '../components/Heading';
 import { useWs } from '../api/ws';
 import useSWR from 'swr';
 import { Table, Tbody, Thead, Tr, Th, Td } from '../components/Table';
+import Link from '../components/Link';
 
 const emptyObject = Object.freeze({});
 
@@ -82,7 +83,9 @@ export default function Storage() {
           <div data-testid="detectors" className="grid grid-cols-1 3xl:grid-cols-3 md:grid-cols-2 gap-4">
             {Object.entries(storage).map(([name, camera]) => (
               <div key={name} className="dark:bg-gray-800 shadow-md hover:shadow-lg rounded-lg transition-shadow">
-                <div className="text-lg flex justify-between p-4">{name}</div>
+                <div className="capitalize text-lg flex justify-between p-4">
+                  <Link href={`/cameras/${name}`}>{name.replaceAll('_', ' ')}</Link>
+                </div>
                 <div className="p-2">
                   <Table className="w-full">
                     <Thead>