feat(tools): 2.0 phase 5 wave 4 - office, ebooks, data, archives (14 tools) (#224)

apps/web/src/components/tools/convert-document-settings.tsx

@@ -0,0 +1,74 @@
+import { useState } from "react";
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+type DocFormat = "docx" | "odt" | "rtf" | "txt";
+
+export function ConvertDocumentSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["convert-document"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("convert-document");
+
+  const [outFormat, setOutFormat] = useState<DocFormat>("odt");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = { format: outFormat };
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      <div>
+        <label htmlFor="cd-format" className="text-xs text-muted-foreground">
+          {s.format}
+        </label>
+        <select
+          id="cd-format"
+          value={outFormat}
+          onChange={(e) => setOutFormat(e.target.value as DocFormat)}
+          className="w-full mt-0.5 px-2 py-1.5 rounded border border-border bg-background text-sm text-foreground"
+        >
+          <option value="docx">DOCX</option>
+          <option value="odt">ODT</option>
+          <option value="rtf">RTF</option>
+          <option value="txt">TXT</option>
+        </select>
+      </div>
+
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="convert-document-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/convert-presentation-settings.tsx

@@ -0,0 +1,72 @@
+import { useState } from "react";
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+type PresFormat = "pptx" | "odp";
+
+export function ConvertPresentationSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["convert-presentation"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("convert-presentation");
+
+  const [outFormat, setOutFormat] = useState<PresFormat>("odp");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = { format: outFormat };
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      <div>
+        <label htmlFor="cp-format" className="text-xs text-muted-foreground">
+          {s.format}
+        </label>
+        <select
+          id="cp-format"
+          value={outFormat}
+          onChange={(e) => setOutFormat(e.target.value as PresFormat)}
+          className="w-full mt-0.5 px-2 py-1.5 rounded border border-border bg-background text-sm text-foreground"
+        >
+          <option value="pptx">PPTX</option>
+          <option value="odp">ODP</option>
+        </select>
+      </div>
+
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="convert-presentation-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/convert-spreadsheet-settings.tsx

@@ -0,0 +1,75 @@
+import { useState } from "react";
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+type SheetFormat = "xlsx" | "ods" | "csv";
+
+export function ConvertSpreadsheetSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["convert-spreadsheet"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("convert-spreadsheet");
+
+  const [outFormat, setOutFormat] = useState<SheetFormat>("ods");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = { format: outFormat };
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      <div>
+        <label htmlFor="cs-format" className="text-xs text-muted-foreground">
+          {s.format}
+        </label>
+        <select
+          id="cs-format"
+          value={outFormat}
+          onChange={(e) => setOutFormat(e.target.value as SheetFormat)}
+          className="w-full mt-0.5 px-2 py-1.5 rounded border border-border bg-background text-sm text-foreground"
+        >
+          <option value="xlsx">XLSX</option>
+          <option value="ods">ODS</option>
+          <option value="csv">CSV</option>
+        </select>
+      </div>
+
+      <p className="text-[10px] text-muted-foreground">{s.hint}</p>
+
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="convert-spreadsheet-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/create-zip-settings.tsx

@@ -0,0 +1,52 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function CreateZipSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["create-zip"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("create-zip");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="create-zip-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/epub-convert-settings.tsx

@@ -0,0 +1,76 @@
+import { useState } from "react";
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+type EpubFormat = "pdf" | "docx" | "html" | "md";
+
+export function EpubConvertSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["epub-convert"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("epub-convert");
+
+  const [outFormat, setOutFormat] = useState<EpubFormat>("html");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = { format: outFormat };
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      <div>
+        <label htmlFor="ec-format" className="text-xs text-muted-foreground">
+          {s.format}
+        </label>
+        <select
+          id="ec-format"
+          value={outFormat}
+          onChange={(e) => setOutFormat(e.target.value as EpubFormat)}
+          className="w-full mt-0.5 px-2 py-1.5 rounded border border-border bg-background text-sm text-foreground"
+        >
+          <option value="pdf">PDF</option>
+          <option value="docx">DOCX</option>
+          <option value="html">HTML</option>
+          <option value="md">Markdown</option>
+        </select>
+      </div>
+
+      <p className="text-[10px] text-muted-foreground">{s.hint}</p>
+
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="epub-convert-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/excel-to-pdf-settings.tsx

@@ -0,0 +1,52 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function ExcelToPdfSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["excel-to-pdf"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("excel-to-pdf");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="excel-to-pdf-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/extract-zip-settings.tsx

@@ -0,0 +1,52 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function ExtractZipSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["extract-zip"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("extract-zip");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="extract-zip-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/markdown-to-docx-settings.tsx

@@ -0,0 +1,52 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function MarkdownToDocxSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["markdown-to-docx"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("markdown-to-docx");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="markdown-to-docx-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/markdown-to-html-settings.tsx

@@ -0,0 +1,54 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function MarkdownToHtmlSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["markdown-to-html"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("markdown-to-html");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      <p className="text-[10px] text-muted-foreground">{s.hint}</p>
+
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="markdown-to-html-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/merge-csvs-settings.tsx

@@ -0,0 +1,52 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function MergeCsvsSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["merge-csvs"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("merge-csvs");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="merge-csvs-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/powerpoint-to-pdf-settings.tsx

@@ -0,0 +1,52 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function PowerpointToPdfSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["powerpoint-to-pdf"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("powerpoint-to-pdf");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="powerpoint-to-pdf-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/to-epub-settings.tsx

@@ -0,0 +1,52 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function ToEpubSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["to-epub"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("to-epub");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="to-epub-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/xml-to-csv-settings.tsx

@@ -0,0 +1,52 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function XmlToCsvSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["xml-to-csv"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("xml-to-csv");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="xml-to-csv-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/components/tools/yaml-json-settings.tsx

@@ -0,0 +1,52 @@
+import { ProgressCard } from "@/components/common/progress-card";
+import { useTranslation } from "@/contexts/i18n-context";
+import { useToolProcessor } from "@/hooks/use-tool-processor";
+import { format } from "@/lib/format";
+import { useFileStore } from "@/stores/file-store";
+
+export function YamlJsonSettings() {
+  const { t } = useTranslation();
+  const s = t.toolSettings["yaml-json"];
+  const { files } = useFileStore();
+  const { processFiles, processAllFiles, processing, error, progress } =
+    useToolProcessor("yaml-json");
+
+  const hasFile = files.length > 0;
+  const hasMultiple = files.length > 1;
+
+  const handleProcess = () => {
+    const settings = {};
+    if (hasMultiple) {
+      processAllFiles(files, settings);
+    } else {
+      processFiles(files, settings);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-xs text-red-500">{error}</p>}
+
+      {processing ? (
+        <ProgressCard
+          active={processing}
+          phase={progress.phase === "idle" ? "uploading" : progress.phase}
+          label={s.progressLabel}
+          stage={progress.stage}
+          percent={progress.percent}
+          elapsed={progress.elapsed}
+        />
+      ) : (
+        <button
+          type="button"
+          data-testid="yaml-json-submit"
+          onClick={handleProcess}
+          disabled={!hasFile || processing}
+          className="w-full py-2.5 rounded-lg bg-primary text-primary-foreground font-medium disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {hasMultiple ? format(s.submitBatch, { count: files.length }) : s.submit}
+        </button>
+      )}
+    </div>
+  );
+}

apps/web/src/lib/icon-map.ts

@@ -7,6 +7,7 @@ import {
   AudioLines,
   AudioWaveform,
   BellRing,
+  Book,
   BookImage,
   BookOpen,
   Braces,
@@ -34,10 +35,13 @@ import {
   FilePen,
   FileText,
   FileType,
+  FileType2,
   FileVideo,
   FileX,
   Film,
   Focus,
+  FolderArchive,
+  FolderOpen,
   Frame,
   GalleryHorizontalEnd,
   GalleryThumbnails,
@@ -65,6 +69,7 @@ import {
   PenLine,
   PenTool,
   Pipette,
+  Presentation,
   QrCode,
   RectangleHorizontal,
   Rewind,
@@ -108,6 +113,7 @@ export const ICON_MAP: Record<string, LucideIcon> = {
   AudioLines,
   AudioWaveform,
   BellRing,
+  Book,
   BookImage,
   BookOpen,
   Braces,
@@ -137,8 +143,11 @@ export const ICON_MAP: Record<string, LucideIcon> = {
   FileX,
   FileText,
   FileType,
+  FileType2,
   Film,
   Focus,
+  FolderArchive,
+  FolderOpen,
   Frame,
   GalleryHorizontalEnd,
   GalleryThumbnails,
@@ -165,6 +174,7 @@ export const ICON_MAP: Record<string, LucideIcon> = {
   PenLine,
   PenTool,
   Pipette,
+  Presentation,
   QrCode,
   RectangleHorizontal,
   Rewind,

apps/web/src/lib/tool-display-modes.ts

@@ -140,6 +140,10 @@ export const TOOL_DISPLAY_MODES: Record<string, DisplayMode> = {
   "waveform-image": "no-comparison",
 
   // PDF & Document tools
+  "convert-document": "no-comparison",
+  "convert-presentation": "no-comparison",
+  "convert-spreadsheet": "no-comparison",
+  "excel-to-pdf": "document",
   "merge-pdf": "document",
   "split-pdf": "no-comparison",
   "compress-pdf": "document",
@@ -164,14 +168,24 @@ export const TOOL_DISPLAY_MODES: Record<string, DisplayMode> = {
   "pdf-to-text": "no-comparison",
   "pdf-to-word": "no-comparison",
   "pdf-metadata": "no-comparison",
+  "powerpoint-to-pdf": "document",
   "html-to-pdf": "document",
+  "markdown-to-docx": "no-comparison",
+  "markdown-to-html": "no-comparison",
   "markdown-to-pdf": "document",
+  "epub-convert": "no-comparison",
+  "to-epub": "no-comparison",
 
   // Data tools
   "csv-excel": "no-comparison",
   "csv-json": "no-comparison",
   "json-xml": "no-comparison",
   "split-csv": "no-comparison",
+  "merge-csvs": "no-comparison",
+  "yaml-json": "no-comparison",
+  "xml-to-csv": "no-comparison",
+  "create-zip": "no-comparison",
+  "extract-zip": "no-comparison",
 };
 
 /**
@@ -179,7 +193,9 @@ export const TOOL_DISPLAY_MODES: Record<string, DisplayMode> = {
  * Consumed by use-tool-processor; backend routes declare maxInputs.
  */
 export const MULTI_FILE_TOOLS: ReadonlySet<string> = new Set([
+  "create-zip",
   "merge-audio",
+  "merge-csvs",
   "merge-pdf",
   "merge-videos",
   "replace-audio",

apps/web/src/lib/tool-registry.tsx

@@ -714,6 +714,76 @@ const MarkdownToPdfSettings = lazy(() =>
     default: m.MarkdownToPdfSettings,
   })),
 );
+const ExcelToPdfSettings = lazy(() =>
+  import("@/components/tools/excel-to-pdf-settings").then((m) => ({
+    default: m.ExcelToPdfSettings,
+  })),
+);
+const PowerpointToPdfSettings = lazy(() =>
+  import("@/components/tools/powerpoint-to-pdf-settings").then((m) => ({
+    default: m.PowerpointToPdfSettings,
+  })),
+);
+const ConvertDocumentSettings = lazy(() =>
+  import("@/components/tools/convert-document-settings").then((m) => ({
+    default: m.ConvertDocumentSettings,
+  })),
+);
+const ConvertSpreadsheetSettings = lazy(() =>
+  import("@/components/tools/convert-spreadsheet-settings").then((m) => ({
+    default: m.ConvertSpreadsheetSettings,
+  })),
+);
+const ConvertPresentationSettings = lazy(() =>
+  import("@/components/tools/convert-presentation-settings").then((m) => ({
+    default: m.ConvertPresentationSettings,
+  })),
+);
+const MarkdownToHtmlSettings = lazy(() =>
+  import("@/components/tools/markdown-to-html-settings").then((m) => ({
+    default: m.MarkdownToHtmlSettings,
+  })),
+);
+const MarkdownToDocxSettings = lazy(() =>
+  import("@/components/tools/markdown-to-docx-settings").then((m) => ({
+    default: m.MarkdownToDocxSettings,
+  })),
+);
+const EpubConvertSettings = lazy(() =>
+  import("@/components/tools/epub-convert-settings").then((m) => ({
+    default: m.EpubConvertSettings,
+  })),
+);
+const ToEpubSettings = lazy(() =>
+  import("@/components/tools/to-epub-settings").then((m) => ({
+    default: m.ToEpubSettings,
+  })),
+);
+const MergeCsvsSettings = lazy(() =>
+  import("@/components/tools/merge-csvs-settings").then((m) => ({
+    default: m.MergeCsvsSettings,
+  })),
+);
+const YamlJsonSettings = lazy(() =>
+  import("@/components/tools/yaml-json-settings").then((m) => ({
+    default: m.YamlJsonSettings,
+  })),
+);
+const XmlToCsvSettings = lazy(() =>
+  import("@/components/tools/xml-to-csv-settings").then((m) => ({
+    default: m.XmlToCsvSettings,
+  })),
+);
+const CreateZipSettings = lazy(() =>
+  import("@/components/tools/create-zip-settings").then((m) => ({
+    default: m.CreateZipSettings,
+  })),
+);
+const ExtractZipSettings = lazy(() =>
+  import("@/components/tools/extract-zip-settings").then((m) => ({
+    default: m.ExtractZipSettings,
+  })),
+);
 
 // ── Color tool wrapper ─────────────────────────────────────────────
 // Color tools share a single component but differ by toolId.
@@ -901,6 +971,15 @@ const ENTRY_CONFIG: ReadonlyArray<[string, RegistryEntryConfig]> = [
   ["compress-pdf", { accept: ".pdf", Settings: CompressPdfSettings }],
   ["rotate-pdf", { accept: ".pdf", Settings: RotatePdfSettings }],
   ["word-to-pdf", { accept: ".docx,.doc,.odt,.rtf,.txt", Settings: WordToPdfSettings }],
+  ["excel-to-pdf", { accept: ".xlsx,.xls,.ods,.csv", Settings: ExcelToPdfSettings }],
+  ["powerpoint-to-pdf", { accept: ".pptx,.ppt,.odp", Settings: PowerpointToPdfSettings }],
+  ["convert-document", { accept: ".docx,.doc,.odt,.rtf,.txt", Settings: ConvertDocumentSettings }],
+  ["convert-spreadsheet", { accept: ".xlsx,.xls,.ods,.csv", Settings: ConvertSpreadsheetSettings }],
+  ["convert-presentation", { accept: ".pptx,.ppt,.odp", Settings: ConvertPresentationSettings }],
+  ["markdown-to-html", { accept: ".md,.markdown", Settings: MarkdownToHtmlSettings }],
+  ["markdown-to-docx", { accept: ".md,.markdown", Settings: MarkdownToDocxSettings }],
+  ["epub-convert", { accept: ".epub", Settings: EpubConvertSettings }],
+  ["to-epub", { accept: ".docx,.md,.html,.txt", Settings: ToEpubSettings }],
 
   // PDF depth tools (organize, secure, pdfcpu, layout)
   ["extract-pages", { accept: ".pdf", Settings: ExtractPagesSettings }],
@@ -928,10 +1007,15 @@ const ENTRY_CONFIG: ReadonlyArray<[string, RegistryEntryConfig]> = [
   ["markdown-to-pdf", { accept: ".md,.markdown", Settings: MarkdownToPdfSettings }],
 
   // Data tools
-  ["csv-excel", { accept: ".csv,.xlsx", Settings: CsvExcelSettings }],
-  ["csv-json", { accept: ".csv,.json", Settings: CsvJsonSettings }],
+  ["csv-excel", { accept: ".csv,.tsv,.xlsx", Settings: CsvExcelSettings }],
+  ["csv-json", { accept: ".csv,.tsv,.json", Settings: CsvJsonSettings }],
   ["json-xml", { accept: ".json,.xml", Settings: JsonXmlSettings }],
-  ["split-csv", { accept: ".csv", Settings: SplitCsvSettings }],
+  ["split-csv", { accept: ".csv,.tsv", Settings: SplitCsvSettings }],
+  ["merge-csvs", { accept: ".csv,.tsv", Settings: MergeCsvsSettings }],
+  ["yaml-json", { accept: ".yaml,.yml,.json", Settings: YamlJsonSettings }],
+  ["xml-to-csv", { accept: ".xml", Settings: XmlToCsvSettings }],
+  ["create-zip", { Settings: CreateZipSettings }],
+  ["extract-zip", { accept: ".zip", Settings: ExtractZipSettings }],
 ];
 
 export const toolRegistry = new Map<string, ToolRegistryEntry>(