fix(ui): sidenav component returning as promise

packages/revert-next/app/dashboard/layout.tsx

@@ -1,15 +1,30 @@
-import { SideNav } from '@revertdotdev/components/sidenav/SideNav';
 import { Metadata } from 'next';
+import { fetchAccountDetails } from '@revertdotdev/lib/api';
+import { auth, currentUser } from '@clerk/nextjs/server';
+import { SideNav } from '@revertdotdev/components';
 
 export const metadata: Metadata = {
     title: 'Dashboard',
 };
 
-export default function Layout({ children }: { children: React.ReactNode }) {
+export default async function Layout({ children }: { children: React.ReactNode }) {
+    const { userId } = auth();
+    const user = await currentUser();
+
+    if (!userId || !user) {
+        return null;
+    }
+
+    const account = await fetchAccountDetails(userId);
+
+    if ('message' in account) {
+        return null;
+    }
+
     return (
         <div className="flex h-screen flex-col md:flex-row md:overflow-hidden">
             <div className="w-full flex-none md:w-64 border border-transparent border-r-gray-25">
-                <SideNav />
+                <SideNav value={{ account, userId, user }} />
             </div>
             <div className="flex-grow p-6 md:overflow-y-auto md:p-12">{children}</div>
         </div>

packages/revert-next/components/ui/index.ts

@@ -38,7 +38,7 @@ export {
     FancyInputBox,
 } from '@revertdotdev/components/common';
 export { OnboardingNavLink } from '@revertdotdev/components/onboarding';
-export { EnvironmentMode, NavLinks } from '@revertdotdev/components/sidenav';
+export { EnvironmentMode, NavLinks, SideNav } from '@revertdotdev/components/sidenav';
 export {
     CreatedApplications,
     ApplicationCards,

packages/revert-next/components/ui/sidenav/SideNav.tsx

@@ -1,24 +1,20 @@
 import Link from 'next/link';
 import { OnboardingNavLink, EnvironmentMode, NavLinks } from '@revertdotdev/components';
 import { BookOpenIcon } from '@revertdotdev/icons';
-import { fetchAccountDetails } from '@revertdotdev/lib/api';
-import { auth, currentUser } from '@clerk/nextjs/server';
 import { UserButton } from '@clerk/nextjs';
+import { AccountResponseSchema } from '@revertdotdev/types/schemas/accountSchema';
+import { User } from '@clerk/nextjs/dist/types/server';
 
-export async function SideNav() {
-    const { userId } = auth();
-    const user = await currentUser();
-
-    if (!userId || !user) {
-        return null;
-    }
-
-    const account = await fetchAccountDetails(userId);
-
-    if ('message' in account) {
-        return null;
-    }
+type SideNavProps = {
+    value: {
+        account: AccountResponseSchema;
+        userId: string;
+        user: User | null;
+    };
+};
 
+export function SideNav({ value }: SideNavProps) {
+    const { account, user, userId } = value;
     const { isDefaultEnvironment, prodPrivateToken } = account;
 
     return (

packages/revert-next/components/ui/sidenav/index.ts

@@ -1,2 +1,3 @@
 export { EnvironmentMode } from './EnvironmentMode';
-export { NavLinks } from './NavLinks';
+export { NavLinks } from './NavLinks';
+export { SideNav } from './SideNav';