feat(ui): config machine (sonde+proxy), mode Listing, défaut apt-cacher-ng

- popup Profil sur la tuile : sonde machine → propositions os_family/
  machine_kind/virtualization avec Appliquer ; proxy APT (mode + url) +
  appliquer persistant
- mode d'affichage Tuiles/Liste : toggle + bouton Ajouter déplacés dans le
  header de page ; vue Liste = liste compacte + panneau détail « Machine view »
  (sections Docker/Post-install dépliées ; pliées en mode tuile)
- Popup rendu via portail document.body (position fixed, z-index 1000) :
  passe au premier plan, échappe au backdrop-filter des tuiles
- Paramètres : onglet Proxy APT (défaut apt-cacher-ng + appliquer à toutes
  les machines) ; AddMachineModal pré-remplit le proxy par défaut
- api client : settings, updateMachine, probe ; icônes network/grid/list

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

client/src/features/machines/AddMachineModal.tsx

@@ -1,5 +1,6 @@
 // client/src/features/machines/AddMachineModal.tsx
-import { useState } from "react";
+import { useEffect, useState } from "react";
+import type { DefaultAptProxy } from "../../lib/api.js";
 import { api } from "../../lib/api.js";
 
 interface Props { onClose: () => void; onCreated: () => void; }
@@ -8,12 +9,31 @@ export function AddMachineModal({ onClose, onCreated }: Props) {
   const [form, setForm] = useState({ name: "", hostname: "", port: 22, username: "", password: "", sudoPassword: "" });
   const [error, setError] = useState<string | null>(null);
   const [busy, setBusy] = useState(false);
+  const [proxyDefault, setProxyDefault] = useState<DefaultAptProxy | null>(null);
+  const [useProxy, setUseProxy] = useState(false);
   const set = (k: string, v: string | number) => setForm({ ...form, [k]: v });
 
+  useEffect(() => {
+    void (async () => {
+      try {
+        const s = await api.getSettings();
+        if (s.defaultAptProxy.url) {
+          setProxyDefault(s.defaultAptProxy);
+          setUseProxy(true);
+        }
+      } catch {
+        /* pas de défaut configuré */
+      }
+    })();
+  }, []);
+
   async function submit() {
     setBusy(true); setError(null);
     try {
-      await api.createMachine({ ...form, port: Number(form.port), sudoPassword: form.sudoPassword || null });
+      const proxy = useProxy && proxyDefault?.url
+        ? { aptProxyMode: proxyDefault.mode === "direct" ? "runtime" : proxyDefault.mode, aptProxyUrl: proxyDefault.url }
+        : {};
+      await api.createMachine({ ...form, port: Number(form.port), sudoPassword: form.sudoPassword || null, ...proxy });
       onCreated(); onClose();
     } catch (e) { setError((e as Error).message); } finally { setBusy(false); }
   }
@@ -28,6 +48,12 @@ export function AddMachineModal({ onClose, onCreated }: Props) {
         <input placeholder="port" type="number" value={form.port} onChange={(e) => set("port", e.target.value)} />
         <input placeholder="password" type="password" value={form.password} onChange={(e) => set("password", e.target.value)} />
         <input placeholder="sudo password (optionnel)" type="password" value={form.sudoPassword} onChange={(e) => set("sudoPassword", e.target.value)} />
+        {proxyDefault?.url && (
+          <label style={{ display: "flex", alignItems: "center", gap: 8, fontSize: 12, color: "var(--ink-2)" }}>
+            <input type="checkbox" checked={useProxy} onChange={(e) => setUseProxy(e.target.checked)} />
+            <span>Proxy APT par défaut <span className="mono">{proxyDefault.url}</span></span>
+          </label>
+        )}
         {error && <div style={{ color: "var(--err)", fontSize: 12 }}>{error}</div>}
         <div style={{ display: "flex", gap: 8, justifyContent: "flex-end" }}>
           <button onClick={onClose}>Annuler</button>