[refactor] migrate feasible app page components from Client to Server for SEO by Copilot · Pull Request #9 · GoodAction-Hub/GoodAction-Hub.github.io

Copilot · 2026-06-06T23:42:41Z

This PR addresses SEO for the three list surfaces by moving rendering/filtering state into URL-driven server pages. It also standardizes pagination to URL parameters with a 10-item page size and visible page links at the end of each list, fully unifies translation handling on mobx-i18n, and converts the remaining feasible app page entrypoints from client rendering to server rendering.

Scope (issue requirements)
- Convert list pages to server-rendered components.
- Switch list search to same-page GET form submissions.
- Add URL-param pagination in units of 10 with centered page links.
- Convert additional feasible client-rendered page entrypoints to server rendering when page-level client state is unnecessary.
Server-rendered list pages
- Reworked:
  - app/activities/page.tsx
  - app/restaurants/page.tsx
  - app/tutoring/page.tsx
- Pages now read searchParams on the server, compute filtered datasets, and slice results by page.
- SSR language selection now normalizes cookie/query/header inputs and loads language maps through mobx-i18n, including async fallback loading.
Additional server-rendered app pages
- Reworked:
  - app/home/page.tsx
  - app/origin/page.tsx
  - app/recommend/page.tsx
- /home and /origin now resolve translations on the server instead of keeping the page entrypoints client-only.
- /recommend now reads keywords from server searchParams, loads recommendation data on the server, and renders recommendation results without a client-page bootstrap.
- The aggregation search UI was adjusted to accept server-provided translated labels so it can be rendered from server pages.
URL-driven search + filtering
- Replaced client-local search state with GET forms:
  - /activities?keywords=...
  - /restaurants?keywords=...&filter=...
  - /tutoring?keywords=...&tag=...
  - /recommend?keywords=...
- Filter/tag interactions now generate navigable links so state is crawlable/shareable.
Pagination behavior
- Introduced shared pagination helpers in lib/pagination.ts.
- Uses the upstream MobX-RESTful-Shadcn pager via install-generated files under components/ui/mobx-restful-shadcn/pager/, while keeping the external component source itself out of Git.
- All three list pages now use:
  - PAGE_SIZE = 10
  - pageIndex query param
  - centered numbered links + prev/next controls
Data access alignment
- Added fetchActivitiesCatalog() in lib/activities.ts and reused it in activities list/detail, /api/data, and /recommend to keep fetch behavior consistent.
Client i18n unification
- Replaced the remaining i18next / react-i18next client integration with mobx-i18n context-based injection.
- Migrated locale resources into MobX-i18n TypeScript translation maps and kept async loading for non-default languages.
- Removed the hook-based translation helper so the infrastructure remains usable from class components.
- Initializes the shared client i18n context with statically loaded zh-CN as the default language map.
- Switching language now refreshes the current page so updated cookies are reflected by SSR immediately.

<form action="/tutoring" method="get">
  <input name="keywords" defaultValue={keywords} />
  {selectedTag && <input type="hidden" name="tag" value={selectedTag} />}
  <button type="submit">搜索</button>
</form>

// URL shape: /tutoring?keywords=数学&tag=小学&pageIndex=2

Human changes

[refactor] simplify Source Code with MobX-i18n & MobX-RESTful-Shadcn
[add] Traditional Chinese translation data
[optimize] update i18n data & simplify i18n SSR bootstrap
[optimize] upgrade to amondnet/vercel-action 42 & other latest Upstream packages/actions

TechQuery

先合并主分支最新代码，再通篇修改以下建议。

…nhub

[add] Traditional Chinese translation data [optimize] update Upstream packages

Copilot

Pull request overview

This PR aims to improve SEO and shareability of the three “list” surfaces by moving search/filter/pagination state into URL-driven server-rendered pages, and by adding SSR language selection/fallback for list-page UI text.

Changes:

