diff --git a/frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureImpactMetrics.tsx b/frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureImpactMetrics.tsx index d5c92a75b6..ef5ee5b45c 100644 --- a/frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureImpactMetrics.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureImpactMetrics.tsx @@ -31,15 +31,21 @@ type ModalState = | { type: 'editing'; config: ChartConfig }; export const FeatureImpactMetrics: FC = () => { - const feature = useRequiredPathParam('featureId'); - const project = useRequiredPathParam('projectId'); + const featureName = useRequiredPathParam('featureId'); + const projectId = useRequiredPathParam('projectId'); const [modalState, setModalState] = useState({ type: 'closed', }); - const { createImpactMetric, deleteImpactMetric } = useImpactMetricsApi(); - const { impactMetrics, refetch } = useFeatureImpactMetrics(feature); + const { createImpactMetric, deleteImpactMetric } = useImpactMetricsApi({ + projectId, + featureName, + }); + const { impactMetrics, refetch } = useFeatureImpactMetrics({ + projectId, + featureName, + }); const { setToastApiError } = useToast(); const { @@ -69,7 +75,7 @@ export const FeatureImpactMetrics: FC = () => { await createImpactMetric({ ...data, - feature, + feature: featureName, id: configId, }); refetch(); @@ -112,7 +118,7 @@ export const FeatureImpactMetrics: FC = () => { onEdit={() => handleEditChart(config)} onDelete={() => handleDeleteChart(config.id)} permission={UPDATE_FEATURE} - projectId={project} + projectId={projectId} /> ), w: 6, @@ -121,7 +127,7 @@ export const FeatureImpactMetrics: FC = () => { y: Math.floor(index / 2) * 2, static: true, })), - [impactMetrics.configs, project], + [impactMetrics.configs, projectId], ); return ( @@ -137,7 +143,7 @@ export const FeatureImpactMetrics: FC = () => { onClick={handleAddChart} disabled={metadataLoading || !!metadataError} permission={UPDATE_FEATURE} - projectId={project} + projectId={projectId} > Add Chart diff --git a/frontend/src/hooks/api/actions/useImpactMetricsSettingsApi/useImpactMetricsApi.ts b/frontend/src/hooks/api/actions/useImpactMetricsSettingsApi/useImpactMetricsApi.ts index 101343eb5b..da8eb623be 100644 --- a/frontend/src/hooks/api/actions/useImpactMetricsSettingsApi/useImpactMetricsApi.ts +++ b/frontend/src/hooks/api/actions/useImpactMetricsSettingsApi/useImpactMetricsApi.ts @@ -2,14 +2,17 @@ import { useCallback } from 'react'; import useAPI from '../useApi/useApi.js'; import type { CreateImpactMetricsConfigSchema } from 'openapi'; -export const useImpactMetricsApi = () => { +export const useImpactMetricsApi = ({ + projectId, + featureName, +}: { projectId: string; featureName: string }) => { const { makeRequest, createRequest, errors, loading } = useAPI({ propagateErrors: true, }); const createImpactMetric = useCallback( async (config: CreateImpactMetricsConfigSchema) => { - const path = `api/admin/impact-metrics/config`; + const path = `api/admin/projects/${projectId}/features/${featureName}/impact-metrics/config`; const req = createRequest( path, { @@ -26,7 +29,7 @@ export const useImpactMetricsApi = () => { const deleteImpactMetric = useCallback( async (metricId: string) => { - const path = `api/admin/impact-metrics/config/${metricId}`; + const path = `api/admin/projects/${projectId}/features/${featureName}/impact-metrics/config/${metricId}`; const req = createRequest( path, { diff --git a/frontend/src/hooks/api/getters/useFeatureImpactMetrics/useFeatureImpactMetrics.ts b/frontend/src/hooks/api/getters/useFeatureImpactMetrics/useFeatureImpactMetrics.ts index 862554e116..8e9845f47e 100644 --- a/frontend/src/hooks/api/getters/useFeatureImpactMetrics/useFeatureImpactMetrics.ts +++ b/frontend/src/hooks/api/getters/useFeatureImpactMetrics/useFeatureImpactMetrics.ts @@ -2,8 +2,11 @@ import { fetcher, useApiGetter } from '../useApiGetter/useApiGetter.js'; import { formatApiPath } from 'utils/formatPath'; import type { ImpactMetricsConfigListSchema } from 'openapi'; -export const useFeatureImpactMetrics = (feature: string) => { - const PATH = `api/admin/impact-metrics/config/${feature}`; +export const useFeatureImpactMetrics = ({ + projectId, + featureName, +}: { projectId: string; featureName: string }) => { + const PATH = `api/admin/projects/${projectId}/features/${featureName}/impact-metrics/config`; const { data, refetch, loading, error } = useApiGetter(formatApiPath(PATH), () => fetcher(formatApiPath(PATH), 'Feature Impact Metrics'),