[ui] Add address and legal form to search result table

statisticsnorway · Dec 16, 2024 · d63dea4 · d63dea4
1 parent b2c4507
commit d63dea4
Show file tree

Hide file tree

Showing 4 changed files with 92 additions and 5 deletions.
diff --git a/app/src/app/search/components/statistical-unit-table-header.tsx b/app/src/app/search/components/statistical-unit-table-header.tsx
@@ -115,7 +115,16 @@ export function StatisticalUnitTableHeader({
                   label="Sector"
                 />
               );
-            case 'activity':
+            case "legal_form":
+              return (
+                <SortableTableHead
+                  className="text-left hidden lg:table-cell"
+                  key={`h-cell-${headerCellSuffix(column)}`}
+                  name="legal_form_code"
+                  label="Legal Form"
+                />
+              );
+            case "activity":
               return (
                 <SortableTableHead
                   className="text-left hidden lg:table-cell"
@@ -124,7 +133,16 @@ export function StatisticalUnitTableHeader({
                   label="Activity Category"
                 />
               );
-            case 'data_sources':
+            case "physical_address":
+              return (
+                <TableHead
+                  className="text-left hidden lg:table-cell"
+                  key={`h-cell-${headerCellSuffix(column)}`}
+                >
+                  Address
+                </TableHead>
+              );
+            case "data_sources":
               return (
                 <TableHead
                   className="text-left hidden lg:table-cell"

diff --git a/app/src/app/search/components/statistical-unit-table-row.tsx b/app/src/app/search/components/statistical-unit-table-row.tsx
@@ -60,6 +60,14 @@ export const StatisticalUnitTableRow = ({
 
   const region = getRegionByPath(unit.physical_region_path);
 
+  const physical_address = [
+    unit.physical_address_part1,
+    unit.physical_address_part2,
+    unit.physical_address_part3,
+  ]
+    .filter(Boolean)
+    .join(", ");
+
   const prettifyUnitType = (type: UnitType | null): string => {
     switch (type) {
       case "enterprise":
@@ -121,7 +129,9 @@ export const StatisticalUnitTableRow = ({
                     <small className="text-gray-700 flex items-center space-x-1">
                       <span className="flex">
                         {externalIdentTypes
-                          ?.map(({ code }) => unit.external_idents[code!] || "")
+                          ?.map(
+                            ({ code }) => unit.external_idents[code!] || "-"
+                          )
                           .join(" | ")}
                       </span>
                       {unit.invalid_codes && (
@@ -272,7 +282,39 @@ export const StatisticalUnitTableRow = ({
                 </div>
               </TableCell>
             );
-
+          case 'legal_form':
+            return (
+              <TableCell
+                key={`cell-${bodyCellSuffix(unit, column)}`}
+                className={getCellClassName(column)}
+              >
+                <div
+                  title={unit.legal_form_name ?? ""}
+                  className="flex flex-col space-y-0.5 leading-tight"
+                >
+                  <span>{unit.legal_form_code}</span>
+                  <small className="text-gray-700 max-w-32 overflow-hidden overflow-ellipsis whitespace-nowrap lg:max-w-32">
+                    {unit.legal_form_name}
+                  </small>
+                </div>
+              </TableCell>
+            );
+          case 'physical_address':
+            return (
+              <TableCell
+                key={`cell-${bodyCellSuffix(unit, column)}`}
+                className={getCellClassName(column)}
+              >
+                <div
+                  title={physical_address}
+                  className="flex flex-col space-y-0.5 leading-tight"
+                >
+                  <small className="text-gray-700 min-w-40 line-clamp-3 lg:max-w-48">
+                    {physical_address}
+                  </small>
+                </div>
+              </TableCell>
+            );
           case 'data_sources':
             return (
               <TableCell key={`cell-${bodyCellSuffix(unit, column)}`} className={getCellClassName(column)}>

diff --git a/app/src/app/search/search.d.ts b/app/src/app/search/search.d.ts
@@ -69,7 +69,18 @@ export type SearchAction = SetQuery | ResetAll | SetOrder | SetPage;
 export type TableColumnVisibilityType = 'Adaptable' | 'Always';
 export type ColumnProfile = "Brief" | "Regular" | "All";
 
-export type TableColumnCode = 'name' | 'activity_section' | 'activity' | 'top_region' | 'region' | 'statistic' | 'unit_counts' | 'sector' | 'data_sources';
+export type TableColumnCode =
+  | "name"
+  | "activity_section"
+  | "activity"
+  | "top_region"
+  | "region"
+  | "statistic"
+  | "unit_counts"
+  | "sector"
+  | "legal_form"
+  | "data_sources"
+  | "physical_address";
 
 // Extend the base interface based on visibility type
 export interface AdaptableTableColumn{

diff --git a/app/src/app/search/table-columns.tsx b/app/src/app/search/table-columns.tsx
@@ -115,6 +115,22 @@ export function TableColumnsProvider({ children }: { children: ReactNode }) {
           stat_code: null,
           profiles: ["All"],
         },
+        {
+          type: "Adaptable",
+          code: "legal_form",
+          label: "Legal Form",
+          visible: false,
+          stat_code: null,
+          profiles: ["All"],
+        },
+        {
+          type: "Adaptable",
+          code: "physical_address",
+          label: "Address",
+          visible: false,
+          stat_code: null,
+          profiles: ["All"],
+        },
         {
           type: "Adaptable",
           code: "data_sources",