Add viewer engagement rewards frontend experience - #319
Conversation
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: e3d6bed998
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
|
|
||
| export const viewerRewardsApi = { | ||
| getFeed(userId: string) { | ||
| return request<ViewerRewardFeedResponse>('/v1/viewer/rewards/feed', { userId }); |
There was a problem hiding this comment.
Use the backend's video-engagement routes
The new client is wired to /v1/viewer/rewards/*, but the server in this repo registers viewer reward handlers under /v1/video-engagement/* (checked backend/src/server/routes.ts, e.g. the routes around lines 525-568). With the current paths, these calls return 404s, so the feed/summary/history and interaction updates never load in production.
Useful? React with 👍 / 👎.
| VideoRewardEligibility | ||
| } from './types'; | ||
|
|
||
| const apiBaseUrl = (import.meta.env.PERBUG_API_BASE_URL as string | undefined) ?? ''; |
There was a problem hiding this comment.
Read the configured public API base URL
This code reads import.meta.env.PERBUG_API_BASE_URL, but the web app configuration uses PUBLIC_PERBUG_API_BASE_URL (see web/.env.example and web/src/pages/creator/rewards.astro). As written, deployments that set only the documented public variable will ignore the configured API host and fall back to relative /v1/... requests, which breaks separated frontend/backend setups.
Useful? React with 👍 / 👎.
| const updateSelected = async (next: Promise<VideoRewardEligibility>, successMessage: string) => { | ||
| const result = await next; | ||
| setVideos((current) => current.map((video) => (video.videoId === result.videoId ? result : video))); |
There was a problem hiding this comment.
Handle action request failures in updateSelected
updateSelected awaits next without error handling, and callers invoke it as void updateSelected(...); when an interaction request gets a non-2xx response, the promise rejection is unhandled and the user never sees the error banner set by load(). This makes rating/comment/watch actions fail silently for backend validation errors or transient network failures.
Useful? React with 👍 / 👎.
Motivation
Description
web/src/lib/viewer-rewards/types.ts,web/src/lib/viewer-rewards/api.ts).web/src/components/viewer-rewards/ViewerEngagementRewardsExperience.tsx)./viewer/engagement-rewardsand initialize the component client-side (web/src/pages/viewer/engagement-rewards.astro).web/vitest.config.ts,web/src/test/setup.ts,web/src/components/viewer-rewards/ViewerEngagementRewardsExperience.test.tsx).web/package.json,web/pnpm-lock.yaml).Testing
cd web && pnpm test, which executed the new Vitest tests and all tests passed (4 tests, component behavior and state transitions verified).cd web && pnpm installas part of wiring the test environment and dependency lockfile was updated successfully.cd web && pnpm check(Astro/TypeScript check) which surfaced preexisting repo-wide TypeScript/Astro issues; these are baseline type diagnostics unrelated to the new reward UI and did not block the test pass.Codex Task