file structure and comments unified

frontend/src/components/FireWallAddTableModal.tsx

@@ -1,4 +1,3 @@
-// src/components/FirewallManager.tsx
 import { Button, Card, Col, Form, Input, Modal, Row, Select, Space, Spin, Typography, notification } from 'antd';
 import { ReactElement, useEffect, useState } from 'react';
 import { execFirewallRaw, fetchRuleset } from '../api/apiClient';
@@ -42,7 +41,6 @@ export default function FirewallAddTableModal({ open, onClose, startOnPreview =
   const [results, setResults] = useState<CmdResult[]>([]);
   const [selectedFamily, setSelectedFamily] = useState<string>('bridge');
 
-  // initialize and refresh when modal opens
   useEffect(() => {
     form.setFieldsValue({
       family: 'bridge',
@@ -70,7 +68,6 @@ export default function FirewallAddTableModal({ open, onClose, startOnPreview =
         setRulesetEmpty(false);
       }
     } catch (err: any) {
-      // use notification instead of message
       notification.warning({
         message: 'Could not load ruleset',
         description: err?.message ?? String(err),
@@ -82,14 +79,12 @@ export default function FirewallAddTableModal({ open, onClose, startOnPreview =
     }
   }
 
-  // Build commands: only create table
   function buildCommands(values: any): string[] {
     const family = (values.family ?? 'bridge').trim();
     const table = (values.tableName ?? 'filter').trim();
     return [`add table ${family} ${table}`];
   }
 
-  // Execute commands sequentially
   async function executeCommands(cmds: string[]) {
     setRunning(true);
     setResults([]);
@@ -109,16 +104,13 @@ export default function FirewallAddTableModal({ open, onClose, startOnPreview =
     setResults(acc);
     setRunning(false);
 
-    // refresh ruleset after running
     try {
       await refreshRuleset();
     } catch {
-      // ignore — refreshRuleset handles notifications on error
     }
 
     const hadError = acc.some((r) => r.err);
     if (!hadError) {
-      // success -> notify briefly and inform parent that a resource was created
       notification.success({
         message: 'Table created',
         description: 'Table was created and ruleset has been refreshed locally in the modal.',
@@ -126,7 +118,6 @@ export default function FirewallAddTableModal({ open, onClose, startOnPreview =
       });
       onClose?.(true); // signal parent to refresh and close modal
     } else {
-      // error -> open results view and show notification
       notification.error({
         message: 'Some commands returned errors',
         description: 'See execution results below for details.',
@@ -153,7 +144,6 @@ export default function FirewallAddTableModal({ open, onClose, startOnPreview =
             <Button
               type="primary"
               onClick={() => {
-                // validate form before preview
                 form
                   .validateFields()
                   .then(() => setStep(1))
@@ -181,7 +171,6 @@ export default function FirewallAddTableModal({ open, onClose, startOnPreview =
     );
   }
 
-  // show spinner while checking ruleset
   if (localLoadingRuleset) {
     return (
       <Modal title="Create Table" open={open} onCancel={() => onClose?.(false)} footer={null} width={700}>
@@ -201,7 +190,7 @@ export default function FirewallAddTableModal({ open, onClose, startOnPreview =
       footer={renderFooter()}
       destroyOnClose
     >
-      {/* Step 0: minimal form */}
+      
       {step === 0 && (
         <div>
           <Form
@@ -238,7 +227,7 @@ export default function FirewallAddTableModal({ open, onClose, startOnPreview =
         </div>
       )}
 
-      {/* Step 1: preview + results */}
+      
       {step === 1 && (
         <>
           <Card title="Command preview" style={{ marginBottom: 12 }}>