diff --git a/frontend/cypress/e2e/pages/SearchPage.cy.ts b/frontend/cypress/e2e/pages/SearchPage.cy.ts
index e51aa6e908..d1c9e3ed95 100644
--- a/frontend/cypress/e2e/pages/SearchPage.cy.ts
+++ b/frontend/cypress/e2e/pages/SearchPage.cy.ts
@@ -5,21 +5,73 @@ describe("Search Page", () => {
     count: 0,
   };
 
-  const checkDisplayedResults = (clientList: ClientSearchResult[]) => {
-    clientList.forEach((client) => {
+  const fullSearchCounter = {
+    count: 0,
+  };
+
+  const checkAutocompleteResults = (clientList: ClientSearchResult[]) => {
+    clientList.forEach((client, index) => {
       cy.get("#search-box")
-        .find(`cds-combo-box-item[data-value^="${client.clientNumber}"]`)
-        .should("exist");
+        .find("cds-combo-box-item")
+        .eq(index)
+        .should("exist")
+        .should("have.attr", "data-id", client.clientNumber);
     });
   };
+
+  const checkTableResults = (clientList: ClientSearchResult[]) => {
+    clientList.forEach((client, index) => {
+      cy.get("cds-table")
+        .find("cds-table-row")
+        .eq(index)
+        .contains(client.clientNumber)
+        .should("be.visible");
+
+      const acronymColumnIndex = 3;
+
+      // only the first client has an acronym
+      const expectedValue = index === 0 ? client.clientAcronym : "-";
+
+      cy.get("cds-table")
+        .find("cds-table-row")
+        .eq(index)
+        .find(`cds-table-cell:nth-child(${acronymColumnIndex})`)
+        .contains(expectedValue)
+        .should("be.visible");
+    });
+  };
+
   beforeEach(() => {
-    // reset counter
+    // reset counters
     predictiveSearchCounter.count = 0;
+    fullSearchCounter.count = 0;
+
+    cy.intercept(
+      {
+        pathname: "/api/clients/search",
+        query: {
+          keyword: "*",
+        },
+      },
+      (req) => {
+        predictiveSearchCounter.count++;
+        req.continue();
+      },
+    ).as("predictiveSearch");
 
-    cy.intercept("/api/clients/search?keyword=*", (req) => {
-      predictiveSearchCounter.count++;
-      req.continue();
-    }).as("predictiveSearch");
+    cy.intercept(
+      {
+        pathname: "/api/clients/search",
+        query: {
+          page: "*",
+          size: "*",
+        },
+      },
+      (req) => {
+        fullSearchCounter.count++;
+        req.continue();
+      },
+    ).as("fullSearch");
 
     cy.viewport(1920, 1080);
     cy.visit("/");
@@ -63,7 +115,7 @@ describe("Search Page", () => {
           .should("have.length", data.length)
           .should("be.visible");
 
-        checkDisplayedResults(data);
+        checkAutocompleteResults(data);
       });
     });
 
@@ -91,12 +143,12 @@ describe("Search Page", () => {
             .should("have.length", data.length)
             .should("be.visible");
 
-          checkDisplayedResults(data);
+          checkAutocompleteResults(data);
         });
       });
     });
 
