refactor: colocate frontend component files

src/pages/account/ui/AccountPage/components/PositionLogo.view.tsx

@@ -0,0 +1,47 @@
+import { Anchor, Avatar } from "@mantine/core";
+import type { FC } from "react";
+import { useState } from "react";
+import { Link } from "react-router";
+
+type PositionLogoProps = {
+	src: string | null;
+	label: string;
+	to?: string;
+};
+
+const PositionLogo: FC<PositionLogoProps> = (props) => {
+	const { src, label } = props;
+	const [failed, setFailed] = useState(false);
+
+	const logo =
+		src && !failed ? (
+			<Avatar
+				src={src}
+				alt={label}
+				size={40}
+				radius="md"
+				onError={() => setFailed(true)}
+			/>
+		) : (
+			<Avatar size={40} radius="md">
+				{(label.trim()[0] ?? "?").toUpperCase()}
+			</Avatar>
+		);
+	return props.to ? (
+		<Anchor
+			component={Link}
+			to={props.to}
+			aria-label={label}
+			c="inherit"
+			underline="never"
+			display="block"
+			style={{ borderRadius: "var(--mantine-radius-md)" }}
+		>
+			{logo}
+		</Anchor>
+	) : (
+		logo
+	);
+};
+
+export { PositionLogo };