delete HostStoragePage

src/pages/HostStoragePage.tsx

@@ -1,31 +0,0 @@
-import React, { useContext, useEffect, useRef } from 'react';
-import { Context } from '..';
-import { useAdminRole } from '../hooks/useAdminRole';
-import Forbidden from './403';
-import { observer } from 'mobx-react-lite';
-
-const HostStoragePage = () => {
-    const executed = useRef(false)
-    const { sideBarsStore } = useContext(Context)
-    const { isAdmin } = useAdminRole()
-
-    useEffect(() => {
-        if (!executed.current) {
-            sideBarsStore.rightVisible = false
-            sideBarsStore.setLeftChildren(null)
-            sideBarsStore.setRightChildren(null)
-            executed.current = true
-        }
-    }, [sideBarsStore])
-
-
-
-    if (!isAdmin) return <Forbidden />
-    return (
-        <div>
-            Storage Page - NOT YET IMPLEMENTED
-        </div>
-    );
-};
-
-export default observer(HostStoragePage);

src/router/routes.tsx

@@ -9,7 +9,6 @@ import SettingsPage from "../pages/SettingsPage";
 import FrigateHostsPage from "../pages/FrigateHostsPage";
 import HostConfigPage from "../pages/HostConfigPage";
 import HostSystemPage from "../pages/HostSystemPage";
-import HostStoragePage from "../pages/HostStoragePage";
 import LiveCameraPage from "../pages/LiveCameraPage";
 import RecordingsPage from "../pages/RecordingsPage";
 import AccessSettings from "../pages/AccessSettingsPage";
@@ -45,10 +44,6 @@ export const routes: IRoute[] = [
         path: routesPath.HOST_SYSTEM_PATH,
         component: <HostSystemPage />,
     },
-    {
-        path: routesPath.HOST_STORAGE_PATH,
-        component: <HostStoragePage />,
-    },
     {
         path: routesPath.ACCESS_PATH,
         component: <AccessSettings />,

src/services/frigate.proxy/frigate.api.ts

@@ -67,8 +67,11 @@ export const proxyPrefix = `${proxyURL.protocol}//${proxyURL.host}/proxy/`
 export const proxyApi = {
     getHostConfigRaw: (hostName: string) => instanceApi.get(`proxy/${hostName}/api/config/raw`).then(res => res.data),
     getHostConfig: (hostName: string) => instanceApi.get(`proxy/${hostName}/api/config`).then(res => res.data),
-    getImageFrigate: async (imageUrl: string) => {
+    getImageFrigate: async (imageUrl: string, height?: number) => {
         const response = await instanceApi.get<Blob>(imageUrl, {
+            params: {
+                h: height
+            },
             responseType: 'blob',
             timeout: 10 * 1000
         })

src/shared/components/images/AutoUpdatedImage.tsx

@@ -26,7 +26,7 @@ const AutoUpdatedImage = ({
 
   const { data: imageBlob, refetch, isPending, isError } = useQuery({
     queryKey: [imageUrl],
-    queryFn: () => proxyApi.getImageFrigate(imageUrl),
+    queryFn: () => proxyApi.getImageFrigate(imageUrl, 522),
     staleTime: 60 * 1000,
     gcTime: Infinity,
     refetchInterval: isVisible ? 30 * 1000 : undefined,

src/shared/components/menu/HostSettingsMenu.tsx

@@ -22,10 +22,7 @@ const HostSettingsMenu = ({ host }: HostSettingsMenuProps) => {
         const url = routesPath.HOST_CONFIG_PATH.replace(':id', host.id)
         navigate(url)
     }
-    const handleStorage = () => {
-        const url = routesPath.HOST_STORAGE_PATH.replace(':id', host.id)
-        navigate(url)
-    }
+
     const handleSystem = () => {
         const url = routesPath.HOST_SYSTEM_PATH.replace(':id', host.id)
         navigate(url)
@@ -57,12 +54,6 @@ const HostSettingsMenu = ({ host }: HostSettingsMenuProps) => {
                     icon={<IconGraph style={{ width: rem(14), height: rem(14) }} />}>
                     {t('hostMenu.system')}
                 </Menu.Item>
-                <Menu.Item
-                    onClick={handleStorage}
-                    icon={<IconServer
-                        style={{ width: rem(14), height: rem(14) }} />}>
-                    {t('hostMenu.storage')}
-                </Menu.Item>
             </Menu.Dropdown>
         </Menu>
     )