Opti: weekly timeline chart

[fishyy119]

优化了时间线图表的刻度显示

[Copilot]

Pull request overview

This PR optimizes the weekly timeline chart’s X-axis tick density and visual hierarchy to improve readability of the scale markers.

Changes:

• Increased X-axis tick granularity from 12 hours to 4 hours.
• Adjusted tick label rendering to show only day-boundaries and midpoints.
• Updated vertical reference line opacity based on whether a tick is a day-boundary, midpoint, or minor tick.

Comments suppressed due to low confidence (1)

src/renderer/src/pages/Record/WeeklyReport.tsx:406

• isDayBoundary / isMidpoint are computed via tick % oneDay / tick % twelveHours, which will misclassify boundaries when the week crosses a DST transition (since the local day length isn’t 24h in ms). It will also potentially skip labeling the true day boundary because the tick offsets won’t land exactly on multiples of oneDay. Prefer checking the computed date (e.g., date.getHours() === dayBoundaryHour && date.getMinutes() === 0 for day boundary, and a similar check for the midpoint) rather than relying on fixed millisecond modulo.

                      const tick = Number(t)
                      const isDayBoundary = tick % oneDay === 0
                      const isMidpoint = tick % twelveHours === 0
                      if (!isDayBoundary && !isMidpoint) return ''

                      const date = new Date(tick + weekStartTime)
                      const hour = date.getHours()
                      const minute = date.getMinutes()
                      const hours = String(hour).padStart(2, '0')
                      const minutes = String(minute).padStart(2, '0')

                      if (isDayBoundary) {
                        const month = String(date.getMonth() + 1).padStart(2, '0')
                        const day = String(date.getDate()).padStart(2, '0')
                        return `${month}-${day}`
                      } else {
                        return `${hours}:${minutes}`
                      }

---

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