Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Gallery search and filters stop working after you come back to /templates through a site link

Chiusa
#151 4 commenti 0 reazioni 1 assegnatario Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@prakashNalla ci sta già lavorando.

Dal 20/10/2026.

  • #156 di @prakashNalla — integrata

Valutazione

Questa issue non è ancora stata valutata.

Descrizione

bug good first issue hacktoberfest ui

The gallery's search box and category pills stop working once you come back to /templates through a link on the site. On https://og.codercops.com:

  1. Open /templates. Typing "dark" filters the gallery, and the GitHub pill shows 10 templates.
  2. Click "Preview" in the header, then "Templates".
  3. Type "dark" or click a category pill. All 110 templates stay on screen, the "Showing" line doesn't change, and there's no error in the console.

The site uses Astro's <ClientRouter /> (src/layouts/Layout.astro, line 75), so links inside the site swap the page without a full reload. The router runs each script once until the next full reload: it remembers scripts by their text and skips any it has already run, unless the script has data-astro-rerun. The gallery's code is a top-level <script is:inline> (src/pages/templates.astro, lines 80 to 163), so the second time the page is shown, nothing attaches listeners to the new search box and pills, and ?q= and ?category= aren't read either.

What to do

  • Put the gallery setup in a function and run it on astro:page-load, which fires on the first load and after every navigation. Layout.astro does this for the scroll animations (line 107).
  • The event fires on every page, so return early when the gallery isn't on the page.
  • Attach the listeners once per visit to /templates, not once more for every navigation.
  • If you'd rather add data-astro-rerun, wrap the code in a function first: run twice, the script's top-level consts would be declared twice and it would throw.
  • Keep the search matching names, descriptions and tags (#147), and keep ?q= and ?category= working.

Where to look

  • src/pages/templates.astro: the script at lines 80 to 163
  • src/layouts/Layout.astro: <ClientRouter /> (line 75) and the astro:page-load listener (line 107)
  • src/components/Header.astro (line 11) and src/components/Footer.astro (line 20) link to /templates

Acceptance criteria

  • After going from /templates to another page and back with the header or footer link, the search box and the category pills filter the gallery, and the "Showing" line updates
  • Going back and forth several times still works, without adding another set of listeners each time
  • Opening /templates?q=dark&category=github directly still applies both
  • npm run check, npm run test and npm run build pass
  • The PR says how you tested the navigation in a browser with npm run dev

Want to work on this? Comment below and I'll assign it to you. Please take one issue at a time, branch off dev, and open your PR against dev with Closes #<this issue number>.

Lingua principale
TypeScript
Stelle
8
Fork
4
Merge medio
6h 9m
PR unite (30g)
66

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di codercops/ogcops

Tutte le issue di codercops/ogcops

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.