📜 Description
📂 Component / File:
Frontend: Tracker.tsx
Hook: useGitHubData.ts
📝 Issue Description:
In the Github Tracker tab (/track), the search inputs (Search Title, Repository, Start Date, End Date, and State) are filtered client-side (using the filterData helper in Tracker.tsx) after fetching a paginated subset from GitHub (10 items per page).
🛑 Current Behavior:
The application fetches only page N (10 items) from the GitHub search API using fetchData.
The UI then filters only these 10 retrieved items client-side.
If the user searches for a specific title that exists in their overall history but is not in the current 10 fetched items, it will not be found.
If a user filters by repository and only 1 item matches, the UI shows a single item on the table, but the pagination component still indicates the total unfiltered count (e.g. 150 items across 15 pages), making pagination completely broken.
✨ Expected Behavior:
Filtering and searching should happen on the server-side (GitHub Search API). The pagination and search filters should be passed as query options to fetchData in useGitHubData.ts so that GitHub returns the correct paginated, filtered subset.
🛠️ Implementation Plan:
Modify the useEffect fetch hook in Tracker.tsx to pass the state-driven search/filter variables (searchTitle, selectedRepo, startDate, endDate, and the active status filters) directly as configuration options when calling the fetchData function.
Update the useEffect hook's dependency array in Tracker.tsx to include the search/filter states so that data is automatically re-fetched when users update the filter controls.
Remove or simplify the client-side filterData helper logic in Tracker.tsx because the server-side Search API will now return the correctly filtered data subset, avoiding visual mismatch with page counters.
Ensure the search form submission handles resetting the active pagination page state index back to 0 to avoid empty page displays when active filters change.
What browsers are you seeing the problem on?
No response
📃 Relevant Screenshots (Links)
As shown in the screenshot, searching/filtering only filters the active 5 items loaded on the current page client-side. The pagination at the bottom still claims there are 5 items total across multiple pages, and clicking next displays empty pages or unrelated items because the Search API was not queried with the active filters
📜 Description
📂 Component / File:
Frontend: Tracker.tsx
Hook: useGitHubData.ts
📝 Issue Description:
In the Github Tracker tab (/track), the search inputs (Search Title, Repository, Start Date, End Date, and State) are filtered client-side (using the filterData helper in Tracker.tsx) after fetching a paginated subset from GitHub (10 items per page).
🛑 Current Behavior:
The application fetches only page N (10 items) from the GitHub search API using fetchData.
The UI then filters only these 10 retrieved items client-side.
If the user searches for a specific title that exists in their overall history but is not in the current 10 fetched items, it will not be found.
If a user filters by repository and only 1 item matches, the UI shows a single item on the table, but the pagination component still indicates the total unfiltered count (e.g. 150 items across 15 pages), making pagination completely broken.
✨ Expected Behavior:
Filtering and searching should happen on the server-side (GitHub Search API). The pagination and search filters should be passed as query options to fetchData in useGitHubData.ts so that GitHub returns the correct paginated, filtered subset.
🛠️ Implementation Plan:
Modify the useEffect fetch hook in Tracker.tsx to pass the state-driven search/filter variables (searchTitle, selectedRepo, startDate, endDate, and the active status filters) directly as configuration options when calling the fetchData function.
Update the useEffect hook's dependency array in Tracker.tsx to include the search/filter states so that data is automatically re-fetched when users update the filter controls.
Remove or simplify the client-side filterData helper logic in Tracker.tsx because the server-side Search API will now return the correctly filtered data subset, avoiding visual mismatch with page counters.
Ensure the search form submission handles resetting the active pagination page state index back to 0 to avoid empty page displays when active filters change.
What browsers are you seeing the problem on?
No response
📃 Relevant Screenshots (Links)
As shown in the screenshot, searching/filtering only filters the active 5 items loaded on the current page client-side. The pagination at the bottom still claims there are 5 items total across multiple pages, and clicking next displays empty pages or unrelated items because the Search API was not queried with the active filters