feat: add track-mode (議程軌) schedule view#238
Conversation
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (3)
✅ Files skipped from review due to trivial changes (1)
🚧 Files skipped from review as they are similar to previous changes (2)
📝 WalkthroughWalkthroughAdds a track-based session table for the session page desktop view and updates the day selector button styling. ChangesSession Track Table Feature
Day Selector Styling
Estimated code review effort: 3 (Moderate) | ~25 minutes Sequence Diagram(s)sequenceDiagram
participant SessionPage as session.vue
participant TrackTable as CpSessionTrackTable
participant Clock as Asia/Taipei time
SessionPage->>TrackTable: Pass sessions, day, interval, sizing props
TrackTable->>TrackTable: Compute tracks, grid positions, labels, and styling
TrackTable->>Clock: Read current localized time
Clock-->>TrackTable: Current time
TrackTable-->>SessionPage: Render track grid, session cards, and now marker
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
🧹 Nitpick comments (2)
app/components/feature/CpSessionTrackTable.vue (2)
53-64: 🩺 Stability & Availability | 🔵 Trivial | 💤 Low value
parseMinutesthrows on malformed input with no guard in computed chain.
timeStart/timeEnd/sessionsall depend onparseMinutes, which throws on any non-matching ISO string (line 56). A single malformedtimeRangeor sessionstart/endvalue would break the entire component's render rather than degrading gracefully.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@app/components/feature/CpSessionTrackTable.vue` around lines 53 - 64, `parseMinutes` in `CpSessionTrackTable.vue` currently throws on any malformed time string, which can break rendering for `timeStart`, `timeEnd`, and `sessions`. Update `parseMinutes` and its callers to handle invalid `timeRange` or session `start`/`end` values gracefully, using a safe fallback or validation path instead of throwing, so the computed chain and component can still render.
140-155: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick winRedundant
nowMinutes()calls instead of reusing thenowMinscomputed.
nowLineLeft,nowLabel, andshowRealtimeLineeach independently callnowMinutes()(creating a freshIntl.DateTimeFormatand parsing on every evaluation), whilenowMins(line 140) already caches this value. Consolidate ontonowMins.valueto avoid duplicate work and guarantee all consumers agree on the same instant.♻️ Proposed consolidation
-const nowLineLeft = computed(() => LABEL_WIDTH + ((nowMinutes() - timeStart.value) / interval) * columnWidth) +const nowLineLeft = computed(() => LABEL_WIDTH + ((nowMins.value - timeStart.value) / interval) * columnWidth) const nowLabel = computed(() => { - const mins = Math.floor(nowMinutes()) + const mins = Math.floor(nowMins.value) return `${String(Math.floor(mins / 60)).padStart(2, '0')}:${String(mins % 60).padStart(2, '0')}` }) const showRealtimeLine = computed(() => { const today = new Intl.DateTimeFormat('en-CA', { timeZone: 'Asia/Taipei' }).format(time.value) - const mins = nowMinutes() + const mins = nowMins.value return day === today && timeStart.value <= mins && mins <= timeEnd.value })🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@app/components/feature/CpSessionTrackTable.vue` around lines 140 - 155, The realtime time computations in CpSessionTrackTable.vue are duplicating work by calling nowMinutes() separately in nowLineLeft, nowLabel, and showRealtimeLine even though nowMins already caches the current minutes value. Update those computed properties to read from nowMins.value instead of invoking nowMinutes() again, so the component reuses one snapshot and avoids repeated Intl.DateTimeFormat parsing. Keep the change localized to the nowMins, nowLineLeft, nowLabel, and showRealtimeLine computed blocks.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@app/components/feature/CpSessionTrackTable.vue`:
- Around line 53-64: `parseMinutes` in `CpSessionTrackTable.vue` currently
throws on any malformed time string, which can break rendering for `timeStart`,
`timeEnd`, and `sessions`. Update `parseMinutes` and its callers to handle
invalid `timeRange` or session `start`/`end` values gracefully, using a safe
fallback or validation path instead of throwing, so the computed chain and
component can still render.
- Around line 140-155: The realtime time computations in CpSessionTrackTable.vue
are duplicating work by calling nowMinutes() separately in nowLineLeft,
nowLabel, and showRealtimeLine even though nowMins already caches the current
minutes value. Update those computed properties to read from nowMins.value
instead of invoking nowMinutes() again, so the component reuses one snapshot and
avoids repeated Intl.DateTimeFormat parsing. Keep the change localized to the
nowMins, nowLineLeft, nowLabel, and showRealtimeLine computed blocks.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 0fa3f09e-88a0-4aaf-87b5-11fdcc28cfba
📒 Files selected for processing (3)
app/components/feature/CpSessionDaySelector.vueapp/components/feature/CpSessionTrackTable.vueapp/pages/session.vue
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: a09f4fc8af
ℹ️ About Codex in GitHub
Codex has been enabled to automatically 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 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
Dokploy Preview Deployment
|
Replace the room-grouped desktop table with a track-grouped grid (tracks as rows, time horizontal) matching the new Figma design, and switch the day selector to the design's day tabs.
23b12d1 to
70fe7d6
Compare
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 70fe7d687b
ℹ️ About Codex in GitHub
Codex has been enabled to automatically 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 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
| <span | ||
| class="p-1 rounded-[4px] bg-black/10 flex items-center left-1 top-1 absolute" | ||
| > |
There was a problem hiding this comment.
Restore the desktop favorite toggle
When this component is used on sm and wider screens, each card is just a NuxtLink with this static star; there is no button wired to toggleFavorite like the mobile list/old table. The page still shows the Favorites view and share button, so desktop users with no favorites cannot add anything to that view, and imported favorites cannot be removed without switching to the mobile layout or clearing storage.
Useful? React with 👍 / 👎.
依 Figma 新設計實作桌面版「議程軌(社群)模式」議程表,取代原本以教室為欄的表格。
變更內容
CpSessionTrackTable:以議程軌為列、時間為橫軸的桌面版議程表,依SessionSummary.track分組,取代原CpSessionTable。/session/{id}詳細頁。CpSessionDaySelector改為設計稿的 Aug.8/Aug.9 分頁樣式(省略標題)。略過項目(尚無功能 / 待後續)
font-mono;未套用次像素基線微調。CpSessionList維持原樣。Summary by CodeRabbit