feat: Add network bonding configuration page

src/components/navigation-links.tsx

@@ -10,6 +10,7 @@ const navigationLinks = [
   { to: "/info", label: "navigation.info" },
   { to: "/nodes", label: "navigation.nodes" },
   { to: "/usb", label: "navigation.usb" },
+  { to: "/network", label: "navigation.network" },
   { to: "/firmware-upgrade", label: "navigation.firmwareUpgrade" },
   { to: "/flash-node", label: "navigation.flashNode" },
   { to: "/about", label: "navigation.about" },

src/components/skeletons/network.tsx

@@ -0,0 +1,36 @@
+import TabView from "../TabView";
+
+export default function NetworkSkeleton() {
+  return (
+    <TabView>
+      <div className="flex flex-col gap-8">
+        <div>
+          <div className="mb-8 h-7 w-48 animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+          <div className="mb-6 h-5 w-96 animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+          <div className="space-y-6">
+            <div className="flex items-center justify-between">
+              <div className="h-5 w-32 animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+              <div className="h-6 w-12 animate-pulse rounded-full bg-neutral-200 dark:bg-neutral-700"></div>
+            </div>
+            <div className="space-y-2">
+              <div className="h-5 w-28 animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+              <div className="h-10 w-full animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+              <div className="h-4 w-72 animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+            </div>
+          </div>
+          <div className="mt-6">
+            <div className="h-9 w-32 animate-pulse rounded-full bg-neutral-200 dark:bg-neutral-700"></div>
+          </div>
+        </div>
+        <div>
+          <div className="mb-6 h-7 w-24 animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+          <div className="space-y-4">
+            <div className="h-6 w-full animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+            <div className="h-6 w-full animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+            <div className="h-6 w-full animate-pulse bg-neutral-200 dark:bg-neutral-700"></div>
+          </div>
+        </div>
+      </div>
+    </TabView>
+  );
+}

src/lib/api/get.ts

@@ -226,3 +226,28 @@ export function useUSBNode1Query() {
     },
   });
 }
+
+export interface NetworkConfigResponse {
+  bonding_enabled: boolean;
+  bonding_mode: string;
+  bonding_active: boolean;
+  slaves: string[];
+  miimon: number;
+}
+
+export function useNetworkConfigQuery() {
+  const api = useAxiosWithAuth();
+
+  return useSuspenseQuery({
+    queryKey: ["networkConfig"],
+    queryFn: async () => {
+      const response = await api.get<APIResponse<NetworkConfigResponse>>("/bmc", {
+        params: {
+          opt: "get",
+          type: "network_config",
+        },
+      });
+      return response.data.response[0].result;
+    },
+  });
+}

src/lib/api/set.ts

@@ -227,3 +227,34 @@ export function useUSBNode1Mutation() {
     },
   });
 }
+
+export interface NetworkConfigPayload {
+  enabled: boolean;
+  mode: string;
+  apply?: boolean;
+}
+
+export function useNetworkConfigMutation() {
+  const api = useAxiosWithAuth();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationKey: ["networkConfigMutation"],
+    mutationFn: async (variables: NetworkConfigPayload) => {
+      const response = await api.get<APIResponse<string>>("/bmc", {
+        params: {
+          opt: "set",
+          type: "network_config",
+          enabled: variables.enabled ? "1" : "0",
+          mode: variables.mode,
+          apply: variables.apply ? "1" : "0",
+        },
+      });
+      return response.data.response[0].result;
+    },
+    onSettled: () => {
+      void queryClient.invalidateQueries({ queryKey: ["networkConfig"] });
+      void queryClient.invalidateQueries({ queryKey: ["infoTabData"] });
+    },
+  });
+}

src/locale/de.ts

