From fe8c0dec86fc47341cc3d9050ce4b36415cd055e Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 10 Jul 2024 08:28:30 +0100 Subject: [PATCH 01/32] add disable preview toggle Signed-off-by: Sajid Alam --- src/actions/index.js | 13 +++++++++++ src/actions/nodes.js | 18 +++++++++++---- .../settings-modal/settings-modal.js | 23 +++++++++++++++++++ .../settings-modal/settings-modal.test.js | 1 + src/config.js | 5 ++++ src/reducers/index.js | 6 +++++ src/store/initial-state.js | 1 + 7 files changed, 62 insertions(+), 5 deletions(-) diff --git a/src/actions/index.js b/src/actions/index.js index 47e83197af..e275eb5598 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -141,6 +141,19 @@ export function toggleShowFeatureHints(showFeatureHints) { }; } +export const TOGGLE_DISABLE_PREVIEW = 'TOGGLE_DISABLE_PREVIEW'; + +/** + * Toggle whether to disable node previews + * @param {Boolean} disablePreview True if node previews should be disabled + */ +export function toggleDisablePreview(disablePreview) { + return { + type: TOGGLE_DISABLE_PREVIEW, + disablePreview, + }; +} + export const TOGGLE_SIDEBAR = 'TOGGLE_SIDEBAR'; /** diff --git a/src/actions/nodes.js b/src/actions/nodes.js index 8a543b8830..8bd4d545cb 100644 --- a/src/actions/nodes.js +++ b/src/actions/nodes.js @@ -68,20 +68,28 @@ export function addNodeMetadata(data) { }; } +export const TOGGLE_DISABLE_PREVIEW = 'TOGGLE_DISABLE_PREVIEW'; + /** - * update node metadata on selection, loading new data if it has not been previously called - * @param {String} nodeID node id of clicked node - * @return {Function} A promise that resolves when the data is loaded + * Toggle whether to disable preview + * @param {Boolean} disablePreview The node's data */ +export function toggleDisablePreview(disablePreview) { + return { + type: TOGGLE_DISABLE_PREVIEW, + disablePreview, + }; +} + export function loadNodeData(nodeID) { return async function (dispatch, getState) { - const { dataSource, node } = getState(); + const { dataSource, node, disablePreview } = getState(); dispatch(toggleNodeClicked(nodeID)); if (dataSource === 'json' && nodeID && !node.fetched[nodeID]) { dispatch(toggleNodeDataLoading(true)); const url = getUrl('nodes', nodeID); - const nodeData = await loadJsonData(url); + const nodeData = await loadJsonData(url, {}, { disablePreview }); dispatch(addNodeMetadata({ id: nodeID, data: nodeData })); dispatch(toggleNodeDataLoading(false)); } diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index aeb0fb5656..2cdd936ba8 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -5,6 +5,7 @@ import { toggleShowFeatureHints, toggleIsPrettyName, toggleSettingsModal, + toggleDisablePreview, } from '../../actions'; import { getFlagsState } from '../../utils/flags'; import SettingsModalRow from './settings-modal-row'; @@ -27,10 +28,12 @@ const SettingsModal = ({ showFeatureHints, isOutdated, isPrettyName, + disablePreview, latestVersion, onToggleFlag, onToggleShowFeatureHints, onToggleIsPrettyName, + onToggleDisablePreview, showSettingsModal, visible, }) => { @@ -40,6 +43,8 @@ const SettingsModal = ({ const [isPrettyNameValue, setIsPrettyName] = useState(isPrettyName); const [showFeatureHintsValue, setShowFeatureHintsValue] = useState(showFeatureHints); + const [disablePreviewValue, setDisablePreviewValue] = + useState(disablePreview); const [toggleFlags, setToggleFlags] = useState(flags); useEffect(() => { @@ -65,6 +70,7 @@ const SettingsModal = ({ onToggleIsPrettyName(isPrettyNameValue); onToggleShowFeatureHints(showFeatureHintsValue); + onToggleDisablePreview(disablePreviewValue); setHasNotInteracted(true); setHasClickApplyAndClose(false); @@ -80,9 +86,11 @@ const SettingsModal = ({ hasClickedApplyAndClose, showFeatureHintsValue, isPrettyNameValue, + disablePreviewValue, onToggleFlag, onToggleShowFeatureHints, onToggleIsPrettyName, + onToggleDisablePreview, showSettingsModal, toggleFlags, ]); @@ -93,6 +101,7 @@ const SettingsModal = ({ setToggleFlags(flags); setIsPrettyName(isPrettyName); setShowFeatureHintsValue(showFeatureHintsValue); + setDisablePreviewValue(disablePreview); }; return ( @@ -130,6 +139,16 @@ const SettingsModal = ({ } }} /> + { + setDisablePreviewValue(event.target.checked); + setHasNotInteracted(false); + }} + /> {flagData.map(({ name, value, description }) => ( ({ flags: state.flags, showFeatureHints: state.showFeatureHints, isPrettyName: state.isPrettyName, + disablePreview: state.disablePreview, visible: state.visible, }); @@ -225,6 +245,9 @@ export const mapDispatchToProps = (dispatch) => ({ onToggleShowFeatureHints: (value) => { dispatch(toggleShowFeatureHints(value)); }, + onToggleDisablePreview: (value) => { + dispatch(toggleDisablePreview(value)); + }, }); export default connect(mapStateToProps, mapDispatchToProps)(SettingsModal); diff --git a/src/components/settings-modal/settings-modal.test.js b/src/components/settings-modal/settings-modal.test.js index 43e723644a..a1ae95f5c0 100644 --- a/src/components/settings-modal/settings-modal.test.js +++ b/src/components/settings-modal/settings-modal.test.js @@ -46,6 +46,7 @@ describe('SettingsModal', () => { exportModal: expect.any(Boolean), settingsModal: expect.any(Boolean), }), + disablePreview: expect.any(Boolean), flags: expect.any(Object), isPrettyName: expect.any(Boolean), showFeatureHints: expect.any(Boolean), diff --git a/src/config.js b/src/config.js index d68b1f9655..ca1cd89bc9 100644 --- a/src/config.js +++ b/src/config.js @@ -77,6 +77,11 @@ export const settings = { description: 'Enable or disable all new feature hints in the interface.', default: true, }, + disablePreview: { + name: 'Disable Node Previews', + description: 'Disable preview for all nodes in the pipeline', + default: false, + }, }; // Sidebar groups is an ordered map of { id: label } diff --git a/src/reducers/index.js b/src/reducers/index.js index 606077d8d9..3aad57eb0a 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -21,6 +21,7 @@ import { UPDATE_CHART_SIZE, UPDATE_ZOOM, TOGGLE_EXPAND_ALL_PIPELINES, + TOGGLE_DISABLE_PREVIEW, } from '../actions'; import { TOGGLE_PARAMETERS_HOVERED } from '../actions'; @@ -101,6 +102,11 @@ const combinedReducer = combineReducers({ TOGGLE_EXPAND_ALL_PIPELINES, 'shouldExpandAllPipelines' ), + disablePreview: createReducer( + false, + TOGGLE_DISABLE_PREVIEW, + 'disablePreview' + ), }); const rootReducer = (state, action) => diff --git a/src/store/initial-state.js b/src/store/initial-state.js index 9e65f9497f..d01fcdcdf2 100644 --- a/src/store/initial-state.js +++ b/src/store/initial-state.js @@ -24,6 +24,7 @@ export const createInitialState = () => ({ expandAllPipelines: false, isPrettyName: settings.isPrettyName.default, showFeatureHints: settings.showFeatureHints.default, + disablePreview: settings.disablePreview.default, ignoreLargeWarning: false, loading: { graph: false, From 7e69aca77dcb18cf7091ec0d300f36a4a6a998ec Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 10 Jul 2024 15:02:29 +0100 Subject: [PATCH 02/32] rename and add api call Signed-off-by: Sajid Alam --- src/actions/index.js | 12 +++--- src/actions/nodes.js | 20 +++------- .../settings-modal/settings-modal.js | 40 ++++++++++--------- .../settings-modal/settings-modal.test.js | 2 +- src/config.js | 8 ++-- src/reducers/index.js | 10 ++--- src/store/initial-state.js | 2 +- 7 files changed, 45 insertions(+), 49 deletions(-) diff --git a/src/actions/index.js b/src/actions/index.js index e275eb5598..a93a322988 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -141,16 +141,16 @@ export function toggleShowFeatureHints(showFeatureHints) { }; } -export const TOGGLE_DISABLE_PREVIEW = 'TOGGLE_DISABLE_PREVIEW'; +export const TOGGLE_SHOW_DATASET_PREVIEWS = 'TOGGLE_SHOW_DATASET_PREVIEWS'; /** - * Toggle whether to disable node previews - * @param {Boolean} disablePreview True if node previews should be disabled + * Toggle whether to show dataset previews on/off + * @param {Boolean} showDatasetPreviews True if dataset previews are to be shown */ -export function toggleDisablePreview(disablePreview) { +export function toggleShowDatasetPreviews(showDatasetPreviews) { return { - type: TOGGLE_DISABLE_PREVIEW, - disablePreview, + type: TOGGLE_SHOW_DATASET_PREVIEWS, + showDatasetPreviews, }; } diff --git a/src/actions/nodes.js b/src/actions/nodes.js index 8bd4d545cb..532e4dc40f 100644 --- a/src/actions/nodes.js +++ b/src/actions/nodes.js @@ -68,28 +68,20 @@ export function addNodeMetadata(data) { }; } -export const TOGGLE_DISABLE_PREVIEW = 'TOGGLE_DISABLE_PREVIEW'; - /** - * Toggle whether to disable preview - * @param {Boolean} disablePreview The node's data + * update node metadata on selection, loading new data if it has not been previously called + * @param {String} nodeID node id of clicked node + * @return {Function} A promise that resolves when the data is loaded */ -export function toggleDisablePreview(disablePreview) { - return { - type: TOGGLE_DISABLE_PREVIEW, - disablePreview, - }; -} - export function loadNodeData(nodeID) { return async function (dispatch, getState) { - const { dataSource, node, disablePreview } = getState(); + const { dataSource, node, showDatasetPreviews } = getState(); dispatch(toggleNodeClicked(nodeID)); if (dataSource === 'json' && nodeID && !node.fetched[nodeID]) { dispatch(toggleNodeDataLoading(true)); - const url = getUrl('nodes', nodeID); - const nodeData = await loadJsonData(url, {}, { disablePreview }); + const url = getUrl('nodes', nodeID, { showDatasetPreviews }); + const nodeData = await loadJsonData(url); dispatch(addNodeMetadata({ id: nodeID, data: nodeData })); dispatch(toggleNodeDataLoading(false)); } diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index 2cdd936ba8..fec08334ba 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -5,7 +5,7 @@ import { toggleShowFeatureHints, toggleIsPrettyName, toggleSettingsModal, - toggleDisablePreview, + toggleShowDatasetPreviews, } from '../../actions'; import { getFlagsState } from '../../utils/flags'; import SettingsModalRow from './settings-modal-row'; @@ -28,12 +28,12 @@ const SettingsModal = ({ showFeatureHints, isOutdated, isPrettyName, - disablePreview, + showDatasetPreviews, latestVersion, onToggleFlag, onToggleShowFeatureHints, onToggleIsPrettyName, - onToggleDisablePreview, + onToggleShowDatasetPreviews, showSettingsModal, visible, }) => { @@ -43,14 +43,18 @@ const SettingsModal = ({ const [isPrettyNameValue, setIsPrettyName] = useState(isPrettyName); const [showFeatureHintsValue, setShowFeatureHintsValue] = useState(showFeatureHints); - const [disablePreviewValue, setDisablePreviewValue] = - useState(disablePreview); + const [showDatasetPreviewsValue, setShowDatasetPreviewsValue] = + useState(showDatasetPreviews); const [toggleFlags, setToggleFlags] = useState(flags); useEffect(() => { setShowFeatureHintsValue(showFeatureHints); }, [showFeatureHints]); + useEffect(() => { + setShowDatasetPreviewsValue(showDatasetPreviews); + }, [showDatasetPreviews]); + useEffect(() => { let modalTimeout, resetTimeout; @@ -70,7 +74,7 @@ const SettingsModal = ({ onToggleIsPrettyName(isPrettyNameValue); onToggleShowFeatureHints(showFeatureHintsValue); - onToggleDisablePreview(disablePreviewValue); + onToggleShowDatasetPreviews(showDatasetPreviewsValue); setHasNotInteracted(true); setHasClickApplyAndClose(false); @@ -86,11 +90,11 @@ const SettingsModal = ({ hasClickedApplyAndClose, showFeatureHintsValue, isPrettyNameValue, - disablePreviewValue, + showDatasetPreviewsValue, onToggleFlag, onToggleShowFeatureHints, onToggleIsPrettyName, - onToggleDisablePreview, + onToggleShowDatasetPreviews, showSettingsModal, toggleFlags, ]); @@ -100,8 +104,8 @@ const SettingsModal = ({ setHasNotInteracted(true); setToggleFlags(flags); setIsPrettyName(isPrettyName); - setShowFeatureHintsValue(showFeatureHintsValue); - setDisablePreviewValue(disablePreview); + setShowFeatureHintsValue(showFeatureHints); + setShowDatasetPreviewsValue(showDatasetPreviews); }; return ( @@ -140,12 +144,12 @@ const SettingsModal = ({ }} /> { - setDisablePreviewValue(event.target.checked); + setShowDatasetPreviewsValue(event.target.checked); setHasNotInteracted(false); }} /> @@ -228,7 +232,7 @@ export const mapStateToProps = (state) => ({ flags: state.flags, showFeatureHints: state.showFeatureHints, isPrettyName: state.isPrettyName, - disablePreview: state.disablePreview, + showDatasetPreviews: state.showDatasetPreviews, visible: state.visible, }); @@ -245,8 +249,8 @@ export const mapDispatchToProps = (dispatch) => ({ onToggleShowFeatureHints: (value) => { dispatch(toggleShowFeatureHints(value)); }, - onToggleDisablePreview: (value) => { - dispatch(toggleDisablePreview(value)); + onToggleShowDatasetPreviews: (value) => { + dispatch(toggleShowDatasetPreviews(value)); }, }); diff --git a/src/components/settings-modal/settings-modal.test.js b/src/components/settings-modal/settings-modal.test.js index a1ae95f5c0..17e508a792 100644 --- a/src/components/settings-modal/settings-modal.test.js +++ b/src/components/settings-modal/settings-modal.test.js @@ -46,7 +46,7 @@ describe('SettingsModal', () => { exportModal: expect.any(Boolean), settingsModal: expect.any(Boolean), }), - disablePreview: expect.any(Boolean), + showDatasetPreviews: expect.any(Boolean), flags: expect.any(Object), isPrettyName: expect.any(Boolean), showFeatureHints: expect.any(Boolean), diff --git a/src/config.js b/src/config.js index 21f1ed0fb7..834bd31422 100644 --- a/src/config.js +++ b/src/config.js @@ -77,10 +77,10 @@ export const settings = { description: 'Enable or disable all new feature hints in the interface.', default: true, }, - disablePreview: { - name: 'Disable Node Previews', - description: 'Disable preview for all nodes in the pipeline', - default: false, + showDatasetPreviews: { + name: 'Dataset Previews', + description: 'Enable or disable dataset previews for all nodes.', + default: true, }, }; diff --git a/src/reducers/index.js b/src/reducers/index.js index 496d321b17..3bdd941e1b 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -13,6 +13,7 @@ import visible from './visible'; import { RESET_DATA, TOGGLE_SHOW_FEATURE_HINTS, + TOGGLE_SHOW_DATASET_PREVIEWS, TOGGLE_HOVERED_FOCUS_MODE, TOGGLE_IGNORE_LARGE_WARNING, TOGGLE_IS_PRETTY_NAME, @@ -21,7 +22,6 @@ import { UPDATE_CHART_SIZE, UPDATE_ZOOM, TOGGLE_EXPAND_ALL_PIPELINES, - TOGGLE_DISABLE_PREVIEW, } from '../actions'; import { TOGGLE_PARAMETERS_HOVERED } from '../actions'; @@ -102,10 +102,10 @@ const combinedReducer = combineReducers({ TOGGLE_EXPAND_ALL_PIPELINES, 'shouldExpandAllPipelines' ), - disablePreview: createReducer( - false, - TOGGLE_DISABLE_PREVIEW, - 'disablePreview' + showDatasetPreviews: createReducer( + true, + TOGGLE_SHOW_DATASET_PREVIEWS, + 'showDatasetPreviews' ), }); diff --git a/src/store/initial-state.js b/src/store/initial-state.js index d01fcdcdf2..44eee2c73b 100644 --- a/src/store/initial-state.js +++ b/src/store/initial-state.js @@ -24,7 +24,7 @@ export const createInitialState = () => ({ expandAllPipelines: false, isPrettyName: settings.isPrettyName.default, showFeatureHints: settings.showFeatureHints.default, - disablePreview: settings.disablePreview.default, + showDatasetPreviews: settings.showDatasetPreviews.default, ignoreLargeWarning: false, loading: { graph: false, From cddf0be24d13cb400ad16fee899b421704ed6309 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Thu, 11 Jul 2024 17:48:42 +0100 Subject: [PATCH 03/32] add to localstore Signed-off-by: Sajid Alam --- src/reducers/index.js | 10 +++++----- src/store/store.js | 1 + 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/src/reducers/index.js b/src/reducers/index.js index 3bdd941e1b..49067ee710 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -82,6 +82,11 @@ const combinedReducer = combineReducers({ TOGGLE_SHOW_FEATURE_HINTS, 'showFeatureHints' ), + showDatasetPreviews: createReducer( + true, + TOGGLE_SHOW_DATASET_PREVIEWS, + 'showDatasetPreviews' + ), hoveredParameters: createReducer( false, TOGGLE_PARAMETERS_HOVERED, @@ -102,11 +107,6 @@ const combinedReducer = combineReducers({ TOGGLE_EXPAND_ALL_PIPELINES, 'shouldExpandAllPipelines' ), - showDatasetPreviews: createReducer( - true, - TOGGLE_SHOW_DATASET_PREVIEWS, - 'showDatasetPreviews' - ), }); const rootReducer = (state, action) => diff --git a/src/store/store.js b/src/store/store.js index 01bf864cf8..55dc352df3 100644 --- a/src/store/store.js +++ b/src/store/store.js @@ -57,6 +57,7 @@ const saveStateToLocalStorage = (state) => { theme: state.theme, isPrettyName: state.isPrettyName, showFeatureHints: state.showFeatureHints, + showDatasetPreviews: state.showDatasetPreviews, flags: state.flags, expandAllPipelines: state.expandAllPipelines, }); From 5c7664fb29261680b79ef650b9036ea261113aea Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Mon, 15 Jul 2024 14:50:34 +0100 Subject: [PATCH 04/32] api backend implementation Signed-off-by: Sajid Alam --- package/kedro_viz/api/rest/responses.py | 4 +++- package/kedro_viz/api/rest/router.py | 6 +++--- src/actions/nodes.js | 2 +- src/utils/index.js | 17 +++++++++++++---- 4 files changed, 20 insertions(+), 9 deletions(-) diff --git a/package/kedro_viz/api/rest/responses.py b/package/kedro_viz/api/rest/responses.py index 8da71d0354..7117e40f75 100644 --- a/package/kedro_viz/api/rest/responses.py +++ b/package/kedro_viz/api/rest/responses.py @@ -320,7 +320,7 @@ def get_default_response() -> GraphAPIResponse: ) -def get_node_metadata_response(node_id: str): +def get_node_metadata_response(node_id: str, showDatasetPreviews: bool = True): """API response for `/api/nodes/node_id`.""" node = data_access_manager.nodes.get_node_by_id(node_id) if not node: @@ -329,6 +329,8 @@ def get_node_metadata_response(node_id: str): if not node.has_metadata(): return JSONResponse(content={}) + DataNodeMetadata.set_is_all_previews_enabled(showDatasetPreviews) + if isinstance(node, TaskNode): return TaskNodeMetadata(task_node=node) diff --git a/package/kedro_viz/api/rest/router.py b/package/kedro_viz/api/rest/router.py index d8a8499677..3631f125a1 100644 --- a/package/kedro_viz/api/rest/router.py +++ b/package/kedro_viz/api/rest/router.py @@ -4,7 +4,7 @@ import logging from typing import List -from fastapi import APIRouter +from fastapi import APIRouter, Query from fastapi.responses import JSONResponse from kedro_viz.api.rest.requests import DeployerConfiguration @@ -45,8 +45,8 @@ async def main(): response_model=NodeMetadataAPIResponse, response_model_exclude_none=True, ) -async def get_single_node_metadata(node_id: str): - return get_node_metadata_response(node_id) +async def get_single_node_metadata(node_id: str, showDatasetPreviews: bool = Query(True)): + return get_node_metadata_response(node_id, showDatasetPreviews) @router.get( diff --git a/src/actions/nodes.js b/src/actions/nodes.js index 532e4dc40f..b11a99ec0a 100644 --- a/src/actions/nodes.js +++ b/src/actions/nodes.js @@ -80,7 +80,7 @@ export function loadNodeData(nodeID) { if (dataSource === 'json' && nodeID && !node.fetched[nodeID]) { dispatch(toggleNodeDataLoading(true)); - const url = getUrl('nodes', nodeID, { showDatasetPreviews }); + const url = getUrl('nodes', nodeID, showDatasetPreviews); const nodeData = await loadJsonData(url); dispatch(addNodeMetadata({ id: nodeID, data: nodeData })); dispatch(toggleNodeDataLoading(false)); diff --git a/src/utils/index.js b/src/utils/index.js index 72fe34af97..bc61f73be6 100644 --- a/src/utils/index.js +++ b/src/utils/index.js @@ -18,24 +18,33 @@ export const arrayToObject = (array, callback) => { * Determine the endpoint URL for loading different data types * @param {String} type Data type * @param {String=} id Endpoint identifier e.g. pipeline ID + * @param {Boolean=} showDatasetPreviews Whether to show dataset previews */ -export const getUrl = (type, id) => { +export const getUrl = (type, id, showDatasetPreviews = true) => { + let url = ''; switch (type) { case 'main': - return [pathRoot, 'main'].join('/'); + url = [pathRoot, 'main'].join('/'); + break; case 'pipeline': if (!id) { throw new Error('No pipeline ID provided'); } - return [pathRoot, 'pipelines', id].join('/'); + url = [pathRoot, 'pipelines', id].join('/'); + break; case 'nodes': if (!id) { throw new Error('No node ID provided'); } - return [pathRoot, 'nodes', id].join('/'); + url = [pathRoot, 'nodes', id].join('/'); + break; default: throw new Error('Unknown URL type'); } + if (!showDatasetPreviews) { + url += '?showDatasetPreviews=false'; + } + return url; }; /** From 9204db6d44c2ae0093375ee42c671c47d3673995 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Tue, 16 Jul 2024 21:12:45 +0100 Subject: [PATCH 05/32] add new api endpoint Signed-off-by: Sajid Alam --- package/kedro_viz/api/rest/requests.py | 5 +++ package/kedro_viz/api/rest/responses.py | 4 +-- package/kedro_viz/api/rest/router.py | 19 ++++++++--- src/actions/index.js | 32 +++++++++++++++++++ src/actions/nodes.js | 4 +-- .../settings-modal/settings-modal.js | 7 ++++ src/reducers/index.js | 2 ++ src/reducers/preferences.js | 19 +++++++++++ src/utils/index.js | 17 +++------- 9 files changed, 87 insertions(+), 22 deletions(-) create mode 100644 src/reducers/preferences.js diff --git a/package/kedro_viz/api/rest/requests.py b/package/kedro_viz/api/rest/requests.py index 6f0a8bafb3..307a99d6c9 100644 --- a/package/kedro_viz/api/rest/requests.py +++ b/package/kedro_viz/api/rest/requests.py @@ -10,3 +10,8 @@ class DeployerConfiguration(BaseModel): is_all_previews_enabled: bool = False endpoint: str bucket_name: str + + +class UserPreference(BaseModel): + """User preferences for Kedro Viz.""" + showDatasetPreviews: bool diff --git a/package/kedro_viz/api/rest/responses.py b/package/kedro_viz/api/rest/responses.py index 7117e40f75..8da71d0354 100644 --- a/package/kedro_viz/api/rest/responses.py +++ b/package/kedro_viz/api/rest/responses.py @@ -320,7 +320,7 @@ def get_default_response() -> GraphAPIResponse: ) -def get_node_metadata_response(node_id: str, showDatasetPreviews: bool = True): +def get_node_metadata_response(node_id: str): """API response for `/api/nodes/node_id`.""" node = data_access_manager.nodes.get_node_by_id(node_id) if not node: @@ -329,8 +329,6 @@ def get_node_metadata_response(node_id: str, showDatasetPreviews: bool = True): if not node.has_metadata(): return JSONResponse(content={}) - DataNodeMetadata.set_is_all_previews_enabled(showDatasetPreviews) - if isinstance(node, TaskNode): return TaskNodeMetadata(task_node=node) diff --git a/package/kedro_viz/api/rest/router.py b/package/kedro_viz/api/rest/router.py index 3631f125a1..23438f3a27 100644 --- a/package/kedro_viz/api/rest/router.py +++ b/package/kedro_viz/api/rest/router.py @@ -4,10 +4,10 @@ import logging from typing import List -from fastapi import APIRouter, Query +from fastapi import APIRouter, HTTPException from fastapi.responses import JSONResponse -from kedro_viz.api.rest.requests import DeployerConfiguration +from kedro_viz.api.rest.requests import DeployerConfiguration, UserPreference from kedro_viz.constants import PACKAGE_REQUIREMENTS from kedro_viz.integrations.deployment.deployer_factory import DeployerFactory @@ -16,6 +16,7 @@ GraphAPIResponse, NodeMetadataAPIResponse, PackageCompatibilityAPIResponse, + DataNodeMetadata, get_default_response, get_node_metadata_response, get_package_compatibilities_response, @@ -45,8 +46,18 @@ async def main(): response_model=NodeMetadataAPIResponse, response_model_exclude_none=True, ) -async def get_single_node_metadata(node_id: str, showDatasetPreviews: bool = Query(True)): - return get_node_metadata_response(node_id, showDatasetPreviews) +async def get_single_node_metadata(node_id: str): + return get_node_metadata_response(node_id) + + +@router.post("/preferences") +async def update_preferences(preferences: UserPreference): + try: + DataNodeMetadata.set_is_all_previews_enabled(preferences.showDatasetPreviews) + return {"message": "Preferences updated successfully"} + except Exception as e: + logger.error(f"Failed to update preferences: {str(e)}") + raise HTTPException(status_code=500, detail="Failed to update preferences") @router.get( diff --git a/src/actions/index.js b/src/actions/index.js index a93a322988..6578d14dc2 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -141,6 +141,38 @@ export function toggleShowFeatureHints(showFeatureHints) { }; } +export const UPDATE_PREFERENCES = 'UPDATE_PREFERENCES'; + +/** + * Update user preferences + * @param {Object} preferences New preferences data + */ +export function updatePreferences(preferences) { + return async (dispatch) => { + try { + const response = await fetch('/api/preferences', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify(preferences), + }); + + if (response.ok) { + const updatedPreferences = await response.json(); + dispatch({ + type: UPDATE_PREFERENCES, + preferences: updatedPreferences, + }); + } else { + throw new Error('Failed to update preferences'); + } + } catch (error) { + console.error('Error updating preferences:', error); + } + }; +} + export const TOGGLE_SHOW_DATASET_PREVIEWS = 'TOGGLE_SHOW_DATASET_PREVIEWS'; /** diff --git a/src/actions/nodes.js b/src/actions/nodes.js index b11a99ec0a..8a543b8830 100644 --- a/src/actions/nodes.js +++ b/src/actions/nodes.js @@ -75,12 +75,12 @@ export function addNodeMetadata(data) { */ export function loadNodeData(nodeID) { return async function (dispatch, getState) { - const { dataSource, node, showDatasetPreviews } = getState(); + const { dataSource, node } = getState(); dispatch(toggleNodeClicked(nodeID)); if (dataSource === 'json' && nodeID && !node.fetched[nodeID]) { dispatch(toggleNodeDataLoading(true)); - const url = getUrl('nodes', nodeID, showDatasetPreviews); + const url = getUrl('nodes', nodeID); const nodeData = await loadJsonData(url); dispatch(addNodeMetadata({ id: nodeID, data: nodeData })); dispatch(toggleNodeDataLoading(false)); diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index fec08334ba..c2cc176589 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -6,6 +6,7 @@ import { toggleIsPrettyName, toggleSettingsModal, toggleShowDatasetPreviews, + updatePreferences, } from '../../actions'; import { getFlagsState } from '../../utils/flags'; import SettingsModalRow from './settings-modal-row'; @@ -34,6 +35,7 @@ const SettingsModal = ({ onToggleShowFeatureHints, onToggleIsPrettyName, onToggleShowDatasetPreviews, + updatePreferences, showSettingsModal, visible, }) => { @@ -75,6 +77,7 @@ const SettingsModal = ({ onToggleIsPrettyName(isPrettyNameValue); onToggleShowFeatureHints(showFeatureHintsValue); onToggleShowDatasetPreviews(showDatasetPreviewsValue); + updatePreferences({ showDatasetPreviews: showDatasetPreviewsValue }); setHasNotInteracted(true); setHasClickApplyAndClose(false); @@ -95,6 +98,7 @@ const SettingsModal = ({ onToggleShowFeatureHints, onToggleIsPrettyName, onToggleShowDatasetPreviews, + updatePreferences, showSettingsModal, toggleFlags, ]); @@ -252,6 +256,9 @@ export const mapDispatchToProps = (dispatch) => ({ onToggleShowDatasetPreviews: (value) => { dispatch(toggleShowDatasetPreviews(value)); }, + updatePreferences: (preferences) => { + dispatch(updatePreferences(preferences)); + }, }); export default connect(mapStateToProps, mapDispatchToProps)(SettingsModal); diff --git a/src/reducers/index.js b/src/reducers/index.js index 49067ee710..7b521d6d1f 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -10,6 +10,7 @@ import pipeline from './pipeline'; import tag from './tags'; import modularPipeline from './modular-pipelines'; import visible from './visible'; +import preferencesReducer from './preferences'; import { RESET_DATA, TOGGLE_SHOW_FEATURE_HINTS, @@ -67,6 +68,7 @@ const combinedReducer = combineReducers({ modularPipeline, visible, runsMetadata, + preferences: preferencesReducer, // These props don't have any actions associated with them display: createReducer(null), dataSource: createReducer(null), diff --git a/src/reducers/preferences.js b/src/reducers/preferences.js new file mode 100644 index 0000000000..b7e0e3066f --- /dev/null +++ b/src/reducers/preferences.js @@ -0,0 +1,19 @@ +import { UPDATE_PREFERENCES } from '../actions'; + +const initialState = { + showDatasetPreviews: true, +}; + +const preferencesReducer = (state = initialState, action) => { + switch (action.type) { + case UPDATE_PREFERENCES: + return { + ...state, + ...action.preferences, + }; + default: + return state; + } +}; + +export default preferencesReducer; diff --git a/src/utils/index.js b/src/utils/index.js index bc61f73be6..72fe34af97 100644 --- a/src/utils/index.js +++ b/src/utils/index.js @@ -18,33 +18,24 @@ export const arrayToObject = (array, callback) => { * Determine the endpoint URL for loading different data types * @param {String} type Data type * @param {String=} id Endpoint identifier e.g. pipeline ID - * @param {Boolean=} showDatasetPreviews Whether to show dataset previews */ -export const getUrl = (type, id, showDatasetPreviews = true) => { - let url = ''; +export const getUrl = (type, id) => { switch (type) { case 'main': - url = [pathRoot, 'main'].join('/'); - break; + return [pathRoot, 'main'].join('/'); case 'pipeline': if (!id) { throw new Error('No pipeline ID provided'); } - url = [pathRoot, 'pipelines', id].join('/'); - break; + return [pathRoot, 'pipelines', id].join('/'); case 'nodes': if (!id) { throw new Error('No node ID provided'); } - url = [pathRoot, 'nodes', id].join('/'); - break; + return [pathRoot, 'nodes', id].join('/'); default: throw new Error('Unknown URL type'); } - if (!showDatasetPreviews) { - url += '?showDatasetPreviews=false'; - } - return url; }; /** From 7731c0d429a19da99cf2aad2b07deea50e04f853 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 17 Jul 2024 14:35:09 +0100 Subject: [PATCH 06/32] changes based on review Signed-off-by: Sajid Alam --- package/kedro_viz/api/rest/requests.py | 1 + package/kedro_viz/api/rest/router.py | 2 +- src/actions/index.js | 32 ----------------- .../settings-modal/settings-modal.js | 34 +++++++++++++++---- src/reducers/index.js | 2 -- src/reducers/preferences.js | 19 ----------- 6 files changed, 29 insertions(+), 61 deletions(-) delete mode 100644 src/reducers/preferences.js diff --git a/package/kedro_viz/api/rest/requests.py b/package/kedro_viz/api/rest/requests.py index 307a99d6c9..b35f4f39b0 100644 --- a/package/kedro_viz/api/rest/requests.py +++ b/package/kedro_viz/api/rest/requests.py @@ -14,4 +14,5 @@ class DeployerConfiguration(BaseModel): class UserPreference(BaseModel): """User preferences for Kedro Viz.""" + showDatasetPreviews: bool diff --git a/package/kedro_viz/api/rest/router.py b/package/kedro_viz/api/rest/router.py index 23438f3a27..3efaa85354 100644 --- a/package/kedro_viz/api/rest/router.py +++ b/package/kedro_viz/api/rest/router.py @@ -13,10 +13,10 @@ from .responses import ( APIErrorMessage, + DataNodeMetadata, GraphAPIResponse, NodeMetadataAPIResponse, PackageCompatibilityAPIResponse, - DataNodeMetadata, get_default_response, get_node_metadata_response, get_package_compatibilities_response, diff --git a/src/actions/index.js b/src/actions/index.js index 6578d14dc2..a93a322988 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -141,38 +141,6 @@ export function toggleShowFeatureHints(showFeatureHints) { }; } -export const UPDATE_PREFERENCES = 'UPDATE_PREFERENCES'; - -/** - * Update user preferences - * @param {Object} preferences New preferences data - */ -export function updatePreferences(preferences) { - return async (dispatch) => { - try { - const response = await fetch('/api/preferences', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify(preferences), - }); - - if (response.ok) { - const updatedPreferences = await response.json(); - dispatch({ - type: UPDATE_PREFERENCES, - preferences: updatedPreferences, - }); - } else { - throw new Error('Failed to update preferences'); - } - } catch (error) { - console.error('Error updating preferences:', error); - } - }; -} - export const TOGGLE_SHOW_DATASET_PREVIEWS = 'TOGGLE_SHOW_DATASET_PREVIEWS'; /** diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index c2cc176589..c81ca13eff 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -6,7 +6,6 @@ import { toggleIsPrettyName, toggleSettingsModal, toggleShowDatasetPreviews, - updatePreferences, } from '../../actions'; import { getFlagsState } from '../../utils/flags'; import SettingsModalRow from './settings-modal-row'; @@ -35,7 +34,6 @@ const SettingsModal = ({ onToggleShowFeatureHints, onToggleIsPrettyName, onToggleShowDatasetPreviews, - updatePreferences, showSettingsModal, visible, }) => { @@ -77,7 +75,6 @@ const SettingsModal = ({ onToggleIsPrettyName(isPrettyNameValue); onToggleShowFeatureHints(showFeatureHintsValue); onToggleShowDatasetPreviews(showDatasetPreviewsValue); - updatePreferences({ showDatasetPreviews: showDatasetPreviewsValue }); setHasNotInteracted(true); setHasClickApplyAndClose(false); @@ -98,11 +95,37 @@ const SettingsModal = ({ onToggleShowFeatureHints, onToggleIsPrettyName, onToggleShowDatasetPreviews, - updatePreferences, showSettingsModal, toggleFlags, ]); + useEffect(() => { + const updatePreferences = async () => { + try { + const response = await fetch('/api/preferences', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify({ + showDatasetPreviews: showDatasetPreviewsValue, + }), + }); + + if (!response.ok) { + throw new Error('Failed to update preferences'); + } + + const result = await response.json(); + console.log('Preferences updated successfully:', result); + } catch (error) { + console.error('Error updating preferences:', error); + } + }; + + updatePreferences(); + }, [showDatasetPreviewsValue]); + const resetStateCloseModal = () => { showSettingsModal(false); setHasNotInteracted(true); @@ -256,9 +279,6 @@ export const mapDispatchToProps = (dispatch) => ({ onToggleShowDatasetPreviews: (value) => { dispatch(toggleShowDatasetPreviews(value)); }, - updatePreferences: (preferences) => { - dispatch(updatePreferences(preferences)); - }, }); export default connect(mapStateToProps, mapDispatchToProps)(SettingsModal); diff --git a/src/reducers/index.js b/src/reducers/index.js index 7b521d6d1f..49067ee710 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -10,7 +10,6 @@ import pipeline from './pipeline'; import tag from './tags'; import modularPipeline from './modular-pipelines'; import visible from './visible'; -import preferencesReducer from './preferences'; import { RESET_DATA, TOGGLE_SHOW_FEATURE_HINTS, @@ -68,7 +67,6 @@ const combinedReducer = combineReducers({ modularPipeline, visible, runsMetadata, - preferences: preferencesReducer, // These props don't have any actions associated with them display: createReducer(null), dataSource: createReducer(null), diff --git a/src/reducers/preferences.js b/src/reducers/preferences.js deleted file mode 100644 index b7e0e3066f..0000000000 --- a/src/reducers/preferences.js +++ /dev/null @@ -1,19 +0,0 @@ -import { UPDATE_PREFERENCES } from '../actions'; - -const initialState = { - showDatasetPreviews: true, -}; - -const preferencesReducer = (state = initialState, action) => { - switch (action.type) { - case UPDATE_PREFERENCES: - return { - ...state, - ...action.preferences, - }; - default: - return state; - } -}; - -export default preferencesReducer; From 1f22e3330d77fd7c21421b04d8c1f7b6267afa60 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 17 Jul 2024 14:59:15 +0100 Subject: [PATCH 07/32] coverage Signed-off-by: Sajid Alam --- .../tests/test_api/test_rest/test_router.py | 25 +++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/package/tests/test_api/test_rest/test_router.py b/package/tests/test_api/test_rest/test_router.py index 9ba1de7e2c..71b419f9e8 100644 --- a/package/tests/test_api/test_rest/test_router.py +++ b/package/tests/test_api/test_rest/test_router.py @@ -86,3 +86,28 @@ def test_get_package_compatibilities( assert response.status_code == expected_status_code assert response.json() == expected_response + + +def test_update_preferences_success(client, mocker): + mocker.patch("kedro_viz.api.rest.responses.DataNodeMetadata.set_is_all_previews_enabled") + response = client.post( + "api/preferences", + json={"showDatasetPreviews": True} + ) + + assert response.status_code == 200 + assert response.json() == {"message": "Preferences updated successfully"} + + +def test_update_preferences_failure(client, mocker): + mocker.patch( + "kedro_viz.api.rest.responses.DataNodeMetadata.set_is_all_previews_enabled", + side_effect=Exception("Test Exception") + ) + response = client.post( + "api/preferences", + json={"showDatasetPreviews": True} + ) + + assert response.status_code == 500 + assert response.json() == {"detail": "Failed to update preferences"} From 41137d9dedf264e47352928bef11ad214cad9e8e Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 17 Jul 2024 15:27:33 +0100 Subject: [PATCH 08/32] add tests Signed-off-by: Sajid Alam --- package/tests/test_api/test_rest/test_router.py | 14 +++++--------- .../settings-modal/settings-modal.test.js | 6 ++++++ 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/package/tests/test_api/test_rest/test_router.py b/package/tests/test_api/test_rest/test_router.py index 71b419f9e8..8f46aeadf9 100644 --- a/package/tests/test_api/test_rest/test_router.py +++ b/package/tests/test_api/test_rest/test_router.py @@ -89,11 +89,10 @@ def test_get_package_compatibilities( def test_update_preferences_success(client, mocker): - mocker.patch("kedro_viz.api.rest.responses.DataNodeMetadata.set_is_all_previews_enabled") - response = client.post( - "api/preferences", - json={"showDatasetPreviews": True} + mocker.patch( + "kedro_viz.api.rest.responses.DataNodeMetadata.set_is_all_previews_enabled" ) + response = client.post("api/preferences", json={"showDatasetPreviews": True}) assert response.status_code == 200 assert response.json() == {"message": "Preferences updated successfully"} @@ -102,12 +101,9 @@ def test_update_preferences_success(client, mocker): def test_update_preferences_failure(client, mocker): mocker.patch( "kedro_viz.api.rest.responses.DataNodeMetadata.set_is_all_previews_enabled", - side_effect=Exception("Test Exception") - ) - response = client.post( - "api/preferences", - json={"showDatasetPreviews": True} + side_effect=Exception("Test Exception"), ) + response = client.post("api/preferences", json={"showDatasetPreviews": True}) assert response.status_code == 500 assert response.json() == {"detail": "Failed to update preferences"} diff --git a/src/components/settings-modal/settings-modal.test.js b/src/components/settings-modal/settings-modal.test.js index 17e508a792..65156644b2 100644 --- a/src/components/settings-modal/settings-modal.test.js +++ b/src/components/settings-modal/settings-modal.test.js @@ -75,5 +75,11 @@ describe('SettingsModal', () => { type: 'TOGGLE_IS_PRETTY_NAME', isPrettyName: false, }); + + mapDispatchToProps(dispatch).onToggleShowDatasetPreviews(false); + expect(dispatch.mock.calls[3][0]).toEqual({ + type: 'TOGGLE_SHOW_DATASET_PREVIEWS', + showDatasetPreviews: false, + }); }); }); From c4cc6a15532fbc165aa555035f5943c9771327c7 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 17 Jul 2024 15:41:07 +0100 Subject: [PATCH 09/32] lint Signed-off-by: Sajid Alam --- package/kedro_viz/api/rest/router.py | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/package/kedro_viz/api/rest/router.py b/package/kedro_viz/api/rest/router.py index 3efaa85354..6548235953 100644 --- a/package/kedro_viz/api/rest/router.py +++ b/package/kedro_viz/api/rest/router.py @@ -55,9 +55,11 @@ async def update_preferences(preferences: UserPreference): try: DataNodeMetadata.set_is_all_previews_enabled(preferences.showDatasetPreviews) return {"message": "Preferences updated successfully"} - except Exception as e: - logger.error(f"Failed to update preferences: {str(e)}") - raise HTTPException(status_code=500, detail="Failed to update preferences") + except Exception as exception: + logger.error("Failed to update preferences: %s", str(exception)) + raise HTTPException( + status_code=500, detail="Failed to update preferences" + ) from exception @router.get( From 90ca5d0b2b1b0092527f379b940e31a1ae688369 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Thu, 18 Jul 2024 09:42:43 +0100 Subject: [PATCH 10/32] design changes Signed-off-by: Sajid Alam --- src/config.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/config.js b/src/config.js index 834bd31422..ea25d9d9a6 100644 --- a/src/config.js +++ b/src/config.js @@ -78,8 +78,8 @@ export const settings = { default: true, }, showDatasetPreviews: { - name: 'Dataset Previews', - description: 'Enable or disable dataset previews for all nodes.', + name: 'Dataset previews', + description: 'Display preview data for all datasets.', default: true, }, }; From b9d07f03185bdf293e1538b7bdf76ed1d6aac6b5 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Thu, 18 Jul 2024 16:19:31 +0100 Subject: [PATCH 11/32] changes based on review 2 Signed-off-by: Sajid Alam --- .../settings-modal/settings-modal.js | 57 +++++++++---------- 1 file changed, 27 insertions(+), 30 deletions(-) diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index c81ca13eff..07618d3176 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -55,6 +55,32 @@ const SettingsModal = ({ setShowDatasetPreviewsValue(showDatasetPreviews); }, [showDatasetPreviews]); + useEffect(() => { + setToggleFlags(flags); + }, [flags]); + + const handleSavePreferences = async () => { + try { + const response = await fetch('/api/preferences', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify({ + showDatasetPreviews: showDatasetPreviewsValue, + }), + }); + if (!response.ok) { + throw new Error('Failed to save preferences'); + } + onToggleIsPrettyName(isPrettyNameValue); + onToggleShowFeatureHints(showFeatureHintsValue); + onToggleShowDatasetPreviews(showDatasetPreviewsValue); + } catch (error) { + console.error('Error saving preferences:', error); + } + }; + useEffect(() => { let modalTimeout, resetTimeout; @@ -72,9 +98,7 @@ const SettingsModal = ({ return onToggleFlag(name, value); }); - onToggleIsPrettyName(isPrettyNameValue); - onToggleShowFeatureHints(showFeatureHintsValue); - onToggleShowDatasetPreviews(showDatasetPreviewsValue); + handleSavePreferences(); setHasNotInteracted(true); setHasClickApplyAndClose(false); @@ -99,33 +123,6 @@ const SettingsModal = ({ toggleFlags, ]); - useEffect(() => { - const updatePreferences = async () => { - try { - const response = await fetch('/api/preferences', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify({ - showDatasetPreviews: showDatasetPreviewsValue, - }), - }); - - if (!response.ok) { - throw new Error('Failed to update preferences'); - } - - const result = await response.json(); - console.log('Preferences updated successfully:', result); - } catch (error) { - console.error('Error updating preferences:', error); - } - }; - - updatePreferences(); - }, [showDatasetPreviewsValue]); - const resetStateCloseModal = () => { showSettingsModal(false); setHasNotInteracted(true); From 7468b5d8f1f59de255dc612f64a125f28007b3da Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Fri, 19 Jul 2024 09:41:46 +0100 Subject: [PATCH 12/32] changes based on review 3 Signed-off-by: Sajid Alam --- .../settings-modal/settings-modal.js | 17 ++++---------- src/utils/preferences-api.js | 22 +++++++++++++++++++ 2 files changed, 26 insertions(+), 13 deletions(-) create mode 100644 src/utils/preferences-api.js diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index 07618d3176..d5e78aecd5 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -12,6 +12,7 @@ import SettingsModalRow from './settings-modal-row'; import { settings as settingsConfig, localStorageName } from '../../config'; import { saveLocalStorage } from '../../store/helpers'; import { localStorageKeyFeatureHintsStep } from '../../components/feature-hints/feature-hints'; +import { updatePreferences } from '../../utils/preferences-api'; import Button from '../ui/button'; import Modal from '../ui/modal'; @@ -61,23 +62,13 @@ const SettingsModal = ({ const handleSavePreferences = async () => { try { - const response = await fetch('/api/preferences', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify({ - showDatasetPreviews: showDatasetPreviewsValue, - }), - }); - if (!response.ok) { - throw new Error('Failed to save preferences'); - } + const result = await updatePreferences(showDatasetPreviewsValue); + console.log('Preferences updated successfully:', result); onToggleIsPrettyName(isPrettyNameValue); onToggleShowFeatureHints(showFeatureHintsValue); onToggleShowDatasetPreviews(showDatasetPreviewsValue); } catch (error) { - console.error('Error saving preferences:', error); + console.error('Error updating preferences:', error); } }; diff --git a/src/utils/preferences-api.js b/src/utils/preferences-api.js new file mode 100644 index 0000000000..48a9a380c0 --- /dev/null +++ b/src/utils/preferences-api.js @@ -0,0 +1,22 @@ +export const updatePreferences = async (showDatasetPreviews) => { + try { + const response = await fetch('/api/preferences', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify({ + showDatasetPreviews, + }), + }); + + if (!response.ok) { + throw new Error('Failed to update preferences'); + } + + return await response.json(); + } catch (error) { + console.error('Error updating preferences:', error); + throw error; + } +}; From f40d62785430ef58fbbc07a147f6f6a6aaf93ef1 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Fri, 19 Jul 2024 09:51:57 +0100 Subject: [PATCH 13/32] add reducer test Signed-off-by: Sajid Alam --- src/components/settings-modal/settings-modal.js | 1 + src/reducers/reducers.test.js | 12 ++++++++++++ 2 files changed, 13 insertions(+) diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index d5e78aecd5..1129be3650 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -112,6 +112,7 @@ const SettingsModal = ({ onToggleShowDatasetPreviews, showSettingsModal, toggleFlags, + handleSavePreferences, ]); const resetStateCloseModal = () => { diff --git a/src/reducers/reducers.test.js b/src/reducers/reducers.test.js index 6cc8b1488b..d61d0e011f 100644 --- a/src/reducers/reducers.test.js +++ b/src/reducers/reducers.test.js @@ -15,6 +15,7 @@ import { TOGGLE_SIDEBAR, TOGGLE_IS_PRETTY_NAME, TOGGLE_SHOW_FEATURE_HINTS, + TOGGLE_SHOW_DATASET_PREVIEWS, TOGGLE_TEXT_LABELS, TOGGLE_THEME, UPDATE_CHART_SIZE, @@ -140,6 +141,17 @@ describe('Reducer', () => { }); }); + describe('TOGGLE_SHOW_DATASET_PREVIEWS', () => { + it('should toggle the value of showDatasetPreviews', () => { + const newState = reducer(mockState.spaceflights, { + type: TOGGLE_SHOW_DATASET_PREVIEWS, + showDatasetPreviews: true, + }); + expect(mockState.spaceflights.showDatasetPreviews).toBe(true); + expect(newState.showDatasetPreviews).toBe(true); + }); + }); + describe('TOGGLE_TEXT_LABELS', () => { it('should toggle the value of textLabels', () => { const newState = reducer(mockState.spaceflights, { From 1b90d05bcb96f4b4e39c863b87f0facb490d3e38 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Fri, 19 Jul 2024 10:04:35 +0100 Subject: [PATCH 14/32] elint fix Signed-off-by: Sajid Alam --- src/components/settings-modal/settings-modal.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index 1129be3650..7411d009b4 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react'; +import React, { useEffect, useState, useCallback } from 'react'; import { connect } from 'react-redux'; import { changeFlag, @@ -60,17 +60,14 @@ const SettingsModal = ({ setToggleFlags(flags); }, [flags]); - const handleSavePreferences = async () => { + const handleSavePreferences = useCallback(async () => { try { const result = await updatePreferences(showDatasetPreviewsValue); console.log('Preferences updated successfully:', result); - onToggleIsPrettyName(isPrettyNameValue); - onToggleShowFeatureHints(showFeatureHintsValue); - onToggleShowDatasetPreviews(showDatasetPreviewsValue); } catch (error) { console.error('Error updating preferences:', error); } - }; + }, [showDatasetPreviewsValue]); useEffect(() => { let modalTimeout, resetTimeout; @@ -90,6 +87,9 @@ const SettingsModal = ({ }); handleSavePreferences(); + onToggleIsPrettyName(isPrettyNameValue); + onToggleShowFeatureHints(showFeatureHintsValue); + onToggleShowDatasetPreviews(showDatasetPreviewsValue); setHasNotInteracted(true); setHasClickApplyAndClose(false); From 46eb7efcdb1c060fb2635f108a9e2a51af4ee40f Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Mon, 22 Jul 2024 10:41:36 +0100 Subject: [PATCH 15/32] changes based on review Signed-off-by: Sajid Alam --- package/kedro_viz/api/rest/router.py | 15 +++++++++------ src/components/settings-modal/settings-modal.js | 4 ---- src/utils/preferences-api.js | 10 ++++++++++ 3 files changed, 19 insertions(+), 10 deletions(-) diff --git a/package/kedro_viz/api/rest/router.py b/package/kedro_viz/api/rest/router.py index 6548235953..963b8aa248 100644 --- a/package/kedro_viz/api/rest/router.py +++ b/package/kedro_viz/api/rest/router.py @@ -4,7 +4,7 @@ import logging from typing import List -from fastapi import APIRouter, HTTPException +from fastapi import APIRouter from fastapi.responses import JSONResponse from kedro_viz.api.rest.requests import DeployerConfiguration, UserPreference @@ -54,12 +54,15 @@ async def get_single_node_metadata(node_id: str): async def update_preferences(preferences: UserPreference): try: DataNodeMetadata.set_is_all_previews_enabled(preferences.showDatasetPreviews) - return {"message": "Preferences updated successfully"} + return JSONResponse( + status_code=200, content={"message": "Preferences updated successfully"} + ) except Exception as exception: logger.error("Failed to update preferences: %s", str(exception)) - raise HTTPException( - status_code=500, detail="Failed to update preferences" - ) from exception + return JSONResponse( + status_code=500, + content={"message": f"Failed to update preferences: {str(exception)}"}, + ) @router.get( @@ -112,7 +115,7 @@ async def get_package_compatibilities(): return get_package_compatibilities_response(PACKAGE_REQUIREMENTS) except Exception as exc: logger.exception( - "An exception occured while getting package compatibility info : %s", exc + "An exception occurred while getting package compatibility info : %s", exc ) return JSONResponse( status_code=500, diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index 7411d009b4..fac6c60515 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -56,10 +56,6 @@ const SettingsModal = ({ setShowDatasetPreviewsValue(showDatasetPreviews); }, [showDatasetPreviews]); - useEffect(() => { - setToggleFlags(flags); - }, [flags]); - const handleSavePreferences = useCallback(async () => { try { const result = await updatePreferences(showDatasetPreviewsValue); diff --git a/src/utils/preferences-api.js b/src/utils/preferences-api.js index 48a9a380c0..d397b4658d 100644 --- a/src/utils/preferences-api.js +++ b/src/utils/preferences-api.js @@ -1,3 +1,13 @@ +/** + * Update user preferences for Kedro Viz. + * + * This function sends a POST request to the '/api/preferences' endpoint + * to update the user preference settings + * + * @param {boolean} showDatasetPreviews - Indicates whether to show dataset previews. + * @return {Promise} - A promise that resolves to the response data. + * @throws {Error} - Throws an error if the API request fails. + */ export const updatePreferences = async (showDatasetPreviews) => { try { const response = await fetch('/api/preferences', { From c38c51b4c99c9478b3dd10aab977bef6c38a9fa2 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Mon, 22 Jul 2024 14:52:08 +0100 Subject: [PATCH 16/32] Update test_router.py Signed-off-by: Sajid Alam --- package/tests/test_api/test_rest/test_router.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package/tests/test_api/test_rest/test_router.py b/package/tests/test_api/test_rest/test_router.py index 8f46aeadf9..7457621688 100644 --- a/package/tests/test_api/test_rest/test_router.py +++ b/package/tests/test_api/test_rest/test_router.py @@ -106,4 +106,4 @@ def test_update_preferences_failure(client, mocker): response = client.post("api/preferences", json={"showDatasetPreviews": True}) assert response.status_code == 500 - assert response.json() == {"detail": "Failed to update preferences"} + assert response.json() == {"message": "Failed to update preferences"} From 99aade6016e6db3419489079f37f537de30efe59 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Mon, 22 Jul 2024 15:01:02 +0100 Subject: [PATCH 17/32] Update router.py Signed-off-by: Sajid Alam --- package/kedro_viz/api/rest/router.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package/kedro_viz/api/rest/router.py b/package/kedro_viz/api/rest/router.py index 963b8aa248..c8badeb850 100644 --- a/package/kedro_viz/api/rest/router.py +++ b/package/kedro_viz/api/rest/router.py @@ -61,7 +61,7 @@ async def update_preferences(preferences: UserPreference): logger.error("Failed to update preferences: %s", str(exception)) return JSONResponse( status_code=500, - content={"message": f"Failed to update preferences: {str(exception)}"}, + content={"message": f"Failed to update preferences"}, ) From 9ec067d7cd81dc03fb61e41cf701d08dff4b6765 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Mon, 22 Jul 2024 15:15:45 +0100 Subject: [PATCH 18/32] remove fstring Signed-off-by: Sajid Alam --- package/kedro_viz/api/rest/router.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package/kedro_viz/api/rest/router.py b/package/kedro_viz/api/rest/router.py index c8badeb850..e03c110483 100644 --- a/package/kedro_viz/api/rest/router.py +++ b/package/kedro_viz/api/rest/router.py @@ -61,7 +61,7 @@ async def update_preferences(preferences: UserPreference): logger.error("Failed to update preferences: %s", str(exception)) return JSONResponse( status_code=500, - content={"message": f"Failed to update preferences"}, + content={"message": "Failed to update preferences"}, ) From 3657cfa4d82f2f4f368c31a1f239811fe385032f Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Mon, 22 Jul 2024 16:07:41 +0100 Subject: [PATCH 19/32] Add new endpoint to fetch initial showDatasetsPreviews value Signed-off-by: Sajid Alam --- package/kedro_viz/api/rest/router.py | 15 +++++++++++++++ src/config.js | 11 +++++++++++ src/utils/preferences-api.js | 24 ++++++++++++++++++++++++ 3 files changed, 50 insertions(+) diff --git a/package/kedro_viz/api/rest/router.py b/package/kedro_viz/api/rest/router.py index e03c110483..1c3ba560e9 100644 --- a/package/kedro_viz/api/rest/router.py +++ b/package/kedro_viz/api/rest/router.py @@ -65,6 +65,21 @@ async def update_preferences(preferences: UserPreference): ) +@router.get("/preferences", response_model=UserPreference) +async def get_preferences(): + try: + show_dataset_previews = DataNodeMetadata.is_all_previews_enabled + return JSONResponse( + status_code=200, content={"showDatasetPreviews": show_dataset_previews} + ) + except Exception as exception: + logger.error("Failed to fetch preferences: %s", str(exception)) + return JSONResponse( + status_code=500, + content={"message": f"Failed to fetch preferences: {str(exception)}"}, + ) + + @router.get( "/pipelines/{registered_pipeline_id}", response_model=GraphAPIResponse, diff --git a/src/config.js b/src/config.js index ea25d9d9a6..e7b92ac04d 100644 --- a/src/config.js +++ b/src/config.js @@ -1,4 +1,5 @@ import { sanitizedPathname } from './utils'; +import { fetchPreferences } from './utils/preferences-api'; export const localStorageName = 'KedroViz'; export const localStorageFlowchartLink = 'KedroViz-link-to-flowchart'; @@ -84,6 +85,16 @@ export const settings = { }, }; +// Fetch preferences from the backend and update settings +(async () => { + try { + const preferences = await fetchPreferences(); + settings.showDatasetPreviews.default = preferences.showDatasetPreviews; + } catch (error) { + console.error('Error fetching initial preferences:', error); + } +})(); + // Sidebar groups is an ordered map of { id: label } export const sidebarGroups = { elementType: 'Element types', diff --git a/src/utils/preferences-api.js b/src/utils/preferences-api.js index d397b4658d..c6040a56a7 100644 --- a/src/utils/preferences-api.js +++ b/src/utils/preferences-api.js @@ -30,3 +30,27 @@ export const updatePreferences = async (showDatasetPreviews) => { throw error; } }; + +/** + * Fetch preferences from the backend. + * @return {Promise} Preferences object containing showDatasetPreviews. + */ +export const fetchPreferences = async () => { + try { + const response = await fetch('/api/preferences', { + method: 'GET', + headers: { + 'Content-Type': 'application/json', + }, + }); + + if (!response.ok) { + throw new Error('Failed to fetch preferences'); + } + + return await response.json(); + } catch (error) { + console.error('Error fetching preferences:', error); + throw error; + } +}; From 013ca1c4846da266b209e9a0fc1c3367f002c663 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Mon, 22 Jul 2024 16:42:50 +0100 Subject: [PATCH 20/32] coverage Signed-off-by: Sajid Alam --- package/kedro_viz/api/rest/router.py | 2 +- .../tests/test_api/test_rest/test_router.py | 21 +++++++++++++++++++ 2 files changed, 22 insertions(+), 1 deletion(-) diff --git a/package/kedro_viz/api/rest/router.py b/package/kedro_viz/api/rest/router.py index 1c3ba560e9..64ad2dc4d6 100644 --- a/package/kedro_viz/api/rest/router.py +++ b/package/kedro_viz/api/rest/router.py @@ -76,7 +76,7 @@ async def get_preferences(): logger.error("Failed to fetch preferences: %s", str(exception)) return JSONResponse( status_code=500, - content={"message": f"Failed to fetch preferences: {str(exception)}"}, + content={"message": "Failed to fetch preferences"}, ) diff --git a/package/tests/test_api/test_rest/test_router.py b/package/tests/test_api/test_rest/test_router.py index 7457621688..e3333fea15 100644 --- a/package/tests/test_api/test_rest/test_router.py +++ b/package/tests/test_api/test_rest/test_router.py @@ -107,3 +107,24 @@ def test_update_preferences_failure(client, mocker): assert response.status_code == 500 assert response.json() == {"message": "Failed to update preferences"} + + +def test_get_preferences_success(client, mocker): + mocker.patch( + "kedro_viz.api.rest.responses.DataNodeMetadata", is_all_previews_enabled=True + ) + response = client.get("/api/preferences") + + assert response.status_code == 200 + assert response.json() == {"showDatasetPreviews": True} + + +def test_get_preferences_failure(client, mocker): + mocker.patch( + "kedro_viz.api.rest.responses.DataNodeMetadata.is_all_previews_enabled", + side_effect=Exception("Test Exception"), + ) + response = client.get("/api/preferences") + + assert response.status_code == 500 + assert response.json() == {"message": "Failed to fetch preferences"} From 1d1796e22510df16c2ed415df740c939519188b8 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Tue, 23 Jul 2024 14:27:04 +0100 Subject: [PATCH 21/32] redux thunk for preferences API Signed-off-by: Sajid Alam --- src/actions/preferences.js | 19 +++++++++++++++++ .../settings-modal/settings-modal.js | 13 +++++++++++- src/config.js | 11 ---------- src/reducers/index.js | 2 ++ src/reducers/preferences.js | 21 +++++++++++++++++++ 5 files changed, 54 insertions(+), 12 deletions(-) create mode 100644 src/actions/preferences.js create mode 100644 src/reducers/preferences.js diff --git a/src/actions/preferences.js b/src/actions/preferences.js new file mode 100644 index 0000000000..2271d766e3 --- /dev/null +++ b/src/actions/preferences.js @@ -0,0 +1,19 @@ +import { fetchPreferences } from '../utils/preferences-api'; + +// Action Types +export const PREFERENCES_LOADED = '[Preferences] loaded'; + +// Action Creators +export const preferencesLoaded = (preferences) => ({ + type: PREFERENCES_LOADED, + payload: preferences, +}); + +export const getPreferences = () => async (dispatch) => { + try { + const preferences = await fetchPreferences(); + dispatch(preferencesLoaded(preferences)); + } catch (error) { + console.error('Error fetching preferences:', error); + } +}; diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index fac6c60515..4cfcc245c3 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -7,6 +7,7 @@ import { toggleSettingsModal, toggleShowDatasetPreviews, } from '../../actions'; +import { getPreferences } from '../../actions/preferences'; import { getFlagsState } from '../../utils/flags'; import SettingsModalRow from './settings-modal-row'; import { settings as settingsConfig, localStorageName } from '../../config'; @@ -36,6 +37,7 @@ const SettingsModal = ({ onToggleIsPrettyName, onToggleShowDatasetPreviews, showSettingsModal, + getPreferences, visible, }) => { const flagData = getFlagsState(); @@ -56,6 +58,12 @@ const SettingsModal = ({ setShowDatasetPreviewsValue(showDatasetPreviews); }, [showDatasetPreviews]); + useEffect(() => { + if (visible.settingsModal) { + getPreferences(); + } + }, [visible.settingsModal, getPreferences]); + const handleSavePreferences = useCallback(async () => { try { const result = await updatePreferences(showDatasetPreviewsValue); @@ -244,7 +252,7 @@ export const mapStateToProps = (state) => ({ flags: state.flags, showFeatureHints: state.showFeatureHints, isPrettyName: state.isPrettyName, - showDatasetPreviews: state.showDatasetPreviews, + showDatasetPreviews: state.preferences.showDatasetPreviews, visible: state.visible, }); @@ -252,6 +260,9 @@ export const mapDispatchToProps = (dispatch) => ({ showSettingsModal: (value) => { dispatch(toggleSettingsModal(value)); }, + getPreferences: () => { + dispatch(getPreferences()); + }, onToggleFlag: (name, value) => { dispatch(changeFlag(name, value)); }, diff --git a/src/config.js b/src/config.js index e7b92ac04d..ea25d9d9a6 100644 --- a/src/config.js +++ b/src/config.js @@ -1,5 +1,4 @@ import { sanitizedPathname } from './utils'; -import { fetchPreferences } from './utils/preferences-api'; export const localStorageName = 'KedroViz'; export const localStorageFlowchartLink = 'KedroViz-link-to-flowchart'; @@ -85,16 +84,6 @@ export const settings = { }, }; -// Fetch preferences from the backend and update settings -(async () => { - try { - const preferences = await fetchPreferences(); - settings.showDatasetPreviews.default = preferences.showDatasetPreviews; - } catch (error) { - console.error('Error fetching initial preferences:', error); - } -})(); - // Sidebar groups is an ordered map of { id: label } export const sidebarGroups = { elementType: 'Element types', diff --git a/src/reducers/index.js b/src/reducers/index.js index 90f1495d61..737a8d186e 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -11,6 +11,7 @@ import tag from './tags'; import merge from 'lodash/merge'; import modularPipeline from './modular-pipelines'; import visible from './visible'; +import preferences from './preferences'; import { RESET_DATA, TOGGLE_SHOW_FEATURE_HINTS, @@ -82,6 +83,7 @@ const combinedReducer = combineReducers({ modularPipeline, visible, runsMetadata, + preferences, // These props don't have any actions associated with them display: createReducer(null), dataSource: createReducer(null), diff --git a/src/reducers/preferences.js b/src/reducers/preferences.js new file mode 100644 index 0000000000..0816d06ffa --- /dev/null +++ b/src/reducers/preferences.js @@ -0,0 +1,21 @@ +// src/reducers/preferences.js + +import { PREFERENCES_LOADED } from '../actions/preferences'; + +const initialState = { + showDatasetPreviews: true, // default value +}; + +const preferencesReducer = (state = initialState, action) => { + switch (action.type) { + case PREFERENCES_LOADED: + return { + ...state, + showDatasetPreviews: action.payload.showDatasetPreviews, + }; + default: + return state; + } +}; + +export default preferencesReducer; From 0efaee1842f4eea7d8f9f87c11057054bdceb8f2 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Tue, 23 Jul 2024 14:58:56 +0100 Subject: [PATCH 22/32] Update preferences.js Signed-off-by: Sajid Alam --- src/actions/preferences.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/actions/preferences.js b/src/actions/preferences.js index 2271d766e3..f284e0b414 100644 --- a/src/actions/preferences.js +++ b/src/actions/preferences.js @@ -1,7 +1,7 @@ import { fetchPreferences } from '../utils/preferences-api'; // Action Types -export const PREFERENCES_LOADED = '[Preferences] loaded'; +export const PREFERENCES_LOADED = 'PREFERENCES_LOADED'; // Action Creators export const preferencesLoaded = (preferences) => ({ From 03b4a50ccccc7f28bed7b6955dc330bc56ebd67c Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Tue, 23 Jul 2024 15:29:49 +0100 Subject: [PATCH 23/32] Update settings-modal.js Signed-off-by: Sajid Alam --- src/components/settings-modal/settings-modal.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index 4cfcc245c3..d19fbaa254 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -66,8 +66,7 @@ const SettingsModal = ({ const handleSavePreferences = useCallback(async () => { try { - const result = await updatePreferences(showDatasetPreviewsValue); - console.log('Preferences updated successfully:', result); + await updatePreferences(showDatasetPreviewsValue); } catch (error) { console.error('Error updating preferences:', error); } From 055ed76b46167d0033f86a25267ec3f46643d6fb Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Tue, 23 Jul 2024 17:07:34 +0100 Subject: [PATCH 24/32] revert nested Signed-off-by: Sajid Alam --- .../settings-modal/settings-modal.js | 2 +- src/reducers/index.js | 18 +++++++++++------- 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index d19fbaa254..38c411dc39 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -251,7 +251,7 @@ export const mapStateToProps = (state) => ({ flags: state.flags, showFeatureHints: state.showFeatureHints, isPrettyName: state.isPrettyName, - showDatasetPreviews: state.preferences.showDatasetPreviews, + showDatasetPreviews: state.showDatasetPreviews, visible: state.visible, }); diff --git a/src/reducers/index.js b/src/reducers/index.js index 737a8d186e..d3538fe8fd 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -11,7 +11,6 @@ import tag from './tags'; import merge from 'lodash/merge'; import modularPipeline from './modular-pipelines'; import visible from './visible'; -import preferences from './preferences'; import { RESET_DATA, TOGGLE_SHOW_FEATURE_HINTS, @@ -26,6 +25,7 @@ import { TOGGLE_EXPAND_ALL_PIPELINES, UPDATE_STATE_FROM_OPTIONS, } from '../actions'; +import { PREFERENCES_LOADED } from '../actions/preferences'; import { TOGGLE_PARAMETERS_HOVERED } from '../actions'; /** @@ -83,7 +83,6 @@ const combinedReducer = combineReducers({ modularPipeline, visible, runsMetadata, - preferences, // These props don't have any actions associated with them display: createReducer(null), dataSource: createReducer(null), @@ -99,11 +98,16 @@ const combinedReducer = combineReducers({ TOGGLE_SHOW_FEATURE_HINTS, 'showFeatureHints' ), - showDatasetPreviews: createReducer( - true, - TOGGLE_SHOW_DATASET_PREVIEWS, - 'showDatasetPreviews' - ), + showDatasetPreviews: (state = true, action) => { + switch (action.type) { + case TOGGLE_SHOW_DATASET_PREVIEWS: + return action.showDatasetPreviews; + case PREFERENCES_LOADED: + return action.payload.showDatasetPreviews ?? state; + default: + return state; + } + }, hoveredParameters: createReducer( false, TOGGLE_PARAMETERS_HOVERED, From a6603bf223353561f480199753c45687850bd036 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Tue, 23 Jul 2024 17:32:26 +0100 Subject: [PATCH 25/32] changes based on review Signed-off-by: Sajid Alam --- src/actions/index.js | 13 ------------ src/actions/preferences.js | 6 ++++++ .../settings-modal/settings-modal.js | 6 ++++-- src/reducers/index.js | 6 ++++-- src/reducers/preferences.js | 21 ------------------- src/reducers/reducers.test.js | 2 +- 6 files changed, 15 insertions(+), 39 deletions(-) delete mode 100644 src/reducers/preferences.js diff --git a/src/actions/index.js b/src/actions/index.js index eb7e10309f..a04c759fef 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -141,19 +141,6 @@ export function toggleShowFeatureHints(showFeatureHints) { }; } -export const TOGGLE_SHOW_DATASET_PREVIEWS = 'TOGGLE_SHOW_DATASET_PREVIEWS'; - -/** - * Toggle whether to show dataset previews on/off - * @param {Boolean} showDatasetPreviews True if dataset previews are to be shown - */ -export function toggleShowDatasetPreviews(showDatasetPreviews) { - return { - type: TOGGLE_SHOW_DATASET_PREVIEWS, - showDatasetPreviews, - }; -} - export const TOGGLE_SIDEBAR = 'TOGGLE_SIDEBAR'; /** diff --git a/src/actions/preferences.js b/src/actions/preferences.js index f284e0b414..251950347a 100644 --- a/src/actions/preferences.js +++ b/src/actions/preferences.js @@ -2,6 +2,7 @@ import { fetchPreferences } from '../utils/preferences-api'; // Action Types export const PREFERENCES_LOADED = 'PREFERENCES_LOADED'; +export const TOGGLE_SHOW_DATASET_PREVIEWS = 'TOGGLE_SHOW_DATASET_PREVIEWS'; // Action Creators export const preferencesLoaded = (preferences) => ({ @@ -9,6 +10,11 @@ export const preferencesLoaded = (preferences) => ({ payload: preferences, }); +export const toggleShowDatasetPreviews = (showDatasetPreviews) => ({ + type: TOGGLE_SHOW_DATASET_PREVIEWS, + showDatasetPreviews, +}); + export const getPreferences = () => async (dispatch) => { try { const preferences = await fetchPreferences(); diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index 38c411dc39..890ee49acd 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -5,9 +5,11 @@ import { toggleShowFeatureHints, toggleIsPrettyName, toggleSettingsModal, - toggleShowDatasetPreviews, } from '../../actions'; -import { getPreferences } from '../../actions/preferences'; +import { + getPreferences, + toggleShowDatasetPreviews, +} from '../../actions/preferences'; import { getFlagsState } from '../../utils/flags'; import SettingsModalRow from './settings-modal-row'; import { settings as settingsConfig, localStorageName } from '../../config'; diff --git a/src/reducers/index.js b/src/reducers/index.js index d3538fe8fd..4a9e117107 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -14,7 +14,6 @@ import visible from './visible'; import { RESET_DATA, TOGGLE_SHOW_FEATURE_HINTS, - TOGGLE_SHOW_DATASET_PREVIEWS, TOGGLE_HOVERED_FOCUS_MODE, TOGGLE_IGNORE_LARGE_WARNING, TOGGLE_IS_PRETTY_NAME, @@ -25,7 +24,10 @@ import { TOGGLE_EXPAND_ALL_PIPELINES, UPDATE_STATE_FROM_OPTIONS, } from '../actions'; -import { PREFERENCES_LOADED } from '../actions/preferences'; +import { + PREFERENCES_LOADED, + TOGGLE_SHOW_DATASET_PREVIEWS, +} from '../actions/preferences'; import { TOGGLE_PARAMETERS_HOVERED } from '../actions'; /** diff --git a/src/reducers/preferences.js b/src/reducers/preferences.js deleted file mode 100644 index 0816d06ffa..0000000000 --- a/src/reducers/preferences.js +++ /dev/null @@ -1,21 +0,0 @@ -// src/reducers/preferences.js - -import { PREFERENCES_LOADED } from '../actions/preferences'; - -const initialState = { - showDatasetPreviews: true, // default value -}; - -const preferencesReducer = (state = initialState, action) => { - switch (action.type) { - case PREFERENCES_LOADED: - return { - ...state, - showDatasetPreviews: action.payload.showDatasetPreviews, - }; - default: - return state; - } -}; - -export default preferencesReducer; diff --git a/src/reducers/reducers.test.js b/src/reducers/reducers.test.js index 464b197b2e..42afbf6574 100644 --- a/src/reducers/reducers.test.js +++ b/src/reducers/reducers.test.js @@ -15,7 +15,6 @@ import { TOGGLE_SIDEBAR, TOGGLE_IS_PRETTY_NAME, TOGGLE_SHOW_FEATURE_HINTS, - TOGGLE_SHOW_DATASET_PREVIEWS, TOGGLE_TEXT_LABELS, TOGGLE_THEME, UPDATE_CHART_SIZE, @@ -37,6 +36,7 @@ import { import { UPDATE_ACTIVE_PIPELINE } from '../actions/pipelines'; import { TOGGLE_MODULAR_PIPELINE_ACTIVE } from '../actions/modular-pipelines'; import { TOGGLE_GRAPH_LOADING } from '../actions/graph'; +import { TOGGLE_SHOW_DATASET_PREVIEWS } from '../actions/preferences'; describe('Reducer', () => { it('should return an Object', () => { From f1843497dba2f50fa4ace9a11215da74ce940a48 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 24 Jul 2024 02:59:39 +0100 Subject: [PATCH 26/32] combine preference action Signed-off-by: Sajid Alam --- src/actions/preferences.js | 16 +++++----------- src/components/settings-modal/settings-modal.js | 4 ++-- src/reducers/index.js | 11 +++-------- 3 files changed, 10 insertions(+), 21 deletions(-) diff --git a/src/actions/preferences.js b/src/actions/preferences.js index 251950347a..dc8fcc0b93 100644 --- a/src/actions/preferences.js +++ b/src/actions/preferences.js @@ -1,24 +1,18 @@ import { fetchPreferences } from '../utils/preferences-api'; // Action Types -export const PREFERENCES_LOADED = 'PREFERENCES_LOADED'; -export const TOGGLE_SHOW_DATASET_PREVIEWS = 'TOGGLE_SHOW_DATASET_PREVIEWS'; +export const UPDATE_DATASET_PREVIEWS = 'UPDATE_DATASET_PREVIEWS'; // Action Creators -export const preferencesLoaded = (preferences) => ({ - type: PREFERENCES_LOADED, - payload: preferences, -}); - -export const toggleShowDatasetPreviews = (showDatasetPreviews) => ({ - type: TOGGLE_SHOW_DATASET_PREVIEWS, - showDatasetPreviews, +export const updateDatasetPreviews = (showDatasetPreviews) => ({ + type: UPDATE_DATASET_PREVIEWS, + payload: { showDatasetPreviews }, }); export const getPreferences = () => async (dispatch) => { try { const preferences = await fetchPreferences(); - dispatch(preferencesLoaded(preferences)); + dispatch(updateDatasetPreviews(preferences.showDatasetPreviews)); } catch (error) { console.error('Error fetching preferences:', error); } diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index 890ee49acd..635dd67ce6 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -8,7 +8,7 @@ import { } from '../../actions'; import { getPreferences, - toggleShowDatasetPreviews, + updateDatasetPreviews, } from '../../actions/preferences'; import { getFlagsState } from '../../utils/flags'; import SettingsModalRow from './settings-modal-row'; @@ -274,7 +274,7 @@ export const mapDispatchToProps = (dispatch) => ({ dispatch(toggleShowFeatureHints(value)); }, onToggleShowDatasetPreviews: (value) => { - dispatch(toggleShowDatasetPreviews(value)); + dispatch(updateDatasetPreviews(value)); }, }); diff --git a/src/reducers/index.js b/src/reducers/index.js index 4a9e117107..522e0075d9 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -24,10 +24,7 @@ import { TOGGLE_EXPAND_ALL_PIPELINES, UPDATE_STATE_FROM_OPTIONS, } from '../actions'; -import { - PREFERENCES_LOADED, - TOGGLE_SHOW_DATASET_PREVIEWS, -} from '../actions/preferences'; +import { UPDATE_DATASET_PREVIEWS } from '../actions/preferences'; import { TOGGLE_PARAMETERS_HOVERED } from '../actions'; /** @@ -102,10 +99,8 @@ const combinedReducer = combineReducers({ ), showDatasetPreviews: (state = true, action) => { switch (action.type) { - case TOGGLE_SHOW_DATASET_PREVIEWS: - return action.showDatasetPreviews; - case PREFERENCES_LOADED: - return action.payload.showDatasetPreviews ?? state; + case UPDATE_DATASET_PREVIEWS: + return action.payload.showDatasetPreviews; default: return state; } From 7a070e0a8dbb8dad2ad9f0c00e78b59678f5bae0 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 24 Jul 2024 03:14:17 +0100 Subject: [PATCH 27/32] changes based on reviews Signed-off-by: Sajid Alam --- src/reducers/index.js | 11 ++--------- src/reducers/preferences.js | 14 ++++++++++++++ src/reducers/reducers.test.js | 10 +++++----- 3 files changed, 21 insertions(+), 14 deletions(-) create mode 100644 src/reducers/preferences.js diff --git a/src/reducers/index.js b/src/reducers/index.js index 522e0075d9..d4183979b4 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -24,7 +24,7 @@ import { TOGGLE_EXPAND_ALL_PIPELINES, UPDATE_STATE_FROM_OPTIONS, } from '../actions'; -import { UPDATE_DATASET_PREVIEWS } from '../actions/preferences'; +import showDatasetPreviews from './preferences'; import { TOGGLE_PARAMETERS_HOVERED } from '../actions'; /** @@ -82,6 +82,7 @@ const combinedReducer = combineReducers({ modularPipeline, visible, runsMetadata, + showDatasetPreviews, // These props don't have any actions associated with them display: createReducer(null), dataSource: createReducer(null), @@ -97,14 +98,6 @@ const combinedReducer = combineReducers({ TOGGLE_SHOW_FEATURE_HINTS, 'showFeatureHints' ), - showDatasetPreviews: (state = true, action) => { - switch (action.type) { - case UPDATE_DATASET_PREVIEWS: - return action.payload.showDatasetPreviews; - default: - return state; - } - }, hoveredParameters: createReducer( false, TOGGLE_PARAMETERS_HOVERED, diff --git a/src/reducers/preferences.js b/src/reducers/preferences.js new file mode 100644 index 0000000000..fc99b34a23 --- /dev/null +++ b/src/reducers/preferences.js @@ -0,0 +1,14 @@ +import { UPDATE_DATASET_PREVIEWS } from '../actions/preferences'; + +const initialState = true; + +const showDatasetPreviews = (state = initialState, action) => { + switch (action.type) { + case UPDATE_DATASET_PREVIEWS: + return action.payload.showDatasetPreviews; + default: + return state; + } +}; + +export default showDatasetPreviews; diff --git a/src/reducers/reducers.test.js b/src/reducers/reducers.test.js index 42afbf6574..d239eed25b 100644 --- a/src/reducers/reducers.test.js +++ b/src/reducers/reducers.test.js @@ -36,7 +36,7 @@ import { import { UPDATE_ACTIVE_PIPELINE } from '../actions/pipelines'; import { TOGGLE_MODULAR_PIPELINE_ACTIVE } from '../actions/modular-pipelines'; import { TOGGLE_GRAPH_LOADING } from '../actions/graph'; -import { TOGGLE_SHOW_DATASET_PREVIEWS } from '../actions/preferences'; +import { UPDATE_DATASET_PREVIEWS } from '../actions/preferences'; describe('Reducer', () => { it('should return an Object', () => { @@ -142,11 +142,11 @@ describe('Reducer', () => { }); }); - describe('TOGGLE_SHOW_DATASET_PREVIEWS', () => { - it('should toggle the value of showDatasetPreviews', () => { + describe('UPDATE_DATASET_PREVIEWS', () => { + it('should update the value of showDatasetPreviews', () => { const newState = reducer(mockState.spaceflights, { - type: TOGGLE_SHOW_DATASET_PREVIEWS, - showDatasetPreviews: true, + type: UPDATE_DATASET_PREVIEWS, + payload: { showDatasetPreviews: true }, }); expect(mockState.spaceflights.showDatasetPreviews).toBe(true); expect(newState.showDatasetPreviews).toBe(true); From 4f048c29e30f209ab6c8b95374f7fa4f0a18479d Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 24 Jul 2024 03:16:56 +0100 Subject: [PATCH 28/32] Update settings-modal.test.js Signed-off-by: Sajid Alam --- src/components/settings-modal/settings-modal.test.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/settings-modal/settings-modal.test.js b/src/components/settings-modal/settings-modal.test.js index e06b6817c4..e835f4ea28 100644 --- a/src/components/settings-modal/settings-modal.test.js +++ b/src/components/settings-modal/settings-modal.test.js @@ -77,8 +77,8 @@ describe('SettingsModal', () => { mapDispatchToProps(dispatch).onToggleShowDatasetPreviews(false); expect(dispatch.mock.calls[3][0]).toEqual({ - type: 'TOGGLE_SHOW_DATASET_PREVIEWS', - showDatasetPreviews: false, + type: 'UPDATE_DATASET_PREVIEWS', + payload: { showDatasetPreviews: false }, }); }); }); From a9a74197da8d00a8648346b1437a5fc208e1d8e5 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 24 Jul 2024 14:03:51 +0100 Subject: [PATCH 29/32] Update RELEASE.md Signed-off-by: Sajid Alam --- RELEASE.md | 1 + 1 file changed, 1 insertion(+) diff --git a/RELEASE.md b/RELEASE.md index e0baa7b6c2..9b55b14d15 100644 --- a/RELEASE.md +++ b/RELEASE.md @@ -17,6 +17,7 @@ Please follow the established format: - Refactor namespace pipelines. (#1897) - Expose the internal Redux state through `options` prop while using Kedro-Viz as a React component. (#1969) - Enhance documentation for the Kedro-Viz standalone React component. (#1954) +- Add Datasets preview toggle in the settings panel. (#1977) ## Bug fixes and other changes From 07bb7b7ec371e5a098a2cbf48437109a45114334 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 24 Jul 2024 15:11:30 +0100 Subject: [PATCH 30/32] rename and add nesting Signed-off-by: Sajid Alam --- src/actions/preferences.js | 10 +++++----- src/components/settings-modal/settings-modal.js | 6 +++--- src/reducers/index.js | 4 ++-- src/reducers/preferences.js | 17 +++++++++++------ src/store/initial-state.js | 4 +++- src/store/store.js | 2 +- 6 files changed, 25 insertions(+), 18 deletions(-) diff --git a/src/actions/preferences.js b/src/actions/preferences.js index dc8fcc0b93..54c80efda0 100644 --- a/src/actions/preferences.js +++ b/src/actions/preferences.js @@ -1,18 +1,18 @@ import { fetchPreferences } from '../utils/preferences-api'; // Action Types -export const UPDATE_DATASET_PREVIEWS = 'UPDATE_DATASET_PREVIEWS'; +export const UPDATE_USER_PREFERENCES = 'UPDATE_USER_PREFERENCES'; // Action Creators -export const updateDatasetPreviews = (showDatasetPreviews) => ({ - type: UPDATE_DATASET_PREVIEWS, - payload: { showDatasetPreviews }, +export const updateUserPreferences = (preferences) => ({ + type: UPDATE_USER_PREFERENCES, + payload: { preferences }, }); export const getPreferences = () => async (dispatch) => { try { const preferences = await fetchPreferences(); - dispatch(updateDatasetPreviews(preferences.showDatasetPreviews)); + dispatch(updateUserPreferences(preferences)); } catch (error) { console.error('Error fetching preferences:', error); } diff --git a/src/components/settings-modal/settings-modal.js b/src/components/settings-modal/settings-modal.js index bb3ff3d0ba..3423b04d3c 100644 --- a/src/components/settings-modal/settings-modal.js +++ b/src/components/settings-modal/settings-modal.js @@ -8,7 +8,7 @@ import { } from '../../actions'; import { getPreferences, - updateDatasetPreviews, + updateUserPreferences, } from '../../actions/preferences'; import { getFlagsState } from '../../utils/flags'; import SettingsModalRow from './settings-modal-row'; @@ -253,7 +253,7 @@ export const mapStateToProps = (state) => ({ flags: state.flags, showFeatureHints: state.showFeatureHints, isPrettyName: state.isPrettyName, - showDatasetPreviews: state.showDatasetPreviews, + showDatasetPreviews: state.userPreferences.showDatasetPreviews, visible: state.visible, }); @@ -274,7 +274,7 @@ export const mapDispatchToProps = (dispatch) => ({ dispatch(toggleShowFeatureHints(value)); }, onToggleShowDatasetPreviews: (value) => { - dispatch(updateDatasetPreviews(value)); + dispatch(updateUserPreferences({ showDatasetPreviews: value })); }, }); diff --git a/src/reducers/index.js b/src/reducers/index.js index d4183979b4..60c0e79cef 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -24,7 +24,7 @@ import { TOGGLE_EXPAND_ALL_PIPELINES, UPDATE_STATE_FROM_OPTIONS, } from '../actions'; -import showDatasetPreviews from './preferences'; +import userPreferences from './preferences'; import { TOGGLE_PARAMETERS_HOVERED } from '../actions'; /** @@ -82,7 +82,7 @@ const combinedReducer = combineReducers({ modularPipeline, visible, runsMetadata, - showDatasetPreviews, + userPreferences, // These props don't have any actions associated with them display: createReducer(null), dataSource: createReducer(null), diff --git a/src/reducers/preferences.js b/src/reducers/preferences.js index fc99b34a23..d96908e1a3 100644 --- a/src/reducers/preferences.js +++ b/src/reducers/preferences.js @@ -1,14 +1,19 @@ -import { UPDATE_DATASET_PREVIEWS } from '../actions/preferences'; +import { UPDATE_USER_PREFERENCES } from '../actions/preferences'; -const initialState = true; +const initialState = { + showDatasetPreviews: true, +}; -const showDatasetPreviews = (state = initialState, action) => { +const userPreferences = (state = initialState, action) => { switch (action.type) { - case UPDATE_DATASET_PREVIEWS: - return action.payload.showDatasetPreviews; + case UPDATE_USER_PREFERENCES: + return { + ...state, + showDatasetPreviews: action.payload.preferences.showDatasetPreviews, + }; default: return state; } }; -export default showDatasetPreviews; +export default userPreferences; diff --git a/src/store/initial-state.js b/src/store/initial-state.js index 3bda88b3e0..86257d4fc7 100644 --- a/src/store/initial-state.js +++ b/src/store/initial-state.js @@ -24,7 +24,9 @@ export const createInitialState = () => ({ expandAllPipelines: false, isPrettyName: settings.isPrettyName.default, showFeatureHints: settings.showFeatureHints.default, - showDatasetPreviews: settings.showDatasetPreviews.default, + userPreferences: { + showDatasetPreviews: settings.showDatasetPreviews.default, + }, ignoreLargeWarning: false, loading: { graph: false, diff --git a/src/store/store.js b/src/store/store.js index 55dc352df3..6b20e60c3e 100644 --- a/src/store/store.js +++ b/src/store/store.js @@ -57,7 +57,7 @@ const saveStateToLocalStorage = (state) => { theme: state.theme, isPrettyName: state.isPrettyName, showFeatureHints: state.showFeatureHints, - showDatasetPreviews: state.showDatasetPreviews, + userPreferences: state.userPreferences, flags: state.flags, expandAllPipelines: state.expandAllPipelines, }); From 2c80e6a711734b6b3f16044fa71815bf47063d40 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Wed, 24 Jul 2024 15:19:39 +0100 Subject: [PATCH 31/32] update tests Signed-off-by: Sajid Alam --- .../settings-modal/settings-modal.test.js | 4 ++-- src/reducers/reducers.test.js | 14 ++++++++------ 2 files changed, 10 insertions(+), 8 deletions(-) diff --git a/src/components/settings-modal/settings-modal.test.js b/src/components/settings-modal/settings-modal.test.js index e835f4ea28..4c4dd74756 100644 --- a/src/components/settings-modal/settings-modal.test.js +++ b/src/components/settings-modal/settings-modal.test.js @@ -77,8 +77,8 @@ describe('SettingsModal', () => { mapDispatchToProps(dispatch).onToggleShowDatasetPreviews(false); expect(dispatch.mock.calls[3][0]).toEqual({ - type: 'UPDATE_DATASET_PREVIEWS', - payload: { showDatasetPreviews: false }, + type: 'UPDATE_USER_PREFERENCES', + payload: { preferences: { showDatasetPreviews: false } }, }); }); }); diff --git a/src/reducers/reducers.test.js b/src/reducers/reducers.test.js index d239eed25b..5427f5150d 100644 --- a/src/reducers/reducers.test.js +++ b/src/reducers/reducers.test.js @@ -36,7 +36,7 @@ import { import { UPDATE_ACTIVE_PIPELINE } from '../actions/pipelines'; import { TOGGLE_MODULAR_PIPELINE_ACTIVE } from '../actions/modular-pipelines'; import { TOGGLE_GRAPH_LOADING } from '../actions/graph'; -import { UPDATE_DATASET_PREVIEWS } from '../actions/preferences'; +import { UPDATE_USER_PREFERENCES } from '../actions/preferences'; describe('Reducer', () => { it('should return an Object', () => { @@ -142,14 +142,16 @@ describe('Reducer', () => { }); }); - describe('UPDATE_DATASET_PREVIEWS', () => { + describe('UPDATE_USER_PREFERENCES', () => { it('should update the value of showDatasetPreviews', () => { const newState = reducer(mockState.spaceflights, { - type: UPDATE_DATASET_PREVIEWS, - payload: { showDatasetPreviews: true }, + type: UPDATE_USER_PREFERENCES, + payload: { preferences: { showDatasetPreviews: true } }, }); - expect(mockState.spaceflights.showDatasetPreviews).toBe(true); - expect(newState.showDatasetPreviews).toBe(true); + expect(mockState.spaceflights.userPreferences.showDatasetPreviews).toBe( + true + ); + expect(newState.userPreferences.showDatasetPreviews).toBe(true); }); }); From b26b75491915d710f256adf8649b89b17ebeee26 Mon Sep 17 00:00:00 2001 From: Sajid Alam Date: Thu, 25 Jul 2024 08:35:32 +0100 Subject: [PATCH 32/32] changes based on reviews Signed-off-by: Sajid Alam --- src/actions/preferences.js | 2 +- src/components/settings-modal/settings-modal.test.js | 2 +- src/reducers/preferences.js | 2 +- src/reducers/reducers.test.js | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/actions/preferences.js b/src/actions/preferences.js index 54c80efda0..2dade70770 100644 --- a/src/actions/preferences.js +++ b/src/actions/preferences.js @@ -6,7 +6,7 @@ export const UPDATE_USER_PREFERENCES = 'UPDATE_USER_PREFERENCES'; // Action Creators export const updateUserPreferences = (preferences) => ({ type: UPDATE_USER_PREFERENCES, - payload: { preferences }, + payload: preferences, }); export const getPreferences = () => async (dispatch) => { diff --git a/src/components/settings-modal/settings-modal.test.js b/src/components/settings-modal/settings-modal.test.js index 4c4dd74756..48a1278806 100644 --- a/src/components/settings-modal/settings-modal.test.js +++ b/src/components/settings-modal/settings-modal.test.js @@ -78,7 +78,7 @@ describe('SettingsModal', () => { mapDispatchToProps(dispatch).onToggleShowDatasetPreviews(false); expect(dispatch.mock.calls[3][0]).toEqual({ type: 'UPDATE_USER_PREFERENCES', - payload: { preferences: { showDatasetPreviews: false } }, + payload: { showDatasetPreviews: false }, }); }); }); diff --git a/src/reducers/preferences.js b/src/reducers/preferences.js index d96908e1a3..d8991435f1 100644 --- a/src/reducers/preferences.js +++ b/src/reducers/preferences.js @@ -9,7 +9,7 @@ const userPreferences = (state = initialState, action) => { case UPDATE_USER_PREFERENCES: return { ...state, - showDatasetPreviews: action.payload.preferences.showDatasetPreviews, + showDatasetPreviews: action.payload.showDatasetPreviews, }; default: return state; diff --git a/src/reducers/reducers.test.js b/src/reducers/reducers.test.js index 5427f5150d..30e7beb697 100644 --- a/src/reducers/reducers.test.js +++ b/src/reducers/reducers.test.js @@ -146,7 +146,7 @@ describe('Reducer', () => { it('should update the value of showDatasetPreviews', () => { const newState = reducer(mockState.spaceflights, { type: UPDATE_USER_PREFERENCES, - payload: { preferences: { showDatasetPreviews: true } }, + payload: { showDatasetPreviews: true }, }); expect(mockState.spaceflights.userPreferences.showDatasetPreviews).toBe( true