refactor: update routes, marketing links, and component icons

- Modify `routes.ts` to add AI feature routes and remove deprecated routes
- Update `marketing.tsx` with new AI feature menu links and more descriptive icons
- Refactor navbar mobile and locale selector components with improved icon imports
- Adjust theme switcher button styling for better visual consistency
- Enhance menu link descriptions and icons for improved user experience

src/components/layout/locale-selector.tsx

@@ -74,7 +74,7 @@ export default function LocaleSelector() {
         {routing.locales.map((cur) => (
           <SelectItem key={cur} value={cur} className="cursor-pointer flex items-center gap-2">
             <div className="flex items-center gap-2">
-              <span className="text-lg">{LOCALE_LIST[cur].flag}</span>
+              <span className="text-md">{LOCALE_LIST[cur].flag}</span>
               <span>{LOCALE_LIST[cur].name}</span>
             </div>
           </SelectItem>

src/components/layout/navbar-mobile.tsx

@@ -15,7 +15,7 @@ import { LocaleLink } from '@/i18n/navigation';
 import { cn } from '@/lib/utils';
 import { Routes } from '@/routes';
 import { Portal } from '@radix-ui/react-portal';
-import { ArrowUpRightIcon, ChevronDown, ChevronUp, MenuIcon, X } from 'lucide-react';
+import { ArrowUpRightIcon, ChevronDownIcon, ChevronUpIcon, MenuIcon, XIcon } from 'lucide-react';
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';
 import * as React from 'react';
@@ -81,7 +81,7 @@ export function NavbarMobile({
             className="flex aspect-square h-fit select-none items-center justify-center rounded-md border"
           >
             {open ? (
-              <X className="size-8" />
+              <XIcon className="size-8" />
             ) : (
               <MenuIcon className="size-8" />
             )}
@@ -164,17 +164,17 @@ function MainMobileMenu({ onLinkClicked }: MainMobileMenuProps) {
                         {item.title}
                       </span>
                       {expanded[item.title.toLowerCase()] ? (
-                        <ChevronUp className="size-4" />
+                        <ChevronUpIcon className="size-4" />
                       ) : (
-                        <ChevronDown className="size-4" />
+                        <ChevronDownIcon className="size-4" />
                       )}
                     </Button>
                   </CollapsibleTrigger>
                   <CollapsibleContent>
-                    <ul className="mt-2 pl-4">
+                    <ul className="mt-2 pl-4 space-y-2">
                       {item.items.map((subItem) => (
                         <li key={subItem.title}>
-                          <Link
+                          <LocaleLink
                             href={subItem.href || '#'}
                             target={subItem.external ? '_blank' : undefined}
                             rel={
@@ -204,14 +204,14 @@ function MainMobileMenu({ onLinkClicked }: MainMobileMenuProps) {
                             {subItem.external && (
                               <ArrowUpRightIcon className="size-4 shrink-0 text-muted-foreground transition-colors group-hover:text-foreground" />
                             )}
-                          </Link>
+                          </LocaleLink>
                         </li>
                       ))}
                     </ul>
                   </CollapsibleContent>
                 </Collapsible>
               ) : (
-                <Link
+                <LocaleLink
                   href={item.href || '#'}
                   target={item.external ? '_blank' : undefined}
                   rel={item.external ? 'noopener noreferrer' : undefined}
@@ -222,7 +222,7 @@ function MainMobileMenu({ onLinkClicked }: MainMobileMenuProps) {
                   onClick={onLinkClicked}
                 >
                   <span className="text-base">{item.title}</span>
-                </Link>
+                </LocaleLink>
               )}
             </li>
           ))}

src/components/layout/theme-switcher.tsx

@@ -19,7 +19,7 @@ export function ThemeSwitcher() {
   return (
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
-        <Button variant="ghost" size="icon" className="px-0">
+        <Button variant="ghost" size="icon" className="p-2 border border-border rounded-full text-sm">
           <SunIcon className="rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
           <MoonIcon className="absolute rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
           <span className="sr-only">Toggle theme</span>

src/config/marketing.tsx

@@ -7,14 +7,21 @@ import { TikTokIcon } from '@/components/icons/tiktok';
 import { TwitterIcon } from '@/components/icons/twitter';
 import { YouTubeIcon } from '@/components/icons/youtube';
 import { Routes } from '@/routes';
-import { CubeIcon, DashboardIcon, PaperPlaneIcon } from '@radix-ui/react-icons';
+import { DashboardIcon } from '@radix-ui/react-icons';
 import {
-  BookOpenIcon,
-  FileBarChartIcon,
-  LayoutIcon,
+  AudioLinesIcon,
+  CookieIcon,
+  FileTextIcon,
+  FilmIcon,
+  ImageIcon,
+  InfoIcon,
+  ListChecksIcon,
+  MailboxIcon,
   MailIcon,
-  PlayIcon,
   SettingsIcon,
+  ShieldIcon,
+  SquareKanbanIcon,
+  SquarePenIcon
 } from 'lucide-react';
 
 /**
@@ -40,32 +47,32 @@ export const MENU_LINKS = [
     title: 'AI',
     items: [
       {
-        title: 'Features',
-        description: 'Short description here',
-        icon: <CubeIcon className="size-5 shrink-0" />,
-        href: Routes.Features,
+        title: 'AI Tex',
+        description: 'show how to use AI to write stunning text',
+        icon: <SquarePenIcon className="size-5 shrink-0" />,
+        href: Routes.AIText,
         external: false
       },
       {
-        title: 'Pricing',
-        description: 'Short description here',
-        icon: <PlayIcon className="size-5 shrink-0" />,
-        href: Routes.Pricing,
+        title: 'AI Image',
+        description: 'show how to use AI to generate beautiful images',
+        icon: <ImageIcon className="size-5 shrink-0" />,
+        href: Routes.AIImage,
         external: false
       },
       {
-        title: 'FAQ',
-        description: 'Short description here',
-        icon: <LayoutIcon className="size-5 shrink-0" />,
-        href: Routes.FAQ,
+        title: 'AI Video',
+        description: 'show how to use AI to generate amazing videos',
+        icon: <FilmIcon className="size-5 shrink-0" />,
+        href: Routes.AIVideo,
         external: false
       },
       {
-        title: 'Roadmap',
-        description: 'Short description here',
-        icon: <FileBarChartIcon className="size-5 shrink-0" />,
-        href: Routes.Roadmap,
-        external: true
+        title: 'AI Audio',
+        description: 'show how to use AI to generate wonderful audio',
+        icon: <AudioLinesIcon className="size-5 shrink-0" />,
+        href: Routes.AIAudio,
+        external: false
       }
     ]
   },
@@ -74,57 +81,57 @@ export const MENU_LINKS = [
     items: [
       {
         title: 'About',
-        description: 'Short description here',
-        icon: <PaperPlaneIcon className="size-5 shrink-0" />,
+        description: 'Learn more about our company, mission, and values',
+        icon: <InfoIcon className="size-5 shrink-0" />,
         href: Routes.About,
         external: false
       },
       {
         title: 'Contact',
-        description: 'Short description here',
-        icon: <PaperPlaneIcon className="size-5 shrink-0" />,
+        description: 'Get in touch with our team for support or inquiries',
+        icon: <MailIcon className="size-5 shrink-0" />,
         href: Routes.Contact,
         external: false
       },
       {
         title: 'Waitlist',
-        description: 'Short description here',
-        icon: <BookOpenIcon className="size-5 shrink-0" />,
+        description: 'Join our waitlist for latest news and updates',
+        icon: <MailboxIcon className="size-5 shrink-0" />,
         href: Routes.Waitlist,
         external: false
       },
       {
         title: 'Changelog',
-        description: 'Short description here',
-        icon: <PaperPlaneIcon className="size-5 shrink-0" />,
+        description: 'See the latest updates to our products',
+        icon: <ListChecksIcon className="size-5 shrink-0" />,
         href: Routes.Changelog,
         external: false
       },
       {
         title: 'Roadmap',
-        description: 'Short description here',
-        icon: <PaperPlaneIcon className="size-5 shrink-0" />,
+        description: 'Explore our future plans and upcoming features',
+        icon: <SquareKanbanIcon className="size-5 shrink-0" />,
         href: Routes.Roadmap,
         external: true
       },
       {
         title: 'Cookie Policy',
-        description: 'Short description here',
-        icon: <BookOpenIcon className="size-5 shrink-0" />,
+        description: 'Information about how we use cookies on our website',
+        icon: <CookieIcon className="size-5 shrink-0" />,
         href: Routes.CookiePolicy,
         external: false
       },
       {
         title: 'Privacy Policy',
-        description: 'Short description here',
-        icon: <BookOpenIcon className="size-5 shrink-0" />,
+        description: 'Details about how we protect and handle your data',
+        icon: <ShieldIcon className="size-5 shrink-0" />,
         href: Routes.PrivacyPolicy,
         external: false
       },
       {
         title: 'Terms of Service',
-        description: 'Short description here',
-        icon: <BookOpenIcon className="size-5 shrink-0" />,
+        description: 'The legal agreement between you and our company',
+        icon: <FileTextIcon className="size-5 shrink-0" />,
         href: Routes.TermsOfService,
         external: false
       }

src/routes.ts

@@ -3,6 +3,7 @@
  */
 export enum Routes {
   Root = '/',
+  DefaultLoginRedirect = '/dashboard',
   
   Features = '/#features',
   Pricing = '/#pricing',
@@ -13,15 +14,12 @@ export enum Routes {
   CookiePolicy = '/cookie-policy',
 
   Blog = '/blog',
-  Docs = '/docs',
   Changelog = '/changelog',
-  Roadmap = 'https://mksaas.canny.io',
+  Roadmap = 'https://mksaas.featurebase.app',
 
   About = '/about',
   Contact = '/contact',
   Waitlist = '/waitlist',
-  Story = '/story',
-  Careers = '/careers',
 
   Login = '/auth/login',
   Register = '/auth/register',
@@ -29,48 +27,13 @@ export enum Routes {
   ForgotPassword = '/auth/forgot-password',
   ResetPassword = '/auth/reset-password',
 
-  Auth = '/auth',
-  Logout = '/auth/logout',
-  Totp = '/auth/totp',
-  RecoveryCode = '/auth/recovery-code',
-  ChangeEmail = '/auth/change-email',
-  ChangeEmailRequest = '/auth/change-email/request',
-  ChangeEmailInvalid = '/auth/change-email/invalid',
-  ChangeEmailExpired = '/auth/change-email/expired',
-  // ForgotPassword = '/auth/forgot-password',
-  ForgotPasswordSuccess = '/auth/forgot-password/success',
-  // ResetPassword = '/auth/reset-password',
-  ResetPasswordRequest = '/auth/reset-password/request',
-  ResetPasswordExpired = '/auth/reset-password/expired',
-  ResetPasswordSuccess = '/auth/reset-password/success',
-  VerifyEmail = '/auth/verify-email',
-  VerifyEmailRequest = '/auth/verify-email/request',
-  VerifyEmailExpired = '/auth/verify-email/expired',
-  VerifyEmailSuccess = '/auth/verify-email/success',
-
   Dashboard = '/dashboard',
-  Home = '/dashboard/home',
-  Contacts = '/dashboard/contacts',
   Settings = '/dashboard/settings',
-  Account = '/dashboard/settings/account',
-  Profile = '/dashboard/settings/account/profile',
-  Security = '/dashboard/settings/account/security',
-  Notifications = '/dashboard/settings/account/notifications',
-  Organization = '/dashboard/settings/organization',
-  OrganizationInformation = '/dashboard/settings/organization/information',
-  Members = '/dashboard/settings/organization/members',
-  Billing = '/dashboard/settings/organization/billing',
-  Developers = '/dashboard/settings/organization/developers',
 
-  Invitations = '/invitations',
-  InvitationRequest = '/invitations/request',
-  InvitationAlreadyAccepted = '/invitations/already-accepted',
-  InvitationRevoked = '/invitations/revoked',
-  InvitationLogOutToAccept = '/invitations/log-out-to-accept',
-
-  Onboarding = '/onboarding',
-
-  DefaultLoginRedirect = '/dashboard',
+  AIText = '/dashboard/features/ai-text',
+  AIImage = '/dashboard/features/ai-image',
+  AIVideo = '/dashboard/features/ai-video',
+  AIAudio = '/dashboard/features/ai-audio',
 }
 
 /**
@@ -81,14 +44,11 @@ export enum Routes {
 export const publicRoutes = [
   "/",
 
-  // blog
-  "/blog(/.*)?",
-
   // pages
+  "/blog(/.*)?",
   "/terms-of-service(/.*)?",
   "/privacy-policy(/.*)?",
   "/cookie-policy(/.*)?",
-
   "/about(/.*)?",
   "/contact(/.*)?",
   "/waitlist(/.*)?",