Skip to content

Replace timepicker addon#3587

Merged
Simrayz merged 3 commits intomasterfrom
chore/replace-timepicker-library
Oct 17, 2025
Merged

Replace timepicker addon#3587
Simrayz merged 3 commits intomasterfrom
chore/replace-timepicker-library

Conversation

@Simrayz
Copy link
Copy Markdown
Contributor

@Simrayz Simrayz commented Oct 14, 2025

Scope and purpose

This PR replaces the jquery-ui-timepicker-addon library with Flatpickr. When upgrading jQuery dependencies in #3582, I discovered that jquery-ui-timepicker-addon is no longer maintained, and does not have an update to support new jQuery versions. The author recommended the library Flatpickr, which I tested and found fitting for replacing the old implementation.

The method of picking time is different, but using sliders for picking hour and minutes is not very user friendly. As such, I think simply filling in the time is a better choice.

This pull request

  • Removes jquery-ui-timepicker-addon dependency
  • Adds new flatpickr dependency and styles
  • Updates maintenance and message views to use flatpickr datetime pickers

How to test

Maintenance Tool

  1. Create a new Maintenance Task, or edit an existing one
  2. Click the "Start time" or "End time" field to trigger the datetime input
  3. Select the desired date and time, and press enter

Messages Tool

  1. Create a new Message
  2. Click "Publish start" or "Publish end" to trigger the datetime input
  3. Select the desired date and time, and press enter

Screenshots

Before

image

After

image

Contributor Checklist

Every pull request should have this checklist filled out, no matter how small it is.
More information about contributing to NAV can be found in the
Hacker's guide to NAV.

  • Added a changelog fragment for towncrier
  • Added/amended tests for new/changed code
  • Added/changed documentation
  • Linted/formatted the code with ruff, easiest by using pre-commit
  • Wrote the commit message so that the first line continues the sentence "If applied, this commit will ...", starts with a capital letter, does not end with punctuation and is 50 characters or less long. See https://cbea.ms/git-commit/
  • Based this pull request on the correct upstream branch: For a patch/bugfix affecting the latest stable version, it should be based on that version's branch (<major>.<minor>.x). For a new feature or other additions, it should be based on master.
  • If applicable: Created new issues if this PR does not fix the issue completely/there is further work to be done
  • If it's not obvious from a linked issue, described how to interact with NAV in order for a reviewer to observe the effects of this change first-hand (commands, URLs, UI interactions)
  • If this results in changes in the UI: Added screenshots of the before and after
  • If this adds a new Python source code file: Added the boilerplate header to that file

@Simrayz Simrayz requested a review from a team October 14, 2025 10:02
@Simrayz Simrayz self-assigned this Oct 14, 2025
@Simrayz Simrayz mentioned this pull request Oct 14, 2025
10 tasks
@github-actions
Copy link
Copy Markdown

github-actions bot commented Oct 14, 2025

Test results

    27 files      27 suites   44m 43s ⏱️
 2 618 tests  2 618 ✅ 0 💤 0 ❌
19 334 runs  19 334 ✅ 0 💤 0 ❌

Results for commit 51a9e8f.

♻️ This comment has been updated with latest results.

@codecov
Copy link
Copy Markdown

codecov bot commented Oct 14, 2025

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 62.51%. Comparing base (f441293) to head (51a9e8f).
⚠️ Report is 271 commits behind head on master.

Additional details and impacted files
@@            Coverage Diff             @@
##           master    #3587      +/-   ##
==========================================
+ Coverage   62.49%   62.51%   +0.01%     
==========================================
  Files         611      611              
  Lines       45020    45020              
  Branches       43       43              
==========================================
+ Hits        28137    28142       +5     
+ Misses      16873    16868       -5     
  Partials       10       10              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Copy link
Copy Markdown
Contributor

@johannaengland johannaengland left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Simrayz Simrayz force-pushed the chore/replace-timepicker-library branch from 328c5c1 to 46560fd Compare October 15, 2025 13:25
@Simrayz
Copy link
Copy Markdown
Contributor Author

Simrayz commented Oct 15, 2025

After removing the library is this file still needed?

https://github.com/Uninett/nav/blob/843ca70f9df4aecf0658dfca1a653fc63ef072e8/python/nav/web/sass/nav/timepicker.scss

It is not, good catch! :D

@johannaengland
Copy link
Copy Markdown
Contributor

After removing the library is this file still needed?
https://github.com/Uninett/nav/blob/843ca70f9df4aecf0658dfca1a653fc63ef072e8/python/nav/web/sass/nav/timepicker.scss

It is not, good catch! :D

I make a habit of just searching for the name of something after it has been removed just to make sure ^^

@Simrayz Simrayz force-pushed the chore/replace-timepicker-library branch from 46560fd to 18cb958 Compare October 15, 2025 14:05
Copy link
Copy Markdown
Member

@lunkwill42 lunkwill42 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Flatpickr even looks much better 😄

<div class="content">
</div>
<!-- container for prefix tree -->
test_ <!-- container for prefix tree -->
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry, what?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was pycharm freezing on me, and inputting the text in the file instead of the action menu :') It really loves eating up all the ram and behaving irrationally. I'll fix.

@Simrayz Simrayz force-pushed the chore/replace-timepicker-library branch 2 times, most recently from b0bf7de to d0c9d04 Compare October 16, 2025 13:02
@Simrayz Simrayz requested a review from lunkwill42 October 17, 2025 08:04
@Simrayz Simrayz force-pushed the chore/replace-timepicker-library branch from d0c9d04 to 51a9e8f Compare October 17, 2025 11:22
@sonarqubecloud
Copy link
Copy Markdown

Copy link
Copy Markdown
Member

@lunkwill42 lunkwill42 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All is good. Flatpickr uses an MIT license, which is compatible.

@Simrayz Simrayz merged commit 8b83fa9 into master Oct 17, 2025
19 checks passed
@Simrayz Simrayz deleted the chore/replace-timepicker-library branch October 17, 2025 14:00
@Simrayz Simrayz restored the chore/replace-timepicker-library branch October 17, 2025 14:06
@Simrayz Simrayz deleted the chore/replace-timepicker-library branch December 15, 2025 11:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants