From 59507d9666b50c8b14edf522089a6d5c58466166 Mon Sep 17 00:00:00 2001
From: ruru <142723369+ruru-m07@users.noreply.github.com>
Date: Wed, 21 Feb 2024 19:14:26 +0530
Subject: [PATCH 1/3] ADD: Update Bio

Co-Authored-By: ruru <ruru.dev07@gmail.com>
---
 .vscode/settings.json                         |   3 +-
 actions/repo/create.ts                        |   2 +-
 actions/user/update-bio.ts                    |  17 ++
 .../[repository]/components/Code.tsx          |  10 +-
 .../upload/[branch]/[[...path]]/page.tsx      |  12 ++
 .../[repository]/upload/components/Upload.tsx | 151 +++++++++++++++
 app/[username]/components/UserSide.tsx        |  80 +++++++-
 app/chat/[user]/loading.tsx                   |   2 +-
 app/chat/layout.tsx                           |   2 +-
 app/chat/loading.tsx                          |  16 ++
 app/favicon.ico                               | Bin 0 -> 4286 bytes
 app/globals.css                               |  56 ++++++
 app/loading.tsx                               |   6 +-
 app/page.tsx                                  | 173 +++++++++++++++++-
 components/Loader2.tsx                        |  47 +++--
 components/Navbar.tsx                         |   3 +-
 components/nav/Side.tsx                       |   5 +-
 components/nav/leftside.tsx                   |   4 +-
 components/nav/navItems.tsx                   |   2 +-
 components/ui/button.tsx                      |   6 +
 context/userContext.tsx                       |   3 +-
 middleware.ts                                 |  57 ------
 package-lock.json                             |  36 ++++
 package.json                                  |   7 +-
 protectedRouter.tsx                           |  12 +-
 25 files changed, 605 insertions(+), 107 deletions(-)
 create mode 100644 actions/user/update-bio.ts
 create mode 100644 app/[username]/[repository]/upload/[branch]/[[...path]]/page.tsx
 create mode 100644 app/[username]/[repository]/upload/components/Upload.tsx
 create mode 100644 app/chat/loading.tsx
 create mode 100644 app/favicon.ico
 delete mode 100644 middleware.ts

diff --git a/.vscode/settings.json b/.vscode/settings.json
index a58c77c..f5b66ae 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -36,5 +36,6 @@
     "glassit.step": 500,
     // "bitoAI.codeCompletion.enableCommentToCode": true,
     // "bitoAI.codeCompletion.enableAutoCompletion": true,
-    "cmake.options.statusBarVisibility": "hidden"
+    "cmake.options.statusBarVisibility": "hidden",
+    "editor.cursorBlinking": "smooth"
 }
\ No newline at end of file
diff --git a/actions/repo/create.ts b/actions/repo/create.ts
index 32e54d0..8fd2ef5 100644
--- a/actions/repo/create.ts
+++ b/actions/repo/create.ts
@@ -28,7 +28,7 @@ export const create = async (
     },
   });
 
