@c-rex/components 0.0.10 → 0.0.11

package/package.json

@@ -1,9 +1,12 @@
 {
   "name": "@c-rex/components",
-  "version": "0.0.10",
+  "version": "0.0.11",
   "files": [
     "src"
   ],
+  "publishConfig": {
+    "access": "public"
+},
   "sideEffects": false,
   "exports": {
     "./autocomplete": {
@@ -27,8 +30,8 @@
       "import": "./src/empty.tsx"
     },
     "./navbar": {
-      "types": "./src/navbar.tsx",
-      "import": "./src/navbar.tsx"
+      "types": "./src/navbar/navbar.tsx",
+      "import": "./src/navbar/navbar.tsx"
     },
     "./providers/search-state-wrapper": {
       "types": "./src/providers/search-state-wrapper.tsx",

package/src/{navbar.tsx → navbar/navbar.tsx}

@@ -1,15 +1,18 @@
-import { FC } from "react";
-
+import React, { FC } from "react";
 import Link from "next/link";
-import { Button } from "@c-rex/ui/button";
 import Image from "next/image";
+import { SingOut, SingInBtn } from "./sing-in-out-btns";
+import { getServerSession } from "next-auth";
+
 
 interface NavBarProps {
     scroll?: boolean;
     large?: boolean;
 }
 
-export const NavBar: FC<NavBarProps> = () => {
+export const NavBar: FC<NavBarProps> = async () => {
+    const session = await getServerSession()
+
     return (
         <header className="sticky top-0 z-40 flex w-full bg-background/60 backdrop-blur-xl transition-all bg-transparent border-b justify-center py-4">
             <div className="container flex justify-between">
@@ -51,14 +54,14 @@ export const NavBar: FC<NavBarProps> = () => {
                 </div>
 
                 <div className="flex items-center space-x-3">
-                    <Button
-                        className="hidden gap-2 px-5 md:flex"
-                        variant="default"
-                        size="sm"
-                        rounded="full"
-                    >
-                        <span>Sign In</span>
-                    </Button>
+                    {session ? (
+                        <>
+                            <span>Welcome, {session.user?.name}</span>
+                            <SingOut />
+                        </>
+                    ) : (
+                        <SingInBtn />
+                    )}
                 </div>
             </div>
         </header>

package/src/navbar/sing-in-out-btns.tsx

@@ -0,0 +1,29 @@
+"use client"
+
+import React from "react";
+import { signOut, signIn } from "next-auth/react";
+import { Button } from "@c-rex/ui/button";
+
+export const SingInBtn = () => (
+    <Button
+        className="hidden gap-2 px-5 md:flex"
+        variant="default"
+        size="sm"
+        rounded="full"
+        onClick={() => signIn("crex", { callbackUrl: "/" })}
+    >
+        <span>Sign In</span>
+    </Button>
+);
+
+export const SingOut = () => (
+    <Button
+        className="hidden gap-2 px-5 md:flex"
+        variant="default"
+        size="sm"
+        rounded="full"
+        onClick={() => signOut()}
+    >
+        <span>Sign out</span>
+    </Button>
+);

package/src/stories/navbar.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import { NavBar } from '../navbar';
+import { NavBar } from '../navbar/navbar';
 
 const meta: Meta = {
     title: 'Components/NavBar',