feat: user preferences (#470)

* wip: improve user preferences

* wip: fix translations and add user danger zone

* feat: add user delete button to danger zone

* fix: test not working

* refactor: add access checks for user edit page, improve not found behaviour, change user preference link in avatar menu to correct link

* fix: remove invalid bg for container

* chore: address pull request feedback

apps/nextjs/src/components/manage/danger-zone.tsx

@@ -0,0 +1,70 @@
+import { Fragment } from "react";
+import {
+  Card,
+  CardSection,
+  Divider,
+  Group,
+  Stack,
+  Text,
+  Title,
+} from "@mantine/core";
+
+import { getI18n } from "@homarr/translation/server";
+
+interface DangerZoneRootProps {
+  children: React.ReactNode[] | React.ReactNode;
+}
+
+export const DangerZoneRoot = async ({ children }: DangerZoneRootProps) => {
+  const t = await getI18n();
+
+  return (
+    <Stack gap="sm">
+      <Title c="red.8" order={2}>
+        {t("common.dangerZone")}
+      </Title>
+      <Card withBorder style={{ borderColor: "var(--mantine-color-red-8)" }}>
+        <Stack gap="sm">
+          {Array.isArray(children)
+            ? children.map((child, index) => (
+                <Fragment key={index}>
+                  {child}
+                  {index + 1 !== children.length && (
+                    <CardSection>
+                      <Divider />
+                    </CardSection>
+                  )}
+                </Fragment>
+              ))
+            : children}
+        </Stack>
+      </Card>
+    </Stack>
+  );
+};
+
+interface DangerZoneItemProps {
+  label: string;
+  description: string;
+  action: React.ReactNode;
+}
+
+export const DangerZoneItem = ({
+  label,
+  description,
+  action,
+}: DangerZoneItemProps) => {
+  return (
+    <Group justify="space-between" px="md">
+      <Stack gap={0}>
+        <Text fw="bold" size="sm">
+          {label}
+        </Text>
+        <Text size="sm">{description}</Text>
+      </Stack>
+      <Group justify="end" w={{ base: "100%", xs: "auto" }}>
+        {action}
+      </Group>
+    </Group>
+  );
+};