From 55d2f217e3bb7e5e8bf59f157bc2966df7ad9977 Mon Sep 17 00:00:00 2001
From: DeccanHYD <pranavyannam984@gmail.com>
Date: Tue, 6 Oct 2026 03:21:11 +0200
Subject: [PATCH] feat(web): add native exercise library management

---
 .../2026-10-06-exercise-library-management.md |  13 +
 web/src/App.tsx                               |  10 +-
 web/src/data/schema.ts                        |   1 +
 web/src/data/store.ts                         |  47 +-
 web/src/domain/codecs.ts                      |   8 +
 web/src/domain/types.ts                       |   2 +
 web/src/features/ExerciseLibrary.tsx          | 417 ++++++++++++++++++
 web/src/features/Plans.tsx                    |  10 +-
 web/src/features/Settings.tsx                 |  10 +-
 web/src/styles.css                            |  35 ++
 web/src/ui/components.tsx                     |   4 +
 web/src/ui/navigation.ts                      |   1 +
 web/tests/exercise-library-store.test.ts      | 135 ++++++
 web/tests/exercise-library-ui.test.tsx        | 285 ++++++++++++
 web/tests/navigation-parity.test.ts           |   1 +
 15 files changed, 963 insertions(+), 16 deletions(-)
 create mode 100644 docs/reviews/2026-10-06-exercise-library-management.md
 create mode 100644 web/src/features/ExerciseLibrary.tsx
 create mode 100644 web/tests/exercise-library-store.test.ts
 create mode 100644 web/tests/exercise-library-ui.test.tsx

diff --git a/docs/reviews/2026-10-06-exercise-library-management.md b/docs/reviews/2026-10-06-exercise-library-management.md
new file mode 100644
index 0000000..5bf1c0b
--- /dev/null
+++ b/docs/reviews/2026-10-06-exercise-library-management.md
@@ -0,0 +1,13 @@
+# Exercise library management parity
+
+Settings now opens a separate exercise-library route instead of a dismiss-on-pick chooser. It follows Kotlin ExerciseLibraryScreen: All/Favorites/Custom and BW-only scopes, removable active chips, a filter sheet for muscles/equipment/category/movement/difficulty, 180 ms search, gym equipment exclusion, favorite-first/name ordering, recently completed exercise search chips and row navigation to progress. It uses Compose star/filter/delete paths, 72px minimum rows, 44px controls, shared themes and sheet/route transitions.
+
+All results are accessible. Web renders 100 at a time with Show more instead of Android's LazyColumn virtualization. Creation reuses the existing custom form with unmatched query prefilled; saving retains the library destination. Editing and tutorial links remain follow-up work; no new native tracking editor has been assumed.
+
+Favorites persist in the profile and canonical native favorite_exercises JSON setting, including double-encoded older JSON. Native settings override stale web-extension favorites during import. Each favorite mutation reads the current profile in a write transaction. Custom creation validates normalized duplicate names within its transaction, preventing simultaneous creates from duplicating a movement. Existing catalog overrides and recorded snapshots retain their behavior.
+
+Confirmed custom deletion protects built-ins, plan references and every workout status, including imported name-only references. Deletion, restored-catalog removal, favorite cleanup and reminder cleanup commit together. Referenced or failed writes keep the exercise and show the failure within the confirmation sheet. A removed restored custom exercise cannot return on bootstrap.
+
+Verification: 53 files / 263 unit tests, TypeScript/build and 185-file output checks. Tests cover concurrent duplicate creation/favorites, native and browser backup transfer, reference protection, transaction rollback, restored entry deletion, actual Settings navigation, filters, creation/confirmation/error behavior, recent names and results past the old limit. Isolated Chrome at 320px verifies favorite reload, filter scopes, creation/reload/cancel/delete, 200 accessible rows, progress/back origins and no horizontal overflow. Screenshots under ignored web/output/playwright/library*.png. Zero console errors/warnings. An older local preview worker displayed an update notice during the first QA attempt; normal Update & reload resolved that obstruction without changing storage or forcing clicks. Closing CI and deployment evidence is in the root handoff.
+
+P03/P14 remain partially open for tutorial/detail and editor workflows; P16/P17 still require native/web differential visual and motion checks. Native source, signed pre-alpha.9 APK and dirty UnifiedPort remain unchanged.
diff --git a/web/src/App.tsx b/web/src/App.tsx
index 0ee63d1..9403708 100644
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -16,6 +16,7 @@ import {
 } from "./features/Progress";
 import { Recovery, Ledger } from "./features/Recovery";
 import { Settings } from "./features/Settings";
+import { ExerciseLibrary } from "./features/ExerciseLibrary";
 import { Intelligence } from "./features/Intelligence";
 import { HistoricalWorkoutEditor, WorkoutCalendar } from "./features/history/HistoryTools";
 import { ExerciseProgress } from "./features/stats/ExerciseProgress";
