feat: Settings 'Scan library' button + last-result status

web/src/app/settings/settings-form.tsx

@@ -22,6 +22,22 @@ export function SettingsForm() {
   const [tokenSet, setTokenSet] = useState(false);
   const [keySet, setKeySet] = useState(false);
   const [saved, setSaved] = useState(false);
+  const [scanResult, setScanResult] = useState<string | null>(null);
+  const [scanRequested, setScanRequested] = useState(false);
+
+  useEffect(() => {
+    fetch("/api/scan")
+      .then((r) => r.json())
+      .then((s: { result: string | null; requested: boolean }) => {
+        setScanResult(s.result);
+        setScanRequested(s.requested);
+      });
+  }, []);
+
+  async function requestScan() {
+    await fetch("/api/scan", { method: "POST" });
+    setScanRequested(true);
+  }
 
   useEffect(() => {
     fetch("/api/config")
@@ -53,6 +69,7 @@ export function SettingsForm() {
   }
 
   return (
+    <>
       <form onSubmit={submit}>
         <fieldset>
           <legend>Qobuz — email/password</legend>
@@ -72,5 +89,14 @@ export function SettingsForm() {
         <button type="submit">Save</button>
         {saved ? <span> Saved.</span> : null}
       </form>
+      <section>
+        <h2>Library</h2>
+        <p>Scan <code>/music</code> and record what's already on disk as owned + monitored.</p>
+        <button type="button" onClick={requestScan} disabled={scanRequested}>
+          {scanRequested ? "Scan requested…" : "Scan library"}
+        </button>
+        {scanResult ? <p aria-label="scan result">Last scan: {scanResult}</p> : null}
+      </section>
+    </>
   );
 }