fix(login): add scroll area to login required page

This commit is contained in:
Kendall Garner
2026-01-07 07:35:26 -08:00
parent e0e82e7246
commit fd78bdf8af
@@ -16,6 +16,7 @@ import { Button } from '/@/shared/components/button/button';
import { Center } from '/@/shared/components/center/center'; import { Center } from '/@/shared/components/center/center';
import { Group } from '/@/shared/components/group/group'; import { Group } from '/@/shared/components/group/group';
import { Icon } from '/@/shared/components/icon/icon'; import { Icon } from '/@/shared/components/icon/icon';
import { ScrollArea } from '/@/shared/components/scroll-area/scroll-area';
import { Stack } from '/@/shared/components/stack/stack'; import { Stack } from '/@/shared/components/stack/stack';
const ActionRequiredRoute = () => { const ActionRequiredRoute = () => {
@@ -59,31 +60,33 @@ const ActionRequiredRoute = () => {
<PageHeader /> <PageHeader />
<Center style={{ height: '100%', width: '100vw' }}> <Center style={{ height: '100%', width: '100vw' }}>
<Stack gap="xl" style={{ maxWidth: '50%' }}> <Stack gap="xl" style={{ maxWidth: '50%' }}>
<Group wrap="nowrap"> <ScrollArea style={{ maxHeight: 'calc(100vh - 50px)' }}>
{displayedCheck && ( <Group wrap="nowrap">
<ActionRequiredContainer title={displayedCheck.title}> {displayedCheck && (
{displayedCheck?.component} <ActionRequiredContainer title={displayedCheck.title}>
</ActionRequiredContainer> {displayedCheck?.component}
)} </ActionRequiredContainer>
</Group> )}
<Stack mt="2rem"> </Group>
{canReturnHome && <Navigate to={AppRoute.HOME} />} <Stack mt="2rem">
{/* This should be displayed if a credential is required */} {canReturnHome && <Navigate to={AppRoute.HOME} />}
{isCredentialRequired && !isServerLock && ( {/* This should be displayed if a credential is required */}
<Group justify="center" wrap="nowrap"> {isCredentialRequired && !isServerLock && (
<Button <Group justify="center" wrap="nowrap">
fullWidth <Button
leftSection={<Icon icon="edit" />} fullWidth
onClick={handleManageServersModal} leftSection={<Icon icon="edit" />}
variant="filled" onClick={handleManageServersModal}
> variant="filled"
{t('page.appMenu.manageServers', { >
postProcess: 'sentenceCase', {t('page.appMenu.manageServers', {
})} postProcess: 'sentenceCase',
</Button> })}
</Group> </Button>
)} </Group>
</Stack> )}
</Stack>
</ScrollArea>
</Stack> </Stack>
</Center> </Center>
</AnimatedPage> </AnimatedPage>