From 832a8517a2dc5a4f58919de589a6c41f35b39d86 Mon Sep 17 00:00:00 2001 From: Sigfried Gold Date: Mon, 13 Nov 2023 17:34:40 -0500 Subject: [PATCH] - Moved calculation of collapsedDescendantPaths based on collapsePaths from state reducer to getRowData. Previously the collapsedDescendantPaths made the query string so big it would crash the browser on reload. - Also fixed the bug that was making expand/collapse not work. --- .../src/components/CsetComparisonPage.jsx | 31 +++++++------------ frontend/src/state/AppState.jsx | 10 ++---- 2 files changed, 13 insertions(+), 28 deletions(-) diff --git a/frontend/src/components/CsetComparisonPage.jsx b/frontend/src/components/CsetComparisonPage.jsx index 8f1c1f77e..323983a5b 100644 --- a/frontend/src/components/CsetComparisonPage.jsx +++ b/frontend/src/components/CsetComparisonPage.jsx @@ -1,36 +1,21 @@ import React, {useCallback, useEffect, useRef, useState,} from "react"; -// import { createSearchParams, useSearchParams, } from "react-router-dom"; import DataTable, {createTheme} from "react-data-table-component"; -// import {AddCircle, Download, RemoveCircleOutline} from "@mui/icons-material"; import AddCircle from "@mui/icons-material/AddCircle"; import Download from "@mui/icons-material/Download"; import RemoveCircleOutline from "@mui/icons-material/RemoveCircleOutline"; -// import {Box, IconButton, Slider, Switch} from "@mui/material"; import Box from "@mui/material/Box"; import IconButton from "@mui/material/IconButton"; import Slider from "@mui/material/Slider"; import Switch from "@mui/material/Switch"; import CloseIcon from "@mui/icons-material/Close"; import Button from "@mui/material/Button"; -// import {Checkbox} from "@mui/material"; -import {difference, flatten, intersection, isEmpty, max, sortBy, throttle, union, uniq, uniqBy} from "lodash"; -import Graph from 'graphology'; -import {allSimplePaths} from 'graphology-simple-path'; -import {dfsFromNode} from 'graphology-traversal/dfs'; +import { flatten, fromPairs, intersection, isEmpty, max, throttle, union, uniqBy } from "lodash"; import {fmt, saveCsv, useWindowSize} from "./utils"; import {setColDefDimensions} from "./dataTableUtils"; import {ConceptSetCard} from "./ConceptSetCard"; import {Tooltip} from "./Tooltip"; -import { - cellContents, - cellStyle, - getCodesetEditActionFunc, - getItem, - Legend, - newCsetAtlasWidget, - textCellForItem, -} from "./NewCset"; +import { cellContents, cellStyle, getCodesetEditActionFunc, getItem, Legend, newCsetAtlasWidget, textCellForItem, } from "./NewCset"; import {FlexibleContainer} from "./FlexibleContainer"; import {NEW_CSET_ID, urlWithSessionStorage, useCodesetIds, useHierarchySettings, useNewCset,} from "../state/AppState"; import {useDataCache} from "../state/DataCache"; @@ -382,9 +367,9 @@ export function getRowData(props) { console.log("getting row data"); const {conceptLookup, indentedCids, hierarchySettings, } = props; - const {collapsedDescendantPaths, hideZeroCounts, hideRxNormExtension, nested } = hierarchySettings; + const {/*collapsedDescendantPaths, */ collapsePaths, hideZeroCounts, hideRxNormExtension, nested } = hierarchySettings; - let allRows, displayedRows, rows; + let allRows, displayedRows; if (indentedCids) { // not sure why they wouldn't be here...maybe not ready yet? [allRows, displayedRows] = nestedConcepts(conceptLookup, indentedCids, hierarchySettings); } else { @@ -399,8 +384,14 @@ export function getRowData(props) { // const collapsedRows= allRows.filter(row => row.collapsed); // let rows = allRows.filter(row => !row.collapsed); if (nested) { + // collapsedDescendantPaths are all the paths that get hidden, the descendants of all the collapsePaths + const hiddenRows = flatten(Object.keys(collapsePaths).map(collapsedPath => { + return allRows.map(r => r.pathToRoot).filter( + p => p.length > collapsedPath.length && p.startsWith(collapsedPath)); + })); + const collapsedDescendantPaths = fromPairs(hiddenRows.map(p => [p, true])); hidden.collapsed = nested ? collapsedDescendantPaths.length : 0; - rows = allRows.filter(row => !collapsedDescendantPaths[row.pathToRoot]); + displayedRows = allRows.filter(row => !collapsedDescendantPaths[row.pathToRoot]); } // const rxNormExtensionRows = rows.filter(r => r.vocabulary_id == 'RxNorm Extension'); diff --git a/frontend/src/state/AppState.jsx b/frontend/src/state/AppState.jsx index 80c7df9f0..048dccf85 100644 --- a/frontend/src/state/AppState.jsx +++ b/frontend/src/state/AppState.jsx @@ -85,7 +85,7 @@ export function useHierarchySettings() { function hierarchySettingsReducer(state, action) { if ( ! ( action || {} ).type ) return state; - let {collapsePaths, collapsedDescendantPaths, + let {collapsePaths, // collapsedDescendantPaths, nested, hideRxNormExtension, hideZeroCounts} = {...unpersistedDefaultState, ...state}; switch (action.type) { case "collapseDescendants": { @@ -101,13 +101,7 @@ export function useHierarchySettings() { collapsePaths = {...collapsePaths}; delete collapsePaths[row.pathToRoot]; } - // collapsedDescendantPaths are all the paths that get hidden, the descendants of all the collapsePaths - const hiddenRows = flatten(Object.keys(collapsePaths).map(collapsedPath => { - return allRows.map(r => r.pathToRoot).filter( - p => p.length > collapsedPath.length && p.startsWith(collapsedPath)); - })); - collapsedDescendantPaths = fromPairs(hiddenRows.map(p => [p, true])); - return {...state, collapsePaths, collapsedDescendantPaths}; + return {...state, collapsePaths /*, collapsedDescendantPaths */}; } case "nested": { return {...state, nested: action.nested}