Reworked /activities, /restaurants, and /tutoring list pages to be server components with GET-based search and URL pagination (page size = 10).
Introduced SSR language loading via mobx-i18n + new translation maps for zh-CN, zh-TW, and en-US.
Aligned activities data fetching by adding fetchActivitiesCatalog() and reusing it in the API route and activities pages.

Reviewed changes

Copilot reviewed 20 out of 22 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
public/locales/zh-TW/translation.json	Adds Traditional Chinese i18next translation namespace data.
public/locales/zh-TW/common.json	Adds Traditional Chinese i18next common namespace data.
package.json	Updates scripts/deps; introduces shadcn-helper install hook and dependency upgrades.
lib/pagination.ts	Adds shared page parsing + visible page calculation helpers.
lib/activities.ts	Adds `fetchActivitiesCatalog()` to centralize activities fetch behavior.
i18n/zh-TW.ts	Adds SSR translation map for Traditional Chinese.
i18n/zh-CN.ts	Adds SSR translation map for Simplified Chinese.
i18n/en-US.ts	Adds SSR translation map for English (US).
i18n/index.ts	Adds SSR i18n store + cookie/header/query language loading.
i18n/config.ts	Extends client i18next config to support zh-TW and formatting tweaks.
eslint.config.ts	Adds React version setting and keeps existing TS-eslint rule override.
components/index.ini	Declares a shadcn registry component to be installed (pager).
components.json	Adds a custom shadcn registry URL.
app/tutoring/page.tsx	Converts tutoring list to SSR with GET search + URL tag selection + pagination.
app/tutoring/[slug]/page.tsx	Adds SSR i18n text usage in tutoring detail page.
app/restaurants/page.tsx	Converts restaurants list to SSR with GET search + URL filter + pagination.
app/restaurants/[id]/page.tsx	Adds SSR i18n text usage in restaurant detail page.
app/api/data/route.ts	Uses `fetchActivitiesCatalog()` for consistent upstream fetch behavior.
app/activities/page.tsx	Converts activities list to SSR with GET search + pagination and SSR locale loading.
app/activities/[id]/page.tsx	Uses `fetchActivitiesCatalog()` + SSR i18n text usage in activity detail page.
.gitignore	Ignores `components/ui/` (shadcn UI components).

Comments suppressed due to low confidence (1)

app/api/data/route.ts:14

fetchActivitiesCatalog() now throws on upstream fetch errors, but the API route catches everything and returns HTTP 500. Previously, upstream fetch failures returned 502 (bad gateway), which more accurately signals an upstream dependency issue. Consider preserving 502 for fetch failures so monitoring/clients can distinguish upstream vs server errors.

