diff --git a/frontend/src/component/feature/StrategyTypes/FlexibleStrategy/StickinessSelect/StickinessSelect.tsx b/frontend/src/component/feature/StrategyTypes/FlexibleStrategy/StickinessSelect/StickinessSelect.tsx index 532c4d7d11..d275ea23c1 100644 --- a/frontend/src/component/feature/StrategyTypes/FlexibleStrategy/StickinessSelect/StickinessSelect.tsx +++ b/frontend/src/component/feature/StrategyTypes/FlexibleStrategy/StickinessSelect/StickinessSelect.tsx @@ -51,7 +51,11 @@ export const StickinessSelect = ({ disabled={!editable} data-testid={dataTestId} onChange={onChange} - style={{ width: 'inherit', minWidth: '100%' }} + style={{ + width: 'inherit', + minWidth: '100%', + marginBottom: '16px', + }} /> ); }; diff --git a/frontend/src/hooks/useDefaultProjectSettings.ts b/frontend/src/hooks/useDefaultProjectSettings.ts index bd19f0e609..069df9982f 100644 --- a/frontend/src/hooks/useDefaultProjectSettings.ts +++ b/frontend/src/hooks/useDefaultProjectSettings.ts @@ -1,15 +1,12 @@ import useUiConfig from './api/getters/useUiConfig/useUiConfig'; -import useSWR, { SWRConfiguration } from 'swr'; +import { SWRConfiguration } from 'swr'; import { useCallback } from 'react'; import handleErrorResponses from './api/getters/httpErrorResponseHandler'; +import { useConditionalSWR } from './api/getters/useConditionalSWR/useConditionalSWR'; export interface IStickinessResponse { - status: number; - - body?: { - defaultStickiness: string; - mode?: string; - }; + defaultStickiness?: string; + mode?: string; } const DEFAULT_STICKINESS = 'default'; export const useDefaultProjectSettings = ( @@ -21,16 +18,15 @@ export const useDefaultProjectSettings = ( const PATH = `/api/admin/projects/${projectId}/settings`; const { projectScopedStickiness } = uiConfig.flags; - const { data, error, mutate } = useSWR( + const { data, error, mutate } = useConditionalSWR( + Boolean(projectId) && Boolean(projectScopedStickiness), + {}, ['useDefaultProjectSettings', PATH], () => fetcher(PATH), options ); - const defaultStickiness = - Boolean(projectScopedStickiness) && data?.body != null && projectId - ? data.body.defaultStickiness - : DEFAULT_STICKINESS; + const defaultStickiness = data?.defaultStickiness ?? DEFAULT_STICKINESS; const refetch = useCallback(() => { mutate().catch(console.warn); @@ -39,24 +35,12 @@ export const useDefaultProjectSettings = ( defaultStickiness, refetch, loading: !error && !data, - status: data?.status, error, }; }; -export const fetcher = async (path: string): Promise => { - const res = await fetch(path); - - if (res.status === 404) { - return { status: 404 }; - } - - if (!res.ok) { - await handleErrorResponses('Project stickiness data')(res); - } - - return { - status: res.status, - body: await res.json(), - }; +const fetcher = (path: string) => { + return fetch(path) + .then(handleErrorResponses('Project stickiness data')) + .then(res => res.json()); };