refactor(web): improve temporal format functions #422
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Important Review skippedAuto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the You can disable this status message by setting the Note Other AI code review bot(s) detectedCodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
2 issues found across 6 files
Prompt for AI agents (all 2 issues)
Understand the root cause of the following 2 issues and fix them.
<file name="apps/web/src/components/calendar/timeline/time-indicator.tsx">
<violation number="1" location="apps/web/src/components/calendar/timeline/time-indicator.tsx:47">
Rule violated: **Define custom utilities, variants and plugins using v4 directives; use @apply in components**
`z-1000` is a custom Tailwind utility but no `@utility` definition exists, so Tailwind will drop it. Restore the arbitrary value or define the utility via v4 directives to keep the label above surrounding elements.</violation>
</file>
<file name="apps/web/src/lib/utils/format.ts">
<violation number="1" location="apps/web/src/lib/utils/format.ts:66">
`Tempo.format` should use the caller’s time zone when formatting a `Temporal.PlainTime`; hard-coding UTC breaks formatting for non-UTC zones.</violation>
</file>
React with 👍 or 👎 to teach cubic. Mention @cubic-dev-ai to give feedback, ask questions, or re-run the review.
| <div className="absolute flex h-4 w-20 items-center justify-end border-r border-transparent"> | ||
| <p className="z-[1000] pe-2 text-[10px] font-medium text-red-500/80 tabular-nums sm:pe-4 sm:text-xs"> | ||
| {formattedTime} | ||
| <p className="z-1000 pe-2 text-[10px] font-medium text-red-500/80 tabular-nums sm:pe-4 sm:text-xs"> |
There was a problem hiding this comment.
Rule violated: Define custom utilities, variants and plugins using v4 directives; use @apply in components
z-1000 is a custom Tailwind utility but no @utility definition exists, so Tailwind will drop it. Restore the arbitrary value or define the utility via v4 directives to keep the label above surrounding elements.
Prompt for AI agents
Address the following comment on apps/web/src/components/calendar/timeline/time-indicator.tsx at line 47:
<comment>`z-1000` is a custom Tailwind utility but no `@utility` definition exists, so Tailwind will drop it. Restore the arbitrary value or define the utility via v4 directives to keep the label above surrounding elements.</comment>
<file context>
@@ -32,20 +32,20 @@ export function TimeIndicator({ date }: TimeIndicatorProps) {
<div className="absolute flex h-4 w-20 items-center justify-end border-r border-transparent">
- <p className="z-[1000] pe-2 text-[10px] font-medium text-red-500/80 tabular-nums sm:pe-4 sm:text-xs">
- {formattedTime}
+ <p className="z-1000 pe-2 text-[10px] font-medium text-red-500/80 tabular-nums sm:pe-4 sm:text-xs">
+ {indicator.label}
</p>
</file context>
| <p className="z-1000 pe-2 text-[10px] font-medium text-red-500/80 tabular-nums sm:pe-4 sm:text-xs"> | |
| <p className="z-[1000] pe-2 text-[10px] font-medium text-red-500/80 tabular-nums sm:pe-4 sm:text-xs"> |
Co-authored-by: cubic-dev-ai[bot] <191113872+cubic-dev-ai[bot]@users.noreply.github.com>
Description
Briefly describe what you did and why.
Screenshots / Recordings
Add screenshots or recordings here to help reviewers understand your changes.
Type of Change
Related Areas
Testing
Checklist
Notes
(Optional) Add anything else you'd like to share.
By submitting, I confirm I understand and stand behind this code. If AI was used, I’ve reviewed and verified everything myself.
Summary by cubic
Refactored date/time formatting to a single utils module and updated components to use it, improving consistency across timezones, locales, and 12/24-hour formats. Also simplified the current-time indicator API and display.
Refactors
Migration
Written for commit 8fbe0f7. Summary will update automatically on new commits.