refactor(settings): drop trim field, now set from preview panel

src/components/Settings.tsx

@@ -1,15 +1,7 @@
 import type { ReactNode } from "react";
 import { useBook } from "../store/useBook";
-import type { TrimSize } from "../model/book";
 import { Icon } from "./Icon";
 
-const TRIMS: { value: TrimSize; label: string }[] = [
-  { value: "6x9", label: "6 × 9 in — trade paperback" },
-  { value: "5.5x8.5", label: "5.5 × 8.5 in — digest" },
-  { value: "5x8", label: "5 × 8 in — pocket" },
-  { value: "a5", label: "A5 — 148 × 210 mm" },
-];
-
 const LANGUAGES = [
   { value: "en", label: "English" },
   { value: "es", label: "Spanish" },
@@ -58,26 +50,15 @@ export function Settings({ onClose, onSave }: { onClose: () => void; onSave: ()
           <Field label="ISBN">
             <input value={metadata.isbn} placeholder="optional" onChange={(e) => setMetadata({ isbn: e.target.value })} />
           </Field>
-          <div className="field-row">
+          <Field label="Language">
-            <Field label="Trim size">
+            <select value={metadata.language} onChange={(e) => setMetadata({ language: e.target.value })}>
-              <select value={settings.trim} onChange={(e) => setSettings({ trim: e.target.value as TrimSize })}>
+              {LANGUAGES.map((l) => (
-                {TRIMS.map((t) => (
+                <option key={l.value} value={l.value}>
-                  <option key={t.value} value={t.value}>
+                  {l.label}
-                    {t.label}
+                </option>
-                  </option>
+              ))}
-                ))}
+            </select>
-              </select>
+          </Field>
-            </Field>
-            <Field label="Language">
-              <select value={metadata.language} onChange={(e) => setMetadata({ language: e.target.value })}>
-                {LANGUAGES.map((l) => (
-                  <option key={l.value} value={l.value}>
-                    {l.label}
-                  </option>
-                ))}
-              </select>
-            </Field>
-          </div>
           <label className="check">
             <input type="checkbox" checked={settings.bleed} onChange={(e) => setSettings({ bleed: e.target.checked })} />
             Add bleed for full-page images (print)