always show create schedule button when 0 schedules (#3205)

* always show create schedule button when 0 schedules

* fix spec

* fix spec

* fix other spec

* fix other specs

Author: rossedfort

src/lib/pages/schedules.svelte

@@ -87,30 +87,36 @@
   const onError = (err: APIErrorResponse) => {
     error = err?.body?.message || translate('schedules.error-message-fetching');
   };
+
+  const showFilters = $derived(Number($schedulesCount) > 0 || query);
 </script>
 
 <div class="flex flex-col gap-4">
   <h1 class="flex flex-col gap-0 md:flex-row md:items-center md:gap-2">
     <SchedulesCount />
   </h1>
-  <div class="flex flex-col justify-between gap-2 md:flex-row">
-    {#if Number($schedulesCount) > 0 || query}
+  <div
+    class="flex flex-col gap-2 md:flex-row {showFilters
+      ? 'justify-between'
+      : 'justify-end'}"
+  >
+    {#if showFilters}
       <SearchAttributeFilter
         bind:filters={$scheduleFilters}
         {searchAttributeOptions}
         refresh={() => {
           refresh = Date.now();
         }}
       />
-      {#if !createDisabled}
-        <Button
-          data-testid="create-schedule"
-          href={routeForScheduleCreate({ namespace })}
-          disabled={!writeActionsAreAllowed()}
-        >
-          {translate('schedules.create')}
-        </Button>
-      {/if}
+    {/if}
+    {#if !createDisabled}
+      <Button
+        data-testid="create-schedule"
+        href={routeForScheduleCreate({ namespace })}
+        disabled={!writeActionsAreAllowed()}
+      >
+        {translate('schedules.create')}
+      </Button>
     {/if}
   </div>
 </div>

tests/e2e/schedules.spec.ts

@@ -23,8 +23,8 @@ test.describe('Schedules Page', () => {
     await scheduleButton.click();
     await expect(page).toHaveURL(/schedules/);
     const createScheduleButton = page.getByTestId('create-schedule');
-    await expect(createScheduleButton).toBeVisible();
-    await createScheduleButton.click();
+    await expect(createScheduleButton.first()).toBeVisible();
+    await createScheduleButton.first().click();
     await expect(page).toHaveURL(/create/);
 
     await page.getByTestId('schedule-name-input').fill('e2e-schedule-1');

tests/integration/disable-write-actions.spec.ts

@@ -51,6 +51,6 @@ test.describe('Disable write actions on empty schedules list actions', () => {
     const namespace = page.locator('h1');
     await expect(namespace).toHaveText('0 Schedules');
     const createButton = page.getByTestId('create-schedule');
-    await expect(createButton).toBeDisabled();
+    await expect(createButton.first()).toBeDisabled();
   });
 });

tests/integration/schedule-edit.spec.ts

@@ -21,7 +21,7 @@ test.describe('Schedules List with schedules', () => {
     await page.waitForResponse(SCHEDULES_COUNT_API);
 
     const createButton = page.getByTestId('create-schedule');
-    await expect(createButton).toBeEnabled();
+    await expect(createButton.first()).toBeEnabled();
 
     const scheduleLink = page.getByRole('link', { name: /test-schedule/i });
     await expect(scheduleLink).toBeVisible();

tests/integration/schedules-list.spec.ts

@@ -22,7 +22,7 @@ test.describe('Schedules List with no schedules', () => {
     await expect(namespace).toHaveText('0 Schedules');
 
     const createButton = page.getByTestId('create-schedule');
-    await expect(createButton).toBeEnabled();
+    await expect(createButton.first()).toBeEnabled();
   });
 });