@@ -27,6 +28,7 @@ import { backFrom } from "./ui/navigation";
 const tabs = ["Home", "Plans", "Log", "Stats", "Settings"];
 const tabRoutes = tabs.map((tab) => tab.toLowerCase());
 const detailTitles: Record<string, string> = {
+  library: "EXERCISE LIBRARY",
   workout: "ACTIVE WORKOUT",
   recovery: "MUSCLE RECOVERY",
   ledger: "IRON LEDGER",
@@ -228,7 +230,7 @@ export function App() {
     );
   const active = data.workouts.find((w) => w.status === "active");
   const detail = !["home", "plans", "log", "stats", "settings"].includes(route);
-  const selectedTabRoute = route.startsWith("plan/")
+  const selectedTabRoute = route === "library" ? "settings" : route.startsWith("plan/")
     ? "plans"
     : route.startsWith("history/") || route === "calendar"
       ? "log"
@@ -259,6 +261,8 @@ export function App() {
       <Stats />
     ) : route === "settings" ? (
       <Settings />
+    ) : route === "library" ? (
+      <ExerciseLibrary />
     ) : route === "recovery" ? (
       <Recovery />
     ) : route === "ledger" ? (
@@ -324,13 +328,13 @@ export function App() {
                   label="Back"
                   onClick={() => backFrom(route)}
                 />
-                <strong>
+                {route === "library" ? <h1 className="detail-screen-title">Exercise library</h1> : <strong>
                   {route.startsWith("plan/")
                     ? "EDIT PLAN"
                     : route.startsWith("history/")
                       ? "WORKOUT"
                       : detailTitles[route] ?? "IRONLOG"}
-                </strong>
+                </strong>}
                 <span aria-hidden="true" />
               </header>
             )}
diff --git a/web/src/data/schema.ts b/web/src/data/schema.ts
index fad5f1d..bdacbc9 100644
--- a/web/src/data/schema.ts
+++ b/web/src/data/schema.ts
@@ -176,6 +176,7 @@ export const profileSchema = z.object({
     plateInventory: z.array(plateStock).optional(),
   }).optional(),
   nativeSettings: z.record(z.string(), z.unknown()).optional(),
+  favoriteExerciseIds: z.array(z.string().min(1)).default([]),
   keepAwake: z.boolean(),
   cardShineEnabled: z.boolean().default(true),
   liquidGlassEnabled: z.boolean().default(true),
diff --git a/web/src/data/store.ts b/web/src/data/store.ts
index 045ab72..a877b4c 100644
--- a/web/src/data/store.ts
+++ b/web/src/data/store.ts
@@ -617,7 +617,52 @@ export function swapExercise(
   );
 }
 export async function saveExercise(e: Exercise) {
-  await db.exercises.put(exerciseSchema.parse(e));
+  const valid = exerciseSchema.parse({ ...e, name: e.name.trim() });
+  if (!exerciseNameKey(valid.name)) throw Error("Enter an exercise name.");
+  await db.transaction("rw", db.catalog, db.exercises, async () => {
+    const library = await readExerciseLibrary();
+    if (valid.custom && library.some(other => other.id !== valid.id && exerciseNameKey(other.name) === exerciseNameKey(valid.name)))
+      throw Error("An exercise with this name already exists. Choose it from the library.");
+    await db.exercises.put(valid);
+  });
+}
+const exerciseNameKey = (name: string) => name.trim().toLowerCase().replace(/[^a-z0-9]+/g, "_").replace(/_+$/, "");
+
+/** Read current favorites inside the write transaction so different tabs cannot lose additions. */
+export async function setExerciseFavorite(id: string, selected: boolean) {
+  await db.transaction("rw", db.profiles, db.catalog, db.exercises, async () => {
+    if (!(await readExerciseLibrary()).some(exercise => exercise.id === id)) throw Error("Exercise no longer exists.");
+    const row = await db.profiles.get("local");
+    const favorites = new Set(row?.favoriteExerciseIds ?? []);
+    if (selected) favorites.add(id); else favorites.delete(id);
+    const profile = profileSchema.parse({ ...defaultProfile, ...row, favoriteExerciseIds: [...favorites].sort() });
+    await db.profiles.put({ ...profile, id: "local" });
+  });
+}
+
+/** Match Kotlin reference protection; name-only imported references are protected too. */
+export async function deleteCustomExercise(id: string) {
+  await db.transaction("rw", db.catalog, db.exercises, db.profiles, db.plans, db.workouts, async () => {
+    const target = (await readExerciseLibrary()).find(exercise => exercise.id === id);
+    if (!target) throw Error("Exercise no longer exists.");
+    const bundled = await db.catalog.get("bundled");
+    if (!target.custom || bundled?.exercises.some(exercise => exercise.id === id)) throw Error("Built-in exercises cannot be deleted.");
+    const references = (exercise: { exerciseId: string; name: string }) => exercise.exerciseId === id ||
+      (!exercise.exerciseId.trim() && exerciseNameKey(exercise.name) === exerciseNameKey(target.name));
+    if ((await db.plans.toArray()).some(plan => plan.days.some(day => day.exercises.some(references))))
+      throw Error("This exercise is used in a plan. Remove it from the plan before deleting.");
+    if ((await db.workouts.toArray()).some(workout => workout.exercises.some(references)))
+      throw Error("This exercise is used in a workout. Keep it to preserve your history.");
+    await db.exercises.delete(id);
+    const restored = await db.catalog.get("restored");
+    if (restored) await db.catalog.put({ ...restored, exercises: restored.exercises.filter(exercise => exercise.id !== id) });
+    const row = await db.profiles.get("local");
+    const notes = { ...row?.exerciseNextNotes };
+    delete notes[`exercise_next_note:${id}`];
+    const profile = profileSchema.parse({ ...defaultProfile, ...row, exerciseNextNotes: notes,
+      favoriteExerciseIds: (row?.favoriteExerciseIds ?? []).filter(value => value !== id) });
+    await db.profiles.put({ ...profile, id: "local" });
+  });
 }
 export async function saveMeasurement(m: Measurement) {
   await db.measurements.put(snapshotSchema.shape.measurements.element.parse(m));
diff --git a/web/src/domain/codecs.ts b/web/src/domain/codecs.ts
index e57b1fb..3bdc5c3 100644
--- a/web/src/domain/codecs.ts
+++ b/web/src/domain/codecs.ts
@@ -361,6 +361,8 @@ export function encodeAndroidBackup(snapshot: AppSnapshot): string {
   }));
   data.app_settings.push({ id: "ironlog_settings", key: "ironlog_settings",
     value: JSON.stringify({ ...snapshot.profile.nativeSettings, barWeightKg: basePlateSetup(snapshot.profile).barKg }), value_type: "json", ...stamp });
+  data.app_settings.push({ id: "favorite_exercises", key: "favorite_exercises",
+    value: JSON.stringify([...new Set(snapshot.profile.favoriteExerciseIds ?? [])].sort()), value_type: "json", ...stamp });
   const finiteGyms = snapshot.gyms.filter(g => g.plateInventory !== undefined);
   let activeGym = snapshot.profile.activeGymId
     ? finiteGyms.find(g => g.id === snapshot.profile.activeGymId)
