Skip to content

Commit

Permalink
finalise next 15 rc-1 upgrade and shadcn sidebar
Browse files Browse the repository at this point in the history
  • Loading branch information
@RedBeardEth
RedBeardEth committed Oct 19, 2024
1 parent 70daf98 commit 90c1fd1
Show file tree
Hide file tree
Showing 33 changed files with 401 additions and 402 deletions.
13 changes: 6 additions & 7 deletions apps/nextjs/next.config.ts
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import { fileURLToPath } from "url";
import type { NextConfig } from "next";
import MillionLint from "@million/lint";
import createMDX from "@next/mdx";
import { env } from "env";
import { createJiti } from "jiti";
import type { NextConfig } from 'next'
import {env} from 'env'

/*// Import env files to validate at build time. Use jiti so we can load .ts files in here.
await createJiti(fileURLToPath(import.meta.url)).import("./env");*/

/** @type {import("next").NextConfig} */

const nextConfig: NextConfig = {

reactStrictMode: true,
/** Enables hot reloading for local packages without a build step */
transpilePackages: [
Expand Down Expand Up @@ -114,9 +114,8 @@ const withMDX = createMDX({
extension: /\.mdx?$/,
});

const enhancedConfig =
!(env.NODE_ENV === "production")
? MillionLint.next({ rsc: true, auto: { rsc: true } })(withMDX(nextConfig))
: withMDX(nextConfig);
const enhancedConfig = !(env.NODE_ENV === "production")
? MillionLint.next({ rsc: true })(withMDX(nextConfig))
: withMDX(nextConfig);

export default withMDX(nextConfig);
75 changes: 50 additions & 25 deletions apps/nextjs/src/app/(app)/account/_components/sidebar/AccountSidebar.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
"use client";

import Link from "next/link";
import LordsIcon from "@/icons/lords.svg";
import {
Collapsible,
Expand All @@ -20,16 +21,20 @@ import {
SidebarGroupLabel,
SidebarHeader,
SidebarMenu,
SidebarMenuAction,
SidebarMenuButton,
SidebarMenuItem,
SidebarMenuSub,
SidebarMenuSubButton,
SidebarMenuSubItem,
SidebarRail,
} from "@realms-world/ui/components/ui/sidebar";
import {
Atom,
Bird,
BookOpen,
Bot,
ChevronRight,
Code2,
Earth,
Eclipse,
Expand Down Expand Up @@ -214,34 +219,55 @@ export const data = {

export function AppSidebar() {
return (
<Sidebar asideClassname="left-[var(--site-sidemenu-width)] top-[var(--site-header-height)]">
<SidebarHeader className="font-sans text-xl tracking-wide">
Your Account
{/*<TeamSwitcher teams={data.teams} />*/}
<Sidebar className="left-[var(--site-sidemenu-width)] top-[var(--site-header-height)]">
<SidebarHeader className="h-16 border-b border-sidebar-border">
<NavUser />
</SidebarHeader>
<SidebarContent>
<SidebarGroup>
<SidebarGroupContent>
<SidebarMenu>
<Collapsible defaultOpen className="group/collapsible">
{data.navMain.map((navItem) => (
<SidebarMenuItem key={navItem.title}>
<CollapsibleTrigger asChild>
<SidebarMenuButton asChild>
<a href={navItem.url}>
<navItem.icon />
<span>{navItem.title}</span>
</a>
</SidebarMenuButton>
</CollapsibleTrigger>
<CollapsibleContent>
<SidebarMenuSub>
<SidebarMenuSubItem />
</SidebarMenuSub>
</CollapsibleContent>
{data.navMain.map((item) => (
<Collapsible
key={item.title}
asChild
defaultOpen={item.isActive}
>
<SidebarMenuItem>
<SidebarMenuButton asChild tooltip={item.title}>
<a href={item.url}>
<item.icon />
<span className="font-sans text-lg tracking-wider">
{item.title}
</span>
</a>
</SidebarMenuButton>
{item.items.length ? (
<>
<CollapsibleTrigger asChild>
<SidebarMenuAction className="data-[state=open]:rotate-90">
<ChevronRight />
<span className="sr-only">Toggle</span>
</SidebarMenuAction>
</CollapsibleTrigger>
<CollapsibleContent>
<SidebarMenuSub>
{item.items.map((subItem) => (
<SidebarMenuSubItem key={subItem.title}>
<SidebarMenuSubButton asChild>
<a href={subItem.url}>
<span>{subItem.title}</span>
</a>
</SidebarMenuSubButton>
</SidebarMenuSubItem>
))}
</SidebarMenuSub>
</CollapsibleContent>
</>
) : null}
</SidebarMenuItem>
))}
</Collapsible>
</Collapsible>
))}

{/*<SidebarItem className="mt-6">
<SidebarLabel>Projects</SidebarLabel>
Expand All @@ -258,9 +284,8 @@ export function AppSidebar() {
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
<SidebarFooter>
<NavUser />
</SidebarFooter>
<SidebarFooter></SidebarFooter>
<SidebarRail className="[[data-side=left][data-collapsible=offcanvas]_&]:-right-[calc(var(--site-sidemenu-width)+15px)]" />
</Sidebar>
);
}
173 changes: 96 additions & 77 deletions apps/nextjs/src/app/(app)/account/_components/sidebar/NavUser.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,5 @@
import {
BadgeCheck,
Bell,
ChevronsUpDown,
CreditCard,
LogOut,
} from "lucide-react";

import { StarknetLoginButton } from "@/app/_components/wallet/StarknetLoginButton";
import { shortenHex } from "@/utils/utils";
import {
Avatar,
AvatarFallback,
Expand All @@ -20,9 +14,21 @@ import {
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@realms-world/ui/components/ui/dropdown-menu";
import {
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
useSidebar,
} from "@realms-world/ui/components/ui/sidebar";
import { useAccount, useDisconnect } from "@starknet-react/core";
import { shortenHex } from "@/utils/utils";
import { StarknetLoginButton } from "@/app/_components/wallet/StarknetLoginButton";
import {
BadgeCheck,
Bell,
ChevronsUpDown,
CreditCard,
LogOut,
Sparkles,
} from "lucide-react";

export function NavUser({
user,
Expand All @@ -34,76 +40,89 @@ export function NavUser({
};
}) {
const { address } = useAccount();
const { disconnect } = useDisconnect();
const { isMobile } = useSidebar();

const { disconnect } = useDisconnect();
{
address && shortenHex(address, 8);
}
return (
<>
<DropdownMenu>
<DropdownMenuTrigger className="w-full rounded-md outline-none ring-ring hover:bg-accent focus-visible:ring-2 data-[state=open]:bg-accent">
<div className="flex items-center gap-2 px-2 py-1.5 text-left text-sm transition-all">
<Avatar className="h-7 w-7 rounded-md border">
<AvatarImage
src={user?.avatar}
alt={user?.name}
className="animate-in fade-in-50 zoom-in-90"
/>
<AvatarFallback className="rounded-md">CN</AvatarFallback>
</Avatar>
<div className="grid flex-1 leading-none">
<div className="font-medium">{user?.name}</div>
<div className="overflow-hidden text-lg text-muted-foreground">
<div className="line-clamp-1">
{address && shortenHex(address, 8)}
</div>
</div>
</div>
<ChevronsUpDown className="ml-auto mr-0.5 h-4 w-4 text-muted-foreground/50" />
</div>
</DropdownMenuTrigger>
<DropdownMenuContent
className="w-56"
align="end"
side="right"
sideOffset={4}
>
<DropdownMenuLabel className="p-0 font-normal">
<div className="flex items-center gap-2 px-1 py-1.5 text-left text-sm transition-all">
<Avatar className="h-7 w-7 rounded-md">
<AvatarImage src={user?.avatar} alt={address} />
<AvatarFallback>CN</AvatarFallback>
</Avatar>
<div className="grid flex-1">
<div className="font-medium">
{address && shortenHex(address, 8)}
</div>
<div className="overflow-hidden text-xs text-muted-foreground">
<div className="line-clamp-1">{user?.email}</div>
</div>
</div>
</div>
</DropdownMenuLabel>
{/*<DropdownMenuSeparator />
<DropdownMenuGroup>
<DropdownMenuItem className="gap-2">
<BadgeCheck className="h-4 w-4 text-muted-foreground" />
Account
</DropdownMenuItem>
<DropdownMenuItem className="gap-2">
<CreditCard className="h-4 w-4 text-muted-foreground" />
Billing
</DropdownMenuItem>
<DropdownMenuItem className="gap-2">
<Bell className="h-4 w-4 text-muted-foreground" />
Notifications
</DropdownMenuItem>
</DropdownMenuGroup>*/}
<DropdownMenuSeparator />
<DropdownMenuItem onClick={disconnect} className="gap-2">
<LogOut className="h-4 w-4 text-muted-foreground" />
Log out
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
{address ? (
<SidebarMenu>
<SidebarMenuItem>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<SidebarMenuButton
size="lg"
className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
>
<Avatar className="h-8 w-8 rounded-lg">
<AvatarImage src={user?.avatar} alt={user?.name} />
<AvatarFallback className="rounded-lg">CN</AvatarFallback>
</Avatar>
<div className="grid flex-1 text-left text-sm leading-tight">
<span className="truncate font-semibold">
{shortenHex(address, 8)}
</span>
</div>
<ChevronsUpDown className="ml-auto size-4" />
</SidebarMenuButton>
</DropdownMenuTrigger>
<DropdownMenuContent
className="w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg"
side={isMobile ? "bottom" : "right"}
align="start"
sideOffset={4}
>
<DropdownMenuLabel className="p-0 font-normal">
<div className="flex items-center gap-2 px-1 py-1.5 text-left text-sm">
<Avatar className="h-8 w-8 rounded-lg">
<AvatarImage src={user?.avatar} alt={user?.name} />
<AvatarFallback className="rounded-lg">CN</AvatarFallback>
</Avatar>
<div className="grid flex-1 text-left text-sm leading-tight">
<span className="truncate font-semibold">
{shortenHex(address, 8)}
</span>
<span className="truncate text-xs">{user?.email}</span>
</div>
</div>
</DropdownMenuLabel>
<DropdownMenuSeparator />
<DropdownMenuGroup>
<DropdownMenuItem>
<Sparkles />
Upgrade to Pro
</DropdownMenuItem>
</DropdownMenuGroup>
<DropdownMenuSeparator />
<DropdownMenuGroup>
<DropdownMenuItem>
<BadgeCheck />
Account
</DropdownMenuItem>
<DropdownMenuItem>
<CreditCard />
Billing
</DropdownMenuItem>
<DropdownMenuItem>
<Bell />
Notifications
</DropdownMenuItem>
</DropdownMenuGroup>
<DropdownMenuSeparator />
<DropdownMenuItem>
<LogOut />
Log out
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</SidebarMenuItem>
</SidebarMenu>
) : (
<StarknetLoginButton />
)}
</>
);
}
16 changes: 11 additions & 5 deletions apps/nextjs/src/app/(app)/account/delegates/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,17 @@ export function generateMetadata(): Metadata {
};
}

export default function Page({
searchParams: { search },
}: {
searchParams: { search?: string };
}) {
export default async function Page(
props: {
searchParams: Promise<{ search?: string }>;
}
) {
const searchParams = await props.searchParams;

const {
search
} = searchParams;

const filters: RouterInputs["delegates"]["all"] = {
limit: 200,
search: search,
Expand Down
Loading

0 comments on commit 90c1fd1

Please sign in to comment.