wip

midday-ai · Dec 21, 2023 · a8d2431 · a8d2431
1 parent deda847
commit a8d2431
Show file tree

Hide file tree

Showing 9 changed files with 110 additions and 9 deletions.
diff --git a/apps/dashboard/src/app/[locale]/@dashboard/(root)/settings/layout.tsx b/apps/dashboard/src/app/[locale]/@dashboard/(root)/settings/layout.tsx
@@ -8,7 +8,7 @@ export default function Layout({ children }: { children: React.ReactNode }) {
         items={[
           { path: "/settings", label: "General" },
           { path: "/settings/connected", label: "Bank Accounts" },
-          // { path: "/settings/members", label: "Members" },
+          { path: "/settings/members", label: "Members" },
           { path: "/settings/security", label: "Security" },
           { path: "/settings/notifications", label: "Notifications" },
         ]}

diff --git a/apps/dashboard/src/app/[locale]/providers.tsx b/apps/dashboard/src/app/[locale]/providers.tsx
@@ -11,7 +11,7 @@ type ProviderProps = {
 
 export function Providers({ locale, children }: ProviderProps) {
   return (
-    <I18nProviderClient locale={locale}>
+    <I18nProviderClient locale={locale} fallback={<div />}>
       <TriggerProvider
         publicApiKey={process.env.NEXT_PUBLIC_TRIGGER_API_KEY!}
         apiUrl={process.env.NEXT_PUBLIC_TRIGGER_API_URL}

diff --git a/apps/dashboard/src/components/command-menu.tsx b/apps/dashboard/src/components/command-menu.tsx
@@ -114,9 +114,19 @@ export function CommandMenu({ ...props }: DialogProps) {
     router.push("/settings");
   });
 
-  useHotkeys("ctrl+s", (evt) => {
+  useHotkeys("ctrl+m", (evt) => {
     evt.preventDefault();
-    router.push("/settings");
+    router.push("/settings/members");
+  });
+
+  useHotkeys("meta+m", (evt) => {
+    evt.preventDefault();
+    router.push("/settings/members");
+  });
+
+  useHotkeys("ctrl+t", (evt) => {
+    evt.preventDefault();
+    router.push("/team");
   });
 
   useHotkeys("ctrl+meta+p", (evt) => {

diff --git a/apps/dashboard/src/components/export-status.tsx b/apps/dashboard/src/components/export-status.tsx
@@ -32,6 +32,7 @@ const options = [
 ];
 
 export function ExportStatus() {
+  return null;
   const { toast, dismiss, update } = useToast();
   const [toastId, setToastId] = useState(null);
   const { exportId, setExportId } = useExportStore();

diff --git a/apps/dashboard/src/components/modals/export-transactions-modal.tsx b/apps/dashboard/src/components/modals/export-transactions-modal.tsx
@@ -25,7 +25,6 @@ export function ExportTransactionsModal({
   totalMissingAttachments,
 }) {
   const { toast } = useToast();
-
   const searchParams = useSearchParams();
   const { setExportId } = useExportStore();
   const filter = searchParams.get("filter");

diff --git a/apps/dashboard/src/components/sidebar.tsx b/apps/dashboard/src/components/sidebar.tsx
@@ -1,10 +1,11 @@
 import { Icons } from "@midday/ui/icons";
 import Link from "next/link";
 import { MainMenu } from "./main-menu";
+import { TeamMenu } from "./team-menu";
 
 export function Sidebar() {
   return (
-    <aside className="w-[70px] h-screen flex-shrink-0 flex-col justify-between flex sticky top-0 ml-4">
+    <aside className="h-screen flex-shrink-0 flex-col justify-between flex sticky top-0 ml-4 pb-4 items-center">
       <div className="flex flex-col items-center justify-center xl:items-start xl:justify-start">
         <div className="mt-6 xl:ml-4">
           <Link href="/">
@@ -13,6 +14,8 @@ export function Sidebar() {
         </div>
         <MainMenu />
       </div>
+
+      <TeamMenu />
     </aside>
   );
 }
diff --git a/apps/dashboard/src/components/team-menu.tsx b/apps/dashboard/src/components/team-menu.tsx
@@ -0,0 +1,77 @@
+import { getUser } from "@midday/supabase/cached-queries";
+import { Avatar, AvatarFallback, AvatarImage } from "@midday/ui/avatar";
+import { Button } from "@midday/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "@midday/ui/dialog";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@midday/ui/dropdown-menu";
+import { Input } from "@midday/ui/input";
+
+export async function TeamMenu() {
+  const { data: userData } = await getUser();
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Avatar className="rounded-sm w-9 h-9">
+          <AvatarImage src={userData?.team?.logo_url} />
+          <AvatarFallback className="rounded-sm w-9 h-9">
+            <span className="text-xs">
+              {userData?.team?.name?.charAt(0)?.toUpperCase()}
+              {userData?.team?.name?.charAt(1)?.toUpperCase()}
+            </span>
+          </AvatarFallback>
+        </Avatar>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent
+        className="w-[240px]"
+        sideOffset={15}
+        align="start"
+        side="top"
+      >
+        <Dialog>
+          <DropdownMenuItem asDialogTrigger>
+            <DialogTrigger>Create team</DialogTrigger>
+          </DropdownMenuItem>
+          <DialogContent className="max-w-[455px]">
+            <div className="p-4">
+              <DialogHeader>
+                <DialogTitle>Create team</DialogTitle>
+                <DialogDescription>
+                  For example, you can use the name of your company or
+                  department.
+                </DialogDescription>
+              </DialogHeader>
+
+              <div className="mt-6 mb-6">
+                <Input placeholder="Team Name" />
+              </div>
+
+              <DialogFooter>
+                <div className="space-x-4">
+                  <Button variant="outline">Cancel</Button>
+                  <Button>Continue</Button>
+                </div>
+              </DialogFooter>
+            </div>
+          </DialogContent>
+          <DropdownMenuItem>Members</DropdownMenuItem>
+          <DropdownMenuItem>Settings</DropdownMenuItem>
+        </Dialog>
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}
diff --git a/apps/dashboard/src/components/user-menu.tsx b/apps/dashboard/src/components/user-menu.tsx
@@ -25,15 +25,17 @@ export async function UserMenu() {
           <Avatar className="rounded-full w-8 h-8">
             <AvatarImage src={userData?.avatar_url} />
             <AvatarFallback>
-              <span className="text-xs">{userData?.full_name?.charAt(0)}</span>
+              <span className="text-xs">
+                {userData?.full_name?.charAt(0)?.toUpperCase()}
+              </span>
             </AvatarFallback>
           </Avatar>
         </DropdownMenuTrigger>
         <DropdownMenuContent className="w-[240px]" sideOffset={10} align="end">
           <DropdownMenuLabel>
             <div className="flex justify-between items-center">
               <span className="truncate">{userData.full_name}</span>
-              <div className="border py-1 px-3 rounded-full text-xs bg-foreground text-background">
+              <div className="border py-0.5 px-3 rounded-full text-[11px] text-background bg-gradient-to-r from-primary dark:via-primary dark:to-[#848484] to-[#000]">
                 Beta
               </div>
             </div>
@@ -48,6 +50,13 @@ export async function UserMenu() {
               </DropdownMenuItem>
             </Link>
 
+            <Link href="/settings/members">
+              <DropdownMenuItem>
+                Members
+                <DropdownMenuShortcut>⌘T</DropdownMenuShortcut>
+              </DropdownMenuItem>
+            </Link>
+
             <Link href="/settings">
               <DropdownMenuItem>
                 Settings

diff --git a/packages/ui/src/components/dropdown-menu.tsx b/packages/ui/src/components/dropdown-menu.tsx
@@ -82,15 +82,17 @@ const DropdownMenuItem = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Item>,
   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {
     inset?: boolean;
+    asDialogTrigger?: boolean;
   }
->(({ className, inset, ...props }, ref) => (
+>(({ className, inset, asDialogTrigger, ...props }, ref) => (
   <DropdownMenuPrimitive.Item
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       inset && "pl-8",
       className
     )}
+    {...(asDialogTrigger && { onSelect: (evt) => evt.preventDefault() })}
     {...props}
   />
 ));