vojo/src/app/pages/ConfigConfig.tsx

47 lines
1.7 KiB
TypeScript

import { Box, Button, Dialog, Text, color, config } from 'folds';
import React from 'react';
import { useTranslation } from 'react-i18next';
import { AuthSplashScreen } from './auth/AuthSplashScreen';
export function ConfigConfigLoading() {
return <AuthSplashScreen />;
}
// Element Web's pattern: blocking ErrorView with retry-only on config failure.
// Continuing past a missing config produces a half-broken login (empty
// homeserverList → no server allowed) and is worse UX than asking the user
// to retry. The 10s fetch timeout in ClientConfigLoader already filters out
// transient network blips so this modal only fires on real outages.
type ConfigConfigErrorProps = {
error: unknown;
retry: () => void;
};
export function ConfigConfigError({ error, retry }: ConfigConfigErrorProps) {
const { t } = useTranslation();
return (
<AuthSplashScreen>
<Box grow="Yes" direction="Column" gap="400" alignItems="Center" justifyContent="Center">
<Dialog>
<Box style={{ padding: config.space.S400 }} direction="Column" gap="400">
<Box direction="Column" gap="100">
<Text>{t('Boot.config_load_failed')}</Text>
{typeof error === 'object' &&
error &&
'message' in error &&
typeof error.message === 'string' && (
<Text size="T300" style={{ color: color.Critical.Main }}>
{error.message}
</Text>
)}
</Box>
<Button variant="Critical" onClick={retry}>
<Text as="span" size="B400">
{t('Boot.retry')}
</Text>
</Button>
</Box>
</Dialog>
</Box>
</AuthSplashScreen>
);
}