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 { route } from '@izzyjs/route/client';
import { ReactNode } from 'react';
import { PropsWithChildren } from 'react';
import useSearchParam from '~/hooks/use_search_param';
import useShortcut from '~/hooks/use_shortcut';
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'));
useShortcut(
'ESCAPE_KEY',
() =>
router.visit(appendCollectionId(route('dashboard').url, collectionId)),
{ disableGlobalCheck: true }
{ disableGlobalCheck: true, enabled: !disabled }
);
return <>{children}</>;
}

View File

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

View File

@@ -51,7 +51,7 @@ export default function MantineFormLink({
collectionId={collectionId}
{...props}
>
<BackToDashboard>
<BackToDashboard disabled={props.disableHomeLink}>
<TextInput
label={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),
}}
>
<Title order={1} size="h2">
<Title order={1} size="h2" c="blue">
{title}
</Title>
{children}