chore: codify React component style

src/shared/ui/AppShell.tsx

@@ -1,13 +1,14 @@
 import { AppShell as MantineAppShell, NavLink, Text } from "@mantine/core";
-import type { ReactNode } from "react";
+import type { FC, ReactNode } from "react";
 import { useTranslation } from "react-i18next";
 import { Outlet, NavLink as RouterNavLink, useLocation } from "react-router";
 
-export function AppShell({
-	contentAboveOutlet,
-}: {
+type AppShellProps = {
 	contentAboveOutlet?: ReactNode;
-}) {
+};
+
+const AppShell: FC<AppShellProps> = (props) => {
+	const { contentAboveOutlet } = props;
 	const { t } = useTranslation();
 	const { pathname } = useLocation();
 	const items = [
@@ -52,4 +53,6 @@ export function AppShell({
 			</nav>
 		</MantineAppShell>
 	);
-}
+};
+
+export { AppShell };

src/shared/ui/StateView.tsx

@@ -1,5 +1,5 @@
 import { Button, Loader, Paper, Stack, Text, Title } from "@mantine/core";
-import type { ReactNode } from "react";
+import type { FC, ReactNode } from "react";
 
 type StateViewProps = {
 	title: string;
@@ -9,13 +9,8 @@ type StateViewProps = {
 	error?: boolean;
 };
 
-export function StateView({
-	title,
-	text,
-	action,
-	loading = false,
-	error = false,
-}: StateViewProps) {
+const StateView: FC<StateViewProps> = (props) => {
+	const { title, text, action, loading = false, error = false } = props;
 	const role = loading ? "status" : error ? "alert" : undefined;
 
 	return (
@@ -28,6 +23,6 @@ export function StateView({
 			</Stack>
 		</Paper>
 	);
-}
+};
 
-export { Button };
+export { Button, StateView };