feat(board): merge column settings from db with default (#1118)

* feat(board): adds settingsMerger utils and merge columns function * feat(board): implements column settings merged with default * refactor(table): inline merging default columns with settings
entur · Jul 13, 2023 · e8f2a86 · e8f2a86
1 parent e599241
commit e8f2a86
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 5 deletions.
diff --git a/next-tavla/src/Board/scenarios/QuayTile/index.tsx b/next-tavla/src/Board/scenarios/QuayTile/index.tsx
@@ -11,6 +11,7 @@ export function QuayTile({
     placeId,
     whitelistedLines,
     whitelistedTransportModes,
+    columns,
 }: TQuayTile) {
     const { data } = useQuery(
         GetQuayQuery,
@@ -44,7 +45,7 @@ export function QuayTile({
     return (
         <Tile className={classes.quayTile}>
             <TableHeader heading={heading} transportModes={transportModes} />
-            <Table departures={data.quay.estimatedCalls} />
+            <Table columns={columns} departures={data.quay.estimatedCalls} />
         </Tile>
     )
 }
diff --git a/next-tavla/src/Board/scenarios/StopPlaceTile/index.tsx b/next-tavla/src/Board/scenarios/StopPlaceTile/index.tsx
@@ -10,6 +10,7 @@ export function StopPlaceTile({
     placeId,
     whitelistedLines,
     whitelistedTransportModes,
+    columns,
 }: TStopPlaceTile) {
     const { data } = useQuery(
         StopPlaceQuery,
@@ -31,7 +32,10 @@ export function StopPlaceTile({
                 heading={data.stopPlace.name}
                 transportModes={data.stopPlace.transportMode}
             />
-            <Table departures={data.stopPlace.estimatedCalls} />
+            <Table
+                departures={data.stopPlace.estimatedCalls}
+                columns={columns}
+            />
         </Tile>
     )
 }
diff --git a/next-tavla/src/Board/scenarios/Table/index.tsx b/next-tavla/src/Board/scenarios/Table/index.tsx
@@ -2,9 +2,9 @@ import { TDepartureFragment } from 'graphql/index'
 import {
     Columns,
     TColumn,
-    DefaultColumns,
     TColumnSize,
     TColumnSettings,
+    DefaultColumns,
 } from 'types/column'
 import React from 'react'
 import classes from './styles.module.css'
@@ -49,12 +49,16 @@ function ColumnTableHeader({ type, size }: TColumnSize) {
 
 function Table({
     departures,
-    columns = DefaultColumns,
+    columns,
 }: {
     departures: TDepartureFragment[]
     columns?: TColumnSettings
 }) {
-    const filteredColumnOrder = ColumnOrder.filter(({ type }) => columns[type])
+    const mergedColumns = { ...DefaultColumns, ...columns }
+
+    const filteredColumnOrder = ColumnOrder.filter(
+        ({ type }) => mergedColumns[type],
+    )
 
     return (
         <div className={classes.container}>