Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-23 00:22:19 +01:00
Code Issues Projects Releases Wiki Activity

Fix/cache (#461)

Browse Source 
* fix: set strategy cache when mounting

* fix: add permission button

* fix: add permission button for discard

* fix: button type

* fix: unused imports

* fix: move setDirty

* fix: add clone deep
This commit is contained in:
Fredrik Strand Oseberg 2021-10-22 13:38:36 +02:00 committed by GitHub
parent 5dca747898
commit 13884db360
1 changed files with 25 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
frontend/src/component/feature/FeatureView2/FeatureStrategies/FeatureStrategiesEnvironments/FeatureStrategyEditable/FeatureStrategyEditable.tsx
View File

@ -11,7 +11,7 @@ import {
} from '../../../../../../interfaces/strategy'; } from '../../../../../../interfaces/strategy';
import FeatureStrategyAccordion from '../../FeatureStrategyAccordion/FeatureStrategyAccordion'; import FeatureStrategyAccordion from '../../FeatureStrategyAccordion/FeatureStrategyAccordion';
import cloneDeep from 'lodash.clonedeep'; import cloneDeep from 'lodash.clonedeep';
import { Button, IconButton, Tooltip } from '@material-ui/core'; import { Tooltip } from '@material-ui/core';
import ConditionallyRender from '../../../../../common/ConditionallyRender'; import ConditionallyRender from '../../../../../common/ConditionallyRender';
import { useStyles } from './FeatureStrategyEditable.styles'; import { useStyles } from './FeatureStrategyEditable.styles';
import { Delete } from '@material-ui/icons'; import { Delete } from '@material-ui/icons';
@ -24,6 +24,8 @@ import {
import AccessContext from '../../../../../../contexts/AccessContext'; import AccessContext from '../../../../../../contexts/AccessContext';
import { UPDATE_FEATURE } from '../../../../../providers/AccessProvider/permissions'; import { UPDATE_FEATURE } from '../../../../../providers/AccessProvider/permissions';
import useFeatureApi from '../../../../../../hooks/api/actions/useFeatureApi/useFeatureApi'; import useFeatureApi from '../../../../../../hooks/api/actions/useFeatureApi/useFeatureApi';
import PermissionIconButton from '../../../../../common/PermissionIconButton/PermissionIconButton';
import PermissionButton from '../../../../../common/PermissionButton/PermissionButton';
interface IFeatureStrategyEditable { interface IFeatureStrategyEditable {
currentStrategy: IFeatureStrategy; currentStrategy: IFeatureStrategy;
@ -45,8 +47,8 @@ const FeatureStrategyEditable = ({
const { activeEnvironment, featureCache, dirty, setDirty } = useContext( const { activeEnvironment, featureCache, dirty, setDirty } = useContext(
FeatureStrategiesUIContext FeatureStrategiesUIContext
); );
const [strategyCache, setStrategyCache] = useState<IFeatureStrategy | null>( const [strategyCache, setStrategyCache] = useState<IFeatureStrategy>(
null cloneDeep(currentStrategy)
); );
const styles = useStyles(); const styles = useStyles();
@ -88,7 +90,6 @@ const FeatureStrategyEditable = ({
useEffect(() => { useEffect(() => {
const dirtyStrategy = dirty[strategy.id]; const dirtyStrategy = dirty[strategy.id];
if (dirtyStrategy) return; if (dirtyStrategy) return;
mutate(FEATURE_STRATEGY_CACHE_KEY, { ...currentStrategy }, false); mutate(FEATURE_STRATEGY_CACHE_KEY, { ...currentStrategy }, false);
setStrategyCache(cloneDeep(currentStrategy)); setStrategyCache(cloneDeep(currentStrategy));
/* eslint-disable-next-line */ /* eslint-disable-next-line */
@ -112,15 +113,16 @@ const FeatureStrategyEditable = ({
}; };
const discardChanges = () => { const discardChanges = () => {
mutate(FEATURE_STRATEGY_CACHE_KEY, { ...strategyCache }, false);
setDirty(prev => ({ ...prev, [strategy.id]: false })); setDirty(prev => ({ ...prev, [strategy.id]: false }));
mutate(FEATURE_STRATEGY_CACHE_KEY, { ...strategyCache }, false);
}; };
const setStrategyConstraints = (constraints: IConstraint[]) => { const setStrategyConstraints = (constraints: IConstraint[]) => {
const updatedStrategy = { ...strategy }; const updatedStrategy = cloneDeep(strategy);
updatedStrategy.constraints = constraints;
mutate(FEATURE_STRATEGY_CACHE_KEY, { ...updatedStrategy }, false); updatedStrategy.constraints = [...cloneDeep(constraints)];
setDirty(prev => ({ ...prev, [strategy.id]: true })); setDirty(prev => ({ ...prev, [strategy.id]: true }));
mutate(FEATURE_STRATEGY_CACHE_KEY, { ...updatedStrategy }, false);
}; };
if (!strategy.id) return null; if (!strategy.id) return null;
@ -134,7 +136,7 @@ const FeatureStrategyEditable = ({
/> />
<FeatureStrategyAccordion <FeatureStrategyAccordion
parameters={parameters} parameters={parameters}
constraints={constraints} constraints={cloneDeep(constraints)}
data-test={`${STRATEGY_ACCORDION_ID}-${strategy.name}`} data-test={`${STRATEGY_ACCORDION_ID}-${strategy.name}`}
strategy={strategy} strategy={strategy}
setStrategyParams={setStrategyParams} setStrategyParams={setStrategyParams}
@ -145,7 +147,9 @@ const FeatureStrategyEditable = ({
condition={hasAccess(UPDATE_FEATURE)} condition={hasAccess(UPDATE_FEATURE)}
show={ show={
<Tooltip title="Delete strategy"> <Tooltip title="Delete strategy">
<IconButton <PermissionIconButton
permission={UPDATE_FEATURE}
projectId={projectId}
data-test={`${DELETE_STRATEGY_ID}-${strategy.name}`} data-test={`${DELETE_STRATEGY_ID}-${strategy.name}`}
onClick={e => { onClick={e => {
e.stopPropagation(); e.stopPropagation();
@ -156,7 +160,7 @@ const FeatureStrategyEditable = ({
}} }}
> >
<Delete /> <Delete />
</IconButton> </PermissionIconButton>
</Tooltip> </Tooltip>
} }
/> />
@ -167,7 +171,9 @@ const FeatureStrategyEditable = ({
show={ show={
<> <>
<div className={styles.buttonContainer}> <div className={styles.buttonContainer}>
<Button <PermissionButton
permission={UPDATE_FEATURE}
projectId={projectId}
variant="contained" variant="contained"
color="primary" color="primary"
className={styles.editButton} className={styles.editButton}
@ -176,14 +182,18 @@ const FeatureStrategyEditable = ({
disabled={loading} disabled={loading}
> >
Save changes Save changes
</Button> </PermissionButton>
<Button <PermissionButton
onClick={discardChanges} onClick={discardChanges}
className={styles.editButton} className={styles.editButton}
disabled={loading} disabled={loading}
color="tertiary"
variant="text"
permission={UPDATE_FEATURE}
projectId={projectId}
> >
Discard changes Discard changes
</Button> </PermissionButton>
</div> </div>
</> </>
} }