From 5c10137df1af92548fca4ec0d05cfbfb677f1e4d Mon Sep 17 00:00:00 2001
From: scottkiener-at-safelite <scott.kiener@safelite.com>
Date: Thu, 28 May 2026 16:33:11 -0400
Subject: [PATCH] Disable date-picker advance after 180 days have been loaded

Unit tests to confirm functonality
---
 .../date-picker/date-picker.spec.js           | 70 +++++++++++++++++++
 .../scheduling/date-picker/date-picker.vue    |  5 +-
 2 files changed, 74 insertions(+), 1 deletion(-)

diff --git a/src/layouts/scheduling/date-picker/date-picker.spec.js b/src/layouts/scheduling/date-picker/date-picker.spec.js
index f64d27a12..73a05ac52 100644
--- a/src/layouts/scheduling/date-picker/date-picker.spec.js
+++ b/src/layouts/scheduling/date-picker/date-picker.spec.js
@@ -214,6 +214,76 @@ describe("date-picker.vue", () => {
         });
     });
 
+    describe("forward button disabled at 180-date limit", () => {
+        function generateDateRange(startStr, count) {
+            const dates = [];
+            const [y, m, d] = startStr.split("-").map(Number);
+            const cursor = new Date(y, m - 1, d);
+            for (let i = 0; i < count; i++) {
+                const yy = cursor.getFullYear();
+                const mm = String(cursor.getMonth() + 1).padStart(2, "0");
+                const dd = String(cursor.getDate()).padStart(2, "0");
+                dates.push(`${yy}-${mm}-${dd}`);
+                cursor.setDate(cursor.getDate() + 1);
+            }
+            return dates;
+        }
+
+        test("canGoForward is false when allDates.length >= 180 and the last date is in the current view", async () => {
+            const allDateValues = generateDateRange("2026-01-01", 180);
+            const wrapper = mountDesktop({
+                availableDates: allDateValues,
+                startDate: allDateValues[0],
+                endDate: allDateValues[allDateValues.length - 1],
+            });
+            // Desktop window size is 5; set windowStart to last window (index 175)
+            wrapper.vm.windowStart = 175;
+            await wrapper.vm.$nextTick();
+            expect(wrapper.vm.canGoForward).toBe(false);
+            wrapper.unmount();
+        });
+
+        test("forward nav button has disabled attribute when at the end of a 180-date range", async () => {
+            const allDateValues = generateDateRange("2026-01-01", 180);
+            const wrapper = mountDesktop({
+                availableDates: allDateValues,
+                startDate: allDateValues[0],
+                endDate: allDateValues[allDateValues.length - 1],
+            });
+            wrapper.vm.windowStart = 175;
+            await wrapper.vm.$nextTick();
+            const forwardBtn = wrapper.findAll(".date-picker__nav-btn")[1];
+            expect(forwardBtn.attributes("disabled")).toBeDefined();
+            wrapper.unmount();
+        });
+
+        test("canGoForward is true when allDates.length >= 180 but the last date is not yet in view", () => {
+            const allDateValues = generateDateRange("2026-01-01", 180);
+            const wrapper = mountDesktop({
+                availableDates: allDateValues,
+                startDate: allDateValues[0],
+                endDate: allDateValues[allDateValues.length - 1],
+            });
+            // windowStart = 0, first 5 of 180 dates are visible — last date is not in view
+            expect(wrapper.vm.canGoForward).toBe(true);
+            wrapper.unmount();
+        });
+
+        test("canGoForward remains true at the last window when allDates.length < 180", async () => {
+            const allDateValues = generateDateRange("2026-01-01", 10);
+            const wrapper = mountDesktop({
+                availableDates: allDateValues,
+                startDate: allDateValues[0],
+                endDate: allDateValues[allDateValues.length - 1],
+            });
+            // windowStart = 5 puts the last 5 dates (indices 5–9) in view
+            wrapper.vm.windowStart = 5;
+            await wrapper.vm.$nextTick();
+            expect(wrapper.vm.canGoForward).toBe(true);
+            wrapper.unmount();
+        });
+    });
+
     describe("initial window positioning", () => {
         test("scrolls to the window containing the pre-selected date on mount", () => {
             // Jan 25 is the 5th date (index 4); with window size 5 on desktop it's still in window 0
diff --git a/src/layouts/scheduling/date-picker/date-picker.vue b/src/layouts/scheduling/date-picker/date-picker.vue
index b8288f993..fa0ebc276 100644
--- a/src/layouts/scheduling/date-picker/date-picker.vue
+++ b/src/layouts/scheduling/date-picker/date-picker.vue
@@ -151,7 +151,10 @@ export default {
             return this.windowStart > 0;
         },
         canGoForward() {
-            return !this.isLoadingDates && this.allDates.length > 0;
+            if (this.isLoadingDates || !this.allDates.length) return false;
+            const lastDateIsVisible = this.windowStart + this.windowSize >= this.allDates.length;
+            if (this.allDates.length >= 180 && lastDateIsVisible) return false;
+            return true;
         },
     },
     mounted() {