From 7495dae0627f4ff7fc9a96408678e0d92259490c Mon Sep 17 00:00:00 2001
From: giancarlo <giancarlopsk@gmail.com>
Date: Fri, 29 Mar 2024 01:11:03 +0800
Subject: [PATCH] Update UI elements and import paths in multiple files

This commit includes a series of UI improvements and import path adjustments across several files. Changes include using a different icon and adjusting the styling in mode-toggle.tsx, modifying class names in personal-account-dropdown.tsx, and updating the import paths in multiple files following the renaming of the 'personal-account-dropdown' to 'personal-account-dropdown-container'.
---
 .../(dashboard)/home/[account]/_components/app-sidebar.tsx   | 2 +-
 apps/web/app/(dashboard)/home/_components/home-sidebar.tsx   | 2 +-
 ...-dropdown.tsx => personal-account-dropdown-container.tsx} | 0
 apps/web/app/auth/sign-up/page.tsx                           | 2 +-
 .../features/accounts/src/components/account-selector.tsx    | 5 ++---
 .../accounts/src/components/personal-account-dropdown.tsx    | 2 +-
 packages/ui/src/makerkit/mode-toggle.tsx                     | 4 ++--
 7 files changed, 8 insertions(+), 9 deletions(-)
 rename apps/web/app/(dashboard)/home/_components/{personal-account-dropdown.tsx => personal-account-dropdown-container.tsx} (100%)

diff --git a/apps/web/app/(dashboard)/home/[account]/_components/app-sidebar.tsx b/apps/web/app/(dashboard)/home/[account]/_components/app-sidebar.tsx
index a2a9646cc..5fafcafc0 100644
--- a/apps/web/app/(dashboard)/home/[account]/_components/app-sidebar.tsx
+++ b/apps/web/app/(dashboard)/home/[account]/_components/app-sidebar.tsx
@@ -17,7 +17,7 @@ import {
 import { Trans } from '@kit/ui/trans';
 import { cn } from '@kit/ui/utils';
 
-import { ProfileAccountDropdownContainer } from '~/(dashboard)/home/_components/personal-account-dropdown';
+import { ProfileAccountDropdownContainer } from '~/(dashboard)/home/_components/personal-account-dropdown-container';
 import featureFlagsConfig from '~/config/feature-flags.config';
 import pathsConfig from '~/config/paths.config';
 
diff --git a/apps/web/app/(dashboard)/home/_components/home-sidebar.tsx b/apps/web/app/(dashboard)/home/_components/home-sidebar.tsx
index d5f39eae5..1b311aebb 100644
--- a/apps/web/app/(dashboard)/home/_components/home-sidebar.tsx
+++ b/apps/web/app/(dashboard)/home/_components/home-sidebar.tsx
@@ -5,7 +5,7 @@ import { cookies } from 'next/headers';
 import { Sidebar, SidebarContent, SidebarNavigation } from '@kit/ui/sidebar';
 
 import { HomeSidebarAccountSelector } from '~/(dashboard)/home/_components/home-sidebar-account-selector';
-import { ProfileAccountDropdownContainer } from '~/(dashboard)/home/_components/personal-account-dropdown';
+import { ProfileAccountDropdownContainer } from '~/(dashboard)/home/_components/personal-account-dropdown-container';
 import { loadUserWorkspace } from '~/(dashboard)/home/_lib/load-user-workspace';
 import { personalAccountSidebarConfig } from '~/config/personal-account-sidebar.config';
 
diff --git a/apps/web/app/(dashboard)/home/_components/personal-account-dropdown.tsx b/apps/web/app/(dashboard)/home/_components/personal-account-dropdown-container.tsx
similarity index 100%
rename from apps/web/app/(dashboard)/home/_components/personal-account-dropdown.tsx
rename to apps/web/app/(dashboard)/home/_components/personal-account-dropdown-container.tsx
diff --git a/apps/web/app/auth/sign-up/page.tsx b/apps/web/app/auth/sign-up/page.tsx
index fc23888cb..27ee9b5d5 100644
--- a/apps/web/app/auth/sign-up/page.tsx
+++ b/apps/web/app/auth/sign-up/page.tsx
@@ -35,11 +35,11 @@ function SignUpPage({ searchParams }: Props) {
 
       <SignUpMethodsContainer
         providers={authConfig.providers}
+        inviteToken={inviteToken}
         paths={{
           callback: pathsConfig.auth.callback,
           appHome: pathsConfig.app.home,
         }}
-        inviteToken={inviteToken}
       />
 
       <div className={'justify-centers flex'}>
diff --git a/packages/features/accounts/src/components/account-selector.tsx b/packages/features/accounts/src/components/account-selector.tsx
index 2947f15fc..cf7821b7f 100644
--- a/packages/features/accounts/src/components/account-selector.tsx
+++ b/packages/features/accounts/src/components/account-selector.tsx
@@ -99,10 +99,10 @@ export function AccountSelector({
         <PopoverTrigger asChild>
           <Button
             size={collapsed ? 'icon' : 'default'}
-            variant="outline"
+            variant="ghost"
             role="combobox"
             aria-expanded={open}
-            className={cn('w-full', {
+            className={cn('w-full shadow', {
               'justify-between': !collapsed,
               'justify-center': collapsed,
             })}
@@ -208,7 +208,6 @@ export function AccountSelector({
               <If condition={features.enableTeamCreation}>
                 <CommandGroup>
                   <Button
-                    size={'sm'}
                     variant="ghost"
                     className="w-full justify-start"
                     onClick={() => {
diff --git a/packages/features/accounts/src/components/personal-account-dropdown.tsx b/packages/features/accounts/src/components/personal-account-dropdown.tsx
index 7dd22030b..f903450a6 100644
--- a/packages/features/accounts/src/components/personal-account-dropdown.tsx
+++ b/packages/features/accounts/src/components/personal-account-dropdown.tsx
@@ -72,7 +72,7 @@ export function PersonalAccountDropdown({
           'animate-in fade-in group flex cursor-pointer items-center focus:outline-none',
           className ?? '',
           {
-            ['items-center space-x-2.5 rounded-lg border' +
+            ['active:bg-muted/50 items-center space-x-2.5 rounded-md' +
             ' hover:bg-muted p-2 transition-colors']: showProfileName,
           },
         )}
diff --git a/packages/ui/src/makerkit/mode-toggle.tsx b/packages/ui/src/makerkit/mode-toggle.tsx
index 5f1c876a0..f2735bfe6 100644
--- a/packages/ui/src/makerkit/mode-toggle.tsx
+++ b/packages/ui/src/makerkit/mode-toggle.tsx
@@ -2,7 +2,7 @@
 
 import { useMemo } from 'react';
 
-import { Check, Moon, Sun } from 'lucide-react';
+import { CheckCircle, Moon, Sun } from 'lucide-react';
 import { useTheme } from 'next-themes';
 
 import { Button } from '../shadcn/button';
@@ -69,7 +69,7 @@ export function SubMenuModeToggle() {
             <Trans i18nKey={`common:${item}Theme`} />
 
             <If condition={theme === item}>
-              <Check className={'mr-2 h-4'} />
+              <CheckCircle className={'mr-2 h-3'} />
             </If>
           </DropdownMenuItem>
         );