-    describe("and user clicks a result", () => {
+    describe("and user clicks an Autocomplete result", () => {
       const clientNumber = "00054076";
       beforeEach(() => {
         cy.get("#search-box")
@@ -116,6 +168,136 @@ describe("Search Page", () => {
         );
       });
     });
+
+    describe("and clicks the Search button", () => {
+      beforeEach(() => {
+        cy.wait("@predictiveSearch");
+        cy.get("#search-button").click();
+      });
+      it("makes one API call with the entered keywords", () => {
+        cy.wait("@fullSearch").then((interception) => {
+          const { query } = interception.request;
+          expect(query.keyword).to.eq("car");
+          expect(query.page).to.eq("0");
+        });
+
+        cy.wait(100); // Waits additional time to make sure there's no duplicate API calls.
+        cy.wrap(fullSearchCounter).its("count").should("eq", 1);
+      });
+
+      it("displays the results on the table", () => {
+        cy.wait("@fullSearch").then((interception) => {
+          const data = interception.response.body;
+
+          cy.wrap(data).should("be.an", "array").and("have.length.greaterThan", 0);
+
+          cy.get("cds-table")
+            .find("cds-table-row")
+            .should("have.length", data.length)
+            .should("be.visible");
+
+          checkTableResults(data);
+        });
+      });
+
+      describe("and user clicks a result on the table", () => {
+        const clientNumber = "00191086";
+        beforeEach(() => {
+          cy.get("cds-table").contains("cds-table-row", clientNumber).click();
+        });
+        it("navigates to the client details", () => {
+          const greenDomain = "green-domain.com";
+          cy.get("@windowOpen").should(
+            "be.calledWith",
+            `https://${greenDomain}/int/client/client02MaintenanceAction.do?bean.clientNumber=${clientNumber}`,
+            "_blank",
+            "noopener",
+          );
+        });
+      });
+
+      describe("and clicks the Next page button on the table footer", () => {
+        beforeEach(() => {
+          cy.wait("@fullSearch");
+          cy.get('[tooltip-text="Next page"]').click();
+        });
+        it("makes an API call for the second page of results", () => {
+          cy.wait("@fullSearch").then((interception) => {
+            const { query } = interception.request;
+            expect(query.keyword).to.eq("car");
+            expect(query.page).to.eq("1");
+          });
+          cy.wrap(fullSearchCounter).its("count").should("eq", 2);
+        });
+
+        it("updates the results on the table", () => {
+          cy.wait("@fullSearch").then((interception) => {
+            const data = interception.response.body;
+
+            cy.wrap(data).should("be.an", "array").and("have.length.greaterThan", 0);
+
+            cy.get("cds-table")
+              .find("cds-table-row")
+              .should("have.length", data.length)
+              .should("be.visible");
+
+            checkTableResults(data);
+          });
+        });
+
+        describe("and clicks the Search button again", () => {
+          beforeEach(() => {
+            cy.wait("@fullSearch");
+
+            // sanity check
+            cy.get("#pages-select").should("have.value", "2");
+
+            cy.get("#search-button").click();
+          });
+          it("makes a new API call for the first page of results", () => {
+            cy.wait("@fullSearch").then((interception) => {
+              const { query } = interception.request;
+              expect(query.keyword).to.eq("car");
+              expect(query.page).to.eq("0");
+            });
+            cy.wrap(fullSearchCounter).its("count").should("eq", 3);
+          });
+
+          it("updates the results on the table", () => {
+            cy.wait("@fullSearch").then((interception) => {
+              // reset to page 1
+              cy.get("#pages-select").should("have.value", "1");
+
+              const data = interception.response.body;
+
+              cy.wrap(data).should("be.an", "array").and("have.length.greaterThan", 0);
+
+              cy.get("cds-table")
+                .find("cds-table-row")
+                .should("have.length", data.length)
+                .should("be.visible");
+
+              checkTableResults(data);
+            });
+          });
+        });
+      });
+    });
+
+    describe("and hits enter on the search box", () => {
+      beforeEach(() => {
+        cy.wait("@predictiveSearch");
+        cy.fillFormEntry("#search-box", "{enter}", { skipBlur: true });
+      });
+      it("makes the API call with the entered keywords", () => {
+        cy.wait("@fullSearch").then((interception) => {
+          const { query } = interception.request;
+          expect(query.keyword).to.eq("car");
+          expect(query.page).to.eq("0");
+        });
+        cy.wrap(fullSearchCounter).its("count").should("eq", 1);
+      });
+    });
   });
 
   describe("when user fills in the search box with an invalid value", () => {
@@ -130,5 +312,69 @@ describe("Search Page", () => {
       cy.wait(500); // This time has to be greater than the debouncing time
       cy.wrap(predictiveSearchCounter).its("count").should("eq", 0);
     });
+
+    describe("and clicks the Search button", () => {
+      beforeEach(() => {
+        cy.get("#search-button").click();
+      });
+      it("makes no API call", () => {
+        cy.wait(500); // This time has to be greater than the debouncing time
+        cy.wrap(fullSearchCounter).its("count").should("eq", 0);
+      });
+    });
+  });
+
+  describe("Search with no keywords", () => {
+    beforeEach(() => {
+      cy.get("#search-button").click();
+    });
+    it("makes an API call even without any keywords", () => {
+      cy.wait("@fullSearch").then((interception) => {
+        const { query } = interception.request;
+        expect(query.keyword).to.eq("");
+        expect(query.page).to.eq("0");
+      });
+    });
+  });
+
+  describe("when the API is returning errors", () => {
+    beforeEach(() => {
+      // The "error" value actually triggers the error response
+      cy.fillFormEntry("#search-box", "error");
+    });
+    describe("and user clicks the Search button", () => {
+      beforeEach(() => {
+        cy.get("#search-button").click();
+      });
+
+      it("displays an error notification", () => {
+        cy.wait("@fullSearch");
+
+        cy.get("cds-actionable-notification")
+          .shadow()
+          .contains("Something went wrong")
+          .should("be.visible");
+      });
+
+      describe("and the API stops returning errors", () => {
+        beforeEach(() => {
+          cy.wait("@fullSearch");
+
+          // Replacing the "error" value actually triggers a successful response
+          cy.fillFormEntry("#search-box", "okay");
+        });
+        describe("and user clicks the Search button", () => {
+          beforeEach(() => {
+            cy.get("#search-button").click();
+          });
+
+          it("hides the error notification", () => {
+            cy.wait("@fullSearch");
+
+            cy.get("cds-actionable-notification").should("not.exist");
+          });
+        });
+      });
+    });
   });
 });
diff --git a/frontend/src/assets/styles/global.scss b/frontend/src/assets/styles/global.scss
index e5a2e01cf0..55b4dd72ca 100644
--- a/frontend/src/assets/styles/global.scss
+++ b/frontend/src/assets/styles/global.scss
@@ -1,8 +1,17 @@
 @use "sass:map";
 @use "@carbon/styles";
