fix(web): keep resume search local (#3510)

This commit is contained in:
Emanuele Tonello
2026-09-17 00:14:42 +02:00
committed by GitHub
parent b42eb6ec06
commit 2a2d08a8d2
@@ -12,7 +12,7 @@ import {
} from "@phosphor-icons/react";
import { useQuery } from "@tanstack/react-query";
import { createFileRoute, Link, stripSearchParams, useNavigate } from "@tanstack/react-router";
import { useMemo } from "react";
import { useMemo, useState } from "react";
import z from "zod";
import { Button } from "@reactive-resume/ui/components/button";
import { InputGroup, InputGroupAddon, InputGroupInput } from "@reactive-resume/ui/components/input-group";
@@ -31,7 +31,6 @@ import { resumeViewSchema, useResumeView } from "./-components/view-mode";
type SortOption = "lastUpdatedAt" | "createdAt" | "name";
const searchSchema = z.object({
search: z.string().default(""),
tags: z.array(z.string()).default([]),
sort: z.enum(["lastUpdatedAt", "createdAt", "name"]).default("lastUpdatedAt"),
view: resumeViewSchema.optional().catch(undefined),
@@ -39,7 +38,7 @@ const searchSchema = z.object({
type Search = z.output<typeof searchSchema>;
const defaultSearch: Search = { search: "", tags: [], sort: "lastUpdatedAt" };
const defaultSearch: Search = { tags: [], sort: "lastUpdatedAt" };
export const Route = createFileRoute("/dashboard/resumes/")({
component: RouteComponent,
@@ -51,7 +50,8 @@ export const Route = createFileRoute("/dashboard/resumes/")({
function RouteComponent() {
const { i18n } = useLingui();
const { search, tags, sort, view: searchView } = Route.useSearch();
const { tags, sort, view: searchView } = Route.useSearch();
const [searchQuery, setSearchQuery] = useState("");
const { session } = Route.useRouteContext();
const view = useResumeView(searchView, session.user.id);
const navigate = useNavigate({ from: Route.fullPath });
@@ -62,12 +62,12 @@ function RouteComponent() {
const filteredResumes = useMemo(() => {
const list = resumes ?? [];
const query = search.trim().toLowerCase();
const query = searchQuery.trim().toLowerCase();
if (!query) return list;
return list.filter(
(resume) => resume.name.toLowerCase().includes(query) || resume.slug.toLowerCase().includes(query),
);
}, [resumes, search]);
}, [resumes, searchQuery]);
const tagOptions = useMemo(() => {
if (!allTags) return [];
@@ -146,12 +146,9 @@ function RouteComponent() {
<MagnifyingGlassIcon />
</InputGroupAddon>
<InputGroupInput
value={search}
value={searchQuery}
placeholder={t`Search resumes...`}
onChange={(event) => {
const value = event.target.value;
void navigate({ search: (prev: Search) => ({ ...prev, search: value }) });
}}
onChange={(event) => setSearchQuery(event.target.value)}
/>
</InputGroup>
)}