Enhance table header interfaces with optional render methods for improved flexibility; refactor router component structure for better readability and maintainability; ensure newline at end of file in url-routes.ts.

src/interfaces/tableProps.ts

@@ -22,14 +22,18 @@ export enum TableHeaderKey {
 interface ICommonTableHeader {
   [TableHeaderKey.Search]?: {
     searchProps?: string[];
+    render?: (key: string) => React.JSX.Element;
   };
 }
 
 export interface ITableWithPaginationHeader extends ICommonTableHeader {
   [TableHeaderKey.AddRow]?: {
     openAddRowModal: () => void;
+    render?: (key: string) => React.JSX.Element;
+  };
+  [TableHeaderKey.SelectType]?: ISelectComponent & {
+    render?: (key: string) => React.JSX.Element;
   };
-  [TableHeaderKey.SelectType]?: ISelectComponent;
 }
 
 export interface ITableWithLoadMoreHeader extends ICommonTableHeader {

src/routers/index.tsx

@@ -13,14 +13,35 @@ export default function Router() {
       <Header />
       <Routes>
         {/* Public routes */}
-        <Route path="/login" element={<Suspense fallback={null}><LoginForm /></Suspense>} />
+        <Route
+          path="/login"
+          element={
+            <Suspense fallback={null}>
+              <LoginForm />
+            </Suspense>
+          }
+        />
 
         {/* Protected routes */}
         <Route path="/" element={<Navigate to="/channels" replace />} />
-        <Route path="/channels" element={<Suspense fallback={null}><ProtectedRoute component={<ChannelList />} /></Suspense>} />
+        <Route
-        <Route path="/channels/:channelId" element={<Suspense fallback={null}><ProtectedRoute component={<ChannelDetail />} /></Suspense>} />
+          path="/:applicationId/channels"
+          element={
+            <Suspense fallback={null}>
+              <ProtectedRoute component={<ChannelList />} />
+            </Suspense>
+          }
+        />
+        <Route
+          path="/channels/:channelId"
+          element={
+            <Suspense fallback={null}>
+              <ProtectedRoute component={<ChannelDetail />} />
+            </Suspense>
+          }
+        />
         {/* Fallback route */}
-        <Route path="*" element={<Navigate to="/login" replace />} />
+        {/* <Route path="*" element={<Navigate to="/login" replace />} /> */}
       </Routes>
     </BrowserRouter>
   );

src/routers/url-routes.ts

@@ -26,4 +26,4 @@ export default {
     path: 'dashboard',
     icon: faTh
   }
-};
+};