add "+" to numbers if hit limit (>50), fix linting

src/libs/endorserServer.ts

@@ -591,6 +591,10 @@ export async function setPlanInCache(
   planCache.set(handleId, planSummary);
 }
 
+/**
+ *
+ * @returns { data: Array<OfferSummaryRecord>, hitLimit: boolean }
+ */
 export async function getNewOffersToUser(
   axios: Axios,
   apiServer: string,
@@ -603,10 +607,12 @@ export async function getNewOffersToUser(
   }
   const headers = await getHeaders(activeDid);
   const response = await axios.get(url, { headers });
-  const offers = response.data.data;
-  return offers;
+  return response.data;
 }
-
+/**
+ *
+ * @returns { data: Array<OfferToPlanSummaryRecord>, hitLimit: boolean }
+ */
 export async function getNewOffersToUserProjects(
   axios: Axios,
   apiServer: string,
@@ -619,8 +625,7 @@ export async function getNewOffersToUserProjects(
   }
   const headers = await getHeaders(activeDid);
   const response = await axios.get(url, { headers });
-  const offers = response.data.data;
-  return offers;
+  return response.data;
 }
 
 /**

src/views/HomeView.vue

@@ -210,7 +210,7 @@
               class="block text-center text-6xl"
               data-testId="newDirectOffersActivityNumber"
             >
-              {{ numNewOffersToUser }}
+              {{ numNewOffersToUser }}{{ newOffersToUserHitLimit ? "+" : "" }}
             </span>
             <p>new offer{{ numNewOffersToUser === 1 ? "" : "s" }} to you</p>
           </div>
@@ -222,7 +222,8 @@
               class="block text-center text-6xl"
               data-testId="newOffersToUserProjectsActivityNumber"
             >
-              {{ numNewOffersToUserProjects }}
+              {{ numNewOffersToUserProjects
+              }}{{ newOffersToUserProjectsHitLimit ? "+" : "" }}
             </span>
             <p>
               new offer{{ numNewOffersToUserProjects === 1 ? "" : "s" }} to your
@@ -461,6 +462,8 @@ export default class HomeView extends Vue {
   isRegistered = false;
   lastAckedOfferToUserJwtId?: string; // the last JWT ID for offer-to-user that they've acknowledged seeing
   lastAckedOfferToUserProjectsJwtId?: string; // the last JWT ID for offers-to-user's-projects that they've acknowledged seeing
+  newOffersToUserHitLimit: boolean = false;
+  newOffersToUserProjectsHitLimit: boolean = false;
   numNewOffersToUser: number = 0; // number of new offers-to-user
   numNewOffersToUserProjects: number = 0; // number of new offers-to-user's-projects
   searchBoxes: Array<{
@@ -529,25 +532,25 @@ export default class HomeView extends Vue {
       this.updateAllFeed();
 
       if (this.activeDid) {
-        this.numNewOffersToUser = (
-          await getNewOffersToUser(
-            this.axios,
-            this.apiServer,
-            this.activeDid,
-            this.lastAckedOfferToUserJwtId,
-          )
-        ).length;
+        const offersToUserData = await getNewOffersToUser(
+          this.axios,
+          this.apiServer,
+          this.activeDid,
+          this.lastAckedOfferToUserJwtId,
+        );
+        this.numNewOffersToUser = offersToUserData.data.length;
+        this.newOffersToUserHitLimit = offersToUserData.hitLimit;
       }
 
       if (this.activeDid) {
-        this.numNewOffersToUserProjects = (
-          await getNewOffersToUserProjects(
-            this.axios,
-            this.apiServer,
-            this.activeDid,
-            this.lastAckedOfferToUserProjectsJwtId,
-          )
-        ).length;
+        const offersToUserProjects = await getNewOffersToUserProjects(
+          this.axios,
+          this.apiServer,
+          this.activeDid,
+          this.lastAckedOfferToUserProjectsJwtId,
+        );
+        this.numNewOffersToUserProjects = offersToUserProjects.data.length;
+        this.newOffersToUserProjectsHitLimit = offersToUserProjects.hitLimit;
       }
 
       // eslint-disable-next-line @typescript-eslint/no-explicit-any

src/views/NewActivityView.vue

@@ -17,7 +17,10 @@
 
     <!-- Display a single row with the name of "New Offers To You" with a count. -->
     <div>
-      <span class="text-lg font-medium">{{ newOffersToUser.length }}</span>
+      <span class="text-lg font-medium"
+        >{{ newOffersToUser.length
+        }}{{ newOffersToUserHitLimit ? "+" : "" }}</span
+      >
       <span class="text-lg font-medium ml-4"
         >New Offer{{ newOffersToUser.length === 1 ? "" : "s" }} To You</span
       >
@@ -68,9 +71,10 @@
 
     <!-- Display a single row with the name of "New Offers To Your Projects" with a count. -->
     <div class="mt-4">
-      <span class="text-lg font-medium">{{
-        newOffersToUserProjects.length
-      }}</span>
+      <span class="text-lg font-medium"
+        >{{ newOffersToUserProjects.length
+        }}{{ newOffersToUserProjectsHitLimit ? "+" : "" }}</span
+      >
       <span class="text-lg font-medium ml-4"
         >New Offer{{ newOffersToUserProjects.length === 1 ? "" : "s" }} To Your
         Projects</span
@@ -162,7 +166,9 @@ export default class NewActivityView extends Vue {
   lastAckedOfferToUserJwtId = "";
   lastAckedOfferToUserProjectsJwtId = "";
   newOffersToUser: Array<OfferSummaryRecord> = [];
+  newOffersToUserHitLimit = false;
   newOffersToUserProjects: Array<OfferToPlanSummaryRecord> = [];
+  newOffersToUserProjectsHitLimit = false;
 
   showOffersDetails = false;
   showOffersToUserProjectsDetails = false;
@@ -185,18 +191,24 @@ export default class NewActivityView extends Vue {
       if (allAccounts.length > 0) {
         this.allMyDids = allAccounts.map((acc) => acc.did);
       }
-      this.newOffersToUser = await getNewOffersToUser(
+
+      const offersToUserData = await getNewOffersToUser(
         this.axios,
         this.apiServer,
         this.activeDid,
         this.lastAckedOfferToUserJwtId,
       );
-      this.newOffersToUserProjects = await getNewOffersToUserProjects(
+      this.newOffersToUser = offersToUserData.data;
+      this.newOffersToUserHitLimit = offersToUserData.hitLimit;
+
+      const offersToUserProjectsData = await getNewOffersToUserProjects(
         this.axios,
         this.apiServer,
         this.activeDid,
         this.lastAckedOfferToUserProjectsJwtId,
       );
+      this.newOffersToUserProjects = offersToUserProjectsData.data;
+      this.newOffersToUserProjectsHitLimit = offersToUserProjectsData.hitLimit;
 
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (err: any) {

test-playwright/50-record-offer.spec.ts

@@ -72,7 +72,7 @@ test('Record an offer', async ({ page }) => {
   // go to the home page and check that the offer is shown as new
   await page.goto('./');
   const offerNumElem = page.getByTestId('newOffersToUserProjectsActivityNumber');
-  await expect(offerNumElem).toHaveText('50');
+  await expect(offerNumElem).toHaveText('50+');
 
   // click on the number of new offers to go to the list page
   await offerNumElem.click();