Skip to content

Commit 4dac78e

Browse files
invisalinvisal
committed
fixing small text after we change style
1 parent c9de5ae commit 4dac78e

18 files changed

+226
-309
lines changed

‎src/app/(outerbase)/nav-layout.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@ import {
77
import { Database, Plus } from "@phosphor-icons/react";
88
import { useParams, usePathname, useRouter } from "next/navigation";
99
import { PropsWithChildren } from "react";
10+
import NavigationProfile from "./nav-profile";
1011
import NavigationSigninBanner from "./nav-signin-banner";
1112
import { useSession } from "./session-provider";
12-
import SidebarProfile from "./sidebar-profile";
1313
import { useWorkspaces } from "./workspace-provider";
1414

1515
export default function NavigationLayout({ children }: PropsWithChildren) {
@@ -23,7 +23,7 @@ export default function NavigationLayout({ children }: PropsWithChildren) {
2323
<div className="flex h-screen w-screen">
2424
<div className="flex w-[250px] shrink-0 flex-col overflow-hidden border-r">
2525
<div className="px-2 py-2">
26-
<SidebarProfile />
26+
<NavigationProfile />
2727
</div>
2828

2929
{/* <div className="px-2">

‎src/app/(outerbase)/nav-profile.tsx

+84-34
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,27 @@
11
import { Avatar } from "@/components/orbit/avatar";
2+
import { buttonVariants } from "@/components/ui/button";
23
import {
34
DropdownMenu,
45
DropdownMenuContent,
56
DropdownMenuItem,
6-
DropdownMenuSeparator,
77
DropdownMenuTrigger,
88
} from "@/components/ui/dropdown-menu";
9-
import { Gear, SignOut, ToggleLeft, ToggleRight } from "@phosphor-icons/react";
9+
import { cn } from "@/lib/utils";
10+
import {
11+
CaretDown,
12+
Gear,
13+
SignOut,
14+
ToggleLeft,
15+
ToggleRight,
16+
} from "@phosphor-icons/react";
1017
import { useTheme } from "next-themes";
1118
import { useRouter } from "next/navigation";
1219
import { useCallback } from "react";
1320
import { useSession } from "./session-provider";
1421

1522
export default function NavigationProfile() {
1623
const { resolvedTheme, forcedTheme, setTheme } = useTheme();
17-
const { session } = useSession();
24+
const { session, isLoading } = useSession();
1825
const router = useRouter();
1926

2027
const theme = forcedTheme ?? resolvedTheme;
@@ -34,48 +41,91 @@ export default function NavigationProfile() {
3441
[theme, setTheme]
3542
);
3643

37-
if (!session?.user) return null;
38-
3944
return (
4045
<DropdownMenu modal={false}>
4146
<DropdownMenuTrigger>
42-
<Avatar size="lg" username={session.user.initials} as="div" />
47+
<div
48+
className={cn(
49+
buttonVariants({
50+
size: "lg",
51+
variant: "ghost",
52+
}),
53+
"flex items-center justify-start gap-2 p-1"
54+
)}
55+
>
56+
<Avatar username="Guest" as="div" />
57+
{!isLoading && (
58+
<div className="flex-1 text-left text-sm">
59+
{session
60+
? session.user.first_name + " " + session?.user.last_name
61+
: "Guest"}
62+
</div>
63+
)}
64+
65+
{isLoading && (
66+
<div className="bg-muted h-4 w-16 animate-pulse rounded-sm" />
67+
)}
68+
<div>
69+
<CaretDown weight="bold" className="h-3 w-3" />
70+
</div>
71+
</div>
4372
</DropdownMenuTrigger>
44-
<DropdownMenuContent align="end" className="w-[200px]">
45-
<div className="flex gap-2 p-2">
46-
<Avatar size="lg" username={session.user.initials} />
73+
<DropdownMenuContent align="start" className="w-[250px]">
74+
<div className="flex gap-2 border-b p-2">
75+
<Avatar size="lg" username={session?.user?.initials ?? "Guest"} />
4776

4877
<div className="flex flex-col justify-center">
4978
<div className="text-sm font-semibold">
50-
{session.user.first_name + " " + session.user.last_name}
79+
{session
80+
? session.user.first_name + " " + session?.user.last_name
81+
: "Guest"}
5182
</div>
52-
<div className="text-sm">{session.user.email}</div>
83+
{session && <div className="text-sm">{session.user.email}</div>}
5384
</div>
5485
</div>
55-
<DropdownMenuSeparator />
56-
<DropdownMenuItem
57-
className="justify-between"
58-
onClick={() => {
59-
router.push(`/account`);
60-
}}
61-
>
62-
Account Setting
63-
<Gear size={20} />
64-
</DropdownMenuItem>
65-
<DropdownMenuItem
66-
className="justify-between"
67-
onClick={onThemeToggleClicked}
68-
>
69-
Theme
70-
{theme === "dark" ? (
71-
<ToggleRight weight="fill" size={20} />
72-
) : (
73-
<ToggleLeft size={20} />
86+
87+
<div className="p-2">
88+
{session && (
89+
<DropdownMenuItem
90+
className="justify-between"
91+
onClick={() => {
92+
router.push(`/account`);
93+
}}
94+
>
95+
Account Setting
96+
<Gear size={20} />
97+
</DropdownMenuItem>
98+
)}
99+
<DropdownMenuItem
100+
className="justify-between"
101+
onClick={onThemeToggleClicked}
102+
>
103+
Theme
104+
{theme === "dark" ? (
105+
<ToggleRight weight="fill" size={20} />
106+
) : (
107+
<ToggleLeft size={20} />
108+
)}
109+
</DropdownMenuItem>
110+
{session && (
111+
<DropdownMenuItem
112+
onClick={onLogoutClicked}
113+
className="justify-between"
114+
>
115+
Log out <SignOut size={20} />
116+
</DropdownMenuItem>
74117
)}
75-
</DropdownMenuItem>
76-
<DropdownMenuItem onClick={onLogoutClicked} className="justify-between">
77-
Log out <SignOut size={20} />
78-
</DropdownMenuItem>
118+
{!session && (
119+
<DropdownMenuItem
120+
onClick={() => {
121+
router.push("/signin");
122+
}}
123+
className="justify-between"
124+
>
125+
Log in
126+
</DropdownMenuItem>
127+
)}
128+
</div>
79129
</DropdownMenuContent>
80130
</DropdownMenu>
81131
);

‎src/app/(outerbase)/sidebar-profile.tsx

-132
This file was deleted.

‎src/components/board/board-canvas.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ export function BoardCanvas({ value, onChange }: BoardProps) {
133133
return (
134134
<div
135135
key={_.i}
136-
className="group bg-background relative flex items-center justify-center overflow-hidden rounded-xl bg-white shadow hover:bg-gray-50 dark:bg-neutral-900 dark:text-white"
136+
className="group relative flex items-center justify-center overflow-hidden rounded-xl bg-white shadow hover:bg-gray-50 dark:bg-neutral-900 dark:text-white"
137137
data-grid={_}
138138
>
139139
<BoardChart

‎src/components/board/board-filter-dialog.tsx

+8-10
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ export function BoardFilterDialog(props: Props) {
7676
</DialogHeader>
7777
<div className="flex flex-col gap-2">
7878
<div className="mb-2">
79-
<div className="mb-1 text-xs font-medium">Select filter type</div>
79+
<div className="mb-1 text-sm font-medium">Select filter type</div>
8080
<Select
8181
value={props.filter.type}
8282
onValueChange={(v) =>
@@ -94,7 +94,7 @@ export function BoardFilterDialog(props: Props) {
9494
</Select>
9595
</div>
9696
<div className="mb-2">
97-
<div className="mb-1 text-xs font-medium">Filter name*</div>
97+
<div className="mb-1 text-sm font-medium">Filter name*</div>
9898
<Input
9999
placeholder="Enter filter name"
100100
value={props.filter.name}
@@ -105,7 +105,7 @@ export function BoardFilterDialog(props: Props) {
105105
</div>
106106
{props.filter.type === "enum" && (
107107
<div className="mb-2">
108-
<div className="mb-1 text-xs font-medium">
108+
<div className="mb-1 text-sm font-medium">
109109
Values*
110110
<div>
111111
<small className="text-muted-foreground">
@@ -123,14 +123,12 @@ export function BoardFilterDialog(props: Props) {
123123
</div>
124124
)}
125125
<div className="mb-2">
126-
<div className="mb-1 text-xs font-medium">
126+
<div className="mb-1 text-sm font-medium">
127127
Default value (optional)
128-
<div>
129-
<small className="text-muted-foreground">
130-
If this field is left empty, no filter will be applied by
131-
default
132-
</small>
133-
</div>
128+
<p className="text-muted-foreground text-sm">
129+
If this field is left empty, no filter will be applied by
130+
default
131+
</p>
134132
</div>
135133
{props.filter.type === "search" ? (
136134
<Input

‎src/components/board/board-filter.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,7 @@ export function BoardFilter(props: Props) {
115115
return (
116116
<div
117117
key={i}
118-
className="bg-secondary flex items-center rounded-md text-xs"
118+
className="bg-secondary flex items-center rounded-md text-sm"
119119
>
120120
<div className="border-background flex items-center gap-1 border-r-[1px] border-solid px-2 py-1">
121121
{icon}

0 commit comments

Comments
 (0)