From b0e638c28b7fd2b6ffeadde1430a0a5974950154 Mon Sep 17 00:00:00 2001
From: Gregor Vostrak <gregor@solidtime.io>
Date: Mon, 30 Jun 2025 12:43:20 +0200
Subject: [PATCH] fix daterange presets, fix e2e test

---
 e2e/projects.spec.ts                          |  6 +--
 .../js/Components/ui/dialog/DialogContent.vue |  5 +--
 .../packages/ui/src/Input/DateRangePicker.vue | 44 +++++++++----------
 3 files changed, 27 insertions(+), 28 deletions(-)

diff --git a/e2e/projects.spec.ts b/e2e/projects.spec.ts
index 156d66e6..b751601a 100644
--- a/e2e/projects.spec.ts
+++ b/e2e/projects.spec.ts
@@ -102,7 +102,7 @@ test('test that updating billable rate works with existing time entries', async
 
     await page.getByRole('row').first().getByRole('button').click();
     await page.getByRole('menuitem').getByText('Edit').first().click();
-        await page.getByText('Non-Billable').click();
+    await page.getByText('Non-Billable').click();
     await page.getByText('Custom Rate').click();
     await page
         .getByPlaceholder('Billable Rate')
@@ -111,8 +111,8 @@ test('test that updating billable rate works with existing time entries', async
 
     await Promise.all([
         page
-            .getByRole('button', { name: 'Yes, update existing time entries' })
-            .click(),
+        .locator('button').filter({ hasText: 'Yes, update existing time' })
+        .click(),    
         page.waitForRequest(
             async (request) =>
                 request.url().includes('/projects/') &&
diff --git a/resources/js/Components/ui/dialog/DialogContent.vue b/resources/js/Components/ui/dialog/DialogContent.vue
index a02e28d3..b1d52176 100644
--- a/resources/js/Components/ui/dialog/DialogContent.vue
+++ b/resources/js/Components/ui/dialog/DialogContent.vue
@@ -33,14 +33,13 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
     <div
       :class="
         cn(
-          'fixed top-0 left-0 z-50 pointer-events-none w-screen h-screen flex items-start pt-6 md:pt-20 xl:pt-32 justify-center overflow-auto data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',
+          'fixed top-0 left-0 z-50 pointer-events-none w-screen h-screen flex items-start pt-6 md:pt-20 xl:pt-32 justify-center overflow-auto',
         )"
     >
     <DialogContent
     v-bind="forwarded"
-
 :class="cn(
-          'bg-default-background grid w-full max-w-lg border border-border-tertiary shadow-lg duration-200 sm:rounded-lg',
+          'bg-default-background grid w-full max-w-lg border border-border-tertiary shadow-lg duration-200 sm:rounded-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',
           props.class,
         )"
       >
diff --git a/resources/js/packages/ui/src/Input/DateRangePicker.vue b/resources/js/packages/ui/src/Input/DateRangePicker.vue
index d2950695..532939cc 100644
--- a/resources/js/packages/ui/src/Input/DateRangePicker.vue
+++ b/resources/js/packages/ui/src/Input/DateRangePicker.vue
@@ -73,18 +73,18 @@ const open = ref(false);
 function setToday() {
     emit(
         'update:start',
-        getLocalizedDayJs().startOf('day').format('YYYY-MM-DD')
+        getLocalizedDayJs().startOf('day').format()
     );
-    emit('update:end', getLocalizedDayJs().endOf('day').format('YYYY-MM-DD'));
+    emit('update:end', getLocalizedDayJs().endOf('day').format());
     open.value = false;
 }
 
 function setThisWeek() {
     emit(
         'update:start',
-        getLocalizedDayJs().startOf('week').format('YYYY-MM-DD')
+        getLocalizedDayJs().startOf('week').format()
     );
-    emit('update:end', getLocalizedDayJs().endOf('week').format('YYYY-MM-DD'));
+    emit('update:end', getLocalizedDayJs().endOf('week').format());
     open.value = false;
 }
 
@@ -94,14 +94,14 @@ function setLastWeek() {
         getLocalizedDayJs()
             .subtract(1, 'week')
             .startOf('week')
-            .format('YYYY-MM-DD')
+            .format()
     );
     emit(
         'update:end',
         getLocalizedDayJs()
             .subtract(1, 'week')
             .endOf('week')
-            .format('YYYY-MM-DD')
+            .format()
     );
     open.value = false;
 }
@@ -109,18 +109,18 @@ function setLastWeek() {
 function setLast14Days() {
     emit(
         'update:start',
-        getLocalizedDayJs().subtract(14, 'days').format('YYYY-MM-DD')
+        getLocalizedDayJs().subtract(14, 'days').format()
     );
-    emit('update:end', getLocalizedDayJs().format('YYYY-MM-DD'));
+    emit('update:end', getLocalizedDayJs().format());
     open.value = false;
 }
 
 function setThisMonth() {
     emit(
         'update:start',
-        getLocalizedDayJs().startOf('month').format('YYYY-MM-DD')
+        getLocalizedDayJs().startOf('month').format()
     );
-    emit('update:end', getLocalizedDayJs().endOf('month').format('YYYY-MM-DD'));
+    emit('update:end', getLocalizedDayJs().endOf('month').format());
     open.value = false;
 }
 
@@ -130,14 +130,14 @@ function setLastMonth() {
         getLocalizedDayJs()
             .subtract(1, 'month')
             .startOf('month')
-            .format('YYYY-MM-DD')
+            .format()
     );
     emit(
         'update:end',
         getLocalizedDayJs()
             .subtract(1, 'month')
             .endOf('month')
-            .format('YYYY-MM-DD')
+            .format()
     );
     open.value = false;
 }
@@ -145,36 +145,36 @@ function setLastMonth() {
 function setLast30Days() {
     emit(
         'update:start',
-        getLocalizedDayJs().subtract(30, 'days').format('YYYY-MM-DD')
+        getLocalizedDayJs().subtract(30, 'days').format()
     );
-    emit('update:end', getLocalizedDayJs().format('YYYY-MM-DD'));
+    emit('update:end', getLocalizedDayJs().format());
     open.value = false;
 }
 
 function setLast90Days() {
     emit(
         'update:start',
-        getDayJsInstance()().subtract(90, 'days').format('YYYY-MM-DD')
+        getDayJsInstance()().subtract(90, 'days').format()
     );
-    emit('update:end', getDayJsInstance()().format('YYYY-MM-DD'));
+    emit('update:end', getDayJsInstance()().format());
     open.value = false;
 }
 
 function setLast12Months() {
     emit(
         'update:start',
-        getLocalizedDayJs().subtract(12, 'months').format('YYYY-MM-DD')
+        getLocalizedDayJs().subtract(12, 'months').format()
     );
-    emit('update:end', getLocalizedDayJs().format('YYYY-MM-DD'));
+    emit('update:end', getLocalizedDayJs().format());
     open.value = false;
 }
 
 function setThisYear() {
     emit(
         'update:start',
-        getLocalizedDayJs().startOf('year').format('YYYY-MM-DD')
+        getLocalizedDayJs().startOf('year').format()
     );
-    emit('update:end', getLocalizedDayJs().endOf('year').format('YYYY-MM-DD'));
+    emit('update:end', getLocalizedDayJs().endOf('year').format());
     open.value = false;
 }
 
@@ -184,14 +184,14 @@ function setLastYear() {
         getLocalizedDayJs()
             .subtract(1, 'year')
             .startOf('year')
-            .format('YYYY-MM-DD')
+            .format()
     );
     emit(
         'update:end',
         getLocalizedDayJs()
             .subtract(1, 'year')
             .endOf('year')
-            .format('YYYY-MM-DD')
+            .format()
     );
     open.value = false;
 }