feat: filter translator rows by missing segments

src/components/Workbench.tsx

@@ -512,6 +512,7 @@ export function Workbench({
     localeMap: { de: {} },
   });
   const [filter, setFilter] = useState("");
+  const [showOnlyMissing, setShowOnlyMissing] = useState(false);
   const [status, setStatus] = useState("");
   const [glossary, setGlossary] = useState<GlossaryTerm[]>(() => {
     try {
@@ -585,7 +586,7 @@ export function Workbench({
     const target = workspace.localeMap[effectiveTargetLanguage] ?? {};
     const allKeys = new Set([...Object.keys(source), ...Object.keys(target)]);
     const query = filter.trim().toLocaleLowerCase("en");
-    const values = Array.from(allKeys)
+    return Array.from(allKeys)
       .sort((left, right) => left.localeCompare(right))
       .map((path) => ({
         key: path,
@@ -599,10 +600,11 @@ export function Workbench({
           row.source.toLocaleLowerCase("en").includes(query) ||
           row.target.toLocaleLowerCase("en").includes(query),
       )
+      .filter((row) => (!showOnlyMissing ? true : !row.target.trim()))
       .slice(0, MAX_PATH_ROWS);
-    return values;
   }, [
     filter,
+    showOnlyMissing,
     workspace.localeMap,
     effectiveSourceLanguage,
     effectiveTargetLanguage,
@@ -912,6 +914,14 @@ export function Workbench({
                     placeholder="Search keys or text"
                   />
                 </label>
+                <label className="field field-inline">
+                  <input
+                    type="checkbox"
+                    checked={showOnlyMissing}
+                    onChange={(event) => setShowOnlyMissing(event.target.checked)}
+                  />
+                  <span>Only missing segments</span>
+                </label>
                 <span className="count">
                   {formatCount(glossaryRows.length)} rows ·{" "}
                   {formatCount(totalMissing)} missing