@@ -771,6 +773,12 @@ export function decodeAndroidBackup(raw: string): {
   const selectedGym = mergedGyms.find(g => g.id === activeGymId) ?? activeGym ??
     (!activeGymId ? mergedGyms.find(g => g.id === ext.unsupportedActiveGymId && g.plateInventory === undefined) : undefined);
   const sourceProfile = profileSchema.parse({ ...profile, ...obj(ext.profile) });
+  const favoriteSetting = table("app_settings").find(s => s.key === "favorite_exercises");
+  if (favoriteSetting) {
+    let favorites = parse(str(favoriteSetting.value));
+    if (typeof favorites === "string") favorites = parse(favorites);
+    sourceProfile.favoriteExerciseIds = [...new Set(z.array(z.string().min(1)).parse(favorites))].sort();
+  }
   const nativeSetting = table("app_settings").find(s => s.key === "ironlog_settings");
   let nativeSettings = sourceProfile.nativeSettings;
   const base = ext.profile == null ? nativeDefaultPlateSetup() : basePlateSetup(sourceProfile);
diff --git a/web/src/domain/types.ts b/web/src/domain/types.ts
index d1275e0..116a6af 100644
--- a/web/src/domain/types.ts
+++ b/web/src/domain/types.ts
@@ -169,6 +169,7 @@ export interface Profile {
   liquidGlassEnabled: boolean;
   planExerciseNotesVisible: boolean;
   exerciseNextNotes?: Record<string, string>;
+  favoriteExerciseIds?: string[];
   badgeUnlocks: Record<string, number>;
   ledgerBaseline?: OnboardingLedgerBaseline;
   recoveryWeeks: string[];
@@ -273,6 +274,7 @@ export const defaultProfile: Profile = {
   liquidGlassEnabled: true,
   planExerciseNotesVisible: true,
   exerciseNextNotes: {},
+  favoriteExerciseIds: [],
   badgeUnlocks: {},
   recoveryWeeks: [],
 };
diff --git a/web/src/features/ExerciseLibrary.tsx b/web/src/features/ExerciseLibrary.tsx
new file mode 100644
index 0000000..0561927
--- /dev/null
+++ b/web/src/features/ExerciseLibrary.tsx
@@ -0,0 +1,417 @@
+import { useEffect, useMemo, useState } from "react";
+import { useApp, navigate } from "../ui/context";
+import { Button, Icon, IconButton, Sheet } from "../ui/components";
+import { deleteCustomExercise, setExerciseFavorite } from "../data/store";
+import { queryExerciseSearch } from "../domain/exercise-search";
+import type { Exercise } from "../domain/types";
+import { ExercisePicker } from "./Plans";
+
+type Filters = {
+  scope: "all" | "favorites" | "custom";
+  muscle: string;
+  equipment: string;
+  category: string;
+  movementPattern: string;
+  difficulty: string;
+  bodyweight: boolean;
+};
+const emptyFilters: Filters = {
+  scope: "all",
+  muscle: "",
+  equipment: "",
+  category: "",
+  movementPattern: "",
+  difficulty: "",
+  bodyweight: false,
+};
+const title = (value: string) =>
+  value ? value[0].toUpperCase() + value.slice(1) : value;
+const normal = (value: string) =>
+  value
+    .replace(/([a-z])([A-Z])/g, "$1 $2")
+    .toLowerCase()
+    .replace(/[^a-z0-9]+/g, " ")
+    .trim();
+const equipmentTags = [
+  "Barbell",
+  "Dumbbell",
+  "Cable",
+  "Machine",
+  "Bodyweight",
+  "Band",
+  "Kettlebell",
+  "Other",
+];
+
+export function ExerciseLibrary() {
+  const { data, run, busy } = useApp();
+  const [query, setQuery] = useState("");
+  const [debounced, setDebounced] = useState("");
+  const [filters, setFilters] = useState<Filters>(emptyFilters);
+  const [showFilters, setShowFilters] = useState(false);
+  const [creating, setCreating] = useState(false);
+  const [deleting, setDeleting] = useState<Exercise>();
+  const [limit, setLimit] = useState(100);
+  useEffect(() => {
+    const timer = window.setTimeout(() => setDebounced(query), 180);
+    return () => window.clearTimeout(timer);
+  }, [query]);
+  useEffect(() => setLimit(100), [debounced, filters]);
+  const favorites = useMemo(
+    () => new Set(data.profile.favoriteExerciseIds ?? []),
+    [data.profile.favoriteExerciseIds],
+  );
+  const unavailable =
+    data.gyms.find((gym) => gym.id === data.profile.activeGymId)
+      ?.unavailableEquipment ?? [];
+  const options = useMemo(() => {
+    const values = (
+      key: "equipment" | "category" | "movementPattern" | "difficulty",
+    ) =>
+      [
+        ...new Set(
+          data.exercises
+            .map((ex) => ex[key]?.trim())
+            .filter((v): v is string => !!v),
+        ),
+      ].sort();
+    return {
+      muscle: [
+        ...new Set(
+          data.exercises
+            .flatMap((ex) => [
+              ex.muscle,
+              ...(ex.primaryMuscles ?? []),
+              ...(ex.secondaryMuscles ?? []),
+            ])
+            .filter(Boolean),
+        ),
+      ].sort(),
+      equipment: values("equipment").filter((value) =>
+        equipmentTags.some((tag) => normal(tag) === normal(value)),
+      ),
+      category: values("category"),
+      movementPattern: values("movementPattern"),
+      difficulty: ["beginner", "intermediate", "advanced", "expert"].filter(
+        (value) => values("difficulty").includes(value),
+      ),
+    };
+  }, [data.exercises]);
+  const list = queryExerciseSearch(
+    data.exercises.filter((ex) => {
+      const haystack = normal(
+        [
+          ex.name,
+          ex.muscle,
+          ...(ex.primaryMuscles ?? []),
+          ...(ex.secondaryMuscles ?? []),
+          ex.equipment,
+          ex.category ?? "",
+          ex.movementPattern ?? "",
+          ex.difficulty ?? "",
+        ].join(" "),
+      );
+      return (
+        (!filters.muscle || haystack.includes(normal(filters.muscle))) &&
+        (!filters.equipment ||
+          normal(ex.equipment) === normal(filters.equipment)) &&
+        (!filters.category ||
+          normal(ex.category ?? "") === normal(filters.category)) &&
+        (!filters.movementPattern ||
+          normal(ex.movementPattern ?? "") ===
+            normal(filters.movementPattern)) &&
+        (!filters.difficulty ||
+          normal(ex.difficulty ?? "") === normal(filters.difficulty)) &&
+        (!filters.bodyweight || ex.isBodyweight === true) &&
+        (filters.scope !== "favorites" || favorites.has(ex.id)) &&
+        (filters.scope !== "custom" || ex.custom === true) &&
+        !unavailable.some((value) => normal(value) === normal(ex.equipment))
+      );
+    }),
+    debounced,
+  ).sort(
+    (a, b) =>
+      Number(favorites.has(b.id)) - Number(favorites.has(a.id)) ||
+      a.name.localeCompare(b.name),
+  );
+  const activeFilters = Object.entries(filters).filter(([key, value]) =>
+    key === "scope" ? value !== "all" : !!value,
+  );
+  const recent = [
+    ...new Set(
+      data.workouts
+        .filter((workout) => workout.status === "completed")
+        .sort(
+          (a, b) =>
+            (b.completedAt ?? b.startedAt) - (a.completedAt ?? a.startedAt),
+        )
+        .flatMap((workout) => workout.exercises.map((ex) => ex.name)),
+    ),
+  ].slice(0, 5);
+  const canCreate =
+    !!query.trim() &&
+    !data.exercises.some((ex) => normal(ex.name) === normal(query));
+  const toggle = (key: keyof Filters, value: string | boolean) =>
+    setFilters((current) =>
+      key === "scope" && value === "all"
+        ? { ...current, scope: "all", bodyweight: false }
+        : {
+            ...current,
+            [key]: current[key] === value ? emptyFilters[key] : value,
+          },
+    );
+
+  return (
+    <section className="exercise-library">
+      <div className="library-toolbar">
+        <div className="library-active-filters">
+          {activeFilters.map(([key, value]) => {
+            const label =
+              key === "bodyweight" ? "BW Only" : title(String(value));
+            return (
+              <button
+                key={key}
+                className="library-chip active"
+                aria-label={`Remove ${label} filter`}
+                onClick={() =>
+                  setFilters((current) => ({
+                    ...current,
+                    [key]: emptyFilters[key as keyof Filters],
+                  }))
+                }
+              >
+                {label}
+                <Icon name="close" size={16} />
+              </button>
+            );
+          })}
+          {unavailable.length > 0 && (
+            <span className="library-gym-filter">Gym filtered</span>
+          )}
+          {!activeFilters.length && !unavailable.length && (
+            <span className="muted">All exercises</span>
+          )}
+        </div>
+        <Button
+          variant="secondary"
+          className={
+            activeFilters.length
+              ? "library-filter-button active"
+              : "library-filter-button"
+          }
+          onClick={() => setShowFilters(true)}
+        >
+          <Icon name="filter-list" size={18} />
+          Filters
+        </Button>
+      </div>
+      <div className="library-search">
+        <Icon name="search" size={18} />
+        <input
+          aria-label="Search exercises"
+          placeholder="Search exercises…"
+          value={query}
+          onChange={(event) => setQuery(event.target.value)}
+          maxLength={160}
+        />
+        {query && (
+          <IconButton
+            name="close"
+            label="Clear search"
+            onClick={() => setQuery("")}
+          />
+        )}
+      </div>
+      <div className="library-summary">
+        <p className="muted" aria-live="polite">
+          {list.length} exercise{list.length === 1 ? "" : "s"}
+        </p>
+        <Button variant="ghost" onClick={() => setCreating(true)}>
+          <Icon name="plus" size={18} />
+          Create custom exercise
+        </Button>
+      </div>
+      {!!recent.length && !debounced.trim() && !activeFilters.length && (
+        <div className="library-recent">
+          <span className="eyebrow">Recently used</span>
+          <div className="library-recent-chips">
+            {recent.map((name) => (
+              <button
+                className="library-chip"
+                key={name}
+                onClick={() => setQuery(name)}
+              >
+                {name}
+              </button>
+            ))}
+          </div>
+        </div>
+      )}
+      <div className="library-rows">
+        {list.slice(0, limit).map((ex) => (
+          <article className="library-row" key={ex.id}>
+            <button
+              className="library-exercise"
+              aria-label={`View progress for ${ex.name}`}
+              onClick={() => navigate(`exercise/${encodeURIComponent(ex.id)}`)}
+            >
+              <span className="library-name">
+                <strong>{ex.name}</strong>
+                {ex.custom && <span className="library-custom">Custom</span>}
+              </span>
+              <small>
+                {[ex.muscle, ex.equipment, title(ex.difficulty ?? "")]
+                  .filter(Boolean)
+                  .join(" · ")}
+              </small>
+            </button>
+            <div className="library-row-actions">
+              <IconButton
+                name={favorites.has(ex.id) ? "star-filled" : "star"}
+                label={`${favorites.has(ex.id) ? "Unfavorite" : "Favorite"} ${ex.name}`}
+                aria-pressed={favorites.has(ex.id)}
+                disabled={busy}
+                onClick={() =>
+                  void run(() =>
+                    setExerciseFavorite(ex.id, !favorites.has(ex.id)),
+                  )
+                }
+              />
+              {ex.custom && (
+                <IconButton
+                  name="delete-outline"
+                  label={`Delete ${ex.name}`}
+                  disabled={busy}
+                  onClick={() => setDeleting(ex)}
+                />
+              )}
+            </div>
+          </article>
+        ))}
+        {!list.length && (
+          <div className="empty">
+            <h2>No exercises found</h2>
+            <p className="muted">Try a different filter or search term.</p>
+          </div>
+        )}
+      </div>
+      {list.length > limit && (
+        <Button
+          variant="secondary"
+          className="library-more"
+          onClick={() => setLimit((current) => current + 100)}
+        >
+          Show more exercises ({list.length - limit} remaining)
+        </Button>
+      )}
+      {canCreate && (
+        <div className="library-missing">
+          <p className="muted">Can't find it?</p>
+          <Button variant="secondary" onClick={() => setCreating(true)}>
+            <Icon name="plus" />
+            Add exercise
+          </Button>
+        </div>
+      )}
+      {showFilters && (
+        <Sheet title="Filters" onClose={() => setShowFilters(false)}>
+          <fieldset className="choice-fieldset library-filter-group">
+            <legend>Scope</legend>
+            <div className="choice-chips">
+              {(["all", "favorites", "custom"] as const).map((scope) => (
+                <button
+                  key={scope}
+                  className={`library-chip ${filters.scope === scope && (scope !== "all" || !filters.bodyweight) ? "active" : ""}`}
+                  aria-pressed={filters.scope === scope && (scope !== "all" || !filters.bodyweight)}
+                  onClick={() => toggle("scope", scope)}
+                >
+                  {title(scope)}
+                </button>
+              ))}
+              <button
+                className={`library-chip ${filters.bodyweight ? "active" : ""}`}
+                aria-pressed={filters.bodyweight}
+                onClick={() => toggle("bodyweight", true)}
+              >
+                BW Only
+              </button>
+            </div>
+          </fieldset>
+          {(
+            [
+              ["muscle", "Muscle group"],
+              ["equipment", "Equipment"],
+              ["category", "Category"],
+              ["movementPattern", "Movement pattern"],
+              ["difficulty", "Difficulty"],
+            ] as const
+          ).map(
+            ([key, label]) =>
+              !!options[key].length && (
+                <fieldset className="choice-fieldset library-filter-group" key={key}>
+                  <legend>{label}</legend>
+                  <div className="choice-chips">
+                    {options[key].map((value) => (
+                      <button
+                        className={`library-chip ${filters[key] === value ? "active" : ""}`}
+                        aria-pressed={filters[key] === value}
+                        key={value}
+                        onClick={() => toggle(key, value)}
+                      >
+                        {title(value)}
+                      </button>
+                    ))}
+                  </div>
+                </fieldset>
+              ),
+          )}
+          <div className="library-filter-actions">
+            <Button variant="ghost" onClick={() => setFilters(emptyFilters)}>
+              Clear filters
+            </Button>
+            <Button onClick={() => setShowFilters(false)}>
+              Show exercises
+            </Button>
+          </div>
+        </Sheet>
+      )}
+      {creating && (
+        <ExercisePicker
+          createOnly
+          initialQuery={query}
+          onClose={() => setCreating(false)}
+          onPick={(ex) => {
+            setCreating(false);
+            setQuery(ex.name);
+            setFilters(emptyFilters);
+          }}
+        />
+      )}
+      {deleting && (
+        <Sheet
+          title={`Delete "${deleting.name}"?`}
+          onClose={() => setDeleting(undefined)}
+        >
+          <p>This will permanently remove this custom exercise.</p>
+          <Button
+            variant="danger"
+            disabled={busy}
+            onClick={() =>
+              void run(
+                () => deleteCustomExercise(deleting.id),
+                "Exercise deleted",
+              ).then((ok) => {
+                if (ok) setDeleting(undefined);
+              })
+            }
+          >
+            Delete exercise
+          </Button>
+          <Button variant="secondary" onClick={() => setDeleting(undefined)}>
+            Cancel
+          </Button>
+        </Sheet>
+      )}
+    </section>
+  );
+}
diff --git a/web/src/features/Plans.tsx b/web/src/features/Plans.tsx
index b546f58..0be206c 100644
--- a/web/src/features/Plans.tsx
+++ b/web/src/features/Plans.tsx
@@ -35,18 +35,22 @@ import templates from "../generated/templates.json";
 export function ExercisePicker({
   onPick,
   onClose,
+  initialQuery = "",
+  createOnly = false,
 }: {
   onPick: (e: Exercise) => void;
   onClose: () => void;
+  initialQuery?: string;
+  createOnly?: boolean;
 }) {
   const { data, run, busy } = useApp();
-  const [query, setQuery] = useState("");
+  const [query, setQuery] = useState(initialQuery);
   const [debouncedQuery, setDebouncedQuery] = useState("");
   useEffect(() => {
     const timer = window.setTimeout(() => setDebouncedQuery(query), 180);
     return () => window.clearTimeout(timer);
   }, [query]);
-  const [custom, setCustom] = useState(false);
+  const [custom, setCustom] = useState(createOnly);
   const [muscle, setMuscle] = useState("Chest");
   const [equipment, setEquipment] = useState("Barbell");
   const [tracking, setTracking] = useState<Tracking>("weight_reps");
@@ -163,7 +167,7 @@ export function ExercisePicker({
               });
             }}
           >
-            Create and select
+            {createOnly ? "Create exercise" : "Create and select"}
           </Button>
         </>
       ) : (
diff --git a/web/src/features/Settings.tsx b/web/src/features/Settings.tsx
index bf5d2aa..026fd7e 100644
--- a/web/src/features/Settings.tsx
+++ b/web/src/features/Settings.tsx
@@ -30,7 +30,6 @@ import {
   decodeWebBackup,
 } from "../domain/codecs";
 import type { AppSnapshot } from "../domain/types";
-import { ExercisePicker } from "./Plans";
 import { GymProfiles } from "./GymProfiles";
 import { basePlateSetup } from "../domain/gym-setup";
 import { loadCatalog } from "../catalog";
@@ -48,7 +47,6 @@ export function Settings() {
   const [confirm, setConfirm] = useState("");
   const [restore, setRestore] = useState<AppSnapshot>();
   const [warnings, setWarnings] = useState<string[]>([]);
-  const [library, setLibrary] = useState(false);
   const [gym, setGym] = useState(false);
   const [barEditor, setBarEditor] = useState(false);
   const [barDraft, setBarDraft] = useState("");
@@ -217,7 +215,7 @@ export function Settings() {
           <strong>Gym & plate setup</strong>
           <Icon name="next" />
         </button>
-        <button className="list-row" onClick={() => setLibrary(true)}>
+        <button className="list-row" onClick={() => navigate("library")}>
           <strong>Exercise library & custom exercises</strong>
           <Icon name="next" />
         </button>
@@ -460,12 +458,6 @@ export function Settings() {
           </Button>
         </Sheet>
       )}
-      {library && (
-        <ExercisePicker
-          onClose={() => setLibrary(false)}
-          onPick={() => setLibrary(false)}
-        />
-      )}
       {gym && <GymProfiles onClose={() => setGym(false)} />}
       {barEditor && <Sheet title="Default bar weight" onClose={() => setBarEditor(false)}>
         <Field label="Default bar weight (kg)">
diff --git a/web/src/styles.css b/web/src/styles.css
index 537d6c6..78ab96c 100644
--- a/web/src/styles.css
+++ b/web/src/styles.css
@@ -2350,6 +2350,41 @@ body.workout-reordering { cursor: grabbing; user-select: none; }
 .gym-palette button[aria-pressed=true] { outline: 2px solid var(--text); outline-offset: 2px; }
 .gym-actions { flex-wrap: wrap; }
 
+/* ExerciseLibraryScreen: native rows, scope chips, search and sheet controls. */
+.exercise-library { min-width: 0; }
+.detail-screen-title { font: inherit; font-weight: 800; text-transform: uppercase; margin: 0; }
+.library-toolbar { display: flex; align-items: center; gap: 8px; margin: 8px 0; }
+.library-active-filters { display: flex; flex: 1; min-width: 0; gap: 6px; align-items: center; overflow-x: auto; scrollbar-width: thin; }
+.library-chip { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 5px 10px; border: 1px solid var(--faint); border-radius: 20px; background: transparent; color: var(--muted); flex-shrink: 0; }
+.library-chip.active { color: var(--accent); background: var(--accentSoft); border-color: var(--accentBorder); font-weight: 700; }
+.library-gym-filter { color: var(--warning); font-weight: 700; white-space: nowrap; }
+.library-filter-button { padding: 8px 14px; min-width: 0; flex-shrink: 0; text-transform: uppercase; }
+.library-filter-button.active { color: var(--accent); border-color: var(--accentBorder); background: var(--accentSoft); }
+.library-search { display: flex; align-items: center; gap: 10px; padding: 4px 10px 4px 14px; background: var(--card); border: 1px solid var(--cardBorder); border-radius: 12px; }
+.library-search:focus-within { border-color: var(--accent); }
+.library-search > input { flex: 1; min-width: 0; border: 0; background: transparent; box-shadow: none; padding: 12px 0; }
+.library-search > input:focus { outline: none; }
+.library-search > .ironlog-icon { color: var(--muted); flex-shrink: 0; }
+.library-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px; }
+.library-summary p { margin: 8px 0; }
+.library-summary .button { padding: 8px 0; }
+.library-recent { display: grid; gap: 6px; padding: 10px 0; }
+.library-recent-chips { display: flex; gap: 8px; overflow-x: auto; }
+.library-row { display: flex; align-items: center; min-height: 72px; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--faint); }
+.library-exercise { border: 0; background: transparent; color: var(--text); padding: 0; flex: 1; min-width: 0; text-align: left; display: grid; gap: 2px; min-height: 44px; align-content: center; }
+.library-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
+.library-name strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
+.library-exercise small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.library-custom { font-size: .625rem; line-height: 1.4; letter-spacing: .03em; font-weight: 900; text-transform: uppercase; border: 1px solid var(--accentBorder); border-radius: 4px; padding: 2px 5px; color: var(--accent); background: var(--accentSoft); flex-shrink: 0; }
+.library-row-actions { display: flex; flex-direction: column; gap: 4px; }
+.library-row-actions .icon-button { width: 44px; height: 44px; min-width: 44px; color: var(--muted); }
+.library-row-actions .icon-button[aria-pressed=true] { color: var(--accent); }
+.library-row-actions .icon-button:has(.ironlog-icon-delete-outline) { color: var(--danger); }
+.library-filter-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
+.choice-fieldset.library-filter-group { margin-bottom: 16px; }
+.library-more { margin: 16px 0; width: 100%; }
+.library-missing { display: grid; justify-items: center; gap: 8px; padding: 16px; }
+
 @media (max-width: 380px) {
   .gym-stock-row { grid-template-columns: 44px minmax(0, 1fr) 44px; }
   .gym-stock-row > .gym-pairs { grid-column: 2; grid-row: 2; }
diff --git a/web/src/ui/components.tsx b/web/src/ui/components.tsx
index d6385b2..c3d0e64 100644
--- a/web/src/ui/components.tsx
+++ b/web/src/ui/components.tsx
@@ -16,6 +16,10 @@ export function Icon({ name, size = 22 }: { name: string; size?: number }) {
   // The Kotlin app uses Compose Outlined navigation and Filled gym controls.
   // Preserve their 24dp filled paths rather than approximating with strokes.
   const composePaths: Record<string, string> = {
+    "star-filled": "M12,17.27L18.18,21l-1.64,-7.03L22,9.24l-7.19,-0.61L12,2 9.19,8.63 2,9.24l5.46,4.73L5.82,21z",
+    star: "M22,9.24l-7.19,-0.62L12,2 9.19,8.63 2,9.24l5.46,4.73L5.82,21 12,17.27 18.18,21l-1.63,-7.03L22,9.24zM12,15.4l-3.76,2.27 1,-4.28 -3.32,-2.88 4.38,-0.38L12,6.1l1.71,4.04 4.38,0.38 -3.32,2.88 1,4.28L12,15.4z",
+    "filter-list": "M10,18h4v-2h-4v2zM3,6v2h18V6H3zM6,13h12v-2H6v2z",
+    "delete-outline": "M6,19c0,1.1 0.9,2 2,2h8c1.1,0 2,-0.9 2,-2V7H6v12zM8,9h8v10H8V9zM15.5,4l-1,-1h-5l-1,1H5v2h14V4z",
     "add-filled": "M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z",
     "remove-filled": "M19,13H5v-2h14v2z",
     "close-filled": "M19,6.41 17.59,5 12,10.59 6.41,5 5,6.41 10.59,12 5,17.59 6.41,19 12,13.41 17.59,19 19,17.59 13.41,12z",
diff --git a/web/src/ui/navigation.ts b/web/src/ui/navigation.ts
index 6b0e1be..9d28325 100644
--- a/web/src/ui/navigation.ts
+++ b/web/src/ui/navigation.ts
@@ -7,6 +7,7 @@ export const routeFromHash = (hash = window.location.hash) =>
   hash.replace(/^#\//, "") || "home";
 
 export function parentRoute(route: string): string {
+  if (route === "library") return "settings";
   if (route.startsWith("plan/")) return "plans";
   if (route.startsWith("history/")) return "log";
   if (route === "calendar") return "log";
diff --git a/web/tests/exercise-library-store.test.ts b/web/tests/exercise-library-store.test.ts
new file mode 100644
index 0000000..2255a91
--- /dev/null
+++ b/web/tests/exercise-library-store.test.ts
@@ -0,0 +1,135 @@
+import { beforeEach, expect, it, vi } from "vitest";
+import * as store from "../src/data/store";
+import {
+  decodeAndroidBackup,
+  encodeAndroidBackup,
+  decodeWebBackup,
+  encodeWebBackup,
+} from "../src/domain/codecs";
+import type { Exercise } from "../src/domain/types";
+
+const bench: Exercise = {
+  id: "bench",
+  name: "Bench Press",
+  muscle: "Chest",
+  equipment: "Barbell",
+  tracking: "weight_reps",
+};
+const custom: Exercise = {
+  ...bench,
+  id: "custom",
+  name: "My Press",
+  custom: true,
+};
+beforeEach(async () => {
+  await store.db.delete();
+  await store.db.open();
+  await store.bootstrap([bench]);
+});
+it("rejects normalized duplicate custom names even for concurrent creates", async () => {
+  await expect(
+    store.saveExercise({ ...custom, name: " bench--press " }),
+  ).rejects.toThrow(/already exists/i);
+  const results = await Promise.allSettled([
+    store.saveExercise(custom),
+    store.saveExercise({ ...custom, id: "other", name: "MY PRESS" }),
+  ]);
+  expect(results.filter((r) => r.status === "fulfilled")).toHaveLength(1);
+  expect(
+    (await store.readSnapshot()).exercises.filter((e) => e.custom),
+  ).toHaveLength(1);
+  await expect(
+    store.saveExercise({ ...custom, id: "blank", name: "   " }),
+  ).rejects.toThrow(/name/i);
+});
+it("atomically changes one favorite without overwriting another tab's changes and round-trips native settings", async () => {
+  await store.saveExercise(custom);
+  await Promise.all([
+    store.setExerciseFavorite(bench.id, true),
+    store.setExerciseFavorite(custom.id, true),
+  ]);
+  await store.setExerciseFavorite(bench.id, false);
+  const snapshot = await store.readSnapshot();
+  expect(snapshot.profile.favoriteExerciseIds).toEqual([custom.id]);
+  expect(
+    (await decodeWebBackup(await encodeWebBackup(snapshot))).profile
+      .favoriteExerciseIds,
+  ).toEqual([custom.id]);
+  const native = JSON.parse(encodeAndroidBackup(snapshot));
+  expect(
+    JSON.parse(
+      native.data.app_settings.find((s: any) => s.key === "favorite_exercises")
+        .value,
+    ),
+  ).toEqual([custom.id]);
+  delete native.webExtension;
+  expect(
+    decodeAndroidBackup(JSON.stringify(native)).snapshot.profile
+      .favoriteExerciseIds,
+  ).toEqual([custom.id]);
+});
+it("protects bundled, planned and logged references including name-only imported references", async () => {
+  await store.saveExercise(custom);
+  await expect(store.deleteCustomExercise(bench.id)).rejects.toThrow(
+    /built-in/i,
+  );
+  const plan = {
+    id: "p",
+    name: "Plan",
+    description: "",
+    goal: "Strength",
+    order: 0,
+    days: [
+      {
+        id: "d",
+        name: "Day",
+        color: "#f00",
+        exercises: [
+          {
+            id: "slot",
+            exerciseId: custom.id,
+            name: custom.name,
+            sets: 3,
+            reps: "10",
+            restSeconds: 90,
+            notes: "",
+            supersetGroup: "",
+            isWarmup: false,
+          },
+        ],
+      },
+    ],
+  };
+  await store.savePlan(plan);
+  await expect(store.deleteCustomExercise(custom.id)).rejects.toThrow(/plan/i);
+  const workout = await store.startWorkout(plan.id, "d");
+  await store.db.plans.delete(plan.id);
+  await store.db.workouts.update(workout.id, { status: "completed" });
+  await expect(store.deleteCustomExercise(custom.id)).rejects.toThrow(
+    /workout/i,
+  );
+  const row = (await store.db.workouts.get(workout.id))!;
+  row.exercises[0].exerciseId = "";
+  await store.db.workouts.put(row);
+  await expect(store.deleteCustomExercise(custom.id)).rejects.toThrow(
+    /workout/i,
+  );
+  expect((await store.readSnapshot()).exercises).toContainEqual(custom);
+});
+it("deletes restored custom entries without resurrection and rolls back favorite cleanup on failure", async () => {
+  await store.db.catalog.put({ id: "restored", exercises: [custom] });
+  await store.setExerciseFavorite(custom.id, true);
+  const spy = vi
+    .spyOn(store.db.profiles, "put")
+    .mockRejectedValueOnce(Error("disk failed"));
+  await expect(store.deleteCustomExercise(custom.id)).rejects.toThrow(
+    "disk failed",
+  );
+  spy.mockRestore();
+  expect((await store.readSnapshot()).exercises).toContainEqual(custom);
+  await store.deleteCustomExercise(custom.id);
+  await store.bootstrap([bench]);
+  const snapshot = await store.readSnapshot();
+  expect(snapshot.exercises.some((e) => e.id === custom.id)).toBe(false);
+  expect(snapshot.profile.favoriteExerciseIds).toEqual([]);
+});
diff --git a/web/tests/exercise-library-ui.test.tsx b/web/tests/exercise-library-ui.test.tsx
new file mode 100644
index 0000000..5ed62da
--- /dev/null
+++ b/web/tests/exercise-library-ui.test.tsx
@@ -0,0 +1,285 @@
+import {
+  cleanup,
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+  within,
+} from "@testing-library/react";
+import { afterEach, beforeEach, expect, it } from "vitest";
+import { App } from "../src/App";
+import {
+  bootstrap,
+  db,
+  readSnapshot,
+  saveExercise,
+  saveProfile,
+  saveGym,
+  savePlan,
+} from "../src/data/store";
+import type { Exercise } from "../src/domain/types";
+const bench: Exercise = {
+  id: "bench",
+  name: "Bench Press",
+  muscle: "Chest",
+  equipment: "Barbell",
+  tracking: "weight_reps",
+  secondaryMuscles: ["Triceps"],
+  category: "strength",
+  difficulty: "beginner",
+  movementPattern: "push",
+};
+const row: Exercise = {
+  ...bench,
+  id: "row",
+  name: "Cable Row",
+  muscle: "Back",
+  equipment: "Cable",
+  secondaryMuscles: [],
+  difficulty: "advanced",
+  movementPattern: "pull",
+};
+afterEach(cleanup);
+beforeEach(async () => {
+  await db.delete();
+  await db.open();
+  await bootstrap([bench, row]);
+  await saveProfile({ onboarded: true });
+  window.history.replaceState(null, "", "#/settings");
+});
+async function openLibrary() {
+  render(<App />);
+  fireEvent.click(await screen.findByRole("button", { name: /^Training/ }));
+  fireEvent.click(
+    screen.getByRole("button", { name: /Exercise library & custom exercises/ }),
+  );
+  return screen.findByRole("heading", { name: "Exercise library" });
+}
+it("opens a separate library destination and persists favorites without dismissing the screen", async () => {
+  await openLibrary();
+  expect(window.location.hash).toBe("#/library");
+  fireEvent.click(screen.getByRole("button", { name: "Favorite Bench Press" }));
+  await screen.findByRole("button", { name: "Unfavorite Bench Press" });
+  expect((await readSnapshot()).profile.favoriteExerciseIds).toEqual(["bench"]);
+  fireEvent.click(screen.getByRole("button", { name: "Filters" }));
+  fireEvent.click(
+    within(screen.getByRole("dialog", { name: "Filters" })).getByRole(
+      "button",
+      { name: "Favorites" },
+    ),
+  );
+  fireEvent.click(screen.getByRole("button", { name: "Show exercises" }));
+  expect(
+    screen.getByRole("button", { name: "View progress for Bench Press" }),
+  ).toBeVisible();
+  expect(
+    screen.queryByRole("button", { name: "View progress for Cable Row" }),
+  ).not.toBeInTheDocument();
+});
+it("combines secondary muscle and difficulty filters, clears them and respects active gym exclusion", async () => {
+  await saveGym(
+    {
+      id: "gym",
+      name: "Gym",
+      barKg: 20,
+      platesKg: [10],
+      unavailableEquipment: ["Cable"],
+    },
+    true,
+  );
+  await openLibrary();
+  expect(
+    screen.queryByRole("button", { name: "View progress for Cable Row" }),
+  ).not.toBeInTheDocument();
+  fireEvent.click(screen.getByRole("button", { name: "Filters" }));
+  const dialog = screen.getByRole("dialog", { name: "Filters" });
+  fireEvent.click(within(dialog).getByRole("button", { name: "Triceps" }));
+  fireEvent.click(within(dialog).getByRole("button", { name: "Beginner" }));
+  fireEvent.click(
+    within(dialog).getByRole("button", { name: "Show exercises" }),
+  );
+  expect(screen.getByText("1 exercise")).toBeVisible();
+  expect(
+    screen.getByRole("button", { name: "Remove Triceps filter" }),
+  ).toBeVisible();
+  fireEvent.click(screen.getByRole("button", { name: "Filters" }));
+  fireEvent.click(screen.getByRole("button", { name: "Clear filters" }));
+  fireEvent.click(screen.getByRole("button", { name: "Show exercises" }));
+  expect(
+    screen.queryByRole("button", { name: "Remove Triceps filter" }),
+  ).not.toBeInTheDocument();
+  expect(screen.getByText("Gym filtered")).toBeVisible();
+});
+it("reaches results beyond the old 50-row limit and follows native progress navigation", async () => {
+  await bootstrap(
+    Array.from({ length: 151 }, (_, i) => ({
+      ...bench,
+      id: `ex-${i}`,
+      name: `Exercise ${String(i).padStart(3, "0")}`,
+    })),
+  );
+  await openLibrary();
+  expect(screen.getByText("151 exercises")).toBeVisible();
+  fireEvent.click(screen.getByRole("button", { name: /Show more exercises/ }));
+  fireEvent.click(
+    screen.getByRole("button", { name: "View progress for Exercise 150" }),
+  );
+  await waitFor(() => expect(window.location.hash).toBe("#/exercise/ex-150"));
+  expect(
+    await screen.findByRole("heading", {
+      name: "No data for this exercise yet",
+    }),
+  ).toBeVisible();
+});
+it("confirms custom deletion and keeps the library open, while built-ins have no delete control", async () => {
+  await saveExercise({
+    ...bench,
+    id: "custom",
+    name: "My Press",
+    custom: true,
+  });
+  await openLibrary();
+  expect(
+    screen.queryByRole("button", { name: "Delete Bench Press" }),
+  ).not.toBeInTheDocument();
+  fireEvent.click(screen.getByRole("button", { name: "Delete My Press" }));
+  expect((await readSnapshot()).exercises.some((e) => e.id === "custom")).toBe(
+    true,
+  );
+  fireEvent.click(screen.getByRole("button", { name: "Delete exercise" }));
+  await waitFor(() =>
+    expect(screen.queryByRole("dialog")).not.toBeInTheDocument(),
+  );
+  expect(
+    screen.queryByRole("button", { name: "Delete My Press" }),
+  ).not.toBeInTheDocument();
+  expect(
+    screen.getByRole("heading", { name: "Exercise library" }),
+  ).toBeVisible();
+});
+it("shows referenced deletion failure and retains the confirmation and exercise", async () => {
+  await saveExercise({
+    ...bench,
+    id: "custom",
+    name: "My Press",
+    custom: true,
+  });
+  await savePlan({
+    id: "p",
+    name: "Plan",
+    description: "",
+    goal: "Strength",
+    order: 0,
+    days: [
+      {
+        id: "d",
+        name: "Day",
+        color: "#f00",
+        exercises: [
+          {
+            id: "slot",
+            exerciseId: "custom",
+            name: "My Press",
+            sets: 3,
+            reps: "10",
+            restSeconds: 90,
+            notes: "",
+            supersetGroup: "",
+            isWarmup: false,
+          },
+        ],
+      },
+    ],
+  });
+  await openLibrary();
+  fireEvent.click(screen.getByRole("button", { name: "Delete My Press" }));
+  fireEvent.click(screen.getByRole("button", { name: "Delete exercise" }));
+  expect(
+    await within(screen.getByRole("dialog")).findByRole("alert"),
+  ).toHaveTextContent("used in a plan");
+  expect(screen.getByRole("dialog")).toBeVisible();
+  expect((await readSnapshot()).exercises.some((e) => e.id === "custom")).toBe(
+    true,
+  );
+});
+it("creates an unmatched search as a custom exercise without selecting or closing the library", async () => {
+  await openLibrary();
+  fireEvent.change(screen.getByLabelText("Search exercises"), {
+    target: { value: "Athlete custom press" },
+  });
+  fireEvent.click(screen.getByRole("button", { name: "Add exercise" }));
+  expect(screen.getByLabelText("Exercise name")).toHaveValue(
+    "Athlete custom press",
+  );
+  fireEvent.click(screen.getByRole("button", { name: "Create exercise" }));
+  await waitFor(() =>
+    expect(screen.queryByRole("dialog")).not.toBeInTheDocument(),
+  );
+  expect(
+    await screen.findByRole("button", { name: "Delete Athlete custom press" }),
+  ).toBeVisible();
+  expect(
+    (await readSnapshot()).exercises.find(
+      (e) => e.name === "Athlete custom press",
+    )?.custom,
+  ).toBe(true);
+  expect(window.location.hash).toBe("#/library");
+});
+it("All scope clears the BW-only restriction as in Kotlin", async () => {
+  await openLibrary();
+  fireEvent.click(screen.getByRole("button", { name: "Filters" }));
+  const dialog = screen.getByRole("dialog", { name: "Filters" });
+  fireEvent.click(within(dialog).getByRole("button", { name: "BW Only" }));
+  expect(within(dialog).getByRole("button", { name: "All" })).toHaveAttribute("aria-pressed", "false");
+  fireEvent.click(
+    within(dialog).getByRole("button", { name: "All" }),
+  );
+  expect(
+    within(dialog).getByRole("button", { name: "BW Only" }),
+  ).toHaveAttribute("aria-pressed", "false");
+  fireEvent.click(
+    within(dialog).getByRole("button", { name: "Show exercises" }),
+  );
+  expect(screen.getByText("2 exercises")).toBeVisible();
+});
+it("uses the latest completed workout names as recent search chips", async () => {
+  await db.workouts.put({
+    id: "w",
+    name: "Session",
+    startedAt: 1,
+    completedAt: 2,
+    status: "completed",
+    notes: "",
+    restUsed: false,
+    revision: 1,
+    exercises: [
+      {
+        id: "slot",
+        exerciseId: bench.id,
+        name: bench.name,
+        sets: 3,
+        reps: "10",
+        restSeconds: 90,
+        notes: "",
+        supersetGroup: "",
+        isWarmup: false,
+        tracking: "weight_reps",
+        muscle: "Chest",
+        equipment: "Barbell",
+        pendingWarmups: [],
+        loggedSets: [],
+      },
+    ],
+  });
+  await openLibrary();
+  fireEvent.click(
+    screen.getByRole("button", { name: "Bench Press" }),
+  );
+  expect(screen.getByLabelText("Search exercises")).toHaveValue("Bench Press");
+  await waitFor(() =>
+    expect(
+      screen.queryByRole("button", { name: "View progress for Cable Row" }),
+    ).not.toBeInTheDocument(),
+  );
+});
+
diff --git a/web/tests/navigation-parity.test.ts b/web/tests/navigation-parity.test.ts
index 5132835..79b90bc 100644
--- a/web/tests/navigation-parity.test.ts
+++ b/web/tests/navigation-parity.test.ts
@@ -13,6 +13,7 @@ describe("native-style web navigation", () => {
 
   it.each([
     ["plan/strength", "plans"],
+    ["library", "settings"],
     ["history/workout-1", "log"],
     ["body", "stats"],
     ["photos", "stats"],