Profile page UI and functionality implemented

2026-04-25 17:57:58 -06:00
parent 7dd2562bae
commit 68517796a9
103 changed files with 4439 additions and 1476 deletions
@@ -0,0 +1,46 @@
+"use client";
+
+import { memo } from "react";
+import type { DividerViewProps } from "./Divider.types";
+
+const lineColor: Record<"content" | "menu", string> = {
+  content: "bg-[var(--color-border-default-secondary)]",
+  menu: "bg-[var(--color-border-default-tertiary)]",
+};
+
+/**
+ * Figma: "Utility / Divider" — horizontal Content (6894:22988), vertical Content
+ * (6894:22990), Menu horizontal (450:1940), Menu vertical (2002:30943).
+ */
+export const DividerView = memo(function DividerView({
+  orientation = "horizontal",
+  type: dividerType = "content",
+  className = "",
+}: DividerViewProps) {
+  const color = lineColor[dividerType];
+
+  if (orientation === "vertical") {
+    return (
+      <div
+        className={`w-px shrink-0 self-stretch ${color} ${className}`}
+        data-figma-node={dividerType === "content" ? "6894:22990" : "2002:30943"}
+        aria-hidden="true"
+      />
+    );
+  }
+
+  return (
+    <div
+      className={`flex w-full flex-col items-center ${className}`}
+      data-figma-node={dividerType === "content" ? "6894:22988" : "450:1940"}
+    >
+      <div
+        className={`h-px w-full shrink-0 ${color}`}
+        data-figma-node={dividerType === "content" ? "6894:22989" : "2002:30856"}
+        aria-hidden="true"
+      />
+    </div>
+  );
+});
+
+DividerView.displayName = "DividerView";