From a63713032ff6b15b80348f724246e7abea40c8a4 Mon Sep 17 00:00:00 2001
From: Md Saban <45597394+mdsaban@users.noreply.github.com>
Date: Sun, 23 Jun 2024 17:39:40 +0530
Subject: ui: Changes for user settings page (#251)

* fix: ui refactoring for user settings page

* fix: type error

* fix: pr comments
---
 .../components/dashboard/settings/UserDetails.tsx  | 33 ++++++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 apps/web/components/dashboard/settings/UserDetails.tsx

(limited to 'apps/web/components/dashboard/settings/UserDetails.tsx')

diff --git a/apps/web/components/dashboard/settings/UserDetails.tsx b/apps/web/components/dashboard/settings/UserDetails.tsx
new file mode 100644
index 00000000..3915782b
--- /dev/null
+++ b/apps/web/components/dashboard/settings/UserDetails.tsx
@@ -0,0 +1,33 @@
+import { Input } from "@/components/ui/input";
+import { api } from "@/server/api/client";
+
+export default async function UserDetails() {
+  const whoami = await api.users.whoami();
+
+  const details = [
+    {
+      label: "Name",
+      value: whoami.name ?? undefined,
+    },
+    {
+      label: "Email",
+      value: whoami.email ?? undefined,
+    },
+  ];
+
+  return (
+    <div className="mb-8 flex flex-col sm:flex-row">
+      <div className="mb-4 w-full text-lg font-medium sm:w-1/3">
+        Basic Details
+      </div>
+      <div className="w-full">
+        {details.map(({ label, value }) => (
+          <div className="mb-2" key={label}>
+            <div className="mb-2 text-sm font-medium">{label}</div>
+            <Input value={value} disabled />
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
-- 
cgit v1.2.3-70-g09d2