Update date picker version and tweak layout logic #1105

annavik · 2026-01-29T12:21:00Z

Summary

Comment from @mihow :

If the calendar picker appears above the field, then when you click prev/next the buttons jump up or down based on the length of the month, which makes it very tricky to go back more than a few months. A lot of the data is from 2022 which takes quite a while to get to with this jumper!

In this PR we fix this by updating date picker version and the layout logic. The updated version (see separate PR) will allow year and month to be set from dropdown. This will make it a lot quicker if you want go back far in time. We also force the date picker to go below the trigger, to keep the position stable for navigation buttons. One little drawback is that scrolling will be needed, if there is not enough space below the trigger in the current view, to fit the calendar.

We also discussed setting the date from a text input. I had a quick look and that solution would require a bit more client side formatting with the current setup. I skipped for now since I think the fixes included will take care of the biggest problems.

Detailed Description

How to Test the Changes

Test interact with the date picker in the filter sidebar.

Screenshots

Before:

After:

Summary by CodeRabbit

Chores
- Updated nova-ui-kit dependency.
Bug Fixes
- Enhanced date picker popover positioning and calendar month reset functionality when closing the picker.
- Fixed page footer stacking to prevent visual overlap with other page elements.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

netlify · 2026-01-29T12:21:06Z

✅ Deploy Preview for antenna-preview ready!

Name	Link
🔨 Latest commit	`068f1ba`
🔍 Latest deploy log	https://app.netlify.com/projects/antenna-preview/deploys/697ca31c8d65cb00087ff881
😎 Deploy Preview	https://deploy-preview-1105--antenna-preview.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 61 (🔴 down 5 from production) Accessibility: 80 (no change from production) Best Practices: 100 (no change from production) SEO: 92 (no change from production) PWA: 80 (no change from production) View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify · 2026-01-29T12:21:06Z

✅ Deploy Preview for antenna-ssec ready!

Name	Link
🔨 Latest commit	`068f1ba`
🔍 Latest deploy log	https://app.netlify.com/projects/antenna-ssec/deploys/697ca31c7b57900008a19be2
😎 Deploy Preview	https://deploy-preview-1105--antenna-ssec.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

coderabbitai · 2026-01-29T12:21:21Z

📝 Walkthrough

Walkthrough

Three UI changes: a dependency version bump for nova-ui-kit, an increased z-index in the page footer SCSS, and state/positioning adjustments to the date picker (popover placement, month state, and calendar props).

Changes

Cohort / File(s)	Summary
Dependencies `ui/package.json`	Bumped `nova-ui-kit` from `^1.1.32` to `^1.1.33`.
Styling `ui/src/design-system/components/page-footer/page-footer.module.scss`	Increased wrapper `z-index` from `2` to `50` (stacking context change).
Date picker component `ui/src/design-system/components/select/date-picker.tsx`	Added internal `selected` memo and `month` state; reset `month` on popover close via effect; changed `Popover.Content` to `side="bottom"` and `avoidCollisions={false}`; passed `month`, `onMonthChange`, and `captionLayout="dropdown"` to `Calendar`. Review popover/calendar interaction and state reset logic.

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant DatePicker
  participant Popover
  participant Calendar

  User->>DatePicker: click to open
  DatePicker->>Popover: open()
  Popover->>Calendar: render(month = DatePicker.month, captionLayout="dropdown")
  User->>Calendar: change month / select date
  Calendar->>DatePicker: onMonthChange(newMonth) / onSelect(date)
  DatePicker->>DatePicker: update month, call onValueChange(selected)
  User->>DatePicker: close popover
  DatePicker->>DatePicker: effect resets month to selected

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

A rabbit hops, a tiny cheer,
Versions nudged and footers clear,
The calendar finds its grounded place,
Month resets with gentle grace,
UI hums along—soft, bright, and near. 🐇✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately reflects the main changes: updating the date picker version and adjusting layout logic to force bottom positioning.
Description check	✅ Passed	The description includes Summary, Detailed Description, How to Test, and Screenshots. However, it lacks a formal 'List of Changes', 'Related Issues', and 'Deployment Notes' sections.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch fix/update-date-picker

Tip

🧪 Unit Test Generation v2 is now available!

We have significantly improved our unit test generation capabilities.

To enable: Add this to your .coderabbit.yaml configuration:

reviews:
  finishing_touches:
    unit_tests:
      enabled: true

Try it out by using the @coderabbitai generate unit tests command on your code files or under ✨ Finishing Touches on the walkthrough!

Have feedback? Share your thoughts on our Discord thread!

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.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

annavik · 2026-01-29T12:43:43Z

@coderabbitai review

coderabbitai · 2026-01-29T12:44:09Z

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

mihow · 2026-01-30T00:44:23Z

Hey this works really well! I like the month & year pickers. Thanks @annavik. I tested in the collection form as well. One additional enhancement would be to open the calendar to the date that has already been selected. On my system if I select April 1, 1984, then open the calendar again it starts from Jan 2026.

annavik · 2026-01-30T12:25:31Z

Hey this works really well! I like the month & year pickers. Thanks @annavik. I tested in the collection form as well. One additional enhancement would be to open the calendar to the date that has already been selected. On my system if I select April 1, 1984, then open the calendar again it starts from Jan 2026.

Good point! Fixed ✅

fix: update date picker version and tweak layout logic

562fed0

annavik assigned mihow Jan 29, 2026

annavik requested a review from mihow January 29, 2026 12:46

annavik assigned annavik and unassigned mihow Jan 29, 2026

feat: set start month based on selected date

068f1ba

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update date picker version and tweak layout logic #1105

Update date picker version and tweak layout logic #1105

annavik commented Jan 29, 2026 •

edited by coderabbitai bot

Loading

Uh oh!

netlify bot commented Jan 29, 2026 •

edited

Loading

Uh oh!

netlify bot commented Jan 29, 2026 •

edited

Loading

Uh oh!

coderabbitai bot commented Jan 29, 2026 •

edited

Loading

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

Poem

Uh oh!

annavik commented Jan 29, 2026

Uh oh!

coderabbitai bot commented Jan 29, 2026

Uh oh!

mihow commented Jan 30, 2026

Uh oh!

annavik commented Jan 30, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Update date picker version and tweak layout logic #1105

Are you sure you want to change the base?

Update date picker version and tweak layout logic #1105

Conversation

annavik commented Jan 29, 2026 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Detailed Description

How to Test the Changes

Screenshots

Summary by CodeRabbit

Uh oh!

netlify bot commented Jan 29, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for antenna-preview ready!

Uh oh!

netlify bot commented Jan 29, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for antenna-ssec ready!

Uh oh!

coderabbitai bot commented Jan 29, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

Poem

Uh oh!

annavik commented Jan 29, 2026

Uh oh!

coderabbitai bot commented Jan 29, 2026

Uh oh!

mihow commented Jan 30, 2026

Uh oh!

annavik commented Jan 30, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

annavik commented Jan 29, 2026 •

edited by coderabbitai bot

Loading

netlify bot commented Jan 29, 2026 •

edited

Loading

netlify bot commented Jan 29, 2026 •

edited

Loading

coderabbitai bot commented Jan 29, 2026 •

edited

Loading