diff --git a/src/server/api/routers/dash-dot.ts b/src/server/api/routers/dash-dot.ts index efd037ebb..74090bea5 100644 --- a/src/server/api/routers/dash-dot.ts +++ b/src/server/api/routers/dash-dot.ts @@ -42,4 +42,26 @@ export const dashDotRouter = createTRPCRouter({ }); return response.data; }), + storage: publicProcedure + .input( + z.object({ + url: dashDotUrlSchema.transform(removeLeadingSlash), + }) + ) + .output(z.array(z.number())) + .query(async ({ input }) => { + const response = await axios.get(`${input.url}/load/storage`).catch((error) => { + if (error.response.status === 404) { + throw new TRPCError({ + code: 'NOT_FOUND', + message: 'Unable to find specified dash-dot', + }); + } + + throw new TRPCError({ + code: 'INTERNAL_SERVER_ERROR', + }); + }); + return response.data; + }), }); diff --git a/src/widgets/dashDot/DashDotCompactStorage.tsx b/src/widgets/dashDot/DashDotCompactStorage.tsx index 5b3c7cdfe..32cb28d00 100644 --- a/src/widgets/dashDot/DashDotCompactStorage.tsx +++ b/src/widgets/dashDot/DashDotCompactStorage.tsx @@ -1,20 +1,18 @@ import { Group, Stack, Text } from '@mantine/core'; -import { useQuery } from '@tanstack/react-query'; -import axios from 'axios'; import { useTranslation } from 'next-i18next'; -import { useConfigContext } from '../../config/provider'; +import { api } from '~/utils/api'; import { bytes } from '../../tools/bytesHelper'; import { percentage } from '../../tools/shared/math/percentage.tool'; import { DashDotInfo } from './DashDotCompactNetwork'; interface DashDotCompactStorageProps { info: DashDotInfo; - widgetId: string; + url: string; } -export const DashDotCompactStorage = ({ info, widgetId }: DashDotCompactStorageProps) => { +export const DashDotCompactStorage = ({ info, url }: DashDotCompactStorageProps) => { const { t } = useTranslation('modules/dashdot'); - const { data: storageLoad } = useDashDotStorage(widgetId); + const { data: storageLoad } = useDashDotStorage(url); const totalUsed = calculateTotalLayoutSize({ layout: storageLoad ?? [], @@ -55,25 +53,7 @@ interface CalculateTotalLayoutSizeProps { key?: keyof TLayoutItem; } -const useDashDotStorage = (widgetId: string) => { - const { name: configName, config } = useConfigContext(); - - return useQuery({ - queryKey: [ - 'dashdot/storage', - { - configName, - url: config?.widgets.find((x) => x.type === 'dashdot')?.properties.url, - widgetId, - }, - ], - queryFn: () => fetchDashDotStorageLoad(configName, widgetId), +const useDashDotStorage = (url: string) => + api.dashDot.storage.useQuery({ + url, }); -}; - -async function fetchDashDotStorageLoad(configName: string | undefined, widgetId: string) { - if (!configName) throw new Error('configName is undefined'); - return (await ( - await axios.get('/api/modules/dashdot/storage', { params: { configName, widgetId } }) - ).data) as number[]; -} diff --git a/src/widgets/dashDot/DashDotGraph.tsx b/src/widgets/dashDot/DashDotGraph.tsx index a93e11105..f86c5188c 100644 --- a/src/widgets/dashDot/DashDotGraph.tsx +++ b/src/widgets/dashDot/DashDotGraph.tsx @@ -11,7 +11,6 @@ interface DashDotGraphProps { dashDotUrl: string; usePercentages: boolean; info: DashDotInfo; - widgetId: string; } export const DashDotGraph = ({ @@ -22,13 +21,12 @@ export const DashDotGraph = ({ dashDotUrl, usePercentages, info, - widgetId, }: DashDotGraphProps) => { const { t } = useTranslation('modules/dashdot'); const { classes } = useStyles(); if (graph === 'storage' && isCompact) { - return ; + return ; } if (graph === 'network' && isCompact) { diff --git a/src/widgets/dashDot/DashDotTile.tsx b/src/widgets/dashDot/DashDotTile.tsx index 2c07c3fd6..9d91814c5 100644 --- a/src/widgets/dashDot/DashDotTile.tsx +++ b/src/widgets/dashDot/DashDotTile.tsx @@ -198,7 +198,6 @@ function DashDotTile({ widget }: DashDotTileProps) { isCompact={g.subValues.compactView ?? false} multiView={g.subValues.multiView ?? false} usePercentages={usePercentages} - widgetId={widget.id} /> ))}