From 4c046bbcb3f06688e75eaaee2afbfa3c65e6c1f1 Mon Sep 17 00:00:00 2001
From: Tim Ittermann <tim.ittermann@gmail.com>
Date: Wed, 31 Jul 2024 18:55:10 +0200
Subject: [PATCH] Add profileImage

---
 src/components/common/NavBar.tsx | 140 ++++++++++++++++++-------------
 1 file changed, 80 insertions(+), 60 deletions(-)

diff --git a/src/components/common/NavBar.tsx b/src/components/common/NavBar.tsx
index 003407e..be72333 100644
--- a/src/components/common/NavBar.tsx
+++ b/src/components/common/NavBar.tsx
@@ -1,73 +1,93 @@
-export const Navbar = async () => {
-  <div className="navbar bg-base-100">
-    <div className="navbar-start">
-      <div className="dropdown">
-        <div tabIndex={0} role="button" className="btn btn-ghost lg:hidden">
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            className="h-5 w-5"
-            fill="none"
-            viewBox="0 0 24 24"
-            stroke="currentColor"
+import { auth } from "@/auth";
+import Image from "next/image";
+import { redirect } from "next/navigation";
+
+export async function NavBar() {
+  const currentUser = await auth();
+  if (currentUser == null) redirect("/");
+
+  return (
+    <div className="navbar bg-base-100">
+      <div className="navbar-start">
+        <div className="dropdown">
+          <div tabIndex={0} role="button" className="btn btn-ghost lg:hidden">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              className="h-5 w-5"
+              fill="none"
+              viewBox="0 0 24 24"
+              stroke="currentColor"
+            >
+              <path
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                strokeWidth="2"
+                d="M4 6h16M4 12h8m-8 6h16"
+              />
+            </svg>
+          </div>
+          <ul
+            tabIndex={0}
+            className="menu dropdown-content menu-sm z-[1] mt-3 w-52 rounded-box bg-base-100 p-2 shadow"
           >
-            <path
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth="2"
-              d="M4 6h16M4 12h8m-8 6h16"
-            />
-          </svg>
+            <li>
+              <a>Item 1</a>
+            </li>
+            <li>
+              <a>Parent</a>
+              <ul className="p-2">
+                <li>
+                  <a>Submenu 1</a>
+                </li>
+                <li>
+                  <a>Submenu 2</a>
+                </li>
+              </ul>
+            </li>
+            <li>
+              <a>Item 3</a>
+            </li>
+          </ul>
         </div>
-        <ul
-          tabIndex={0}
-          className="menu dropdown-content menu-sm z-[1] mt-3 w-52 rounded-box bg-base-100 p-2 shadow"
-        >
+        <a className="btn btn-ghost text-xl">Simple Meal Plan</a>
+      </div>
+      <div className="navbar-center hidden lg:flex">
+        <ul className="menu menu-horizontal px-1">
           <li>
             <a>Item 1</a>
           </li>
           <li>
-            <a>Parent</a>
-            <ul className="p-2">
-              <li>
-                <a>Submenu 1</a>
-              </li>
-              <li>
-                <a>Submenu 2</a>
-              </li>
-            </ul>
+            <details>
+              <summary>Parent</summary>
+              <ul className="p-2">
+                <li>
+                  <a>Submenu 1</a>
+                </li>
+                <li>
+                  <a>Submenu 2</a>
+                </li>
+              </ul>
+            </details>
           </li>
           <li>
             <a>Item 3</a>
           </li>
         </ul>
       </div>
-      <a className="btn btn-ghost text-xl">Simple Meal Plan</a>
-    </div>
-    <div className="navbar-center hidden lg:flex">
-      <ul className="menu menu-horizontal px-1">
-        <li>
-          <a>Item 1</a>
-        </li>
-        <li>
-          <details>
-            <summary>Parent</summary>
-            <ul className="p-2">
-              <li>
-                <a>Submenu 1</a>
-              </li>
-              <li>
-                <a>Submenu 2</a>
-              </li>
-            </ul>
-          </details>
-        </li>
-        <li>
-          <a>Item 3</a>
-        </li>
-      </ul>
-    </div>
-    <div className="navbar-end">
-      <a className="btn">Button</a>
+      <div className="navbar-end">
+        {currentUser.user?.image && (
+          <div className="avatar">
+            <div className="w-24 rounded-full ring ring-primary ring-offset-2 ring-offset-base-100">
+              <Image
+                src={currentUser.user.image}
+                width={64}
+                height={64}
+                alt="User profile image"
+              />
+            </div>
+          </div>
+        )}
+      </div>
     </div>
-  </div>;
-};
+  );
+}