2.4.6 Release

.github/workflows/master-deployment.yml

@@ -79,7 +79,7 @@ jobs:
           context: .
           file: ./Dockerfile
           push: true
-          tags: ${{ secrets.DOCKER_HUB_LABS_USERNAME }}/neodash:latest,${{ secrets.DOCKER_HUB_LABS_USERNAME }}/neodash:2.4.5
+          tags: ${{ secrets.DOCKER_HUB_LABS_USERNAME }}/neodash:latest,${{ secrets.DOCKER_HUB_LABS_USERNAME }}/neodash:2.4.6
   build-docker-legacy:
     needs: build-test
     runs-on: neodash-runners
@@ -103,7 +103,7 @@ jobs:
           context: .
           file: ./Dockerfile
           push: true
-          tags: ${{ secrets.DOCKER_HUB_USERNAME }}/neodash:latest,${{ secrets.DOCKER_HUB_USERNAME }}/neodash:2.4.5
+          tags: ${{ secrets.DOCKER_HUB_USERNAME }}/neodash:latest,${{ secrets.DOCKER_HUB_USERNAME }}/neodash:2.4.6
   deploy-gallery:
     runs-on: neodash-runners
     strategy:

Dockerfile

@@ -44,4 +44,4 @@ USER nginx
 EXPOSE $NGINX_PORT
 
 HEALTHCHECK cmd curl --fail "http://localhost:$NGINX_PORT" || exit 1
-LABEL version="2.4.5"
+LABEL version="2.4.6"

changelog.md

