Coaches, seats, schedules, and pricing related updates

apps/edr-passenger-web/backoffice/src/components/layout/Sidebar.tsx

@@ -57,12 +57,12 @@ const navigationSections = [
     title: 'Master Data',
     items: [
       { name: 'Stations', href: '/stations', icon: MapPin },
-      { name: 'Routes', href: '/routes', icon: Route },
       { name: 'Trains', href: '/trains', icon: Train },
       { name: 'Coaches', href: '/coaches', icon: Grid3x3 },
       { name: 'Seats', href: '/seats', icon: Armchair },
+      { name: 'Classes', href: '/classes', icon: Settings },
+      { name: 'Routes', href: '/routes', icon: Route },
       { name: 'Schedules', href: '/schedules', icon: Calendar },
-      { name: 'Classes', href: '/seat-classes', icon: Settings },
     ]
   },
   {

apps/edr-passenger-web/backoffice/src/components/ui/Pagination.tsx

@@ -7,8 +7,12 @@ interface PaginationProps {
 }
 
 export default function Pagination({ currentPage, totalPages, onPageChange }: PaginationProps) {
+  if (totalPages <= 1) {
+    return null;
+  }
+
   return (
-    <div className="flex items-center justify-between border-t border-gray-200 bg-white px-4 py-3 sm:px-6">
+    <div className="flex items-center justify-between border-t border-border bg-card px-4 py-3 sm:px-6">
       <div className="flex flex-1 justify-between sm:hidden">
         <button
           onClick={() => onPageChange(currentPage - 1)}
@@ -27,7 +31,7 @@ export default function Pagination({ currentPage, totalPages, onPageChange }: Pa
       </div>
       <div className="hidden sm:flex sm:flex-1 sm:items-center sm:justify-between">
         <div>
-          <p className="text-sm text-gray-700">
+          <p className="text-sm text-foreground">
             Page <span className="font-medium">{currentPage}</span> of{' '}
             <span className="font-medium">{totalPages}</span>
           </p>
@@ -51,4 +55,4 @@ export default function Pagination({ currentPage, totalPages, onPageChange }: Pa
       </div>
     </div>
   );
-}
+}

apps/edr-passenger-web/backoffice/src/components/ui/Tabs.tsx

@@ -0,0 +1,43 @@
+import React, { ReactNode } from 'react';
+
+interface TabItem {
+  id: string;
+  label: string;
+  icon?: ReactNode;
+  content: ReactNode;
+}
+
+interface TabsProps {
+  tabs: TabItem[];
+  defaultTab?: string;
+}
+
+export default function Tabs({ tabs, defaultTab }: TabsProps) {
+  const [activeTab, setActiveTab] = React.useState(defaultTab || tabs[0]?.id);
+
+  return (
+    <div>
+      <div className="border-b border-gray-200">
+        <div className="flex gap-1 -mb-px">
+          {tabs.map((tab) => (
+            <button
+              key={tab.id}
+              onClick={() => setActiveTab(tab.id)}
+              className={`px-4 py-2 font-medium text-sm border-b-2 transition-colors ${
+                activeTab === tab.id
+                  ? 'border-blue-600 text-blue-600'
+                  : 'border-transparent text-gray-600 hover:text-gray-900 hover:border-gray-300'
+              } flex items-center gap-2`}
+            >
+              {tab.icon}
+              {tab.label}
+            </button>
+          ))}
+        </div>
+      </div>
+      <div className="mt-6">
+        {tabs.find((tab) => tab.id === activeTab)?.content}
+      </div>
+    </div>
+  );
+}