added category and municipality to table

ConductionNL · Nov 28, 2023 · ef2dcf1 · ef2dcf1
1 parent 42fd9d2
commit ef2dcf1
Show file tree

Hide file tree

Showing 4 changed files with 63 additions and 2 deletions.
diff --git a/pwa/src/templates/templateParts/tableResultsTemplate/TableResultsTemplate.module.css b/pwa/src/templates/templateParts/tableResultsTemplate/TableResultsTemplate.module.css
@@ -49,3 +49,19 @@
   grid-gap: 24px;
   grid-template-columns: 1fr 1fr 1fr;
 }
+
+td {
+  width: min-content;
+}
+
+.categoryAndMunicipality {
+  text-wrap: nowrap;
+}
+
+.test {
+  display: -webkit-box;
+  -webkit-line-clamp: 5;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
diff --git a/pwa/src/templates/templateParts/tableResultsTemplate/TableResultsTemplate.tsx b/pwa/src/templates/templateParts/tableResultsTemplate/TableResultsTemplate.tsx
@@ -1,5 +1,6 @@
 import * as React from "react";
 import * as styles from "./TableResultsTemplate.module.css";
+import clsx from "clsx";
 import {
   Table,
   TableHeader,
@@ -32,6 +33,17 @@ export const TableResultsTemplate: React.FC<TableResultsTemplateProps> = ({ requ
           <TableRow>
             <TableHeaderCell>{t("Subject")}</TableHeaderCell>
             <TableHeaderCell>{t("Publication date")}</TableHeaderCell>
+            {(window.sessionStorage.getItem("SHOW_CATEGORY") === "true" ||
+              window.sessionStorage.getItem("SHOW_ORGANIZATION") === "true") && (
+              <>
+                {window.sessionStorage.getItem("SHOW_ORGANIZATION") === "true" && (
+                  <TableHeaderCell>{t("Municipality")}</TableHeaderCell>
+                )}
+                {window.sessionStorage.getItem("SHOW_CATEGORY") === "true" && (
+                  <TableHeaderCell>{t("Category")}</TableHeaderCell>
+                )}
+              </>
+            )}
             <TableHeaderCell>{t("Summary")}</TableHeaderCell>
           </TableRow>
         </TableHeader>
@@ -44,15 +56,42 @@ export const TableResultsTemplate: React.FC<TableResultsTemplateProps> = ({ requ
               tabIndex={0}
               aria-label={`${request.titel},  ${
                 request.publicatiedatum ? translateDate(i18n.language, request.publicatiedatum) : t("N/A")
-              }, ${request.samenvatting}`}
+              } ${
+                window.sessionStorage.getItem("SHOW_ORGANIZATION") === "true"
+                  ? `,${request.embedded?.behandelendBestuursorgaan?.naam}`
+                  : ""
+              } ${window.sessionStorage.getItem("SHOW_CATEGORY") === "true" ? `, ${request.categorie}` : ""}, ${
+                request.samenvatting
+              }`}
             >
               <TableCell>{request.titel ?? t("No subject available")}</TableCell>
               <TableCell>
                 {request.publicatiedatum
                   ? translateDate(i18n.language, request.publicatiedatum)
                   : t("No publication date available")}
               </TableCell>
-              <TableCell>{request.samenvatting ?? t("No summary available")}</TableCell>
+              {(window.sessionStorage.getItem("SHOW_CATEGORY") === "true" ||
+                window.sessionStorage.getItem("SHOW_ORGANIZATION") === "true") && (
+                <>
+                  {window.sessionStorage.getItem("SHOW_ORGANIZATION") === "true" && (
+                    <TableCell className={styles.categoryAndMunicipality}>
+                      {request.embedded?.behandelendBestuursorgaan?.naam ?? t("No municipality available")}
+                    </TableCell>
+                  )}
+                  {window.sessionStorage.getItem("SHOW_CATEGORY") === "true" && (
+                    <TableCell
+                      className={clsx(
+                        window.sessionStorage.getItem("SHOW_ORGANIZATION") !== "true" && styles.categoryAndMunicipality,
+                      )}
+                    >
+                      {request.categorie ?? t("No category available")}
+                    </TableCell>
+                  )}
+                </>
+              )}
+              <TableCell>
+                <div className={styles.test}>{request.samenvatting ?? t("No summary available")}</div>
+              </TableCell>
             </TableRow>
           ))}
         </TableBody>

diff --git a/pwa/src/translations/en.ts b/pwa/src/translations/en.ts
@@ -15,6 +15,7 @@ export const en = {
   Page: "Page",
   Jumbotron: "Jumbotron",
   Limit: "Limit",
+  Municipality: "Municipality",
   "Jumbotron card": "Jumbotron card",
   "N/A": "N/A",
   "Details page": "Details page",
@@ -56,4 +57,6 @@ export const en = {
   "Select result limit": "Select result limit",
   "Scroll table to the left": "Scroll table to the left",
   "Scroll table to the right": "Scroll table to the right",
+  "No category available": "No category available",
+  "No municipality available": "No municipality available",
 };
diff --git a/pwa/src/translations/nl.ts b/pwa/src/translations/nl.ts
@@ -15,6 +15,7 @@ export const nl = {
   Page: "Pagina",
   Jumbotron: "Jumbotron",
   Limit: "Limiet",
+  Municipality: "Gemeente",
   "Jumbotron card": "Jumbotron tegel",
   "N/A": "N.v.t",
   "Details page": "Detailpagina",
@@ -56,4 +57,6 @@ export const nl = {
   "Select result limit": "Selecteer resultaten limiet",
   "Scroll table to the left": "Scroll tabel naar links",
   "Scroll table to the right": "Scroll tabel naar rechts",
+  "No category available": "Geen categorie beschikbaar",
+  "No municipality available": "Geen gemeente beschikbaar",
 };