feat(ME): Add count for selected records (#666)

* feat(ME): Add selected records count, add translations

* feat(ME): Add e2e tests for chekcboxes

* feat(ME): Remove np from records table title

apps/metadata-editor-e2e/src/e2e/dashboard.cy.ts

@@ -61,4 +61,38 @@ describe('dashboard', () => {
         })
     })
   })
+
+  describe('checkboxes', () => {
+    it('should show the correct amount of selected records when they are selected', () => {
+      cy.visit('/records/all')
+      cy.get('gn-ui-record-table')
+        .find('.record-table-col')
+        .get('[type="checkbox"]')
+        .eq(2)
+        .click()
+      cy.get('.selected-records').contains('1 selected')
+    })
+
+    it('should show nothing when none are selected', () => {
+      cy.visit('/records/all')
+      cy.get('gn-ui-record-table')
+        .find('.record-table-col')
+        .get('mat-checkbox.mat-primary')
+        .each(($checkbox) => cy.wrap($checkbox).click())
+      cy.get('.records-information').should(
+        'not.have.descendants',
+        '.selected-records'
+      )
+    })
+
+    it('should select all records when the "select all" checkbox is checked', () => {
+      cy.visit('/records/all')
+      cy.get('gn-ui-record-table')
+        .find('.record-table-col')
+        .get('mat-checkbox.mat-primary')
+        .first()
+        .click()
+      cy.get('.selected-records').contains('12 selected')
+    })
+  })
 })

apps/metadata-editor/src/app/records/records-list.component.html

@@ -14,7 +14,6 @@
       </div>
       <div class="flex flex-row gap-3 items-center">
         <h1 class="text-[56px] font-title grow">{{ title }}</h1>
-        np
         <h1 *ngIf="users" class="text-[56px] font-title grow" translate>
           dashboard.records.users
         </h1>

libs/ui/search/src/lib/record-table/record-table.component.html

@@ -1,14 +1,24 @@
 <div>
   <div *ngIf="totalHits" class="">
-    <div
-      translate
-      class="my-8 ml-4 block text-gray-500"
-      [translateParams]="{
-        displayed: records.length,
-        hits: totalHits
-      }"
-    >
-      results.records.hits.displayedOn
+    <div class="flex records-information">
+      <div
+        translate
+        class="my-8 ml-4 block text-gray-800"
+        [translateParams]="{
+          displayed: records.length,
+          hits: totalHits
+        }"
+      >
+        results.records.hits.displayedOn
+      </div>
+      <div
+        *ngIf="selectedRecords.length > 0"
+        class="my-8 ml-6 block text-gray-400 selected-records"
+        translate
+        [translateParams]="{ amount: selectedRecords.length }"
+      >
+        results.records.hits.selected
+      </div>
     </div>
 
     <div

translations/de.json

@@ -224,6 +224,7 @@
   "results.records.hits.displayedOn": "{displayed, plural, =0{Kein Datensatz.} one{1 Datensatz} other{{displayed} Datensätze }} {hits, plural, other{auf {hits} insgesamt angezeigt.}}",
   "results.records.hits.empty.help.html": "Vorschläge: <ul class='list-disc list-inside'><li>Versuchen Sie andere Wörter</li><li>Geben Sie weniger Wörter ein</li></ul>",
   "results.records.hits.found": "{hits, plural, =0{Keine Dokumente entsprechen der angegebenen Suche.} one{1 Datensatz gefunden.} other{{hits} Datensätze gefunden.}}",
+  "results.records.hits.selected": "",
   "results.showMore": "Mehr Ergebnisse anzeigen...",
   "results.sortBy.dateStamp": "Letzte Aktualisierungen",
   "results.sortBy.popularity": "Beliebtheit",

translations/en.json

@@ -224,6 +224,7 @@
   "results.records.hits.displayedOn": "{displayed, plural, =0{No record.} one{1 record} other{{displayed} records }} {hits, plural, other{displayed on {hits} total.}}",
   "results.records.hits.empty.help.html": "Suggestions: <ul class='list-disc list-inside'><li>Try other words</li><li>Specify fewer words</li></ul>",
   "results.records.hits.found": "{hits, plural, =0{No documents match the specified search.} one{1 record found.} other{{hits} records found.}}",
+  "results.records.hits.selected": "{ amount } selected",
   "results.showMore": "Show more results...",
   "results.sortBy.dateStamp": "Most recent",
   "results.sortBy.popularity": "Popularity",

translations/es.json

@@ -224,6 +224,7 @@
   "results.records.hits.displayedOn": "",
   "results.records.hits.empty.help.html": "",
   "results.records.hits.found": "",
+  "results.records.hits.selected": "",
   "results.showMore": "",
   "results.sortBy.dateStamp": "",
   "results.sortBy.popularity": "",

translations/fr.json

@@ -224,6 +224,7 @@
   "results.records.hits.displayedOn": "",
   "results.records.hits.empty.help.html": "Suggestions : <ul class='list-disc list-inside'><li>Essayez d'autres mots clés</li><li>Cherchez moins de mots</li></ul>",
   "results.records.hits.found": "{hits, plural, =0{Aucune correspondance.} one{1 enregistrement trouvé.} other{{hits} résultats.}}",
+  "results.records.hits.selected": "",
   "results.showMore": "Plus de résultats...",
   "results.sortBy.dateStamp": "Plus récent",
   "results.sortBy.popularity": "Popularité",

translations/it.json

@@ -224,6 +224,7 @@
   "results.records.hits.displayedOn": "",
   "results.records.hits.empty.help.html": "",
   "results.records.hits.found": "",
+  "results.records.hits.selected": "",
   "results.showMore": "",
   "results.sortBy.dateStamp": "",
   "results.sortBy.popularity": "",

translations/nl.json

@@ -224,6 +224,7 @@
   "results.records.hits.displayedOn": "",
   "results.records.hits.empty.help.html": "",
   "results.records.hits.found": "",
+  "results.records.hits.selected": "",
   "results.showMore": "",
   "results.sortBy.dateStamp": "",
   "results.sortBy.popularity": "",

translations/pt.json

@@ -224,6 +224,7 @@
   "results.records.hits.displayedOn": "",
   "results.records.hits.empty.help.html": "",
   "results.records.hits.found": "",
+  "results.records.hits.selected": "",
   "results.showMore": "",
   "results.sortBy.dateStamp": "",
   "results.sortBy.popularity": "",