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'.

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';
 

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';
 

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'}>

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={() => {

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,
           },
         )}

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>
         );