99 lines
3.0 KiB
TypeScript
99 lines
3.0 KiB
TypeScript
import { Button, Card, Flex, Group, ScrollArea, Text } from '@mantine/core';
|
|
import { IconCircleCheck, IconCircleX, IconReportSearch, IconTestPipe } from '@tabler/icons-react';
|
|
import { useSession } from 'next-auth/react';
|
|
import { useTranslation } from 'next-i18next';
|
|
import { useConfigContext } from '~/config/provider';
|
|
import { api } from '~/utils/api';
|
|
|
|
import { defineWidget } from '../helper';
|
|
import { WidgetLoading } from '../loading';
|
|
import { IWidget } from '../widgets';
|
|
|
|
const definition = defineWidget({
|
|
id: 'indexer-manager',
|
|
icon: IconReportSearch,
|
|
options: {},
|
|
gridstack: {
|
|
minWidth: 1,
|
|
minHeight: 1,
|
|
maxWidth: 3,
|
|
maxHeight: 3,
|
|
},
|
|
component: IndexerManagerWidgetTile,
|
|
});
|
|
|
|
export type IIndexerManagerWidget = IWidget<(typeof definition)['id'], typeof definition>;
|
|
|
|
interface IndexerManagerWidgetProps {
|
|
widget: IIndexerManagerWidget;
|
|
}
|
|
|
|
function IndexerManagerWidgetTile({ widget }: IndexerManagerWidgetProps) {
|
|
const { t } = useTranslation('modules/indexer-manager');
|
|
const { data: sessionData } = useSession();
|
|
const { name: configName } = useConfigContext();
|
|
const utils = api.useUtils();
|
|
const { isLoading: testAllLoading, mutateAsync: testAllAsync } =
|
|
api.indexerManager.testAllIndexers.useMutation({
|
|
onSuccess: async () => {
|
|
await utils.indexerManager.invalidate();
|
|
},
|
|
});
|
|
const { isInitialLoading: indexersLoading, data: indexersData } =
|
|
api.indexerManager.indexers.useQuery({
|
|
configName: configName!,
|
|
});
|
|
const { isInitialLoading: statusesLoading, data: statusesData } =
|
|
api.indexerManager.statuses.useQuery(
|
|
{
|
|
configName: configName!,
|
|
},
|
|
{
|
|
staleTime: 1000 * 60 * 2,
|
|
}
|
|
);
|
|
if (indexersLoading || !indexersData || statusesLoading) {
|
|
return <WidgetLoading />;
|
|
}
|
|
|
|
return (
|
|
<Flex h="100%" gap={0} direction="column">
|
|
<Text mt={2}>{t('indexersStatus.title')}</Text>
|
|
<Card py={5} px={10} radius="md" withBorder style={{ flex: '1' }}>
|
|
<ScrollArea h="100%">
|
|
{indexersData.map((indexer: any) => (
|
|
<Group key={indexer.id} position="apart">
|
|
<Text color="dimmed" align="center" size="xs">
|
|
{indexer.name}
|
|
</Text>
|
|
{!statusesData.find((status: any) => indexer.id === status.indexerId) &&
|
|
indexer.enable ? (
|
|
<IconCircleCheck color="#2ecc71" />
|
|
) : (
|
|
<IconCircleX color="#d9534f" />
|
|
)}
|
|
</Group>
|
|
))}
|
|
</ScrollArea>
|
|
</Card>
|
|
{sessionData && (
|
|
<Button
|
|
mt={5}
|
|
radius="md"
|
|
variant="light"
|
|
onClick={() => {
|
|
testAllAsync({ configName: configName! });
|
|
}}
|
|
loading={testAllLoading}
|
|
loaderPosition="right"
|
|
rightIcon={<IconTestPipe size={20} />}
|
|
>
|
|
{t('indexersStatus.testAllButton')}
|
|
</Button>
|
|
)}
|
|
</Flex>
|
|
);
|
|
}
|
|
|
|
export default definition;
|