export async function GET() {
  try {
    const externalData = await fetchActivitiesCatalog();
    const data = externalData.map(transformItem);
    return NextResponse.json(data);
  } catch (err) {
    console.error('Failed to fetch data from external API:', err);
    return NextResponse.json({ error: 'Failed to load data' }, { status: 500 });
  }

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

+export function parsePage(rawPage?: string): number {
+  const parsed = Number.parseInt(rawPage ?? '1', 10);
+  return Number.isFinite(parsed) && parsed > 0 ? parsed : 1;
+}


TechQuery

完全使用 mobx-i18n 替代 i18next

Copilot · 2026-06-15T18:47:57Z

@copilot 每次让你通篇改是要你搜索类似的模式，你要理解它是个什么概念，而不是单纯查找相似的字符串！

已在 25972e1 按“理解概念而不是只搜字符串”的方式继续收口：把剩余两个带 props 的 observer 组件统一成同一套 FC<Props> 声明风格，并把还漏掉的导入分组顺序一并改齐；npm run test、npm run build、Code Review 和 CodeQL 已通过。

Co-authored-by: South Drifter <shiy2008@gmail.com>

[optimize] upgrade to amondnet/vercel-action 42

TechQuery · 2026-06-16T02:26:44Z

@copilot 把所有客户端渲染的页面尽可能改成服务端渲染，实在有困难的就先不改。

Copilot · 2026-06-16T02:34:55Z

@copilot 把所有客户端渲染的页面尽可能改成服务端渲染，实在有困难的就先不改。

已在 968a32b 尽量把客户端渲染页面改成服务端渲染：/home、/origin、/recommend 都已改为服务端页面，交互仅下沉到必要的子组件；npm run test、npm run build、CodeQL 已通过。

TechQuery

@copilot 通篇改

TechQuery · 2026-06-16T02:40:53Z

+interface AggregationProps {
+  searchLabel: string;
+  searchPlaceholder: string;
+  searchAriaLabel: string;
+}


用 Record 泛型

TechQuery · 2026-06-16T02:42:02Z

+export const Aggregation = ({
+  searchLabel,
+  searchPlaceholder,
+  searchAriaLabel,
+}: AggregationProps) => {
  return (


Suggested change

export const Aggregation = ({

searchLabel,

searchPlaceholder,

searchAriaLabel,

}: AggregationProps) => {

return (

export const Aggregation: FC<AggregationProps> = ({

searchLabel,

searchPlaceholder,

searchAriaLabel,

}) => (

TechQuery · 2026-06-16T02:43:13Z

        <Select.Content className="rounded-lg border border-slate-200 bg-white shadow-lg z-50">
          <Select.Viewport className="p-1">
-            {Object.entries(supportedLngDisplayNames).map(([lng, label]) => (
+            {Object.entries(LanguageName).map(([lng, label]) => (


Suggested change

{Object.entries(LanguageName).map(([lng, label]) => (

{Object.entries(LanguageName).map(([language, label]) => (

Copilot · 2026-06-16T02:47:27Z

@copilot 通篇改

已在 08feb3b 按这轮“通篇改”继续收口：Aggregation 改成 Record 泛型 + FC<Props> 简洁写法，SwitchLanguage 的语言项遍历也统一成显式 language 命名；npm run test、npm run build 和本轮 Code Review / CodeQL 已通过。

Initial plan

535e663

Copilot AI assigned Copilot and TechQuery Jun 6, 2026

Copilot AI linked an issue Jun 6, 2026 that may be closed by this pull request

对 GoodActionHub 进行 SEO #8

Closed

Copilot started work on behalf of TechQuery June 6, 2026 23:42 View session

TechQuery added the feature New feature or request label Jun 6, 2026

Copilot AI added 2 commits June 6, 2026 23:48

feat: server render list pages with URL search pagination

6667edb

refactor: share pagination helpers and tighten list filter parsing

36e2d2d

Copilot AI changed the title ~~[WIP] Implement SEO improvements for GoodActionHub~~ SEO: server-render list pages, GET-based search, and URL pagination (size=10) Jun 6, 2026

Copilot AI requested a review from TechQuery June 6, 2026 23:58

Copilot finished work on behalf of TechQuery June 6, 2026 23:58

TechQuery requested changes Jun 7, 2026

View reviewed changes

Copilot started work on behalf of TechQuery June 7, 2026 21:16 View session

Copilot AI added 2 commits June 7, 2026 21:17

Merge remote-tracking branch 'origin/main' into copilot/seo-goodactio…

fb5d908

…nhub

chore: address review feedback on server list pages

4d6b6e0

Copilot AI changed the title ~~SEO: server-render list pages, GET-based search, and URL pagination (size=10)~~ SEO: server-render list pages, GET-based search, URL pagination (size=10), and SSR locale fallback Jun 7, 2026

Copilot finished work on behalf of TechQuery June 7, 2026 21:25

Copilot AI requested a review from TechQuery June 7, 2026 21:25

[refactor] simplify Source Code with MobX-i18n & MobX-RESTful-Shadcn

e5930b9

[add] Traditional Chinese translation data [optimize] update Upstream packages

TechQuery marked this pull request as ready for review June 8, 2026 00:54

Copilot AI review requested due to automatic review settings June 8, 2026 00:54

Copilot started reviewing on behalf of TechQuery June 8, 2026 00:54 View session

Copilot AI reviewed Jun 8, 2026

View reviewed changes

[migrate] replace Bun with PNPM for compatibility

17f423d

go165 mentioned this pull request Jun 13, 2026

SEO: server-render list pages with GET search pagination #10

Closed

TechQuery added 2 commits June 13, 2026 20:43

[fix] Parameter Name of Search Keyword

479c328

[fix] rollback Activity page filter

2a79bfd

TechQuery requested changes Jun 13, 2026

View reviewed changes

Copilot started work on behalf of TechQuery June 13, 2026 21:21 View session

Copilot finished work on behalf of TechQuery June 13, 2026 21:22

Align remaining review patterns

25972e1

Copilot finished work on behalf of TechQuery June 15, 2026 18:48

Copilot AI requested a review from TechQuery June 15, 2026 18:48

Apply suggestions from code review

95cea06

Co-authored-by: South Drifter <shiy2008@gmail.com>

TechQuery approved these changes Jun 15, 2026

View reviewed changes

[fix] Server starting bugs

9da085c

[optimize] upgrade to amondnet/vercel-action 42

TechQuery changed the title ~~SEO: server-render list pages, GET-based search, URL pagination (size=10), SSR locale fallback, and MobX i18n unification~~ [refactor] migrate List Page components from Client to Server for SEO Jun 15, 2026

TechQuery requested a review from FenjuFu June 15, 2026 21:26

TechQuery added 2 commits June 16, 2026 09:33

[remove] some useless codes

23bca88

[optimize] update i18n data & simplify i18n SSR bootstrap

5f3d912

TechQuery added the enhancement Some improvements label Jun 16, 2026

Copilot started work on behalf of TechQuery June 16, 2026 02:27 View session

Copilot AI added 3 commits June 16, 2026 02:31

Server-render remaining app pages

124c7c8

Clarify recommend fetch errors

0a425cf

Remove redundant recommend assertion

968a32b

Copilot AI changed the title ~~[refactor] migrate List Page components from Client to Server for SEO~~ [refactor] migrate feasible app page components from Client to Server for SEO Jun 16, 2026

Copilot finished work on behalf of TechQuery June 16, 2026 02:35

Copilot AI requested a review from TechQuery June 16, 2026 02:35

TechQuery requested changes Jun 16, 2026

View reviewed changes

Copilot started work on behalf of TechQuery June 16, 2026 02:44 View session

Apply review-wide component cleanup

08feb3b

Copilot finished work on behalf of TechQuery June 16, 2026 02:47

Copilot AI requested a review from TechQuery June 16, 2026 02:47

TechQuery approved these changes Jun 16, 2026

View reviewed changes

TechQuery merged commit bc15085 into main Jun 16, 2026
3 checks passed

TechQuery deleted the copilot/seo-goodactionhub branch June 16, 2026 03:01

	{Object.entries(LanguageName).map(([lng, label]) => (
	{Object.entries(LanguageName).map(([language, label]) => (

Conversation

Copilot AI commented Jun 6, 2026 • edited by TechQuery Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Human changes

Uh oh!

TechQuery left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

TechQuery left a comment

Choose a reason for hiding this comment

Uh oh!

Copilot AI commented Jun 15, 2026

Uh oh!

TechQuery commented Jun 16, 2026

Uh oh!

Copilot AI commented Jun 16, 2026

Uh oh!

TechQuery left a comment

Choose a reason for hiding this comment

Uh oh!

TechQuery Jun 16, 2026

Choose a reason for hiding this comment

Uh oh!

TechQuery Jun 16, 2026

Choose a reason for hiding this comment

Uh oh!

TechQuery Jun 16, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI commented Jun 16, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Copilot AI commented Jun 6, 2026 •

edited by TechQuery

Loading