From 60c9150010e72b53e689853cc7abca70bcfeb948 Mon Sep 17 00:00:00 2001 From: Vikram Raj Date: Mon, 27 Jan 2025 20:36:14 +0530 Subject: [PATCH 1/2] Store Topology sidebar alert in the localStorage --- .../components/side-bar/components/SideBarAlerts.tsx | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/frontend/packages/topology/src/components/side-bar/components/SideBarAlerts.tsx b/frontend/packages/topology/src/components/side-bar/components/SideBarAlerts.tsx index 401114354cb7..256ef4d31f4a 100644 --- a/frontend/packages/topology/src/components/side-bar/components/SideBarAlerts.tsx +++ b/frontend/packages/topology/src/components/side-bar/components/SideBarAlerts.tsx @@ -8,6 +8,7 @@ import { useResolvedExtensions, } from '@console/dynamic-plugin-sdk'; import { USERSETTINGS_PREFIX, useUserSettings } from '@console/shared'; +import { useUserSettingsLocalStorage } from '@console/shared/src/hooks/useUserSettingsLocalStorage'; const SIDEBAR_ALERTS = 'sideBarAlerts'; @@ -16,14 +17,19 @@ const ResolveResourceAlerts: React.FC<{ useResourceAlertsContent?: (element: GraphElement) => DetailsResourceAlertContent; element: GraphElement; }> = observer(function ResolveResourceAlerts({ id, useResourceAlertsContent, element }) { - const [showAlert, setShowAlert, loaded] = useUserSettings( + const [showAlertFromConfigMap, , loaded] = useUserSettings( `${USERSETTINGS_PREFIX}.${SIDEBAR_ALERTS}.${id}.${element.getId()}`, true, ); + const [showAlert, setShowAlert] = useUserSettingsLocalStorage( + `${USERSETTINGS_PREFIX}/${SIDEBAR_ALERTS}/${id}`, + `${element.getId()}`, + true, + ); const alertConfigs = useResourceAlertsContent(element); if (!alertConfigs) return null; const { variant, content, actionLinks, dismissible, title } = alertConfigs; - return loaded && showAlert ? ( + return showAlert || (showAlertFromConfigMap && loaded) ? ( Date: Tue, 11 Feb 2025 17:50:37 +0530 Subject: [PATCH 2/2] set default as set in userSetting configMap --- .../src/hooks/useGetUserSettingConfigMap.ts | 47 +++++++++++++++++++ .../side-bar/components/SideBarAlerts.tsx | 25 +++++++--- 2 files changed, 65 insertions(+), 7 deletions(-) create mode 100644 frontend/packages/console-shared/src/hooks/useGetUserSettingConfigMap.ts diff --git a/frontend/packages/console-shared/src/hooks/useGetUserSettingConfigMap.ts b/frontend/packages/console-shared/src/hooks/useGetUserSettingConfigMap.ts new file mode 100644 index 000000000000..9083844a0393 --- /dev/null +++ b/frontend/packages/console-shared/src/hooks/useGetUserSettingConfigMap.ts @@ -0,0 +1,47 @@ +import { createHash } from 'crypto'; +import * as React from 'react'; +// eslint-disable-next-line @typescript-eslint/ban-ts-comment +// @ts-ignore: FIXME out-of-sync @types/react-redux version as new types cause many build errors +import { useSelector } from 'react-redux'; +import { getImpersonate, getUser, K8sResourceKind } from '@console/dynamic-plugin-sdk/src'; +import { useK8sWatchResource } from '@console/internal/components/utils/k8s-watch-hook'; +import { ConfigMapModel } from '@console/internal/models'; +import { RootState } from '@console/internal/redux'; +import { USER_SETTING_CONFIGMAP_NAMESPACE } from '../utils/user-settings'; + +export const useGetUserSettingConfigMap = () => { + const hashNameOrKubeadmin = (name: string): string | null => { + if (!name) { + return null; + } + + if (name === 'kube:admin') { + return 'kubeadmin'; + } + const hash = createHash('sha256'); + hash.update(name); + return hash.digest('hex'); + }; + // User and impersonate + const userUid = useSelector((state: RootState) => { + const impersonateName = getImpersonate(state)?.name; + const { uid, username } = getUser(state) ?? {}; + const hashName = hashNameOrKubeadmin(username); + return impersonateName || uid || hashName || ''; + }); + + const configMapResource = React.useMemo( + () => + !userUid + ? null + : { + kind: ConfigMapModel.kind, + namespace: USER_SETTING_CONFIGMAP_NAMESPACE, + isList: false, + name: `user-settings-${userUid}`, + }, + [userUid], + ); + const [cfData, cfLoaded, cfLoadError] = useK8sWatchResource(configMapResource); + return [cfData, cfLoaded, cfLoadError]; +}; diff --git a/frontend/packages/topology/src/components/side-bar/components/SideBarAlerts.tsx b/frontend/packages/topology/src/components/side-bar/components/SideBarAlerts.tsx index 256ef4d31f4a..581b1c045690 100644 --- a/frontend/packages/topology/src/components/side-bar/components/SideBarAlerts.tsx +++ b/frontend/packages/topology/src/components/side-bar/components/SideBarAlerts.tsx @@ -7,8 +7,10 @@ import { isDetailsResourceAlert, useResolvedExtensions, } from '@console/dynamic-plugin-sdk'; -import { USERSETTINGS_PREFIX, useUserSettings } from '@console/shared'; +import { USERSETTINGS_PREFIX } from '@console/shared'; +import { useGetUserSettingConfigMap } from '@console/shared/src/hooks/useGetUserSettingConfigMap'; import { useUserSettingsLocalStorage } from '@console/shared/src/hooks/useUserSettingsLocalStorage'; +import { deseralizeData } from '@console/shared/src/utils/user-settings'; const SIDEBAR_ALERTS = 'sideBarAlerts'; @@ -17,19 +19,28 @@ const ResolveResourceAlerts: React.FC<{ useResourceAlertsContent?: (element: GraphElement) => DetailsResourceAlertContent; element: GraphElement; }> = observer(function ResolveResourceAlerts({ id, useResourceAlertsContent, element }) { - const [showAlertFromConfigMap, , loaded] = useUserSettings( - `${USERSETTINGS_PREFIX}.${SIDEBAR_ALERTS}.${id}.${element.getId()}`, - true, - ); + const [cfData, cfLoaded, cfLoadError] = useGetUserSettingConfigMap(); const [showAlert, setShowAlert] = useUserSettingsLocalStorage( `${USERSETTINGS_PREFIX}/${SIDEBAR_ALERTS}/${id}`, `${element.getId()}`, - true, + deseralizeData( + cfData?.data?.[`${USERSETTINGS_PREFIX}.${SIDEBAR_ALERTS}.${id}.${element.getId()}`], + ) || true, ); + + React.useEffect(() => { + if (cfData && cfLoaded && !cfLoadError) { + const alertSetting = deseralizeData( + cfData?.data?.[`${USERSETTINGS_PREFIX}.${SIDEBAR_ALERTS}.${id}.${element.getId()}`], + ); + setShowAlert(alertSetting); + } + }, [setShowAlert, cfData, cfLoaded, cfLoadError, id, element]); + const alertConfigs = useResourceAlertsContent(element); if (!alertConfigs) return null; const { variant, content, actionLinks, dismissible, title } = alertConfigs; - return showAlert || (showAlertFromConfigMap && loaded) ? ( + return showAlert ? (