awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-08 09:27:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: resolved infinite rendering issue caused by zustand

Browse Source
This commit is contained in:
=
2025-01-06 14:55:13 +05:30
parent c56f598115
commit 524a97e9a6
1 changed files with 11 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend-v2/src/pages/secret-manager/SecretDashboardPage/SecretMainPage.store.tsx
+11 -10
View File
@@ -1,6 +1,7 @@
import { createContext, ReactNode, useContext, useEffect, useRef } from "react"; import { createContext, ReactNode, useContext, useEffect, useRef } from "react";
import { useRouter } from "@tanstack/react-router"; import { useRouter } from "@tanstack/react-router";
import { createStore, StateCreator, StoreApi, useStore } from "zustand"; import { createStore, StateCreator, StoreApi, useStore } from "zustand";
import { useShallow } from "zustand/react/shallow";
import { SecretV3RawSanitized } from "@app/hooks/api/secrets/types"; import { SecretV3RawSanitized } from "@app/hooks/api/secrets/types";
@@ -60,14 +61,13 @@ const createPopUpStore: StateCreator<PopUpState> = (set) => ({
type CombinedState = SelectedSecretState & PopUpState; type CombinedState = SelectedSecretState & PopUpState;
const StoreContext = createContext<StoreApi<CombinedState> | null>(null); const StoreContext = createContext<StoreApi<CombinedState> | null>(null);
export const StoreProvider = ({ children }: { children: ReactNode }) => { export const StoreProvider = ({ children }: { children: ReactNode }) => {
const storeRef = useRef<StoreApi<CombinedState>>(); const storeRef = useRef<StoreApi<CombinedState>>(
const router = useRouter(); createStore<CombinedState>((...a) => ({
if (!storeRef.current) {
storeRef.current = createStore<CombinedState>((...a) => ({
...createSelectedSecretStore(...a), ...createSelectedSecretStore(...a),
...createPopUpStore(...a) ...createPopUpStore(...a)
})); }))
} );
const router = useRouter();
useEffect(() => { useEffect(() => {
const onRouteChangeStart = () => { const onRouteChangeStart = () => {
@@ -91,10 +91,11 @@ const useStoreContext = <T extends object>(selector: (state: CombinedState) => T
}; };
// selected secret context // selected secret context
export const useSelectedSecrets = () => useStoreContext((state) => state.selectedSecret); export const useSelectedSecrets = () =>
export const useSelectedSecretActions = () => useStoreContext((state) => state.action); useStoreContext(useShallow((state) => state.selectedSecret));
export const useSelectedSecretActions = () => useStoreContext(useShallow((state) => state.action));
// popup context // popup context
export const usePopUpState = (id: PopUpNames) => export const usePopUpState = (id: PopUpNames) =>
useStoreContext((state) => state.popUp?.[id] || { isOpen: false }); useStoreContext(useShallow((state) => state.popUp?.[id] || { isOpen: false }));
export const usePopUpAction = () => useStoreContext((state) => state.popUpActions); export const usePopUpAction = () => useStoreContext(useShallow((state) => state.popUpActions));