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

feat: update hook to use change request settings (#2406)

Browse Source 
* Refactors the hook to use the change request settings from the API
This commit is contained in:
Fredrik Strand Oseberg 2022-11-14 12:34:38 +01:00 committed by GitHub
parent a425bcb3b8
commit 4689705f45
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 63 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/component/feature/FeatureStrategy/FeatureStrategyCreate/FeatureStrategyCreate.tsx
View File

@ -51,7 +51,7 @@ export const FeatureStrategyCreate = () => {
const { feature, refetchFeature } = useFeature(projectId, featureId);
const ref = useRef<IFeatureToggle>(feature);
const isChangeRequestEnabled = useChangeRequestsEnabled(environmentId);
const { isChangeRequestConfigured } = useChangeRequestsEnabled(projectId);
const { refetch: refetchChangeRequests } = useChangeRequestOpen(projectId);
const { data, staleDataNotification, forceRefreshCache } =
@ -124,7 +124,7 @@ export const FeatureStrategyCreate = () => {
const payload = createStrategyPayload(strategy);
try {
if (isChangeRequestEnabled) {
if (isChangeRequestConfigured(environmentId)) {
await onStrategyRequestAdd(payload);
} else {
await onAddStrategy(payload);
@ -166,7 +166,7 @@ export const FeatureStrategyCreate = () => {
loading={loading}
permission={CREATE_FEATURE_STRATEGY}
errors={errors}
isChangeRequest={isChangeRequestEnabled}
isChangeRequest={isChangeRequestConfigured(environmentId)}
/>
{staleDataNotification}
</FormTemplate>

6
frontend/src/component/feature/FeatureStrategy/FeatureStrategyEdit/FeatureStrategyEdit.tsx
View File

@ -46,7 +46,7 @@ export const FeatureStrategyEdit = () => {
const { unleashUrl } = uiConfig;
const navigate = useNavigate();
const { addChangeRequest } = useChangeRequestApi();
const isChangeRequestEnabled = useChangeRequestsEnabled(environmentId);
const { isChangeRequestConfigured } = useChangeRequestsEnabled(projectId);
const { refetch: refetchChangeRequests } = useChangeRequestOpen(projectId);
const { feature, refetchFeature } = useFeature(projectId, featureId);
@ -136,7 +136,7 @@ export const FeatureStrategyEdit = () => {
const payload = createStrategyPayload(strategy);
try {
if (isChangeRequestEnabled) {
if (isChangeRequestConfigured(environmentId)) {
await onStrategyRequestEdit(payload);
} else {
await onStrategyEdit(payload);
@ -183,7 +183,7 @@ export const FeatureStrategyEdit = () => {
loading={loading}
permission={UPDATE_FEATURE_STRATEGY}
errors={errors}
isChangeRequest={isChangeRequestEnabled}
isChangeRequest={isChangeRequestConfigured(environmentId)}
/>
{staleDataNotification}
</FormTemplate>

5
frontend/src/component/feature/FeatureStrategy/FeatureStrategyEmpty/AddFromTemplateCard/AddFromTemplateCard.tsx
View File

@ -10,6 +10,7 @@ import { formatUnknownError } from 'utils/formatUnknownError';
import PermissionButton from 'component/common/PermissionButton/PermissionButton';
import { CREATE_FEATURE_STRATEGY } from 'component/providers/AccessProvider/permissions';
import { IFeatureStrategyPayload } from 'interfaces/strategy';
import { useRequiredPathParam } from 'hooks/useRequiredPathParam';
interface IAddFromTemplateCardProps {
title: string;
@ -40,7 +41,7 @@ export const AddFromTemplateCard: FC<IAddFromTemplateCardProps> = ({
const { addStrategyToFeature } = useFeatureStrategyApi();
const { setToastApiError } = useToast();
const isChangeRequestEnabled = useChangeRequestsEnabled(environmentId);
const { isChangeRequestConfigured } = useChangeRequestsEnabled(projectId);
const {
changeRequestDialogDetails,
@ -51,7 +52,7 @@ export const AddFromTemplateCard: FC<IAddFromTemplateCardProps> = ({
const onStrategyAdd = async () => {
try {
if (isChangeRequestEnabled) {
if (isChangeRequestConfigured(environmentId)) {
onChangeRequestAddStrategy(environmentId, strategy);
} else {
await addStrategyToFeature(

4
frontend/src/component/feature/FeatureStrategy/FeatureStrategyEmpty/FeatureStrategyEmpty.tsx
View File

@ -43,7 +43,7 @@ export const FeatureStrategyEmpty = ({
environment.strategies &&
environment.strategies.length > 0
);
const isChangeRequestEnabled = useChangeRequestsEnabled(environmentId);
const { isChangeRequestConfigured } = useChangeRequestsEnabled(projectId);
const {
changeRequestDialogDetails,
@ -71,7 +71,7 @@ export const FeatureStrategyEmpty = ({
environment => environment.name === fromEnvironmentName
)?.strategies || [];
if (isChangeRequestEnabled) {
if (isChangeRequestConfigured(environmentId)) {
await onChangeRequestAddStrategies(
environmentId,
strategies,

4
frontend/src/component/feature/FeatureStrategy/FeatureStrategyRemove/FeatureStrategyRemove.tsx
View File

@ -165,7 +165,7 @@ export const FeatureStrategyRemove = ({
}: IFeatureStrategyRemoveProps) => {
const [openDialogue, setOpenDialogue] = useState(false);
const changeRequestsEnabled = useChangeRequestsEnabled(environmentId);
const { isChangeRequestConfigured } = useChangeRequestsEnabled(projectId);
const onRemove = useOnRemove({
featureId,
@ -215,7 +215,7 @@ export const FeatureStrategyRemove = ({
}
/>
<ConditionallyRender
condition={changeRequestsEnabled}
condition={isChangeRequestConfigured(environmentId)}
show={
<SuggestFeatureStrategyRemoveDialogue
isOpen={openDialogue}

4
frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvSwitches/FeatureOverviewEnvSwitch/FeatureOverviewEnvSwitch.tsx
View File

@ -35,7 +35,7 @@ const FeatureOverviewEnvSwitch = ({
const { refetchFeature } = useFeature(projectId, featureId);
const { setToastData, setToastApiError } = useToast();
const { classes: styles } = useStyles();
const changeRequestsEnabled = useChangeRequestsEnabled(env.name);
const { isChangeRequestConfigured } = useChangeRequestsEnabled(projectId);
const {
onChangeRequestToggle,
onChangeRequestToggleClose,
@ -85,7 +85,7 @@ const FeatureOverviewEnvSwitch = ({
};
const toggleEnvironment = async (e: React.ChangeEvent) => {
if (changeRequestsEnabled) {
if (isChangeRequestConfigured(env.name)) {
e.preventDefault();
onChangeRequestToggle(featureId, env.name, !env.enabled);
return;

8
frontend/src/component/feature/FeatureView/FeatureView.tsx
View File

@ -32,14 +32,16 @@ import { useRequiredPathParam } from 'hooks/useRequiredPathParam';
import { FeatureArchiveDialog } from '../../common/FeatureArchiveDialog/FeatureArchiveDialog';
import { DraftBanner } from 'component/changeRequest/DraftBanner/DraftBanner';
import { MainLayout } from 'component/layout/MainLayout/MainLayout';
import { useChangeRequestsEnabled } from '../../../hooks/useChangeRequestsEnabled';
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
import { useChangeRequestsEnabled } from 'hooks/useChangeRequestsEnabled';
export const FeatureView = () => {
const projectId = useRequiredPathParam('projectId');
const featureId = useRequiredPathParam('featureId');
const { refetch: projectRefetch } = useProject(projectId);
const { refetchFeature } = useFeature(projectId, featureId);
const changeRequestsEnabled = useChangeRequestsEnabled();
const { isChangeRequestConfiguredInAnyEnv } =
useChangeRequestsEnabled(projectId);
const [openTagDialog, setOpenTagDialog] = useState(false);
const [showDelDialog, setShowDelDialog] = useState(false);
@ -88,7 +90,7 @@ export const FeatureView = () => {
<MainLayout
ref={ref}
subheader={
changeRequestsEnabled ? (
isChangeRequestConfiguredInAnyEnv() ? (
<DraftBanner project={projectId} />
) : null
}

22
frontend/src/component/project/Project/Project.tsx
View File

@ -28,8 +28,8 @@ import { ChangeRequestOverview } from 'component/changeRequest/ChangeRequestOver
import { DraftBanner } from 'component/changeRequest/DraftBanner/DraftBanner';
import { MainLayout } from 'component/layout/MainLayout/MainLayout';
import { ProjectChangeRequests } from '../../changeRequest/ProjectChangeRequests/ProjectChangeRequests';
import { useChangeRequestsEnabled } from 'hooks/useChangeRequestsEnabled';
import { ProjectSettings } from './ProjectSettings/ProjectSettings';
import { useChangeRequestsEnabled } from 'hooks/useChangeRequestsEnabled';
const StyledDiv = styled('div')(() => ({
display: 'flex',
@ -59,14 +59,14 @@ const Project = () => {
const { classes: styles } = useStyles();
const navigate = useNavigate();
const { pathname } = useLocation();
const { isOss, uiConfig } = useUiConfig();
const { isOss } = useUiConfig();
const basePath = `/projects/${projectId}`;
const projectName = project?.name || projectId;
const { isChangeRequestConfiguredInAnyEnv, isChangeRequestFlagEnabled } =
useChangeRequestsEnabled(projectId);
const [showDelDialog, setShowDelDialog] = useState(false);
const changeRequestsEnabled = useChangeRequestsEnabled();
const tabs = useMemo(() => {
const tabArray = [
{
@ -79,7 +79,7 @@ const Project = () => {
path: `${basePath}/health`,
name: 'health',
},
...(!uiConfig?.flags?.changeRequests
...(!isChangeRequestFlagEnabled
? [
{
title: 'Access',
@ -98,7 +98,7 @@ const Project = () => {
path: `${basePath}/archive`,
name: 'archive',
},
...(uiConfig?.flags?.changeRequests
...(isChangeRequestFlagEnabled
? [
{
title: 'Project settings',
@ -120,11 +120,11 @@ const Project = () => {
name: 'change-request' + '',
};
if (changeRequestsEnabled) {
if (isChangeRequestFlagEnabled) {
tabArray.splice(tabArray.length - 2, 0, changeRequestTab);
}
return tabArray;
}, [changeRequestsEnabled]);
}, [isChangeRequestFlagEnabled]);
const activeTab = [...tabs]
.reverse()
@ -149,7 +149,7 @@ const Project = () => {
<MainLayout
ref={ref}
subheader={
changeRequestsEnabled ? (
isChangeRequestConfiguredInAnyEnv() ? (
<DraftBanner project={projectId} />
) : null
}
@ -263,7 +263,7 @@ const Project = () => {
path="change-requests"
element={
<ConditionallyRender
condition={changeRequestsEnabled}
condition={isChangeRequestFlagEnabled}
show={<ProjectChangeRequests />}
/>
}
@ -272,7 +272,7 @@ const Project = () => {
path="change-requests/:id"
element={
<ConditionallyRender
condition={changeRequestsEnabled}
condition={isChangeRequestFlagEnabled}
show={<ChangeRequestOverview />}
/>
}

4
frontend/src/component/project/Project/ProjectFeatureToggles/ProjectFeatureToggles.tsx
View File

@ -96,7 +96,7 @@ export const ProjectFeatureToggles = ({
const navigate = useNavigate();
const [searchParams, setSearchParams] = useSearchParams();
const { uiConfig } = useUiConfig();
const changeRequestsEnabled = useChangeRequestsEnabled();
const { isChangeRequestConfigured } = useChangeRequestsEnabled(projectId);
const environments = useEnvironmentsRef(
loading ? ['a', 'b', 'c'] : newEnvironments
);
@ -119,7 +119,7 @@ export const ProjectFeatureToggles = ({
environment: string,
enabled: boolean
) => {
if (changeRequestsEnabled) {
if (isChangeRequestConfigured(environment)) {
onChangeRequestToggle(featureName, environment, enabled);
throw new Error('Additional approval required');
}

35
frontend/src/hooks/useChangeRequestsEnabled.ts
View File

@ -1,10 +1,35 @@
import React from 'react';
import useUiConfig from './api/getters/useUiConfig/useUiConfig';
import { useChangeRequestConfig } from './api/getters/useChangeRequestConfig/useChangeRequestConfig';
export const useChangeRequestsEnabled = (environment?: string) => {
// it can be swapped with proper settings instead of feature flag
export const useChangeRequestsEnabled = (projectId: string) => {
const { uiConfig } = useUiConfig();
return (
Boolean(uiConfig?.flags?.changeRequests) &&
(environment === 'production' || typeof environment === 'undefined')
const { data } = useChangeRequestConfig(projectId);
const isChangeRequestConfigured = React.useCallback(
(environment: string): boolean => {
const enabled = data.some(draft => {
return (
draft.environment === environment &&
draft.changeRequestEnabled
);
});
return Boolean(uiConfig?.flags.changeRequests) && enabled;
},
[data]
);
const isChangeRequestConfiguredInAnyEnv = React.useCallback((): boolean => {
return (
Boolean(uiConfig?.flags.changeRequests) &&
data.some(draft => draft.changeRequestEnabled)
);
}, [data]);
return {
isChangeRequestFlagEnabled: Boolean(uiConfig?.flags.changeRequests),
isChangeRequestConfigured,
isChangeRequestConfiguredInAnyEnv,
};
};