From bf04b15604aabe2b45ee61cc80ed3c3ced3d50e3 Mon Sep 17 00:00:00 2001
From: Postema Max <max@elynor.com>
Date: Wed, 11 Dec 2024 15:16:53 +0100
Subject: [PATCH 1/8] fix(directory): add the select all buttons

---
 .../checkout-components/CheckOut.vue          |  2 +-
 .../ApplicationHeaderPartialView.vue          | 36 ++++++++++++++++---
 2 files changed, 33 insertions(+), 5 deletions(-)

diff --git a/apps/directory/src/components/checkout-components/CheckOut.vue b/apps/directory/src/components/checkout-components/CheckOut.vue
index c3561b62cb..5148024859 100644
--- a/apps/directory/src/components/checkout-components/CheckOut.vue
+++ b/apps/directory/src/components/checkout-components/CheckOut.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <button
-      class="btn btn-primary"
+      class="btn btn-primary text-nowrap"
       @click="showCart = !showCart"
       :disabled="disableButton"
     >
diff --git a/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue b/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
index db7d78f558..236a4a8756 100644
--- a/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
+++ b/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
@@ -1,12 +1,39 @@
 <template>
   <div class="px-3 pt-1 headerbar card sticky-top border-0 shadow-sm">
     <div class="row my-2">
-      <div class="col-8" aria-label="action-bar">
+      <div class="col px-2" aria-label="action-bar">
         <div class="search-container mr-2 mb-2">
           <SearchFilter />
         </div>
       </div>
-      <div class="col-4 d-flex justify-content-end">
+
+        <div class="col d-flex filterbar justify-content-end">
+          <div>
+            <button
+            v-if="
+              hasActiveFilters && biobanksStore.biobankCardsCollectionCount > 0
+            "
+            @click="selectAllCollections"
+            type="button"
+            class="btn btn-secondary mb-3 text-nowrap"
+          >
+            Select all collections 
+            <span class="badge badge-light ml-2"> {{ biobanksStore.biobankCardsCollectionCount }}</span>
+          </button>
+        </div>
+        <div>
+          <button
+            v-if="
+              hasActiveFilters && biobanksStore.biobankCardsServicesCount > 0
+            "
+            @click="selectAllServices"
+            type="button"
+            class="btn btn-secondary mb-3 text-nowrap"
+          >
+            Select all services
+            <span class="badge badge-light ml-2"> {{ biobanksStore.biobankCardsServicesCount }}</span>
+          </button>
+        </div>
         <router-link
           v-if="showSettings"
           class="btn btn-light border mr-2 align-self-start"
@@ -50,7 +77,6 @@
         :key="toggleFilter.name"
         v-bind="toggleFilter"
       />
-
       <button
         v-if="hasActiveFilters"
         @click="clearAllFilters"
