66 lines
1.7 KiB
TypeScript
66 lines
1.7 KiB
TypeScript
import { useEffect, useState } from "react";
|
|||
|
|
import { invoke } from "@tauri-apps/api/core";
|
||
|
|
|
||
|
|
const APP_NAME = "Renamr";
|
||
|
|
const APP_VERSION = "0.1.0";
|
||
|
|
|
||
|
|
const DEFAULT_EXPRESSION = "{n} - {s00e00} - {t}";
|
||
|
|
const DEFAULT_BINDINGS: Record<string, string> = {
|
||
|
|
n: "Example Show",
|
||
|
|
s00e00: "S01E01",
|
||
|
|
t: "Pilot",
|
||
|
|
};
|
||
|
|
|
||
|
|
export default function App() {
|
||
|
|
const [expression, setExpression] = useState(DEFAULT_EXPRESSION);
|
||
|
|
const [preview, setPreview] = useState<string>("");
|
||
|
|
const [error, setError] = useState<string | null>(null);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
let cancelled = false;
|
||
|
|
|
||
|
|
invoke<string>("render_expression", { expression, bindings: DEFAULT_BINDINGS })
|
||
|
|
.then((result) => {
|
||
|
|
if (!cancelled) {
|
||
|
|
setPreview(result);
|
||
|
|
setError(null);
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.catch((err) => {
|
||
|
|
if (!cancelled) {
|
||
|
|
setPreview("");
|
||
|
|
setError(String(err));
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
return () => {
|
||
|
|
cancelled = true;
|
||
|
|
};
|
||
|
|
}, [expression]);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<main className="shell">
|
||
|
|
<header>
|
||
|
|
<h1>{APP_NAME}</h1>
|
||
|
|
<p className="tagline">A fast, cross-platform media renamer.</p>
|
||
|
|
<p className="version">v{APP_VERSION}</p>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<section className="panel">
|
||
|
|
<label htmlFor="expression">Naming scheme</label>
|
||
|
|
<input
|
||
|
|
id="expression"
|
||
|
|
value={expression}
|
||
|
|
onChange={(e) => setExpression(e.target.value)}
|
||
|
|
spellCheck={false}
|
||
|
|
/>
|
||
|
|
|
||
|
|
<div className="preview">
|
||
|
|
<span className="preview-label">Preview</span>
|
||
|
|
{error ? <span className="preview-error">{error}</span> : <span className="preview-value">{preview}</span>}
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
</main>
|
||
|
|
);
|
||
|
|
}
|