@@ -5,6 +5,7 @@ const translations = {
     info: "Info",
     nodes: "Knoten",
     usb: "USB",
+    network: "Netzwerk",
     firmwareUpgrade: "Firmware-Upgrade",
     flashNode: "Knoten flashen",
     about: "Über",

src/locale/en.ts

@@ -3,6 +3,7 @@ const translations = {
     info: "Info",
     nodes: "Nodes",
     usb: "USB",
+    network: "Network",
     firmwareUpgrade: "Firmware Upgrade",
     flashNode: "Flash Node",
     about: "About",
@@ -149,6 +150,46 @@ const translations = {
     apiVersion: "API version",
     bmcUI: "BMC UI",
   },
+  network: {
+    header: "Link Aggregation (Bonding)",
+    description:
+      "Bond the two Ethernet ports (ge0 and ge1) together for increased bandwidth or redundancy.",
+    enabled: "Bonding Enabled",
+    mode: "Bonding Mode",
+    status: "Status",
+    statusActive: "Active",
+    statusInactive: "Inactive",
+    slaves: "Slave Interfaces",
+    applyButton: "Apply Changes",
+    applySuccess: "Network configuration applied successfully.",
+    applyFailed: "Failed to apply network configuration.",
+    modes: {
+      "active-backup": "Active-Backup (Failover)",
+      "balance-rr": "Balance Round-Robin",
+      "balance-xor": "Balance XOR",
+      broadcast: "Broadcast",
+      "802.3ad": "802.3ad LACP",
+      "balance-tlb": "Balance TLB",
+      "balance-alb": "Balance ALB",
+    },
+    modeDescriptions: {
+      "active-backup":
+        "Only one slave is active. Provides fault tolerance without switch configuration.",
+      "balance-rr":
+        "Round-robin transmit. Requires switch aggregate/trunk configuration.",
+      "balance-xor":
+        "XOR hash based transmit. Requires switch aggregate/trunk configuration.",
+      broadcast: "All slaves transmit all packets. For special use cases.",
+      "802.3ad":
+        "IEEE 802.3ad LACP. Requires switch LACP support. Provides true 2Gbps aggregate bandwidth.",
+      "balance-tlb":
+        "Adaptive transmit load balancing. No switch configuration required.",
+      "balance-alb":
+        "Adaptive load balancing (TX and RX). No switch configuration required.",
+    },
+    switchRequired: "Requires switch configuration",
+    switchNotRequired: "No switch configuration needed",
+  },
   ui: {
     cancel: "Cancel",
     continue: "Continue",

src/locale/es.ts

@@ -5,6 +5,7 @@ const translations = {
     info: "Información",
     nodes: "Nodos",
     usb: "USB",
+    network: "Red",
     firmwareUpgrade: "Actualizar Firmware",
     flashNode: "Instalar SO",
     about: "Acerca de",

src/locale/nl.ts

@@ -5,6 +5,7 @@ const translations = {
     info: "Info",
     nodes: "Nodes",
     usb: "USB",
+    network: "Netwerk",
     firmwareUpgrade: "Firmware-upgrade",
     flashNode: "Flash-node",
     about: "Over",

src/locale/pl.ts

@@ -6,6 +6,7 @@ const translations = {
     info: "Informacje",
     nodes: "Węzły",
     usb: "USB",
+    network: "Siec",
     firmwareUpgrade: "Aktualizacja oprogramowania",
     flashNode: "Flashowanie węzła",
     about: "O programie",

src/locale/zh-Hans.ts

@@ -5,6 +5,7 @@ const translations = {
     info: "信息",
     nodes: "节点",
     usb: "USB",
+    network: "网络",
     firmwareUpgrade: "固件升级",
     flashNode: "刷写节点",
     about: "关于",

src/routeTree.gen.ts

@@ -17,6 +17,7 @@ import { Route as TabLayoutRouteImport } from './routes/_tabLayout'
 const IndexLazyRouteImport = createFileRoute('/')()
 const TabLayoutUsbLazyRouteImport = createFileRoute('/_tabLayout/usb')()
 const TabLayoutNodesLazyRouteImport = createFileRoute('/_tabLayout/nodes')()
+const TabLayoutNetworkLazyRouteImport = createFileRoute('/_tabLayout/network')()
 const TabLayoutInfoLazyRouteImport = createFileRoute('/_tabLayout/info')()
 const TabLayoutFlashNodeLazyRouteImport = createFileRoute(
   '/_tabLayout/flash-node',
@@ -54,6 +55,13 @@ const TabLayoutNodesLazyRoute = TabLayoutNodesLazyRouteImport.update({
 } as any).lazy(() =>
   import('./routes/_tabLayout/nodes.lazy').then((d) => d.Route),
 )
+const TabLayoutNetworkLazyRoute = TabLayoutNetworkLazyRouteImport.update({
+  id: '/network',
+  path: '/network',
+  getParentRoute: () => TabLayoutRoute,
+} as any).lazy(() =>
+  import('./routes/_tabLayout/network.lazy').then((d) => d.Route),
+)
 const TabLayoutInfoLazyRoute = TabLayoutInfoLazyRouteImport.update({
   id: '/info',
   path: '/info',
@@ -91,6 +99,7 @@ export interface FileRoutesByFullPath {
   '/firmware-upgrade': typeof TabLayoutFirmwareUpgradeLazyRoute
   '/flash-node': typeof TabLayoutFlashNodeLazyRoute
   '/info': typeof TabLayoutInfoLazyRoute
+  '/network': typeof TabLayoutNetworkLazyRoute
   '/nodes': typeof TabLayoutNodesLazyRoute
   '/usb': typeof TabLayoutUsbLazyRoute
 }
@@ -101,6 +110,7 @@ export interface FileRoutesByTo {
   '/firmware-upgrade': typeof TabLayoutFirmwareUpgradeLazyRoute
   '/flash-node': typeof TabLayoutFlashNodeLazyRoute
   '/info': typeof TabLayoutInfoLazyRoute
+  '/network': typeof TabLayoutNetworkLazyRoute
   '/nodes': typeof TabLayoutNodesLazyRoute
   '/usb': typeof TabLayoutUsbLazyRoute
 }
@@ -113,6 +123,7 @@ export interface FileRoutesById {
   '/_tabLayout/firmware-upgrade': typeof TabLayoutFirmwareUpgradeLazyRoute
   '/_tabLayout/flash-node': typeof TabLayoutFlashNodeLazyRoute
   '/_tabLayout/info': typeof TabLayoutInfoLazyRoute
+  '/_tabLayout/network': typeof TabLayoutNetworkLazyRoute
   '/_tabLayout/nodes': typeof TabLayoutNodesLazyRoute
   '/_tabLayout/usb': typeof TabLayoutUsbLazyRoute
 }
@@ -125,6 +136,7 @@ export interface FileRouteTypes {
     | '/firmware-upgrade'
     | '/flash-node'
     | '/info'
+    | '/network'
     | '/nodes'
     | '/usb'
   fileRoutesByTo: FileRoutesByTo
@@ -135,6 +147,7 @@ export interface FileRouteTypes {
     | '/firmware-upgrade'
     | '/flash-node'
     | '/info'
+    | '/network'
     | '/nodes'
     | '/usb'
   id:
@@ -146,6 +159,7 @@ export interface FileRouteTypes {
     | '/_tabLayout/firmware-upgrade'
     | '/_tabLayout/flash-node'
     | '/_tabLayout/info'
+    | '/_tabLayout/network'
     | '/_tabLayout/nodes'
     | '/_tabLayout/usb'
   fileRoutesById: FileRoutesById
@@ -193,6 +207,13 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof TabLayoutNodesLazyRouteImport
       parentRoute: typeof TabLayoutRoute
     }
+    '/_tabLayout/network': {
+      id: '/_tabLayout/network'
+      path: '/network'
+      fullPath: '/network'
+      preLoaderRoute: typeof TabLayoutNetworkLazyRouteImport
+      parentRoute: typeof TabLayoutRoute
+    }
     '/_tabLayout/info': {
       id: '/_tabLayout/info'
       path: '/info'
@@ -229,6 +250,7 @@ interface TabLayoutRouteChildren {
   TabLayoutFirmwareUpgradeLazyRoute: typeof TabLayoutFirmwareUpgradeLazyRoute
   TabLayoutFlashNodeLazyRoute: typeof TabLayoutFlashNodeLazyRoute
   TabLayoutInfoLazyRoute: typeof TabLayoutInfoLazyRoute
+  TabLayoutNetworkLazyRoute: typeof TabLayoutNetworkLazyRoute
   TabLayoutNodesLazyRoute: typeof TabLayoutNodesLazyRoute
   TabLayoutUsbLazyRoute: typeof TabLayoutUsbLazyRoute
 }
@@ -238,6 +260,7 @@ const TabLayoutRouteChildren: TabLayoutRouteChildren = {
   TabLayoutFirmwareUpgradeLazyRoute: TabLayoutFirmwareUpgradeLazyRoute,
   TabLayoutFlashNodeLazyRoute: TabLayoutFlashNodeLazyRoute,
   TabLayoutInfoLazyRoute: TabLayoutInfoLazyRoute,
+  TabLayoutNetworkLazyRoute: TabLayoutNetworkLazyRoute,
   TabLayoutNodesLazyRoute: TabLayoutNodesLazyRoute,
   TabLayoutUsbLazyRoute: TabLayoutUsbLazyRoute,
 }