+@use '@carbon/styles/scss/theme';
+@use '@carbon/themes';
 @use "@bcgov-nr/nr-fsa-theme/design-tokens/type-family.scss" as typeFamily;
+@use '@bcgov-nr/nr-fsa-theme/design-tokens/light-tags.scss' as light-tag-overrides;
+
+// adds cds-tag related tokens
+@include theme.add-component-tokens(light-tag-overrides.$light-tag-token-overrides);
 
 :root {
+  // the empty list passed in prevents from emitting the full theme
+  @include themes.theme(());
+
   --others-transparent-transparent: rgba(255, 255, 255, 0);
   --light-theme-border-subtle-01: #dfdfe1;
   --light-theme-button-button-primary: #0073e6;
@@ -1486,6 +1495,22 @@ cds-table-header-cell {
   width: 1.5rem;
 }
 
+.col-6_75rem {
+  width: 6.75rem;
+}
+
+.col-19_4375rem {
+  width: 19.4375rem;
+}
+
+.col-14_75rem {
+  width: 14.75rem;
+}
+
+.col-7_0625rem {
+  width: 7.0625rem;
+}
+
 cds-pagination {
   border-radius: 0px 0px 4px 4px;
   border-top: 1px solid var(--light-theme-border-border-subtle-01, #dfdfe1);
diff --git a/frontend/src/components/forms/AutoCompleteInputComponent.vue b/frontend/src/components/forms/AutoCompleteInputComponent.vue
index 1f3075e400..a6a3833b83 100644
--- a/frontend/src/components/forms/AutoCompleteInputComponent.vue
+++ b/frontend/src/components/forms/AutoCompleteInputComponent.vue
@@ -42,6 +42,7 @@ const emit = defineEmits<{
   (e: "update:model-value", value: string): void;
   (e: "update:selected-value", value: BusinessSearchResult | undefined): void;
   (e: "click:option", value: string): void;
+  (e: "press:enter"): void;
 }>();
 
 //We initialize the error message handling for validation
@@ -113,7 +114,7 @@ const emitValueChange = (newValue: string, isSelectEvent = false): void => {
       : undefined;
   }
 
-  emit("update:model-value", selectedValue?.name ?? newValue);
+  emit("update:model-value", selectedValue?.name ?? newValue ?? "");
   emit("update:selected-value", selectedValue);
   emit("empty", isEmpty(newValue));
 };
@@ -185,6 +186,9 @@ const validateInput = (newValue: string, validations = props.validations) => {
   }
 };
 
+const isClickSelectEvent = ref(false);
+const isKeyboardSelectEvent = ref(false);
+
 const selectAutocompleteItem = (event: any) => {
   const newValue = event?.detail?.item?.getAttribute("data-id");
   emitValueChange(newValue, true);
@@ -192,6 +196,13 @@ const selectAutocompleteItem = (event: any) => {
 };
 
 const preSelectAutocompleteItem = (event: any) => {
+  if (!isClickSelectEvent.value) {
+    isKeyboardSelectEvent.value = true;
+  }
+
+  // resets the flag
+  isClickSelectEvent.value = false;
+
   if (event?.detail?.item) {
     const newValue = event?.detail?.item?.getAttribute("data-id");
     emit("click:option", newValue);
@@ -201,6 +212,20 @@ const preSelectAutocompleteItem = (event: any) => {
   }
 };
 
+const onPressEnter = () => {
+  // prevents emitting the event when this is a selection with the keyboard
+  if (!isKeyboardSelectEvent.value) {
+    emit("press:enter");
+  }
+
+  // resets the flag
+  isKeyboardSelectEvent.value = false;
+};
+
+const onItemClick = () => {
+  isClickSelectEvent.value = true;
+};
+
 const onTyping = (event: any) => {
   isUserEvent.value = true;
   inputValue.value = event.srcElement._filterInputValue;
@@ -314,6 +339,7 @@ const safeHelperText = computed(() => props.tip || " ");
             validateInput(event.srcElement._filterInputValue);
           }
         "
+        @keypress.enter="onPressEnter"
         :data-focus="id"
         :data-scroll="id"
         :data-id="'input-' + id"
@@ -327,6 +353,7 @@ const safeHelperText = computed(() => props.tip || " ");
           :value="getComboBoxItemValue(item)"
           v-shadow
           :data-loading="item.name === loadingName"
+          @click="onItemClick"
         >
           <template v-if="item.name === loadingName">
             <cds-inline-loading />
diff --git a/frontend/src/pages/SearchPage.vue b/frontend/src/pages/SearchPage.vue
index 86f73ee7e3..d5c562f67d 100644
--- a/frontend/src/pages/SearchPage.vue
+++ b/frontend/src/pages/SearchPage.vue
@@ -1,9 +1,17 @@
 <script setup lang="ts">
 import ForestClientUserSession from "@/helpers/ForestClientUserSession";
-import { ref, computed, watch } from "vue";
+import { ref, computed, watch, onMounted } from "vue";
+
+// Carbon
+import "@carbon/web-components/es/components/data-table/index";
+import "@carbon/web-components/es/components/button/index";
+import "@carbon/web-components/es/components/pagination/index";
+import "@carbon/web-components/es/components/select/index";
+import "@carbon/web-components/es/components/tag/index";
+
 import { useFetchTo } from "@/composables/useFetch";
 import type { ClientSearchResult, CodeNameType } from "@/dto/CommonTypesDto";
-import { adminEmail, getObfuscatedEmailLink } from "@/services/ForestClientService";
+import { adminEmail, getObfuscatedEmailLink, toTitleCase } from "@/services/ForestClientService";
 import summit from "@carbon/pictograms/es/summit";
 import useSvg from "@/composables/useSvg";
 
@@ -21,16 +29,19 @@ const summitSvg = useSvg(summit);
 
 const userhasAuthority = ["CLIENT_VIEWER", "CLIENT_EDITOR", "CLIENT_ADMIN", "CLIENT_SUSPEND"].some(authority => ForestClientUserSession.authorities.includes(authority));
 
-let networkErrorMsg = ref("");
+const networkErrorMsg = ref("");
 
 // Table data
-const tableData = ref<ClientSearchResult[]>([]);
+const tableData = ref<ClientSearchResult[]>();
 const pageNumber = ref(1);
 const totalItems = ref(0);
 const pageSize = ref(10);
 
 const searchKeyword = ref("");
 
+// empty is valid
+const valid = ref(true);
+
 const predictiveSearchUri = computed(
   () => `/api/clients/search?keyword=${encodeURIComponent(searchKeyword.value)}`,
 );
@@ -40,37 +51,62 @@ const fullSearchUri = computed(
     `/api/clients/search?page=${pageNumber.value - 1}&size=${pageSize.value}&keyword=${encodeURIComponent(searchKeyword.value)}`,
 );
 
-const search = () => {
-  const { response, fetch, loading, error: fetchError } = useFetchTo(fullSearchUri, tableData);
-  if (!loading.value) fetch();
+const {
+  response: searchResponse,
+  fetch,
+  loading: loadingSearch,
+  error: searchError,
+} = useFetchTo(fullSearchUri, tableData, { skip: true });
+
+const search = (skipResetPage = false) => {
+  if (!valid.value) {
+    return;
+  }
 
-  watch(response, () => {
-    const totalCount = parseInt(response.value.headers["x-total-count"] || "0");
-    totalItems.value = totalCount;
-  });
+  // resets any error message
+  networkErrorMsg.value = "";
 
-  watch([fetchError], () => {
-    if (fetchError.value.message) {
-      networkErrorMsg.value = fetchError.value.message;
-    }
-  });
+  if (!skipResetPage) {
+    pageNumber.value = 1;
+  }
+  fetch();
 };
 
+watch(searchResponse, () => {
+  const totalCount = parseInt(searchResponse.value.headers["x-total-count"] || "0");
+  totalItems.value = totalCount;
+});
+
+watch([searchError], () => {
+  if (searchError.value.message) {
+    networkErrorMsg.value = searchError.value.message;
+  }
+});
+
 const tagColor = (status: string) => {
   switch (status) {
     case "Active":
       return "green";
-    case "Inactive":
+    case "Deactivated":
+      return "purple";
+    case "Receivership":
+      return "magenta";
+    case "Suspended":
       return "red";
+    case "Deceased":
+      return "gray";
     default:
-      return "purple";
+      return "";
   }
 };
 
 const paginate = (event: any) => {
+  const hasPageChanged = event.detail.page !== pageNumber.value;
   pageNumber.value = event.detail.page;
   pageSize.value = event.detail.pageSize;
-  search();
+  if (hasPageChanged) {
+    search(true);
+  }
 };
 
 /**
@@ -101,7 +137,19 @@ const validationsOnChange = [isAscii(lowerCaseLabel), isMaxSizeMsg(lowerCaseLabe
 
 const validations = [optional(isMinSizeMsg(lowerCaseLabel, 3)), ...validationsOnChange];
 
-const valid = ref(!!searchKeyword.value);
+const skeletonReference = ref(null);
+
+const disableSkelleton = () => {
+  if (skeletonReference.value) {
+    skeletonReference.value.showHeader = false;
+    skeletonReference.value.showToolbar = false;
+  }
+};
+// This is to make the skelleton data-table to hide some elements
+onMounted(() => {
+  disableSkelleton();
+  watch(skeletonReference, disableSkelleton);
+});
 </script>
 
 <template>
@@ -157,25 +205,26 @@ const valid = ref(!!searchKeyword.value);
           @click:option="openClientDetails"
           @update:model-value="valid = false"
           @error="valid = !$event"
+          @press:enter="search()"
         />
       </data-fetcher>
-      <cds-button kind="primary" @click.prevent="search" id="search-button">
+      <cds-button kind="primary" @click.prevent="search()" id="search-button">
         <span>Search</span>
         <Search16 slot="icon" />
       </cds-button>
     </div>
     <div id="datatable" v-if="userhasAuthority">
 
-      <cds-table use-zebra-styles v-if="!loading">
+      <cds-table use-zebra-styles v-if="!loadingSearch">
         <cds-table-head>
           <cds-table-header-row>
             <cds-table-header-cell />
-            <cds-table-header-cell>Client number</cds-table-header-cell>
-            <cds-table-header-cell>Acronym</cds-table-header-cell>
-            <cds-table-header-cell>Name</cds-table-header-cell>
-            <cds-table-header-cell>Type</cds-table-header-cell>
-            <cds-table-header-cell>City</cds-table-header-cell>
-            <cds-table-header-cell>Status</cds-table-header-cell>
+            <cds-table-header-cell class="col-6_75rem">Client number</cds-table-header-cell>
+            <cds-table-header-cell class="col-6_75rem">Acronym</cds-table-header-cell>
+            <cds-table-header-cell class="col-19_4375rem">Name</cds-table-header-cell>
+            <cds-table-header-cell class="col-14_75rem">Type</cds-table-header-cell>
+            <cds-table-header-cell class="col-14_75rem">City</cds-table-header-cell>
+            <cds-table-header-cell class="col-7_0625rem">Status</cds-table-header-cell>
             <cds-table-header-cell />
           </cds-table-header-row>
         </cds-table-head>
@@ -187,10 +236,10 @@ const valid = ref(!!searchKeyword.value);
           >
             <cds-table-cell />
             <cds-table-cell><span>{{ row.clientNumber }}</span></cds-table-cell>
-            <cds-table-cell><span>{{ row.clientAcronym }}</span></cds-table-cell>
-            <cds-table-cell><span>{{ row.clientFullName }}</span></cds-table-cell>
+            <cds-table-cell><span>{{ row.clientAcronym || "-" }}</span></cds-table-cell>
+            <cds-table-cell><span>{{ toTitleCase(row.clientFullName) }}</span></cds-table-cell>
             <cds-table-cell><span>{{ row.clientType }}</span></cds-table-cell>
-            <cds-table-cell><span>{{ row.city }}</span></cds-table-cell>
+            <cds-table-cell><span>{{ toTitleCase(row.city) }}</span></cds-table-cell>
             <cds-table-cell>
               <div>
                 <cds-tag :type="tagColor(row.clientStatus)" title=""><span>{{ row.clientStatus }}</span></cds-tag>
@@ -210,27 +259,32 @@ const valid = ref(!!searchKeyword.value);
       />
     </div>
 
-    <div class="empty-table-list" 
-        v-if="totalItems == 0 && userhasAuthority && !loading">
-        <summit-svg alt="Summit pictogram" 
-                    class="standard-svg"/>
-        <p class="heading-02">Nothing to show yet!</p>
-        <p class="body-compact-01">Enter at least one criteria to start the search.</p>
-        <p class="body-compact-01">The list will display here.</p>
+    <div
+      class="empty-table-list"
+      v-if="(!tableData || totalItems == 0) && userhasAuthority && !loadingSearch"
+    >
+      <summit-svg alt="Summit pictogram" class="standard-svg" />
+      <p class="heading-02">Nothing to show yet!</p>
+      <p class="body-compact-01">Enter at least one criteria to start the search.</p>
+      <p class="body-compact-01">The list will display here.</p>
     </div>
-    
+
     <div class="paginator" v-if="totalItems && userhasAuthority">
       <cds-pagination
-          items-per-page-text="Submissions per page"        
-          :page-size="pageSize" 
-          :total-items="totalItems"
-          @cds-pagination-changed-current="paginate"
-          >
-            <cds-select-item :value="10" selected>10</cds-select-item>
-            <cds-select-item :value="20">20</cds-select-item>
-            <cds-select-item :value="30">30</cds-select-item>
-            <cds-select-item :value="40">40</cds-select-item>
-            <cds-select-item :value="50">50</cds-select-item>
+        items-per-page-text="Clients per page"
+        :page="pageNumber"
+        :page-size="pageSize"
+        :total-items="totalItems"
+        @cds-pagination-changed-current="paginate"
+        :formatStatusWithDeterminateTotal="
+          ({ start, end, count }) => `${start}–${end} of ${count} client${count <= 1 ? '' : 's'}`
+        "
+      >
+        <cds-select-item :value="10" selected>10</cds-select-item>
+        <cds-select-item :value="20">20</cds-select-item>
+        <cds-select-item :value="30">30</cds-select-item>
+        <cds-select-item :value="40">40</cds-select-item>
+        <cds-select-item :value="50">50</cds-select-item>
       </cds-pagination>
     </div>
 
diff --git a/frontend/stub/__files/response-client-search-keyword-CAR.json b/frontend/stub/__files/response-client-search-keyword-CAR.json
index 62ba41f6b0..c81d48fda9 100644
--- a/frontend/stub/__files/response-client-search-keyword-CAR.json
+++ b/frontend/stub/__files/response-client-search-keyword-CAR.json
@@ -2,7 +2,7 @@
   {
     "clientNumber": "00049695",
     "clientAcronym": null,
-    "clientName": "CARLY Carleton CARGO",
+    "clientFullName": "CARLY Carleton CARGO",
     "clientType": "Individual",
     "city": "WILLIAMS LAKE",
     "clientStatus": "Active",
@@ -11,7 +11,7 @@
   {
     "clientNumber": "00054076",
     "clientAcronym": null,
-    "clientName": "CARYL Cassie CARLOW",
+    "clientFullName": "CARYL Cassie CARLOW",
     "clientType": "Individual",
     "city": "CAMPBELL RIVER",
     "clientStatus": "Active",
@@ -20,7 +20,7 @@
   {
     "clientNumber": "00025941",
     "clientAcronym": null,
-    "clientName": "CAREY Calista CARDON",
+    "clientFullName": "CAREY Calista CARDON",
     "clientType": "Individual",
     "city": "WILLIAMS LAKE",
     "clientStatus": "Active",
@@ -29,7 +29,7 @@
   {
     "clientNumber": "00010998",
     "clientAcronym": null,
-    "clientName": "CARLO Carri CAMERO",
+    "clientFullName": "CARLO Carri CAMERO",
     "clientType": "Individual",
     "city": "VANCOUVER",
     "clientStatus": "Active",
@@ -38,7 +38,7 @@
   {
     "clientNumber": "00116666",
     "clientAcronym": null,
-    "clientName": "CARMA Carie CARRILO",
+    "clientFullName": "CARMA Carie CARRILO",
     "clientType": "Individual",
     "city": "WESTBRIDGE",
     "clientStatus": "Active",
@@ -47,7 +47,7 @@
   {
     "clientNumber": "00153340",
     "clientAcronym": null,
-    "clientName": "CHARIS Chucho CARSON",
+    "clientFullName": "CHARIS Chucho CARSON",
     "clientType": "Individual",
     "city": "PORT MCNEILL",
     "clientStatus": "Active",
@@ -56,7 +56,7 @@
   {
     "clientNumber": "00015449",
     "clientAcronym": null,
-    "clientName": "CATHERINE Chaim CAREY",
+    "clientFullName": "CATHERINE Chaim CAREY",
     "clientType": "Individual",
     "city": "CAMPBELL RIVER",
     "clientStatus": "Active",
@@ -65,7 +65,7 @@
   {
     "clientNumber": "00142058",
     "clientAcronym": null,
-    "clientName": "CARROLL Carrie CARRICK",
+    "clientFullName": "CARROLL Carrie CARRICK",
     "clientType": "Individual",
     "city": "WINFIELD",
     "clientStatus": "Active",
@@ -74,7 +74,7 @@
   {
     "clientNumber": "00131543",
     "clientAcronym": null,
-    "clientName": "CAROLYN Casey CARCAMO",
+    "clientFullName": "CAROLYN Casey CARCAMO",
     "clientType": "Individual",
     "city": "TAPPEN",
     "clientStatus": "Active",
@@ -83,7 +83,7 @@
   {
     "clientNumber": "00112109",
     "clientAcronym": null,
-    "clientName": "CARLITOS Candi CARRETTA",
+    "clientFullName": "CARLITOS Candi CARRETTA",
     "clientType": "Individual",
     "city": "WHONNOCK",
     "clientStatus": "Active",
diff --git a/frontend/stub/__files/response-client-search-page0.json b/frontend/stub/__files/response-client-search-page0.json
index ecf12a2514..983d75bf3b 100644
--- a/frontend/stub/__files/response-client-search-page0.json
+++ b/frontend/stub/__files/response-client-search-page0.json
@@ -1,7 +1,7 @@
 [
   {
     "clientNumber": "00191088",
-    "clientAcronym": null,
+    "clientAcronym": "MLLP",
     "clientFullName": "MABELINV LIMITED LIABILITY PARTNERSHIP",
     "clientType": "Limited Partnership",
     "city": "TORONTO",
@@ -14,7 +14,7 @@
     "clientFullName": "LITHIA MASTER LP COMPANY, LP",
     "clientType": "Limited Partnership",
     "city": "MAPLE RIDGE",
-    "clientStatus": "Active",
+    "clientStatus": "Deactivated",
     "count": 147963
   },
   {
@@ -23,7 +23,7 @@
     "clientFullName": "TEST DATA",
     "clientType": "Limited Partnership",
     "city": "ANAHIM LAKE",
-    "clientStatus": "Active",
+    "clientStatus": "Receivership",
     "count": 147963
   },
   {
@@ -32,7 +32,7 @@
     "clientFullName": "CANAB AQUACULTURE LIMITED PARNERSHIP",
     "clientType": "Limited Partnership",
     "city": "PICKERING",
-    "clientStatus": "Active",
+    "clientStatus": "Suspended",
     "count": 147963
   },
   {
@@ -41,7 +41,7 @@
     "clientFullName": "TSAY KEH DENE TIMBER LIMITED PARTNERSHIP",
     "clientType": "Limited Partnership",
     "city": "GOULDS",
-    "clientStatus": "Active",
+    "clientStatus": "Deceased",
     "count": 147963
   },
   {
diff --git a/frontend/stub/mappings/client_search.json b/frontend/stub/mappings/client_search.json
index 0002fee7c0..c6986cb7f8 100644
--- a/frontend/stub/mappings/client_search.json
+++ b/frontend/stub/mappings/client_search.json
@@ -42,6 +42,25 @@
         "bodyFileName": "response-client-search-keyword-CAR.json"
       }
     },
+    {
+      "name": "Autocompete Predictive Search empty",
+      "request": {
+        "urlPath": "/api/clients/search",
+        "method": "GET",
+        "queryParameters": {
+          "keyword": {
+            "matches": "empty"
+          }
+        }
+      },
+      "response": {
+        "status": 200,
+        "headers": {
+          "content-type": "application/json;charset=UTF-8"
+        },
+        "body": "[]"
+      }
+    },
     {
       "name": "Full Search pageable (keyword, page and size)",
       "request": {
@@ -62,9 +81,68 @@
       "response": {
         "status": 200,
         "headers": {
-          "content-type": "application/json;charset=UTF-8"
+          "x-total-count": "30",
+          "content-type": "application/json;charset=UTF-8",
+          "Access-Control-Expose-Headers": "x-total-count"
+        },
+        "bodyFileName": "response-client-search-page{{request.query.page}}.json",
+        "fixedDelayMilliseconds": 2000
+      }
+    },
+    {
+      "name": "Full Search empty results",
+      "request": {
+        "urlPath": "/api/clients/search",
+        "method": "GET",
+        "queryParameters": {
+          "keyword": {
+            "matches": "empty"
+          },
+          "page": {
+            "matches": "^[0-5]$"
+          },
+          "size": {
+            "matches": "^\\d+$"
+          }
+        }
+      },
+      "response": {
+        "status": 200,
+        "headers": {
+          "x-total-count": "0",
+          "content-type": "application/json;charset=UTF-8",
+          "Access-Control-Expose-Headers": "x-total-count"
+        },
+        "body": "[]",
+        "fixedDelayMilliseconds": 2000
+      }
+    },
+    {
+      "name": "Full Search error",
+      "request": {
+        "urlPath": "/api/clients/search",
+        "method": "GET",
+        "queryParameters": {
+          "keyword": {
+            "matches": "error"
+          },
+          "page": {
+            "matches": "^[0-5]$"
+          },
+          "size": {
+            "matches": "^\\d+$"
+          }
+        }
+      },
+      "response": {
+        "status": 404,
+        "headers": {
+          "x-total-count": "0",
+          "content-type": "application/json;charset=UTF-8",
+          "Access-Control-Expose-Headers": "x-total-count"
         },
-        "bodyFileName": "response-client-search-page{{request.query.page}}.json"
+        "body": "Page not found",
+        "fixedDelayMilliseconds": 500
       }
     }
   ]
diff --git a/frontend/tests/unittests/components/forms/AutoCompleteInputComponent.spec.ts b/frontend/tests/unittests/components/forms/AutoCompleteInputComponent.spec.ts
index a4ab0dca02..5fc1a4d19c 100644
--- a/frontend/tests/unittests/components/forms/AutoCompleteInputComponent.spec.ts
+++ b/frontend/tests/unittests/components/forms/AutoCompleteInputComponent.spec.ts
@@ -38,6 +38,29 @@ describe("Auto Complete Input Component", () => {
     await inputWrapper.trigger("input");
   };
 
+  const selectItemWithKeyboard = async (
+    inputWrapper: DOMWrapper<HTMLInputElement>,
+    value: string,
+  ) => {
+    /*
+    This reproduces artificially what happens when an item is selected using the keyboard.
+    A cds-combo-box-beingselected happens before the corresponding keypress event.
+    */
+    await inputWrapper.trigger("cds-combo-box-beingselected", eventSelectContent(value));
+
+    await inputWrapper.trigger("keypress.enter");
+  };
+
+  const selectItemWithMouse = async (inputWrapper: DOMWrapper<HTMLInputElement>, value: string) => {
+    /*
+    This reproduces artificially what happens when an item is selected using the mouse.
+    The click event on the item happens before the cds-combo-box-beingselected.
+    */
+    await inputWrapper.find(`cds-combo-box-item[data-id="${value}"]`).trigger("click");
+
+    await inputWrapper.trigger("cds-combo-box-beingselected", eventSelectContent(value));
+  };
+
   const mount: typeof baseMount = function (inputComponent, options) {
     const wrapper = baseMount(inputComponent, options);
     const comboBox = wrapper.find(`#${id}`);
@@ -114,8 +137,6 @@ describe("Auto Complete Input Component", () => {
       },
     });
 
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
     await setInputValue(wrapper.find(`#${id}`), "a");
     await wrapper.find(`#${id}`).trigger("blur");
 
@@ -123,8 +144,6 @@ describe("Auto Complete Input Component", () => {
     expect(wrapper.emitted("error")).toHaveLength(1);
     expect(wrapper.emitted("error")![0][0]).toBe(errorMessage);
 
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
     await setInputValue(wrapper.find(`#${id}`), "ab"); // adds another character
     await wrapper.find(`#${id}`).trigger("blur");
 
@@ -252,8 +271,6 @@ describe("Auto Complete Input Component", () => {
       },
     });
 
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
     await setInputValue(wrapper.find(`#${id}`), "a");
     await wrapper.find(`#${id}`).trigger("blur");
 
@@ -274,8 +291,6 @@ describe("Auto Complete Input Component", () => {
         },
       });
 
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore
       await setInputValue(wrapper.find(`#${id}`), "");
 
       expect(wrapper.emitted("empty")).toBeTruthy();
@@ -360,6 +375,29 @@ describe("Auto Complete Input Component", () => {
     });
   });
 
+  it("sets the model value to an empty string, not undefined", async () => {
+    const wrapper = mount(AutoCompleteInputComponent, {
+      props: {
+        id,
+        modelValue: "",
+        contents,
+        validations: [],
+        label: id,
+        tip: "",
+      },
+    });
+
+    await wrapper.setProps({ modelValue: "T" });
+    await wrapper.find(`#${id}`).trigger("input");
+
+    // User initiated event to clear the value
+    await wrapper.find(`#${id}`).trigger("cds-combo-box-beingselected", eventClearContent());
+
+    expect(wrapper.emitted("update:model-value")).toBeTruthy();
+    expect(wrapper.emitted("update:model-value")).toHaveLength(2);
+    expect(wrapper.emitted("update:model-value")![1][0]).toEqual("");
+  });
+
   it('emits the "update:selected-value" event when an option from the list is clicked', async () => {
     const wrapper = mount(AutoCompleteInputComponent, {
       props: {
@@ -407,8 +445,6 @@ describe("Auto Complete Input Component", () => {
 
     it('emits the "update:selected-value" with undefined when user types something in the input field', async () => {
       // adding a 'Z' character to the end of the original value so to trigger an update:model-value
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore
       await setInputValue(wrapper.find(`#${id}`), "TANGOZ");
 
       expect(wrapper.emitted("update:selected-value")).toHaveLength(2);
@@ -441,4 +477,95 @@ describe("Auto Complete Input Component", () => {
       );
     });
   });
+
+  it('emits the "press:enter" event', async () => {
+    const wrapper = mount(AutoCompleteInputComponent, {
+      props: {
+        id,
+        modelValue: "",
+        contents,
+        validations: [],
+        label: id,
+      },
+    });
+
+    await wrapper.find(`#${id}`).trigger("keypress.enter");
+
+    expect(wrapper.emitted("press:enter")).toHaveLength(1);
+  });
+
+  it("doesn't emit the \"press:enter\" event when it's a selection with the keyboard", async () => {
+    const wrapper = mount(AutoCompleteInputComponent, {
+      props: {
+        id,
+        modelValue: "",
+        contents,
+        validations: [],
+        label: id,
+      },
+    });
+
+    selectItemWithKeyboard(wrapper.find(`#${id}`), "TB");
+
+    expect(wrapper.emitted("press:enter")).toBeFalsy();
+  });
+
+  describe("when user selects an item using the enter key on the keyboard", () => {
+    let wrapper: VueWrapper<any, any>;
+
+    beforeEach(async () => {
+      wrapper = mount(AutoCompleteInputComponent, {
+        props: {
+          id,
+          modelValue: "",
+          contents,
+          validations: [],
+          label: id,
+        },
+      });
+
+      selectItemWithKeyboard(wrapper.find(`#${id}`), "TB");
+
+      // sanity check
+      expect(wrapper.emitted("press:enter")).toBeFalsy();
+    });
+
+    describe("and later hits enter on the input field", () => {
+      beforeEach(async () => {
+        await wrapper.find(`#${id}`).trigger("keypress.enter");
+      });
+
+      it('emits the "press:enter" event', async () => {
+        expect(wrapper.emitted("press:enter")).toHaveLength(1);
+      });
+    });
+  });
+
+  describe("when user selects an item with a click", () => {
+    let wrapper: VueWrapper<any, any>;
+
+    beforeEach(async () => {
+      wrapper = mount(AutoCompleteInputComponent, {
+        props: {
+          id,
+          modelValue: "",
+          contents,
+          validations: [],
+          label: id,
+        },
+      });
+
+      selectItemWithMouse(wrapper.find(`#${id}`), "TA");
+    });
+
+    describe("and later hits enter on the input field", () => {
+      beforeEach(async () => {
+        await wrapper.find(`#${id}`).trigger("keypress.enter");
+      });
+
+      it('emits the "press:enter" event', async () => {
+        expect(wrapper.emitted("press:enter")).toHaveLength(1);
+      });
+    });
+  });
 });