fix flakyness in e2e tests for reporting

e2e/reporting.spec.ts

@@ -114,8 +114,8 @@ test('test that project filtering works in reporting', async ({ page }) => {
     await page.waitForLoadState('networkidle');
 
     // Verify only project1 time entries are shown
-    await expect(page.getByTestId('reporting_view').getByText(project1)).toBeVisible();
+    await expect(page.getByText(project1)).toBeVisible();
-    await expect(page.getByTestId('reporting_view').getByText(project2)).not.toBeVisible();
+    await expect(page.getByText(project2)).not.toBeVisible();
 });
 
 test('test that tag filtering works in reporting', async ({ page }) => {
@@ -142,7 +142,7 @@ test('test that tag filtering works in reporting', async ({ page }) => {
     ]);
 
     // Verify only time entries with tag1 are shown
-    await expect(page.getByTestId('reporting_view').getByText('1h 00min').first()).toBeVisible();
+    await expect(page.getByText('1h 00min').first()).toBeVisible();
 });
 
 test('test that billable status filtering works in reporting', async ({ page }) => {
@@ -164,7 +164,7 @@ test('test that billable status filtering works in reporting', async ({ page })
     ]);
     await page.waitForLoadState('networkidle');
 
-    await expect(page.getByTestId('reporting_view').getByText('1h 00min').first()).toBeVisible();
+    await expect(page.getByText('1h 00min').first()).toBeVisible();
 });
 
 

resources/js/packages/ui/src/TimeEntry/TimeEntryAggregateRow.vue

@@ -154,7 +154,7 @@ function onSelectChange(checked: boolean) {
                         "></BillableToggleButton>
                     <div class="flex-1">
                         <button
-                            :class="twMerge('text-text-secondary px-1 py-1.5 bg-transparent text-center hover:bg-card-background rounded-lg border border-transparent hover:border-card-border text-sm font-medium focus-visible:outline-none focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:bg-tertiary', organization?.time_format === '12-hours' ? 'w-[170px]' : 'w-[120px]')"
+                            :class="twMerge('text-text-secondary w-[110px] px-1 py-1.5 bg-transparent text-center hover:bg-card-background rounded-lg border border-transparent hover:border-card-border text-sm font-medium focus-visible:outline-none focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:bg-tertiary', organization?.time_format === '12-hours' ? 'w-[160px]' : 'w-[110px]')"
                             @click="expanded = !expanded">
                             {{ formatStartEnd(timeEntry.start, timeEntry.end, organization?.time_format) }}
                         </button>