-  console.log(existingRepo);
+  // console.log(existingRepo);
 
   if (existingRepo) {
     return { error: "Repository already exist with this name!" };
diff --git a/actions/user/update-bio.ts b/actions/user/update-bio.ts
new file mode 100644
index 0000000..ff1b143
--- /dev/null
+++ b/actions/user/update-bio.ts
@@ -0,0 +1,17 @@
+"use server";
+
+import { db } from "@/lib/db";
+
+export const updateBio = async (username: string, bio: string) => {
+  if (!username) {
+    return { error: "Invalid user!" };
+  }
+  await db.user.update({
+    where: { username: username },
+    data: {
+      bio: bio,
+    },
+  });
+
+  return { success: "Profile update Successfully! 🎉" };
+};
diff --git a/app/[username]/[repository]/components/Code.tsx b/app/[username]/[repository]/components/Code.tsx
index a4a8c4c..1bba392 100644
--- a/app/[username]/[repository]/components/Code.tsx
+++ b/app/[username]/[repository]/components/Code.tsx
@@ -119,7 +119,7 @@ export function Code({ repodata }: { repodata: Repository }) {
         </div>
         <div className="flex">
           <Button
-            className="mr-1 hover:border-[#51d89f] hover:bg-[#10241b] hover:text-[#51d89f]"
+            className="mr-1 dark:hover:border-[#51d89f] hover:border-[#166534] dark:hover:bg-[#10241b] hover:bg-[#a7f3d0] hover:text-[#166534]  dark:hover:text-[#51d89f]"
             variant={"outline"}
           >
             <Heart className="w-4 h-4 mr-2" />
@@ -293,9 +293,11 @@ export function Code({ repodata }: { repodata: Repository }) {
               </Button>
               <Dialog>
                 <DialogTrigger asChild>
-                  <Button variant="outline" className="ml-auto">
-                    Add File
-                  </Button>
+                  <Link href={`${repodata.name}/upload/${repodata.DefualtBranch}`}>
+                    <Button  variant="outline" className="ml-auto ">
+                      Add File
+                    </Button>
+                  </Link>
                 </DialogTrigger>
               </Dialog>
             </div>
diff --git a/app/[username]/[repository]/upload/[branch]/[[...path]]/page.tsx b/app/[username]/[repository]/upload/[branch]/[[...path]]/page.tsx
new file mode 100644
index 0000000..d4b8f64
--- /dev/null
+++ b/app/[username]/[repository]/upload/[branch]/[[...path]]/page.tsx
@@ -0,0 +1,12 @@
+import Upload from "../../components/Upload";
+
+export default function Page() {
+
+  return (
+    <main className="mx-6 my-5 xl:mx-60">
+      <div>
+        <Upload />
+      </div>
+    </main>
+  );
+}
diff --git a/app/[username]/[repository]/upload/components/Upload.tsx b/app/[username]/[repository]/upload/components/Upload.tsx
new file mode 100644
index 0000000..52cfdc9
--- /dev/null
+++ b/app/[username]/[repository]/upload/components/Upload.tsx
@@ -0,0 +1,151 @@
+"use client";
+
+import React, { useEffect, useState } from "react";
+import Dropzone from "react-dropzone";
+import { FileWithPath } from "file-selector";
+import {
+  FileCode2,
+  GitCommitHorizontal,
+  GitPullRequestArrow,
+} from "lucide-react";
+import { Card } from "@/components/ui/card";
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
+import { useAuth } from "@/context/userContext";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
+import { Button } from "@/components/ui/button";
+import { Label } from "@/components/ui/label";
+import { useParams } from "next/navigation";
+import Link from "next/link";
+
+const Upload = () => {
+  const { user } = useAuth();
+  const params = useParams<{
+    username: string;
+    repository: string;
+    branch: string;
+  }>();
+  console.log(params);
+  const [files, setFiles] = useState<FileWithPath[]>([]);
+
+  const handlechange = async (acceptFiles: FileWithPath[]) => {
+    // Items to ignore
+    const ignoreList = [
+      ".env",
+      "node_modules",
+      ".git",
+      ".next",
+      ".vercel",
+      "dist",
+    ];
+
+    // console.log(acceptFiles);
+    // Filter out files or folders listed in the ignoreList
+
+    const filteredFiles = acceptFiles.filter((file) => {
+      const fileName = file.path && file.path.toLowerCase();
+      return !ignoreList.some((item) => fileName?.includes(item.toLowerCase()));
+    });
+
+    setFiles((prevFiles) => [...prevFiles, ...filteredFiles]);
+  };
+
+  useEffect(() => {
+    console.log(files);
+  }, [files]);
+
+  return (
+    <div>
+      <div className="my-2 text-xl">
+        <Link className=" hover:text-blue-700 hover:underline" href={`/${params.username}/${params.repository}`}>{params.repository} {" "}</Link>  / 
+      </div>
+      <div className="items-center justify-center w-full p-5 border rounded-md">
+        <Dropzone onDrop={(acceptedFiles) => handlechange(acceptedFiles)}>
+          {({ getRootProps, getInputProps, isDragActive }) => (
+            <section className="flex items-center justify-center h-96">
+              <div
+                className="flex items-center justify-center w-full h-full "
+                {...getRootProps()}
+              >
+                <input {...getInputProps()} />
+                {isDragActive ? (
+                  <div className="flex items-center justify-center w-full h-full border-4 border-dashed rounded-md">
+                    <div className="grid place-items-center">
+                      <FileCode2
+                        className="mb-5 text-muted-foreground"
+                        size={50}
+                      />
+                      <p className="text-muted-foreground">
+                        Drop to Upload file
+                      </p>
+                    </div>
+                  </div>
+                ) : (
+                  <div className="grid w-full place-items-center">
+                    <FileCode2
+                      className="mb-5 text-muted-foreground"
+                      size={50}
+                    />
+
+                    <p className="text-muted-foreground">
+                      Drag files here to add them to your repository
+                    </p>
+                    <p className="text-muted-foreground">
+                      or
+                      <span className="text-blue-600 cursor-pointer hover:underline">
+                        choose your file
+                      </span>
+                    </p>
+                  </div>
+                )}
+              </div>
+            </section>
+          )}
+        </Dropzone>
+      </div>
+
+      <Card className="flex my-5 border-none rounded-md">
+        <div>
+          <Avatar>
+            <AvatarImage
+              src={user?.image || "https://asset-cocola.vercel.app/copilot.png"}
+              alt={user?.username || "profile"}
+            />
+            <AvatarFallback> </AvatarFallback>
+          </Avatar>
+        </div>
+        <div className="w-full ml-4 comment-box">
+          <Card className="w-full p-4 rounded-md">
+            <h1 className="text-xl ">Commit changes</h1>
+            <Input className="my-3" placeholder="Add file via upload" />
+            <Textarea
+              rows={5}
+              placeholder="Add an optional extended description..."
+            />
+            <RadioGroup className="mt-3" defaultValue="main">
+              <div className="flex items-center space-x-2">
+                <RadioGroupItem value="main" id="r1" />
+                <GitCommitHorizontal size={25} />
+                <p className="ml-2">Commit directly to the main branch.</p>
+              </div>
+              <div className="flex items-center space-x-2">
+                <RadioGroupItem className="mr-1" value="new" id="r2" />
+                <GitPullRequestArrow size={20} />
+                <p className="ml-2">
+                  Create a new branch for this commit and start a pull request.
+                </p>
+              </div>
+            </RadioGroup>
+          </Card>
+          <div className="flex gap-3 my-4">
+            <Button variant={"default"}>Commit changes</Button>
+            <Button variant={"danger2"}>Cancel</Button>
+          </div>
+        </div>
+      </Card>
+    </div>
+  );
+};
+
+export default Upload;
diff --git a/app/[username]/components/UserSide.tsx b/app/[username]/components/UserSide.tsx
index 8ddc388..0476cf2 100644
--- a/app/[username]/components/UserSide.tsx
+++ b/app/[username]/components/UserSide.tsx
@@ -1,10 +1,43 @@
-import React from "react";
+import React, { useState } from "react";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
 import { User } from "@prisma/client";
 import { Button } from "@/components/ui/button";
 import { ASSET_BASE_URL } from "@/resources";
-
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "@/components/ui/dialog";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+import { updateBio } from "@/actions/user/update-bio";
+import Alert from "@/components/alert/Alert";
 const UserSide = ({ userdata, user }: { userdata: User; user: User }) => {
+  const [error, setError] = useState<string | undefined>("");
+  const [success, setSuccess] = useState<string | undefined>("");
+  const [bio, setBio] = useState<string>();
+
+  const updateUserBio = () => {
+    setError("");
+    setSuccess("");
+
+    if (user?.username && bio) {
+      updateBio(user?.username, bio).then((data) => {
+        if (data?.error) {
+          setError(data.error);
+        }
+        if (data?.success) {
+          setSuccess(data.success);
+          setBio("");
+        }
+      });
+    }
+  };
+
   return (
     <div className="w-72">
       <Avatar className="overflow-visible mt-3 w-72 h-72">
@@ -29,9 +62,46 @@ const UserSide = ({ userdata, user }: { userdata: User; user: User }) => {
         ) : null}
 
         {userdata?.username === user?.username ? (
-          <Button className="w-full mt-4" variant={"outline"}>
-            Edit profile
-          </Button>
+          <Dialog>
+            <DialogTrigger asChild>
+              <Button className="w-full mt-4" variant={"outline"}>
+                Edit profile
+              </Button>
+            </DialogTrigger>
+            <DialogContent className="sm:max-w-[425px]">
+              <DialogHeader>
+                <DialogTitle>Edit profile</DialogTitle>
+                <DialogDescription>
+                  Make changes to your profile here. Click save when you&apos;re
+                  done.
+                </DialogDescription>
+              </DialogHeader>
+              <div className="grid gap-4 py-4">
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="bio" className="text-right">
+                    Bio
+                  </Label>
+                  <Textarea
+                    id="bio"
+                    className="col-span-3"
+                    value={bio}
+                    onChange={(e) => setBio(e.target.value)}
+                  />
+                </div>
+              </div>
+              <div className="my-4">
+                {error ? <Alert message={error} variant={"alert"} /> : null}
+                {success ? (
+                  <Alert message={success} variant={"success"} />
+                ) : null}
+              </div>
+              <DialogFooter>
+                <Button onClick={updateUserBio} type="submit">
+                  Save changes
+                </Button>
+              </DialogFooter>
+            </DialogContent>
+          </Dialog>
         ) : (
           <Button className="w-full mt-4" variant={"outline"}>
             Follow
diff --git a/app/chat/[user]/loading.tsx b/app/chat/[user]/loading.tsx
index 247b5a8..c34c83c 100644
--- a/app/chat/[user]/loading.tsx
+++ b/app/chat/[user]/loading.tsx
@@ -6,7 +6,7 @@ const Loading = () => {
     <div className="ml-4 h-full w-full border-slate-100">
       <Card className="h-full">
         <div className="px-2 h-full flex justify-center items-center">
-          <Loader2 />
+          <Loader2 size={30} />
         </div>
       </Card>
     </div>
diff --git a/app/chat/layout.tsx b/app/chat/layout.tsx
index 2192674..2fca50a 100644
--- a/app/chat/layout.tsx
+++ b/app/chat/layout.tsx
@@ -24,7 +24,7 @@ export default function DashboardLayout({
     },
     {
       id: 2,
-      name: "Ruru",
+      name: "ruru",
       lastMessage: "Hello! How are you?",
       time: "12:00",
       avatar: "https://asset-cocola.vercel.app/ruru_m07.png",
diff --git a/app/chat/loading.tsx b/app/chat/loading.tsx
new file mode 100644
index 0000000..c34c83c
--- /dev/null
+++ b/app/chat/loading.tsx
@@ -0,0 +1,16 @@
+import Loader2 from "@/components/Loader2";
+import { Card } from "@/components/ui/card";
+
+const Loading = () => {
+  return (
+    <div className="ml-4 h-full w-full border-slate-100">
+      <Card className="h-full">
+        <div className="px-2 h-full flex justify-center items-center">
+          <Loader2 size={30} />
+        </div>
+      </Card>
+    </div>
+  );
+};
+
+export default Loading;
diff --git a/app/favicon.ico b/app/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..b1a8b5afdc06f4f9f055a4c21bb6af1a7ef0511c
GIT binary patch
literal 4286
zcmeHKOHUI~7`-hCh>$>nufzp)p%7hY1S1KFB_<k!Vtg!J=t9>f8aKoQcIq$i6(5NS
zamm7+(R9O#h%FB*AoR{mr=7MGsuV1Jjpv&_B;!1awsE1C91`Y!bI<wC_szW*#vJ%@
zxfuOsuUi@0#Te@Z@QC#R^jsU5`#-kkKqMSyu}H)j6vcz0AoK%g4KN@}QpeoP3=1qQ
zu%IOEMa&t4IC^(L62)FcQR)FpF~qIrat?4`6gmF_Yyc@8GFWq5mV!scK!8C<r^JPK
zx|q^CX*^fJfAw23>5N1oru@X6&*zEz65a^{Dv;Mf1-B3R_VC3;;_i?H!DAZBc^ur=
zm!i=+B@{B{R=}OfWbC;){|N5mfdcmdXnAkT9gA6WLsvGNt%Q35-W(GOp6^HA<hij&
zg}iT2-eHTp$@5G)P288UmbvGYw<vZOxi@=G{Ca4f$132?74jx-*&-LpyIbI#p??}t
z&q2ge%_)C9-XiuIaa-0Ko}|{-E6Mu<*6X5gjCvPvhGe-(4hFXy0dtKJMR5X_y{4)v
z!@72Pm${c>G1K+7I)VPB{lW$B{D4XS2xabA6}d?(@+STx;9fG|Cp{s=^ir=yqtUIV
zXB#gS@;_|B?}fe{<Wnt%Ex#a4qPKPewV*HgZ<W6f+&lgvzqgkBw*GToQ~nD2e-`K3
zK8jmiU9EZ#P+tRw(Ep0T_ebY#7U$XvssZ*|MtfB?hb+r16b^60`E?ImbiXj#gR+<}
zYslwv)s(=fw{b2uf#U)A>8@g=A&2>wB_GnMR8=*EpaEwTX}E8rfqZDwG?Q<lcm?&j
z3k(|I4*I6+R!@(1UfBsI4V!$hs>O4}wvCUC(f)A(dP{c&@=XsvV*32Jo8lg8CqZ8e
zD-D_tzKIFaa2~v3k^9#>BIlnG<MvNaGu#C#(h&OD4`v$5{V?V8(Kj>ze!)zGRMarL
z1s^mGqDVbys-gI8woQ7yq~RR?=4Kl3oN94m*6(N0->-$fzIpWQEA->;Pg7G=i+=C~
ziW>B>^!FTMPQDo#VRrw2P@%M*l;vh{+ytHij}7n$ai>Q|N45P4>z_i*LxZ>{c=ilF
z-3E6v-Shu+d|z8*N$kss<z?sBM1rj)lcr13-Z?)%&sJ7eobh<v0hq@AD--afFoyRy
zRMzUqGgn=f^);l}a7)6$+PRatJ@stJ)1s=w?SR_?G><q>gR0`aA-wO#I_+4m1?x6o
P{W_I+)WAl8R8@Zf2~72%

literal 0
HcmV?d00001

diff --git a/app/globals.css b/app/globals.css
index b0dcee0..5827c43 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -5,6 +5,8 @@
 html,
 body,
 :root {
+  padding: 0;
+  margin: 0;
   height: 100%;
 }
 
@@ -179,3 +181,57 @@ body::-webkit-scrollbar-thumb {
     @apply bg-background text-foreground;
   }
 }
+
+/* .comment-box {
+  position: relative;
+ }
+ 
+ .comment-box:before, .comment-box:after {
+  content: '';
+  height: 0;
+  width: 0;
+  position: absolute;
+  display: block;
+  border-width: 10px 12px 10px 0;
+  border-style: solid;
+  border-color: transparent #0a0a0a;
+  top: 8px;
+  left: -11px;
+ }
+ 
+ .comment-box:before {
+  border-width: 11px 13px 11px 0;
+  border-color: transparent #262626;
+  left: -12px;
+ }
+ 
+ .reply-list .comment-box {
+  width: 610px;
+ } */
+.comment-box {
+  position: relative;
+}
+
+.comment-box:before,
+.comment-box:after {
+  position: absolute;
+  top: 11px;
+  right: 100%;
+  left: -8px;
+  display: block;
+  width: 8px;
+  height: 16px;
+  pointer-events: none;
+  content: " ";
+  clip-path: polygon(0 50%, 100% 0, 100% 100%);
+}
+
+.comment-box::before {
+  background-color: #262626;
+}
+
+.comment-box::after {
+  display: table;
+  clear: both;
+  content: "";
+}
diff --git a/app/loading.tsx b/app/loading.tsx
index d6c9e20..e3a5eba 100644
--- a/app/loading.tsx
+++ b/app/loading.tsx
@@ -1,10 +1,10 @@
-import Loader from "@/components/Loader";
+import Loader2 from "@/components/Loader2";
 
 export default function Loading() {
   return (
     <>
-      <div className="h-screen flex w-full">
-        <Loader />
+      <div className="h-screen justify-center items-center flex w-full">
+        <Loader2 />
       </div>
     </>
   );
diff --git a/app/page.tsx b/app/page.tsx
index e156ed6..b250aa9 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,10 +1,177 @@
+"use client";
+
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { ScrollArea } from "@/components/ui/scroll-area";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select";
+import { useAuth } from "@/context/userContext";
+import { cn } from "@/lib/utils";
+import Image from "next/image";
 import Link from "next/link";
+import React from "react";
+interface AccountSwitcherProps {
+  isCollapsed: boolean;
+  accounts: {
+    label: string;
+    // label: string;
+    icon: React.ReactNode;
+  }[];
+}
 
 export default function Page() {
+  const { user } = useAuth();
+
+  const accounts = [
+    {
+      label: user?.username || "",
+      icon: (
+        <>
+          <Image
+            src={user?.image || "https://asset-cocola.vercel.app/ruru_m07.png"}
+            className="rounded-full"
+            alt="user"
+            width={25}
+            height={25}
+          />
+        </>
+      ),
+    },
+  ];
+
+  const repository = [
+    {
+      image: "https://asset-cocola.vercel.app/ruru_m07.png",
+      auther: "ruru_m07",
+      repository: "test",
+    },
+    {
+      image: "https://asset-cocola.vercel.app/copilot.png",
+      auther: "copilot",
+      repository: "AI",
+    },
+    {
+      image: "https://asset-cocola.vercel.app/ruru_m07.png",
+      auther: "ruru-m07",
+      repository: "test",
+    },
+    {
+      image: "https://asset-cocola.vercel.app/black_logo_png.png",
+      auther: "cocola-dev",
+      repository: "cocola",
+    },
+  ];
+
+  const [selectedAccount, setSelectedAccount] = React.useState<string>(
+    accounts[0].label,
+  );
+
+  const isCollapsed = false;
+
   return (
-    <main>
-      <h1>Home</h1>
-      <Link href="/auth/login">login</Link>
+    <main className="h-full w-full border-t flex justify-between">
+      <ScrollArea className="w-[550px] border-r p-4 h-[93vh] sticky top-0">
+        <div className="w-40">
+          <Select
+            defaultValue={selectedAccount}
+            onValueChange={setSelectedAccount}
+          >
+            <SelectTrigger
+              className={cn(
+                "flex items-center gap-2 [&>span]:line-clamp-1 [&>span]:flex [&>span]:w-full [&>span]:items-center [&>span]:gap-1 [&>span]:truncate [&_svg]:h-4 [&_svg]:w-4 [&_svg]:shrink-0",
+                isCollapsed &&
+                  "flex h-9 w-9 shrink-0 items-center justify-center p-0 [&>span]:w-auto [&>svg]:hidden",
+              )}
+              aria-label="Select account"
+            >
+              <SelectValue placeholder="Select an account">
+                {
+                  accounts.find((account) => account.label === selectedAccount)
+                    ?.icon
+                }
+                <span className={cn("ml-2", isCollapsed && "hidden")}>
+                  {
+                    accounts.find(
+                      (account) => account.label === selectedAccount,
+                    )?.label
+                  }
+                </span>
+              </SelectValue>
+            </SelectTrigger>
+            <SelectContent>
+              {accounts.map((account) => (
+                <SelectItem key={account.label} value={account.label}>
+                  <div className="flex items-center gap-3 [&_svg]:h-4 [&_svg]:w-4 [&_svg]:shrink-0 [&_svg]:text-foreground">
+                    {account.icon}
+                    {account.label}
+                  </div>
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+        </div>
+        {/* Top Repositories */}
+
+        <div className="w-full ">
+          <div className="flex items-center my-3 justify-between">
+            <h1 className="w-full text-lg">Top Repositories</h1>
+            <Button size={"sm"}> New </Button>
+          </div>
+          <div>
+            <Input placeholder="Find a repository" />
+          </div>
+          <div className="my-3 mt-5">
+            {repository.map((repo, index) => (
+              <div key={index} className="flex items-center my-2 ">
+                <Avatar className="w-5 h-5">
+                  <AvatarImage
+                    src={repo.image}
+                    alt="repository"
+                    width={2}
+                    height={2}
+                  />
+                  <AvatarFallback></AvatarFallback>
+                </Avatar>
+                <span className="ml-2 text-sm">
+                  <Link href={`/${repo.auther}`}>{repo.auther}</Link> /{" "}
+                  <Link href={`/${repo.auther}/${repo.repository}`}>
+                    {repo.repository}
+                  </Link>
+                </span>
+              </div>
+            ))}
+            <Button
+              className="m-0 p-0 hover:text-blue-700 text-muted-foreground"
+              variant={"link"}
+            >
+              see more
+            </Button>
+          </div>
+        </div>
+
+        {/* Recent activity */}
+
+        <div className="w-full ">
+          <div className="flex items-center my-3 justify-between">
+            <h1 className="w-full text-lg">Recent activity</h1>
+          </div>
+          <div className="my-3 mt-5">
+            <h1 className="text-muted-foreground">
+              don&apos;t have any recent activity
+            </h1>
+          </div>
+        </div>
+      </ScrollArea>
+      <ScrollArea className="w-full border-r p-4 h-[93vh]">
+        <h1 className="text-2xl">Home</h1>
+      </ScrollArea>
+      <ScrollArea className="w-[550px] border-r p-4 h-[93vh]"></ScrollArea>
     </main>
   );
 }
diff --git a/components/Loader2.tsx b/components/Loader2.tsx
index 094cf20..9cc6157 100644
--- a/components/Loader2.tsx
+++ b/components/Loader2.tsx
@@ -1,21 +1,38 @@
-const Loader2 = () => {
+const Loader2 = ({ size }: { size?: number }) => {
   return (
     <div className="flex space-x-2 w-full fixed bg-card  justify-center items-center">
       <div className=" flex justify-center items-center">
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="24"
-          height="24"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          stroke-width="2"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          className="lucide lucide-loader-2 animate-spin"
-        >
-          <path d="M21 12a9 9 0 1 1-6.219-8.56" />
-        </svg>
+        {size ? (
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            width={size}
+            height={size}
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            className="lucide lucide-loader-2 animate-spin"
+          >
+            <path d="M21 12a9 9 0 1 1-6.219-8.56" />
+          </svg>
+        ) : (
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            className="lucide lucide-loader-2 animate-spin"
+          >
+            <path d="M21 12a9 9 0 1 1-6.219-8.56" />
+          </svg>
+        )}
       </div>
     </div>
   );
diff --git a/components/Navbar.tsx b/components/Navbar.tsx
index 0604e88..c6d4d03 100644
--- a/components/Navbar.tsx
+++ b/components/Navbar.tsx
@@ -24,7 +24,8 @@ const Navbar = ({ isAuthenticated }: { isAuthenticated: any }) => {
           <div className="flex items-center ml-4">
             {isAuthenticated ? <Leftside /> : <div className="-mb-10" />}
             <Logo />
-            {params ? (
+
+            {params && isAuthenticated ? (
               <div>
                 <Link
                   href={`/${params.username}`}
diff --git a/components/nav/Side.tsx b/components/nav/Side.tsx
index f3633bc..fc2540e 100644
--- a/components/nav/Side.tsx
+++ b/components/nav/Side.tsx
@@ -46,7 +46,10 @@ export function Side({ links, isCollapsed }: NavProps) {
                   <span className="sr-only">{link.title}</span>
                 </Link>
               </TooltipTrigger>
-              <TooltipContent side="right" className="flex items-center gap-4">
+              <TooltipContent
+                side="right"
+                className="flex bg-card text-card-foreground border items-center gap-4"
+              >
                 {link.title}
                 {link.label && (
                   <span className="ml-auto text-muted-foreground">
diff --git a/components/nav/leftside.tsx b/components/nav/leftside.tsx
index 1443aca..64fe9b7 100644
--- a/components/nav/leftside.tsx
+++ b/components/nav/leftside.tsx
@@ -49,11 +49,11 @@ const Leftside = () => {
                   path: "/messages",
                 },
                 {
-                  title: "Forums",
+                  title: "Chat",
                   label: "4",
                   icon: MessagesSquare,
                   variant: "ghost",
-                  path: "/messages",
+                  path: "/chat",
                 },
                 {
                   title: "Analytics",
diff --git a/components/nav/navItems.tsx b/components/nav/navItems.tsx
index d2d02be..5643bc6 100644
--- a/components/nav/navItems.tsx
+++ b/components/nav/navItems.tsx
@@ -5,7 +5,7 @@ const NavItems = () => {
   return (
     <div className={"text-muted-foreground"}>
       <div>
-        <Button className="mx-2" variant={"ghost"}>
+        <Button className="mx-2 ml-4" variant={"ghost"}>
           Documentation
         </Button>
         <Button className="mx-2" variant={"ghost"}>
diff --git a/components/ui/button.tsx b/components/ui/button.tsx
index 225e113..70edf4d 100644
--- a/components/ui/button.tsx
+++ b/components/ui/button.tsx
@@ -19,6 +19,12 @@ const buttonVariants = cva(
           "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
         ghost: "hover:bg-accent hover:text-accent-foreground",
         link: "text-primary underline-offset-4 hover:underline",
+        danger:
+          "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground mr-1 dark:hover:border-red-500 hover:border-[#166534] dark:hover:bg-red-950 hover:bg-[#a7f3d0] hover:text-[#166534]  dark:hover:text-red-500",
+        danger2:
+          "text-red-700 border hover:border-red-700 hover:text-primary hover:bg-red-700 ",
+        success:
+          "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground mr-1 dark:hover:border-[#51d89f] hover:border-[#166534] dark:hover:bg-[#10241b] hover:bg-[#a7f3d0] hover:text-[#166534]  dark:hover:text-[#51d89f]",
       },
       size: {
         default: "h-9 px-4 py-2",
diff --git a/context/userContext.tsx b/context/userContext.tsx
index 893a6cc..137a36b 100644
--- a/context/userContext.tsx
+++ b/context/userContext.tsx
@@ -5,8 +5,7 @@ import Loader from "@/components/Loader";
 import { User } from "@prisma/client";
 import { useCurrentUser } from "@/hooks/use-current-user";
 import { whoami } from "@/actions/whoami";
-import { debounce, set } from "lodash";
-import { notFound } from "next/navigation";
+import { debounce } from "lodash";
 
 const AuthContext = createContext<{
   user: User | null;
diff --git a/middleware.ts b/middleware.ts
deleted file mode 100644
index 054463d..0000000
--- a/middleware.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-import NextAuth from "next-auth";
-import authConfig from "@/auth.config";
-import {
-  DEFAULT_LOGIN_REDIRECT,
-  apiAuthPrefix,
-  authRoutes,
-  publicRoutes,
-} from "@/routes";
-
-const { auth } = NextAuth(authConfig);
-
-export default auth((req) => {
-  const { nextUrl } = req;
-  const isLoggedIn = !!req.auth;
-
-  const isApiAuthRoute = nextUrl.pathname.startsWith(apiAuthPrefix);
-  const isPublicRoute = publicRoutes.some((route) => {
-    // Check if the route is a dynamic parameter route
-    if (route.includes("/:")) {
-      const regex = new RegExp(route.replace(/:[^/]+/g, "[^/]+"));
-      return regex.test(nextUrl.pathname);
-    }
-    return route === nextUrl.pathname;
-  });
-  const isAuthRoute = authRoutes.includes(nextUrl.pathname);
-
-  if (isApiAuthRoute) {
-    return null;
-  }
-
-  if (isAuthRoute) {
-    if (isLoggedIn) {
-      return Response.redirect(new URL(DEFAULT_LOGIN_REDIRECT, nextUrl));
-    }
-    return null;
-  }
-
-  if (!isLoggedIn && !isPublicRoute) {
-    let callbackUrl = nextUrl.pathname;
-    if (nextUrl.search) {
-      callbackUrl += nextUrl.search;
-    }
-
-    const encodedCallbackUrl = encodeURIComponent(callbackUrl);
-
-    return Response.redirect(
-      new URL(`/login?callbackUrl=${encodedCallbackUrl}`, nextUrl),
-    );
-  }
-
-  return null;
-});
-
-// Optionally, don't invoke Middleware on some paths
-export const config = {
-  matcher: ["/((?!.+\\.[\\w]+$|_next).*)", "/", "/(api|trpc)(.*)"],
-};
diff --git a/package-lock.json b/package-lock.json
index beeb32f..45e9198 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -55,6 +55,7 @@
         "nextjs-toploader": "^1.6.6",
         "react": "^18",
         "react-dom": "^18",
+        "react-dropzone": "^14.2.3",
         "react-hook-form": "^7.49.3",
         "react-icons": "^5.0.1",
         "react-otp-input": "^3.1.1",
@@ -5419,6 +5420,14 @@
       "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
       "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
     },
+    "node_modules/attr-accept": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-2.2.2.tgz",
+      "integrity": "sha512-7prDjvt9HmqiZ0cl5CRjtS84sEyhsHP2coDkaZKRKVfCDo9s7iw7ChVmar78Gu9pC4SoR/28wFu/G5JJhTnqEg==",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/autoprefixer": {
       "version": "10.4.17",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.17.tgz",
@@ -7859,6 +7868,17 @@
         "node": "^10.12.0 || >=12.0.0"
       }
     },
+    "node_modules/file-selector": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/file-selector/-/file-selector-0.6.0.tgz",
+      "integrity": "sha512-QlZ5yJC0VxHxQQsQhXvBaC7VRJ2uaxTf+Tfpu4Z/OcVQJVpZO+DGU0rkoVW5ce2SccxugvpBJoMvUs59iILYdw==",
+      "dependencies": {
+        "tslib": "^2.4.0"
+      },
+      "engines": {
+        "node": ">= 12"
+      }
+    },
     "node_modules/file-uri-to-path": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
@@ -13140,6 +13160,22 @@
         "react": "^18.2.0"
       }
     },
+    "node_modules/react-dropzone": {
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-14.2.3.tgz",
+      "integrity": "sha512-O3om8I+PkFKbxCukfIR3QAGftYXDZfOE2N1mr/7qebQJHs7U+/RSL/9xomJNpRg9kM5h9soQSdf0Gc7OHF5Fug==",
+      "dependencies": {
+        "attr-accept": "^2.2.2",
+        "file-selector": "^0.6.0",
+        "prop-types": "^15.8.1"
+      },
+      "engines": {
+        "node": ">= 10.13"
+      },
+      "peerDependencies": {
+        "react": ">= 16.8 || 18.0.0"
+      }
+    },
     "node_modules/react-hook-form": {
       "version": "7.49.3",
       "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.49.3.tgz",
diff --git a/package.json b/package.json
index 8b1f434..29f2a27 100644
--- a/package.json
+++ b/package.json
@@ -4,13 +4,13 @@
   "private": true,
   "scripts": {
     "postinstall": "prisma generate",
-    "dev": "next dev --turbo",
+    "dev": "next dev",
     "build": "prisma generate && next build",
     "start": "next start",
     "lint": "next lint",
     "prisma": "prisma generate && prisma db push ",
-    "format": "prettier . --check && prettier . --write",
-    "prettier": "prettier . --check && prettier . --write"
+    "format": "prettier . --write",
+    "prettier": "prettier . --write"
   },
   "dependencies": {
     "@auth/mongodb-adapter": "^2.1.0",
@@ -59,6 +59,7 @@
     "nextjs-toploader": "^1.6.6",
     "react": "^18",
     "react-dom": "^18",
+    "react-dropzone": "^14.2.3",
     "react-hook-form": "^7.49.3",
     "react-icons": "^5.0.1",
     "react-otp-input": "^3.1.1",
diff --git a/protectedRouter.tsx b/protectedRouter.tsx
index d04940c..ed2bfc2 100644
--- a/protectedRouter.tsx
+++ b/protectedRouter.tsx
@@ -1,15 +1,15 @@
 import { NextComponentType } from "next";
-import LoginRequired from "./components/LoginRequired";
 import { useSession } from "next-auth/react";
+import { redirect } from "next/navigation";
 
 export function withAuth(Component: NextComponentType) {
-  return async function AuthComponent(props: any) {
-    const session = useSession();
+  return function AuthComponent(props: any) {
+    const { data: session } = useSession();
 
-    if (session.status === "unauthenticated") {
-      return <LoginRequired />;
+    if (!session) {
+      return redirect(`/login`);
     }
 
-    return session ? <Component {...props} /> : null;
+    return <Component {...props} />;
   };
 }

From e02afb70a5ea6d323d4cf297e13438a3fe1129c2 Mon Sep 17 00:00:00 2001
From: ruru <142723369+ruru-m07@users.noreply.github.com>
Date: Wed, 21 Feb 2024 19:22:22 +0530
Subject: [PATCH 2/3] npm run format

Co-Authored-By: ruru <ruru.dev07@gmail.com>
---
 app/[username]/[repository]/components/Code.tsx           | 6 ++++--
 .../[repository]/upload/[branch]/[[...path]]/page.tsx     | 1 -
 app/[username]/[repository]/upload/components/Upload.tsx  | 8 +++++++-
 3 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/app/[username]/[repository]/components/Code.tsx b/app/[username]/[repository]/components/Code.tsx
index 1bba392..b2eee6d 100644
--- a/app/[username]/[repository]/components/Code.tsx
+++ b/app/[username]/[repository]/components/Code.tsx
@@ -293,8 +293,10 @@ export function Code({ repodata }: { repodata: Repository }) {
               </Button>
               <Dialog>
                 <DialogTrigger asChild>
-                  <Link href={`${repodata.name}/upload/${repodata.DefualtBranch}`}>
-                    <Button  variant="outline" className="ml-auto ">
+                  <Link
+                    href={`${repodata.name}/upload/${repodata.DefualtBranch}`}
+                  >
+                    <Button variant="outline" className="ml-auto ">
                       Add File
                     </Button>
                   </Link>
diff --git a/app/[username]/[repository]/upload/[branch]/[[...path]]/page.tsx b/app/[username]/[repository]/upload/[branch]/[[...path]]/page.tsx
index d4b8f64..305e2f3 100644
--- a/app/[username]/[repository]/upload/[branch]/[[...path]]/page.tsx
+++ b/app/[username]/[repository]/upload/[branch]/[[...path]]/page.tsx
@@ -1,7 +1,6 @@
 import Upload from "../../components/Upload";
 
 export default function Page() {
-
   return (
     <main className="mx-6 my-5 xl:mx-60">
       <div>
diff --git a/app/[username]/[repository]/upload/components/Upload.tsx b/app/[username]/[repository]/upload/components/Upload.tsx
index 52cfdc9..21065a9 100644
--- a/app/[username]/[repository]/upload/components/Upload.tsx
+++ b/app/[username]/[repository]/upload/components/Upload.tsx
@@ -58,7 +58,13 @@ const Upload = () => {
   return (
     <div>
       <div className="my-2 text-xl">
-        <Link className=" hover:text-blue-700 hover:underline" href={`/${params.username}/${params.repository}`}>{params.repository} {" "}</Link>  / 
+        <Link
+          className=" hover:text-blue-700 hover:underline"
+          href={`/${params.username}/${params.repository}`}
+        >
+          {params.repository}{" "}
+        </Link>{" "}
+        /
       </div>
       <div className="items-center justify-center w-full p-5 border rounded-md">
         <Dropzone onDrop={(acceptedFiles) => handlechange(acceptedFiles)}>

From 5250c6ff5d2e77281c993425503ac33722077180 Mon Sep 17 00:00:00 2001
From: ruru <142723369+ruru-m07@users.noreply.github.com>
Date: Wed, 21 Feb 2024 19:35:08 +0530
Subject: [PATCH 3/3] FIX #33 from #32

close #33

Co-Authored-By: ruru <ruru.dev07@gmail.com>
---
 app/page.tsx | 15 +++++----------
 1 file changed, 5 insertions(+), 10 deletions(-)

diff --git a/app/page.tsx b/app/page.tsx
index b250aa9..4cf7280 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -13,19 +13,12 @@ import {
 } from "@/components/ui/select";
 import { useAuth } from "@/context/userContext";
 import { cn } from "@/lib/utils";
+import { withAuth } from "@/protectedRouter";
 import Image from "next/image";
 import Link from "next/link";
 import React from "react";
-interface AccountSwitcherProps {
-  isCollapsed: boolean;
-  accounts: {
-    label: string;
-    // label: string;
-    icon: React.ReactNode;
-  }[];
-}
 
-export default function Page() {
+const Page = () => {
   const { user } = useAuth();
 
   const accounts = [
@@ -174,4 +167,6 @@ export default function Page() {
       <ScrollArea className="w-[550px] border-r p-4 h-[93vh]"></ScrollArea>
     </main>
   );
-}
+};
+
+export default withAuth(Page);