@@ -137,6 +163,8 @@ export default {
     clearAllFilters() {
       this.filtersStore.clearAllFilters();
     },
+    selectAllServices() {},
+    selectAllCollections() {},
     filterSelectionCount(facetIdentifier) {
       const options = this.filtersStore.filters[facetIdentifier];
       if (!options || !options.length) {
@@ -166,6 +194,6 @@ export default {
   display: inline-flex;
   position: relative;
   top: 2px; /* aligning it with the dropwdowns */
-  width: 44%;
+  width: 60%;
 }
 </style>

From 73d4a847d9b7a9f87e8175e92b69d2e7ec030b97 Mon Sep 17 00:00:00 2001
From: Postema Max <max@elynor.com>
Date: Thu, 12 Dec 2024 13:00:55 +0100
Subject: [PATCH 2/8] fix(directory): make the buttons work

---
 .../ApplicationHeaderPartialView.vue          | 52 +++++++++++++++----
 1 file changed, 43 insertions(+), 9 deletions(-)

diff --git a/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue b/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
index 236a4a8756..bf0ff7b222 100644
--- a/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
+++ b/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
@@ -7,18 +7,20 @@
         </div>
       </div>
 
-        <div class="col d-flex filterbar justify-content-end">
-          <div>
-            <button
+      <div class="col d-flex filterbar justify-content-end">
+        <div>
+          <button
             v-if="
-              hasActiveFilters && biobanksStore.biobankCardsCollectionCount > 0
+              hasActiveFilters && (biobanksStore.biobankCardsCollectionCount + biobanksStore.biobankCardsSubcollectionCount) > 0
             "
             @click="selectAllCollections"
             type="button"
             class="btn btn-secondary mb-3 text-nowrap"
           >
-            Select all collections 
-            <span class="badge badge-light ml-2"> {{ biobanksStore.biobankCardsCollectionCount }}</span>
+            Select all collections
+            <span class="badge badge-light ml-2">
+              {{ (biobanksStore.biobankCardsCollectionCount + biobanksStore.biobankCardsSubcollectionCount) }}</span
+            >
           </button>
         </div>
         <div>
@@ -31,7 +33,9 @@
             class="btn btn-secondary mb-3 text-nowrap"
           >
             Select all services
-            <span class="badge badge-light ml-2"> {{ biobanksStore.biobankCardsServicesCount }}</span>
+            <span class="badge badge-light ml-2">
+              {{ biobanksStore.biobankCardsServicesCount }}</span
+            >
           </button>
         </div>
         <router-link
@@ -163,8 +167,38 @@ export default {
     clearAllFilters() {
       this.filtersStore.clearAllFilters();
     },
-    selectAllServices() {},
-    selectAllCollections() {},
+    selectAllServices() {
+      const allSelections = this.biobanksStore.biobankCards.map((biobank) => ({
+        biobank: { id: biobank.id, name: biobank.name },
+        services: biobank.services.map((service) => ({
+          label: service.name,
+          value: service.id,
+        })),
+      }));
+      allSelections.forEach((item) => {
+        this.checkoutStore.addServicesToSelection(
+          item.biobank,
+          item.services,
+          true
+        );
+      });
+    },
+    selectAllCollections() {
+      const allSelections = this.biobanksStore.biobankCards.map((biobank) => ({
+        biobank: { id: biobank.id, name: biobank.name },
+        collections: biobank.collections.map((collection) => ({
+          label: collection.name,
+          value: collection.id,
+        })),
+      }));
+      allSelections.forEach((item) => {
+        this.checkoutStore.addCollectionsToSelection(
+          item.biobank,
+          item.collections,
+          true
+        );
+      });
+    },
     filterSelectionCount(facetIdentifier) {
       const options = this.filtersStore.filters[facetIdentifier];
       if (!options || !options.length) {

From 9a6a064ed28bc72d79ffe5cf2fac750cd0c5f102 Mon Sep 17 00:00:00 2001
From: Postema Max <max@elynor.com>
Date: Fri, 13 Dec 2024 09:28:28 +0100
Subject: [PATCH 3/8] fix: formating

---
 .../partial-views/ApplicationHeaderPartialView.vue     | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue b/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
index bf0ff7b222..0601a2d296 100644
--- a/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
+++ b/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
@@ -11,7 +11,10 @@
         <div>
           <button
             v-if="
-              hasActiveFilters && (biobanksStore.biobankCardsCollectionCount + biobanksStore.biobankCardsSubcollectionCount) > 0
+              hasActiveFilters &&
+              biobanksStore.biobankCardsCollectionCount +
+                biobanksStore.biobankCardsSubcollectionCount >
+                0
             "
             @click="selectAllCollections"
             type="button"
@@ -19,7 +22,10 @@
           >
             Select all collections
             <span class="badge badge-light ml-2">
-              {{ (biobanksStore.biobankCardsCollectionCount + biobanksStore.biobankCardsSubcollectionCount) }}</span
+              {{
+                biobanksStore.biobankCardsCollectionCount +
+                biobanksStore.biobankCardsSubcollectionCount
+              }}</span
             >
           </button>
         </div>

From 5f851c09754efe75032754056f7435ce0d85c2ef Mon Sep 17 00:00:00 2001
From: Postema Max <max@elynor.com>
Date: Fri, 13 Dec 2024 09:46:02 +0100
Subject: [PATCH 4/8] fix: formating for settings button

---
 .../ApplicationHeaderPartialView.vue           | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue b/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
index 0601a2d296..02c581c6a2 100644
--- a/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
+++ b/apps/directory/src/components/partial-views/ApplicationHeaderPartialView.vue
@@ -44,14 +44,16 @@
             >
           </button>
         </div>
-        <router-link
-          v-if="showSettings"
-          class="btn btn-light border mr-2 align-self-start"
-          to="/configuration"
-        >
-          <span class="mr-2">Settings</span>
-          <span class="fa-solid fa-gear" />
-        </router-link>
+        <div>
+          <router-link
+            v-if="showSettings"
+            class="btn btn-light border mr-2 mb-3 text-nowrap"
+            to="/configuration"
+          >
+            <span class="mr-2">Settings</span>
+            <span class="fa-solid fa-gear" />
+          </router-link>
+        </div>
         <check-out :bookmark="true" />
       </div>
     </div>

From 31e879551c28f5e8a0d554c8294ba962c2407fd9 Mon Sep 17 00:00:00 2001
From: Postema Max <max@elynor.com>
Date: Fri, 13 Dec 2024 14:00:07 +0100
Subject: [PATCH 5/8] fix(directory): add e2e test

---
 apps/directory/package.json                |  3 ++-
 apps/directory/tests/select-all-buttons.ts | 11 +++++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 apps/directory/tests/select-all-buttons.ts

diff --git a/apps/directory/package.json b/apps/directory/package.json
index 5d7865cd23..17a28f5d5e 100644
--- a/apps/directory/package.json
+++ b/apps/directory/package.json
@@ -13,7 +13,8 @@
     "test-ci": "vitest run",
     "format": "prettier src tests  --write --config ../.prettierrc.js",
     "checkFormat": "prettier src tests  --check --config ../.prettierrc.js",
-    "e2e": "playwright test"
+    "e2e": "playwright test",
+    "codegen": "playwright codegen"
   },
   "dependencies": {
     "@fortawesome/fontawesome-free": "6.5.2",
diff --git a/apps/directory/tests/select-all-buttons.ts b/apps/directory/tests/select-all-buttons.ts
new file mode 100644
index 0000000000..8a402c1734
--- /dev/null
+++ b/apps/directory/tests/select-all-buttons.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test';
+import { getAppRoute } from "./getAppRoute";
+
+test('select all collections and services', async ({ page }) => {
+  await page.goto(getAppRoute());
+  await page.getByRole('checkbox').check();
+  await page.getByRole('button', { name: 'Select all collections' }).click();
+  await expect(page.getByRole('main')).toContainText('2');
+  await page.getByRole('button', { name: 'Select all services' }).click();
+  await expect(page.getByRole('main')).toContainText('4');
+});
\ No newline at end of file

From 4e143ff42421c6279a1469878058006aad72f03d Mon Sep 17 00:00:00 2001
From: Postema Max <max@elynor.com>
Date: Fri, 13 Dec 2024 14:10:44 +0100
Subject: [PATCH 6/8] fix(directory): code formating

---
 apps/directory/tests/select-all-buttons.ts | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/apps/directory/tests/select-all-buttons.ts b/apps/directory/tests/select-all-buttons.ts
index 8a402c1734..02ab8ef4e2 100644
--- a/apps/directory/tests/select-all-buttons.ts
+++ b/apps/directory/tests/select-all-buttons.ts
@@ -1,11 +1,11 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from "@playwright/test";
 import { getAppRoute } from "./getAppRoute";
 
-test('select all collections and services', async ({ page }) => {
+test("select all collections and services", async ({ page }) => {
   await page.goto(getAppRoute());
-  await page.getByRole('checkbox').check();
-  await page.getByRole('button', { name: 'Select all collections' }).click();
-  await expect(page.getByRole('main')).toContainText('2');
-  await page.getByRole('button', { name: 'Select all services' }).click();
-  await expect(page.getByRole('main')).toContainText('4');
-});
\ No newline at end of file
+  await page.getByRole("checkbox").check();
+  await page.getByRole("button", { name: "Select all collections" }).click();
+  await expect(page.getByRole("main")).toContainText("2");
+  await page.getByRole("button", { name: "Select all services" }).click();
+  await expect(page.getByRole("main")).toContainText("4");
+});

From 716806dd52c06ae48a885870ffaadd7816e9775d Mon Sep 17 00:00:00 2001
From: Postema Max <max@elynor.com>
Date: Fri, 13 Dec 2024 14:55:18 +0100
Subject: [PATCH 7/8] fix: use correct e2e test name

---
 .../tests/{select-all-buttons.ts => select-all-buttons.spec.ts}   | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename apps/directory/tests/{select-all-buttons.ts => select-all-buttons.spec.ts} (100%)

diff --git a/apps/directory/tests/select-all-buttons.ts b/apps/directory/tests/select-all-buttons.spec.ts
similarity index 100%
rename from apps/directory/tests/select-all-buttons.ts
rename to apps/directory/tests/select-all-buttons.spec.ts

From cba5a777ed5dcd5c75a1213853b1595e5a9aada0 Mon Sep 17 00:00:00 2001
From: connoratrug <c.stroomberg@rug.nl>
Date: Wed, 18 Dec 2024 13:55:05 +0100
Subject: [PATCH 8/8] fix test: update for demo content

---
 apps/directory/tests/select-all-buttons.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/directory/tests/select-all-buttons.spec.ts b/apps/directory/tests/select-all-buttons.spec.ts
index 02ab8ef4e2..284eddce2c 100644
--- a/apps/directory/tests/select-all-buttons.spec.ts
+++ b/apps/directory/tests/select-all-buttons.spec.ts
@@ -7,5 +7,5 @@ test("select all collections and services", async ({ page }) => {
   await page.getByRole("button", { name: "Select all collections" }).click();
   await expect(page.getByRole("main")).toContainText("2");
   await page.getByRole("button", { name: "Select all services" }).click();
-  await expect(page.getByRole("main")).toContainText("4");
+  await expect(page.getByRole("main")).toContainText("6");
 });