fix focus & click behaviour of time range selector and task project dropdown modal

resources/js/Components/Common/TimeEntry/TimeEntryRangeSelector.vue

@@ -33,6 +33,7 @@ const open = ref(false);
                     @changed="
                         (newStart, newEnd) => emit('changed', newStart, newEnd)
                     "
+                    focus
                     :start="start"
                     :end="end">
                 </TimeRangeSelector>

resources/js/Components/Common/TimeRangeSelector.vue

@@ -9,6 +9,7 @@ import dayjs from 'dayjs';
 const props = defineProps<{
     start: string;
     end: string | null;
+    focus?: boolean;
 }>();
 
 // The timestamps for the changed event are UTC
@@ -56,7 +57,7 @@ watch(focused, (newValue, oldValue) => {
             <div class="space-y-1">
                 <TimePicker
                     data-testid="time_entry_range_start"
-                    focus
+                    :focus
                     @changed="updateTimeEntry"
                     v-model="tempStart"></TimePicker>
                 <DatePicker

resources/js/Components/Common/TimeTracker/TimeTrackerProjectTaskDropdown.vue

@@ -314,7 +314,7 @@ const showCreateProject = ref(false);
             <span>Add new project</span>
         </Badge>
     </div>
-    <Dropdown v-else v-model="open" :closeOnContentClick="true" align="bottom">
+    <Dropdown v-else v-model="open" :closeOnContentClick="false" align="bottom">
         <template #trigger>
             <ProjectBadge
                 ref="projectDropdownTrigger"
@@ -340,6 +340,7 @@ const showCreateProject = ref(false);
                 :value="searchValue"
                 @input="updateSearchValue"
                 @keydown.enter="addClientIfNoneExists"
+                @click.prevent="searchInput?.focus()"
                 data-testid="client_dropdown_search"
                 @keydown.up.prevent="moveHighlightUp"
                 @keydown.down.prevent="moveHighlightDown"

resources/js/Components/Common/TimeTracker/TimeTrackerRangeSelector.vue

@@ -119,6 +119,13 @@ async function updateTimeRange(newStart: string) {
         }
     }
 }
+
+const startTime = computed(() => {
+    if (currentTimeEntry.value.start && currentTimeEntry.value.start !== '') {
+        return currentTimeEntry.value.start;
+    }
+    return dayjs().utc().format();
+});
 </script>
 
 <template>
@@ -142,7 +149,7 @@ async function updateTimeRange(newStart: string) {
             <template #content>
                 <TimeRangeSelector
                     @changed="updateTimeRange"
-                    :start="currentTimeEntry.start"
+                    :start="startTime"
                     :end="null">
                 </TimeRangeSelector>
             </template>

resources/js/Components/TimeTracker.vue

@@ -152,7 +152,10 @@ function switchToTimeEntryOrganization() {
                             "></BillableToggleButton>
                     </div>
                     <div class="border-l border-card-border">
-                        <TimeTrackerRangeSelector></TimeTrackerRangeSelector>
+                        <TimeTrackerRangeSelector
+                            @keydown.enter="
+                                startTimerIfNotActive
+                            "></TimeTrackerRangeSelector>
                     </div>
                 </div>
             </div>