Hacktoberfest 2026:维护者为十月标记出来的 issue,仍然开放、适合新手。 浏览 Hacktoberfest issue

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

未关闭
#151 4 条评论 0 个 reaction 已指派 1 人 在 GitHub 查看

维护者通常 1 天内回复

@prakashNalla 已经在做这个了。

开始于 2026年10月20日。

评估

这个 Issue 还没有评估数据。

描述

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>.

主要语言
TypeScript
星标
8
派生
4
平均合并
6 小时 37 分钟
30 天内合并 PR
58

环境准备

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

codercops/ogcops 的其他 Issue

查看 codercops/ogcops 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。