refactor: remove all legacy files

+ comment/delete things that haven't yet migrated to mantine

inertia/layouts/_base_layout.tsx

@@ -0,0 +1,56 @@
+import { router } from '@inertiajs/react';
+import { ColorSchemeScript, createTheme, MantineProvider } from '@mantine/core';
+import dayjs from 'dayjs';
+import { ReactNode, useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import '@mantine/core/styles.css';
+import '@mantine/spotlight/styles.css';
+import '../styles/index.css';
+
+const theme = createTheme({});
+const TRANSITION_IN_CLASS = '__transition_fadeIn';
+const TRANSITION_OUT_CLASS = '__transition_fadeOut';
+
+export default function BaseLayout({ children }: { children: ReactNode }) {
+	const { i18n } = useTranslation();
+	dayjs.locale(i18n.language);
+
+	const findAppElement = () => document.getElementById('app');
+
+	const flipClass = (addClass: string, removeClass: string) => {
+		const appElement = findAppElement();
+		if (appElement) {
+			appElement.classList.add(addClass);
+			appElement.classList.remove(removeClass);
+		}
+	};
+
+	const canTransition = (currentLocation: URL, newLocation: URL) =>
+		currentLocation.pathname !== newLocation.pathname;
+
+	useEffect(() => {
+		const currentLocation = new URL(window.location.href);
+		flipClass(TRANSITION_IN_CLASS, TRANSITION_OUT_CLASS);
+
+		router.on(
+			'start',
+			(event) =>
+				canTransition(currentLocation, event.detail.visit.url) &&
+				flipClass(TRANSITION_OUT_CLASS, TRANSITION_IN_CLASS)
+		);
+		router.on(
+			'finish',
+			(event) =>
+				canTransition(currentLocation, event.detail.visit.url) &&
+				flipClass(TRANSITION_IN_CLASS, TRANSITION_OUT_CLASS)
+		);
+	}, []);
+
+	return (
+		<>
+			<ColorSchemeScript />
+			<MantineProvider theme={theme}>{children}</MantineProvider>
+		</>
+	);
+}

inertia/layouts/content_layout.tsx

@@ -0,0 +1,33 @@
+import { Container } from '@mantine/core';
+import { PropsWithChildren } from 'react';
+import { MantineFooter } from '~/components/footer/footer';
+import Navbar from '~/components/navbar/navbar';
+import BaseLayout from '~/layouts/_base_layout';
+
+const ContentLayout = ({ children }: PropsWithChildren) => (
+	<Container
+		style={{
+			minHeight: '100%',
+			display: 'flex',
+			flexDirection: 'column',
+		}}
+	>
+		<Navbar />
+		<main
+			style={{
+				flex: 1,
+			}}
+		>
+			{children}
+		</main>
+		<MantineFooter />
+	</Container>
+);
+
+const LayoutWrapper = ({ children }: PropsWithChildren) => (
+	<BaseLayout>
+		<ContentLayout>{children}</ContentLayout>
+	</BaseLayout>
+);
+
+export { LayoutWrapper as ContentLayout };

inertia/layouts/dashboard_layout.tsx

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

inertia/layouts/form_layout.tsx

@@ -0,0 +1,103 @@
+import { Head, Link } from '@inertiajs/react';
+import { route } from '@izzyjs/route/client';
+import { Anchor, Button, Container, Group, rem, Title } from '@mantine/core';
+import { FormEvent, PropsWithChildren } from 'react';
+import { useTranslation } from 'react-i18next';
+import { MantineFooter } from '~/components/footer/footer';
+import i18n from '~/i18n';
+import BaseLayout from '~/layouts/_base_layout';
+import { appendCollectionId } from '~/lib/navigation';
+
+export interface FormLayoutProps extends PropsWithChildren {
+	title: string;
+
+	canSubmit: boolean;
+	handleSubmit: (event: FormEvent<HTMLFormElement>) => void;
+	textSubmitButton?: string;
+
+	disableHomeLink?: boolean;
+	submitBtnDanger?: boolean;
+	collectionId?: number;
+}
+
+function FormLayout({
+	title,
+	children,
+
+	canSubmit,
+	handleSubmit,
+	textSubmitButton = i18n.t('common:form.confirm'),
+
+	disableHomeLink = false,
+	submitBtnDanger = false,
+	collectionId,
+}: FormLayoutProps) {
+	const { t } = useTranslation('common');
+	return (
+		<Container
+			style={{
+				minHeight: '100%',
+				display: 'flex',
+				flexDirection: 'column',
+			}}
+			pt={80}
+		>
+			<main
+				style={{
+					display: 'flex',
+					flex: 1,
+					alignItems: 'center',
+					flexDirection: 'column',
+				}}
+			>
+				<Head title={title} />
+				<form
+					onSubmit={handleSubmit}
+					style={{
+						maxWidth: '100%',
+						width: rem(600),
+					}}
+				>
+					<Title order={1} size="h2" c="blue">
+						{title}
+					</Title>
+					{children}
+
+					<Group
+						justify={disableHomeLink ? 'flex-end' : 'space-between'}
+						align="center"
+						mt="md"
+					>
+						{!disableHomeLink && (
+							<Anchor
+								component={Link}
+								href={appendCollectionId(route('dashboard').url, collectionId)}
+								disabled={disableHomeLink}
+							>
+								{t('back-home')}
+							</Anchor>
+						)}
+						<Button
+							type="submit"
+							variant="filled"
+							disabled={!canSubmit}
+							color={submitBtnDanger ? 'red' : 'blue'}
+							style={{ transition: 'background-color 0.15s' }}
+						>
+							{textSubmitButton}
+						</Button>
+					</Group>
+					<MantineFooter />
+				</form>
+			</main>
+		</Container>
+	);
+}
+
+const LayoutWrapper = (props: FormLayoutProps) => (
+	<BaseLayout>
+		<FormLayout {...props} />
+	</BaseLayout>
+);
+
+export { LayoutWrapper as FormLayout };