@@ -1,3 +1,11 @@
+## NeoDash 2.4.6
+This is a minor release containing a few critical fixes and some extra style customizations:
+
+- Fix bad text wrapping for arrays in tables ([868](https://github.com/neo4j-labs/neodash/pull/868)).
+- Make wrapping in table optional, disabled by default ([872](https://github.com/neo4j-labs/neodash/pull/872)).
+- Fixed issues where cross database dashboard sharing always reverted back to the default database ([873](https://github.com/neo4j-labs/neodash/pull/873)).
+- Added option to define style config using environment variables for the Docker image ([876](https://github.com/neo4j-labs/neodash/pull/876)). 
+
 ## NeoDash 2.4.5
 This is a small release containing a few fixes:
 - Fixed rendering of string arrays inside tables, report titles, and report action buttons [849](https://github.com/neo4j-labs/neodash/pull/849)

docs/modules/ROOT/pages/developer-guide/deploy-a-build.adoc

@@ -37,7 +37,7 @@ Depending on the webserver type and version, this could be different directory.
 As an example - to copy the files to an nginx webserver using `scp`:
 
 ```bash
-scp neodash-2.4.5 username@host:/usr/share/nginx/html
+scp neodash-2.4.6 username@host:/usr/share/nginx/html
 ```
 
 NeoDash should now be visible by visiting your (sub)domain in the browser.

docs/modules/ROOT/pages/developer-guide/style-configuration.adoc

@@ -6,9 +6,15 @@ link:https://cdn.jsdelivr.net/npm/@neo4j-ndl/[email protected]/lib/tokens/css/tokens.cs
 
 For a simple (non-Dockerized) deployment, these configuration parameters
 can be changed by modifying `dist/style.config.json` after you have built the
-application. When Docker image, these can not be passed as environment
-variables.
+application. When using the NeoDash Docker image, these can be passed as environment
+variables. For example:
 
+....
+docker run -p 5005:5005 \
+ -e DASHBOARD_HEADER_BRAND_LOGO=https://picsum.photos/500/100 \
+ neo4jlabs/neodash
+....
+
 An example configuration for NeoDash
 
 ....

package.json

@@ -1,6 +1,6 @@
 {
   "name": "neodash",
-  "version": "2.4.5",
+  "version": "2.4.6",
   "description": "NeoDash - Neo4j Dashboard Builder",
   "neo4jDesktop": {
     "apiVersion": "^1.2.0"

release-notes.md

@@ -1,11 +1,7 @@
-## NeoDash 2.4.5
-This is a small release containing a few fixes:
-- Fixed rendering of string arrays inside tables, report titles, and report action buttons [849](https://github.com/neo4j-labs/neodash/pull/849)
-- Allowed text to wrap in tables, preserving the number of rows [852](https://github.com/neo4j-labs/neodash/pull/852)
-- Disabled auto-sorting of Cypher query-based Parameter Select ; use Cypher ORDER BY to control result order [857](https://github.com/neo4j-labs/neodash/pull/857)
-- Updated role selector menu, and made user updates more robust [854](https://github.com/neo4j-labs/neodash/pull/854)
+## NeoDash 2.4.6
+This is a minor release containing a few critical fixes and some extra style customizations:
 
-Thanks to all the contributors for this release: 
-- [MariusC](https://github.com/mariusconjeaud),
-- [LiamEdwardsLamarche](https://github.com/LiamEdwardsLamarche),
-- [AleSim94](https://github.com/AleSim94)
+- Fix bad text wrapping for arrays in tables ([868](https://github.com/neo4j-labs/neodash/pull/868)).
+- Make wrapping in table optional, disabled by default ([872](https://github.com/neo4j-labs/neodash/pull/872)).
+- Fixed issues where cross database dashboard sharing always reverted back to the default database ([873](https://github.com/neo4j-labs/neodash/pull/873)).
+- Added option to define style config using environment variables for the Docker image ([876](https://github.com/neo4j-labs/neodash/pull/876)).

scripts/config-entrypoint.sh

@@ -27,4 +27,17 @@ echo " \
     \"customHeader\": \"${customHeader:=}\"  \
    }" > /usr/share/nginx/html/config.json
 
-echo "${styleConfigJson:={\}}" > /usr/share/nginx/html/style.config.json
+echo " \
+  { \
+  \"DASHBOARD_HEADER_BRAND_LOGO\": \"${DASHBOARD_HEADER_BRAND_LOGO:=}\",  \
+  \"DASHBOARD_HEADER_COLOR\" : \"${DASHBOARD_HEADER_COLOR:=}\",  \
+  \"DASHBOARD_HEADER_BUTTON_COLOR\" : \"${DASHBOARD_HEADER_BUTTON_COLOR:=}\",  \
+  \"DASHBOARD_HEADER_TITLE_COLOR\" : \"${DASHBOARD_HEADER_TITLE_COLOR:=}\",  \
+  \"DASHBOARD_PAGE_LIST_COLOR\" : \"${DASHBOARD_PAGE_LIST_COLOR:=}\", \
+  \"DASHBOARD_PAGE_LIST_ACTIVE_COLOR\": \"${DASHBOARD_PAGE_LIST_ACTIVE_COLOR:=}\", \
+  \"style\": { \
+    \"--palette-light-neutral-bg-weak\": \"${STYLE_PALETTE_LIGHT_NEUTRAL_BG_WEAK:=}\" \
+  } \
+}" > /usr/share/nginx/html/style.config.json
+
+

src/application/ApplicationActions.ts

@@ -178,7 +178,7 @@ export const setStandaloneEnabled = (
 
 export const SET_STANDALONE_MODE = 'APPLICATION/SET_STANDALONE_MODE';
 export const setStandaloneMode = (standalone: boolean) => ({
-  type: SET_STANDALONE_ENABLED,
+  type: SET_STANDALONE_MODE,
   payload: { standalone },
 });
 

src/application/ApplicationThunks.ts

@@ -259,16 +259,19 @@
       const skipConfirmation = urlParams.get('skipConfirmation') == 'Yes';
 
       const dashboardDatabase = urlParams.get('dashboardDatabase');
-      dispatch(setStandaloneDashboardDatabase(dashboardDatabase));
+      if (dashboardDatabase) {
+        dispatch(setStandaloneDashboardDatabase(dashboardDatabase));
+      }
+
       if (urlParams.get('credentials')) {
         setWelcomeScreenOpen(false);
         const connection = decodeURIComponent(urlParams.get('credentials'));
         const protocol = connection.split('://')[0];
         const username = connection.split('://')[1].split(':')[0];
         const password = connection.split('://')[1].split(':')[1].split('@')[0];
         const database = connection.split('@')[1].split(':')[0];
         const url = connection.split('@')[1].split(':')[1];
         const port = connection.split('@')[1].split(':')[2];
         // if (url == password) {
         //   // Special case where a connect link is generated without a password.
         //   // Here, the format is parsed incorrectly and we open the connection window instead.
@@ -363,6 +366,8 @@
 
     if (shareDetails.dashboardDatabase) {
       dispatch(setStandaloneDashboardDatabase(shareDetails.dashboardDatabase));
+    } else if (!state.application.standaloneDashboardDatabase) {
+      // No standalone dashboard database configured, fall back to default
       dispatch(setStandaloneDashboardDatabase(shareDetails.database));
     }
     if (shareDetails.url) {
@@ -452,6 +457,9 @@
     dispatch(setSSOProviders(config.ssoProviders));
 
     const { standalone } = config;
+    // if a dashboard database was previously set, remember to use it.
+    const dashboardDatabase = state.application.standaloneDashboardDatabase;
+
     dispatch(
       setStandaloneEnabled(
         standalone,
@@ -460,7 +468,7 @@
         config.standalonePort,
         config.standaloneDatabase,
         config.standaloneDashboardName,
-        config.standaloneDashboardDatabase,
+        dashboardDatabase || config.standaloneDashboardDatabase,
         config.standaloneDashboardURL,
         config.standaloneUsername,
         config.standalonePassword,
@@ -575,7 +583,7 @@
       dispatch(initializeApplicationAsEditorThunk(config, paramsToSetAfterConnecting));
     }
   } catch (e) {
     console.log(e);
     dispatch(setWelcomeScreenOpen(false));
     dispatch(
       createNotificationThunk(

src/chart/table/TableChart.tsx

@@ -46,11 +46,9 @@ function renderAsButtonWrapper(renderer) {
       return <></>;
     }
     return (
-      <Button
-        style={{ width: '100%', marginLeft: '5px', marginRight: '5px' }}
-        variant='contained'
-        color='primary'
-      >{outputValue}</Button>
+      <Button style={{ width: '100%', marginLeft: '5px', marginRight: '5px' }} variant='contained' color='primary'>
+        {outputValue}
+      </Button>
     );
   };
 }
@@ -73,6 +71,7 @@ export const generateSafeColumnKey = (key) => {
 
 export const NeoTableChart = (props: ChartProps) => {
   const transposed = props.settings && props.settings.transposed ? props.settings.transposed : false;
+  const wrapContent = props.settings && props.settings.wrapContent ? props.settings.wrapContent : false;
   const allowDownload =
     props.settings && props.settings.allowDownload !== undefined ? props.settings.allowDownload : false;
 
@@ -214,6 +213,49 @@ export const NeoTableChart = (props: ChartProps) => {
     : Math.floor(availableRowHeight) - pageSizeReducer;
 
   const pageNames = getPageNumbersAndNamesList();
+  const commonGridProps = {
+    key: 'tableKey',
+    headerHeight: 32,
+    density: compact ? 'compact' : 'standard',
+    rows: rows,
+    columns: columns,
+    columnVisibilityModel: columnVisibilityModel,
+    onColumnVisibilityModelChange: (newModel) => setColumnVisibilityModel(newModel),
+    onCellClick: (e) => performActionOnElement(e, actionsRules, { ...props, pageNames: pageNames }, 'Click', 'Table'),
+    onCellDoubleClick: (e) => {
+      let rules = getRule(e, actionsRules, 'doubleClick');
+      if (rules !== null) {
+        rules.forEach((rule) => executeActionRule(rule, e, { ...props, pageNames: pageNames }, 'table'));
+      } else {
+        setNotificationOpen(true);
+        navigator.clipboard.writeText(e.value);
+      }
+    },
+    checkboxSelection: hasCheckboxes(actionsRules),
+    selectionModel: getCheckboxes(actionsRules, rows, props.getGlobalParameter),
+    onSelectionModelChange: (selection) => updateCheckBoxes(actionsRules, rows, selection, props.setGlobalParameter),
+    pageSize: tablePageSize > 0 ? tablePageSize : 5,
+    rowsPerPageOptions: rows.length < 5 ? [rows.length, 5] : [5],
+    disableSelectionOnClick: true,
+    components: {
+      ColumnSortedDescendingIcon: () => <></>,
+      ColumnSortedAscendingIcon: () => <></>,
+    },
+    getRowClassName: (params) => {
+      return ['row color', 'row text color']
+        .map((e) => {
+          return `rule${evaluateRulesOnDict(params.row, styleRules, [e])}`;
+        })
+        .join(' ');
+    },
+    getCellClassName: (params) => {
+      return ['cell color', 'cell text color']
+        .map((e) => {
+          return `rule${evaluateRulesOnDict({ [params.field]: params.value }, styleRules, [e])}`;
+        })
+        .join(' ');
+    },
+  };
 
   return (
     <ThemeProvider theme={theme}>
@@ -259,61 +301,21 @@ export const NeoTableChart = (props: ChartProps) => {
           <></>
         )}
 
-        <DataGrid
-          key={'tableKey'}
-          headerHeight={32}
-          density={compact ? 'compact' : 'standard'}
-          getRowHeight={() => 'auto'}
-          rows={rows}
-          columns={columns}
-          columnVisibilityModel={columnVisibilityModel}
-          onColumnVisibilityModelChange={(newModel) => setColumnVisibilityModel(newModel)}
-          onCellClick={(e) =>
-            performActionOnElement(e, actionsRules, { ...props, pageNames: pageNames }, 'Click', 'Table')
-          }
-          onCellDoubleClick={(e) => {
-            let rules = getRule(e, actionsRules, 'doubleClick');
-            if (rules !== null) {
-              rules.forEach((rule) => executeActionRule(rule, e, { ...props, pageNames: pageNames }, 'table'));
-            } else {
-              setNotificationOpen(true);
-              navigator.clipboard.writeText(e.value);
-            }
-          }}
-          checkboxSelection={hasCheckboxes(actionsRules)}
-          selectionModel={getCheckboxes(actionsRules, rows, props.getGlobalParameter)}
-          onSelectionModelChange={(selection) =>
-            updateCheckBoxes(actionsRules, rows, selection, props.setGlobalParameter)
-          }
-          pageSize={tablePageSize > 0 ? tablePageSize : 5}
-          rowsPerPageOptions={rows.length < 5 ? [rows.length, 5] : [5]}
-          disableSelectionOnClick
-          components={{
-            ColumnSortedDescendingIcon: () => <></>,
-            ColumnSortedAscendingIcon: () => <></>,
-          }}
-          getRowClassName={(params) => {
-            return ['row color', 'row text color']
-              .map((e) => {
-                return `rule${evaluateRulesOnDict(params.row, styleRules, [e])}`;
-              })
-              .join(' ');
-          }}
-          getCellClassName={(params) => {
-            return ['cell color', 'cell text color']
-              .map((e) => {
-                return `rule${evaluateRulesOnDict({ [params.field]: params.value }, styleRules, [e])}`;
-              })
-              .join(' ');
-          }}
-          sx={{
-            '&.MuiDataGrid-root--densityCompact .MuiDataGrid-cell': { py: '3px' },
-            '&.MuiDataGrid-root--densityCompact .MuiDataGrid-cell:has(button)': { py: '0px' },
-            '&.MuiDataGrid-root--densityStandard .MuiDataGrid-cell': { py: '15px' },
-            '&.MuiDataGrid-root--densityComfortable .MuiDataGrid-cell': { py: '22px' },
-            '&.MuiDataGrid-root .MuiDataGrid-cell': { wordBreak: 'break-word' },
-          }}
-        />
+        {wrapContent ? (
+          <DataGrid
+            {...commonGridProps}
+            getRowHeight={() => 'auto'}
+            sx={{
+              '&.MuiDataGrid-root--densityCompact .MuiDataGrid-cell': { py: '3px' },
+              '&.MuiDataGrid-root--densityCompact .MuiDataGrid-cell:has(button)': { py: '0px' },
+              '&.MuiDataGrid-root--densityStandard .MuiDataGrid-cell': { py: '15px' },
+              '&.MuiDataGrid-root--densityComfortable .MuiDataGrid-cell': { py: '22px' },
+              '&.MuiDataGrid-root .MuiDataGrid-cell': { wordBreak: 'break-word' },
+            }}
+          />
+        ) : (
+          <DataGrid {...commonGridProps} rowHeight={tableRowHeight} />
+        )}
       </div>
     </ThemeProvider>
   );

src/config/ReportConfig.tsx

@@ -46,6 +46,12 @@ const _REPORT_TYPES = {
         values: [true, false],
         default: false,
       },
+      wrapContent: {
+        label: 'Wrap overflowing content',
+        type: SELECTION_TYPES.LIST,
+        values: [true, false],
+        default: false,
+      },
       columnWidthsType: {
         label: 'Column Widths Specification',
         type: SELECTION_TYPES.LIST,

src/modal/AboutModal.tsx

@@ -3,7 +3,7 @@ import { Button, Dialog, TextLink } from '@neo4j-ndl/react';
 import { BookOpenIconOutline, BeakerIconOutline } from '@neo4j-ndl/react/icons';
 import { Section, SectionTitle, SectionContent } from './ModalUtils';
 
-export const version = '2.4.5';
+export const version = '2.4.6';
 
 export const NeoAboutModal = ({ open, handleClose, getDebugState }) => {
   const downloadDebugFile = () => {

src/report/ReportRecordProcessing.tsx

@@ -247,12 +247,15 @@ function RenderPath(value) {
 }
 
 function RenderArray(value) {
+  if (value.length > 0 && !valueIsNode(value[0]) && !valueIsRelationship(value[0])) {
+    return RenderString(value.join(', '));
+  }
   const mapped = value.map((v, i) => {
     return (
-      <div key={String(`k${i}`) + v}>
+      <span key={String(`k${i}`) + v}>
         {RenderSubValue(v)}
         {i < value.length - 1 && !valueIsNode(v) && !valueIsRelationship(v) ? <span>,&nbsp;</span> : <></>}
-      </div>
+      </span>
     );
   });
   return mapped;