fix: disable shortcut when we cant go back to home

This commit is contained in:
Sonny
2024-11-02 02:52:39 +01:00
committed by Sonny
parent 757788bf9b
commit 13bff28876
5 changed files with 21 additions and 6 deletions

View File

@@ -1,17 +1,24 @@
import { router } from '@inertiajs/react'; import { router } from '@inertiajs/react';
import { route } from '@izzyjs/route/client'; import { route } from '@izzyjs/route/client';
import { ReactNode } from 'react'; import { PropsWithChildren } from 'react';
import useSearchParam from '~/hooks/use_search_param'; import useSearchParam from '~/hooks/use_search_param';
import useShortcut from '~/hooks/use_shortcut'; import useShortcut from '~/hooks/use_shortcut';
import { appendCollectionId } from '~/lib/navigation'; import { appendCollectionId } from '~/lib/navigation';
export default function BackToDashboard({ children }: { children: ReactNode }) { interface BackToDashboardProps extends PropsWithChildren {
disabled?: boolean;
}
export default function BackToDashboard({
disabled = false,
children,
}: BackToDashboardProps) {
const collectionId = Number(useSearchParam('collectionId')); const collectionId = Number(useSearchParam('collectionId'));
useShortcut( useShortcut(
'ESCAPE_KEY', 'ESCAPE_KEY',
() => () =>
router.visit(appendCollectionId(route('dashboard').url, collectionId)), router.visit(appendCollectionId(route('dashboard').url, collectionId)),
{ disableGlobalCheck: true } { disableGlobalCheck: true, enabled: !disabled }
); );
return <>{children}</>; return <>{children}</>;
} }

View File

@@ -42,7 +42,7 @@ export default function MantineFormCollection({
return ( return (
<MantineFormLayout handleSubmit={onSubmit} {...props}> <MantineFormLayout handleSubmit={onSubmit} {...props}>
<BackToDashboard> <BackToDashboard disabled={props.disableHomeLink}>
<TextInput <TextInput
label={t('form.name')} label={t('form.name')}
placeholder={t('form.name')} placeholder={t('form.name')}

View File

@@ -51,7 +51,7 @@ export default function MantineFormLink({
collectionId={collectionId} collectionId={collectionId}
{...props} {...props}
> >
<BackToDashboard> <BackToDashboard disabled={props.disableHomeLink}>
<TextInput <TextInput
label={t('form.name')} label={t('form.name')}
placeholder={t('form.name')} placeholder={t('form.name')}

View File

@@ -0,0 +1,8 @@
import { PropsWithChildren } from 'react';
import BaseLayout from '~/mantine/layouts/_mantine_base_layout';
const LayoutWrapper = ({ children }: PropsWithChildren) => (
<BaseLayout>{children}</BaseLayout>
);
export { LayoutWrapper as MantineDashboardLayout };

View File

@@ -58,7 +58,7 @@ function MantineFormLayout({
width: rem(600), width: rem(600),
}} }}
> >
<Title order={1} size="h2"> <Title order={1} size="h2" c="blue">
{title} {title}
</Title> </Title>
{children} {children}