feat: establish frontend foundation

src/shared/ui/StateView.tsx

@@ -0,0 +1,33 @@
+import { Button, Loader, Paper, Stack, Text, Title } from "@mantine/core";
+import type { ReactNode } from "react";
+
+type StateViewProps = {
+	title: string;
+	text: string;
+	action?: ReactNode;
+	loading?: boolean;
+	error?: boolean;
+};
+
+export function StateView({
+	title,
+	text,
+	action,
+	loading = false,
+	error = false,
+}: StateViewProps) {
+	const role = loading ? "status" : error ? "alert" : undefined;
+
+	return (
+		<Paper p="xl" radius="md" shadow="xs" withBorder role={role}>
+			<Stack align="flex-start" gap="sm">
+				{loading ? <Loader aria-label={title} size="sm" /> : null}
+				<Title order={2}>{title}</Title>
+				<Text c="dimmed">{text}</Text>
+				{action}
+			</Stack>
+		</Paper>
+	);
+}
+
+export { Button };