Warn when selected leave days are in the past (#85)

* Make text-warning class match the name of its variable

* Fix file resolution in asdf

* Show a warning if some leave dates are in the past

* Add test

* Expand test

Gemfile

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 source "https://rubygems.org"
-ruby File.read(".ruby-version").strip
+ruby File.read(File.join(__dir__, ".ruby-version")).strip
 
 # Core
 gem "puma"

app/assets/stylesheets/application/util/reset.scss

@@ -49,6 +49,10 @@ strong {
   text-align: right !important;
 }
 
-.text-warn {
+.text-warning {
   color: var(--color-warning);
 }
+
+.text-warn {
+  color: var(--color-warn);
+}

app/javascript/controllers/calendar_controller.ts

@@ -2,20 +2,36 @@ import { Controller } from '@hotwired/stimulus';
 import flatpickr from 'flatpickr';
 
 export default class extends Controller {
+  static targets = ['input', 'pastWarning'];
+
   private instance?: flatpickr.Instance;
+  declare readonly inputTarget: HTMLTextAreaElement;
+  declare readonly pastWarningTarget: HTMLDivElement;
 
   connect(): void {
-    this.instance = flatpickr(this.element, {
+    this.handleWarning = this.handleWarning.bind(this);
+
+    this.instance = flatpickr(this.inputTarget, {
       inline: true,
       mode: 'multiple',
       disable: [(date) => date.getDay() === 0 || date.getDay() === 6],
       weekNumbers: true,
       locale: {
         firstDayOfWeek: 1,
       },
+      onReady: this.handleWarning,
+      onChange: this.handleWarning,
     });
   }
 
+  handleWarning(selectedDates: Date[]): void {
+    const today = new Date();
+    today.setHours(0, 0, 0, 0);
+
+    const showWarning = selectedDates.some((date) => date < today);
+    this.pastWarningTarget.hidden = !showWarning;
+  }
+
   disconnect(): void {
     this.instance?.destroy();
   }

app/views/leaves/_form.html.slim

@@ -1,5 +1,7 @@
 = form_with model: @leave, class: :stack, builder: AwesomeForm do |f|
-  = f.text_field :days, data: { controller: "calendar" }, style: "display: none"
+  .stack data-controller="calendar"
+    = f.text_field :days, data: { calendar_target: "input" }, style: "display: none"
+    .text-warn data-calendar-target="pastWarning" hidden="hidden" = t(".some_days_in_the_past")
   = @leave.errors[:days].to_sentence
   - if policy(@leave).permitted_attributes.include?(:user_id)
     = f.input :user_id

app/views/sprints/_sprint.html.slim

@@ -39,7 +39,7 @@
                 - if feedback.turnover_per_storypoint
                   div = "#{number_to_currency feedback.turnover_per_storypoint} / point"
               - if feedback.turnover_per_storypoint
-                div class=("text-warn" if feedback.turnover_per_storypoint_against_avarage > 1) = number_to_percentage feedback.turnover_per_storypoint_against_avarage * 100
+                div class=("text-warning" if feedback.turnover_per_storypoint_against_avarage > 1) = number_to_percentage feedback.turnover_per_storypoint_against_avarage * 100
         - if policy(sprint).overview?
           tr
             th

config/locales/en.yml

@@ -15,6 +15,7 @@ en:
   leaves:
     form:
       request_leave: Request leave
+      some_days_in_the_past: 'Heads up: Some of the selected days are in the past.'
     index:
       all_users: All users
       leaves: Leaves

spec/system/leaves_spec.rb

@@ -67,4 +67,23 @@
     expect(status.slack_id).to eq "slack-john"
     expect(status.until_time).to eq Time.zone.today.end_of_day
   end
+
+  it "shows a warning if one of the leave days is in the past" do
+    login :john
+    visit leaves_path
+    click_on "Request leave"
+
+    expect(page).not_to have_content "Heads up: Some of the selected days are in the past."
+
+    within ".modal" do
+      find(".flatpickr-day.today").click
+
+      expect(page).not_to have_content "Heads up: Some of the selected days are in the past."
+
+      find(".flatpickr-prev-month").click
+      first(".dayContainer .flatpickr-day").click
+    end
+
+    expect(page).to have_content "Heads up: Some of the selected days are in the past."
+  end
 end