account sidebar urls

frontend/app/(urls)/account/layout.tsx

@@ -5,8 +5,10 @@ import { useRouter } from 'next/navigation'
 import AccountSidebar from '@/components/AccountSidebar'
 import Loader from '@/components/ui/Loader'
 import { RiUser3Line } from 'react-icons/ri'
+import { FaRoute } from 'react-icons/fa'
+import { GoPackageDependents, GoPackageDependencies } from 'react-icons/go'
+import { MdOutlinePayments } from 'react-icons/md'
 import { CgNotes } from 'react-icons/cg'
-import { FaStar } from 'react-icons/fa6'
 import useUserStore from '@/app/store/userStore'
 
 export default function AccountLayout({
@@ -37,7 +39,18 @@ export default function AccountLayout({
 
   const userNavigation = [
     { name: 'Профиль', href: '/account', icon: RiUser3Line },
-    { name: 'Мои маршруты', href: '/account/routes', icon: CgNotes },
+    { name: 'Мои маршруты', href: '/account/routes', icon: FaRoute },
+    {
+      name: 'Отправить посылку',
+      href: '/account/create_as_sender',
+      icon: GoPackageDependents,
+    },
+    {
+      name: 'Перевезти посылку',
+      href: '/account/create_as_deliveler',
+      icon: GoPackageDependencies,
+    },
+    { name: 'Тарифы', href: '/account/payments', icon: MdOutlinePayments },
   ]
 
   return (

frontend/app/types/index.ts

@@ -21,6 +21,8 @@ export interface ButtonProps {
   onClick?: () => void
   className?: string
   text?: string
+  leftIcon?: React.ReactNode
+  rightIcon?: React.ReactNode
   type?: 'button' | 'submit' | 'reset'
 }
 

frontend/components/AccountSidebar.tsx

@@ -21,11 +21,11 @@ const AccountSidebar: React.FC<AccountSidebarProps> = ({
 
   const getAccountTypeStyles = (accountType: string) => {
     switch (accountType.toLowerCase()) {
-      case 'free':
-        return 'bg-gray-400 text-white'
       case 'lite':
-        return 'bg-orage/70 text-white'
-      case 'pro':
+        return 'bg-gray-400 text-white'
+      case 'standart':
+        return 'bg-orange/70 text-white'
+      case 'premium':
         return 'bg-blue-300'
       default:
         return 'bg-gray-200'

frontend/components/Logout.tsx

@@ -34,6 +34,7 @@ const Logout = () => {
   return (
     <Button
       text="Выйти из аккаунта"
+      leftIcon={<IoExitOutline className="mr-1 h-5 w-5" />}
       className="w-full text-sm font-medium text-gray-600 hover:bg-gray-100 px-4 py-4 flex items-center rounded-lg transition-colors"
       onClick={handleLogout}
     />

frontend/components/ui/Button.tsx

@@ -1,14 +1,23 @@
 import React from 'react'
 import { ButtonProps } from '@/app/types/index'
 
-const Button = ({ onClick, className, text, type }: ButtonProps) => {
+const Button = ({
+  onClick,
+  className,
+  text,
+  type,
+  leftIcon,
+  rightIcon,
+}: ButtonProps) => {
   return (
     <button
       onClick={onClick}
       className={`text-base font-medium rounded-2xl cursor-pointer ${className}`}
       type={type}
     >
+      {leftIcon && <span className="mr-2 flex items-center">{leftIcon}</span>}
       <span>{text}</span>
+      {rightIcon && <span className="ml-2 flex items-center">{rightIcon}</span>}
     </button>
   )
 }