+
+
+
+ {files.length > 0 ? `${files.length} file${files.length === 1 ? "" : "s"} loaded` : "No files loaded"}
+
+
+
+ {files.length > 0 && (
+
+ {allExtensions.length > 0 && (
+
+
Extension
+
+ {allExtensions.map((ext) => (
+
+ ))}
+
+
+ )}
+
+ {allKinds.length > 0 && (
+
+
Kind
+
+ {allKinds.map((kind) => (
+
+ ))}
+
+
+ )}
+
+
+ Filename contains
+ setNameContains(e.target.value)}
+ />
+
+
+ {kinds.has("tv") && (
+
+ Season
+ setSeason(e.target.value)}
+ />
+
+ )}
+
+ )}
+
+
+ {files.length === 0 &&
Load files to filter them by extension, kind, name, or season.
}
+
+ {files.length > 0 && (
+
+
+ {scanning ? "Scanning…" : `${filtered.length} of ${files.length} files match`}
+
+
+
+ )}
+
+ {files.length > 0 && !scanning && filtered.length === 0 && (
+
No files match the current filters.
+ )}
+
+ {filtered.map((file) => (
+
+ {displayName(file)}
+ {subtitleFor(info[file.path])}
+
+ ))}
+
+
+ {status &&
{status}
}
+
+ );
+}
diff --git a/src/main.tsx b/src/main.tsx
index 4cb895a..b2a57e2 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -9,6 +9,7 @@ import "./components/RenamePanel.css";
import "./components/EpisodesPanel.css";
import "./components/SubtitlesPanel.css";
import "./components/SfvPanel.css";
+import "./components/FilterPanel.css";
import "./components/PanelStub.css";
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(