diff --git a/frontend/src/component/admin/auth/OidcAuth/OidcAuth.tsx b/frontend/src/component/admin/auth/OidcAuth/OidcAuth.tsx index bd042f6843..9418d8b518 100644 --- a/frontend/src/component/admin/auth/OidcAuth/OidcAuth.tsx +++ b/frontend/src/component/admin/auth/OidcAuth/OidcAuth.tsx @@ -36,6 +36,7 @@ const initialState = { secret: '', acrValues: '', idTokenSigningAlgorithm: 'RS256', + enablePkce: false, }; type State = typeof initialState & { @@ -47,6 +48,7 @@ export const OidcAuth = () => { const { setToastData, setToastApiError } = useToast(); const { uiConfig } = useUiConfig(); const { oidcConfiguredThroughEnv } = uiConfig; + const oidcPkceSupport = Boolean(uiConfig.flags?.oidcPkceSupport); const [data, setData] = useState(initialState); const { config } = useAuthSettings('oidc'); const { updateSettings, errors, loading } = useAuthSettingsApi('oidc'); @@ -253,6 +255,44 @@ export const OidcAuth = () => { /> + + + Enable PKCE +

+ Require Proof Key for Code Exchange (PKCE) + to add an extra layer of security for the + authorization code flow. +

+ + + + setValue( + 'enablePkce', + event.target.checked, + ) + } + name='enablePkce' + checked={Boolean(data.enablePkce)} + disabled={ + !data.enabled || + oidcConfiguredThroughEnv + } + /> + } + label={ + data.enablePkce ? 'Enabled' : 'Disabled' + } + /> + + + } + /> ACR Values diff --git a/frontend/src/component/admin/network/NetworkConnectedEdges/NetworkConnectedEdgeInstance.tsx b/frontend/src/component/admin/network/NetworkConnectedEdges/NetworkConnectedEdgeInstance.tsx index 2481d3e452..cb650eada7 100644 --- a/frontend/src/component/admin/network/NetworkConnectedEdges/NetworkConnectedEdgeInstance.tsx +++ b/frontend/src/component/admin/network/NetworkConnectedEdges/NetworkConnectedEdgeInstance.tsx @@ -82,6 +82,19 @@ const StyledBadge = styled(Badge)(({ theme }) => ({ padding: theme.spacing(0, 1), })); +const getHosting = ({ + hosting, +}: ConnectedEdge): 'Cloud' | 'Self-hosted' | 'Unknown' => { + switch (hosting) { + case 'hosted': + return 'Cloud'; + case 'enterprise-self-hosted': + return 'Self-hosted'; + default: + return hosting ? `Unknown: ${hosting}` : 'Unknown'; + } +}; + const getConnectionStatus = ({ reportedAt, }: ConnectedEdge): InstanceConnectionStatus => { @@ -178,6 +191,10 @@ export const NetworkConnectedEdgeInstance = ({ Region {instance.region || 'Unknown'} + + Hosting + {getHosting(instance)} + Version {instance.edgeVersion} diff --git a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/MilestoneListRenderer.tsx b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/MilestoneListRenderer.tsx index 72235954c6..6ce7492ca1 100644 --- a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/MilestoneListRenderer.tsx +++ b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/MilestoneListRenderer.tsx @@ -110,8 +110,6 @@ const MilestoneListRendererCore = ({ readonly={readonly} milestone={milestone} automationSection={automationSection} - allMilestones={plan.milestones} - activeMilestoneId={plan.activeMilestoneId} /> {isNotLastMilestone && } diff --git a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/ReleasePlanChange.tsx b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/ReleasePlanChange.tsx index 9036e9cd0e..c46a98e86d 100644 --- a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/ReleasePlanChange.tsx +++ b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/ReleasePlanChange.tsx @@ -106,12 +106,7 @@ const StartMilestone: FC<{ - + ({ const StyledTextField = styled(TextField)(({ theme }) => ({ width: '60px', - '& .MuiOutlinedInput-root': { - borderRadius: theme.spacing(0.5), - '&:hover .MuiOutlinedInput-notchedOutline': { - borderColor: theme.palette.primary.main, - }, - }, - '& input': { - textAlign: 'center', - padding: theme.spacing(0.75, 1), - fontSize: theme.typography.body2.fontSize, - fontWeight: theme.typography.fontWeightMedium, - }, })); const StyledSelect = styled(Select)(({ theme }) => ({ width: '100px', - fontSize: theme.typography.body2.fontSize, - borderRadius: theme.spacing(0.5), - '& .MuiOutlinedInput-notchedOutline': { - borderRadius: theme.spacing(0.5), - }, - '&:hover .MuiOutlinedInput-notchedOutline': { - borderColor: theme.palette.primary.main, - }, - '& .MuiSelect-select': { - padding: theme.spacing(0.75, 1.25), - }, })); interface IMilestoneProgressionTimeInputProps { @@ -75,8 +52,7 @@ export const MilestoneProgressionTimeInput = ({ return ( ({ display: 'flex', borderBottom: `1px dashed ${theme.palette.neutral.border}`, - padding: theme.spacing(1.5, 2), + padding: theme.spacing(0.25, 0.25), })); const StyledAlert = styled(Alert)(({ theme }) => ({ - margin: theme.spacing(1, 2), + margin: theme.spacing(1, 0), })); const StyledMilestones = styled('div', { @@ -106,6 +106,14 @@ const StyledMilestones = styled('div', { }), })); +const StyledResumeMilestoneProgressions = styled(Link)(({ theme }) => ({ + display: 'flex', + alignItems: 'center', + gap: theme.spacing(0.5), + textDecoration: 'none', + color: 'inherit', +})); + interface IReleasePlanProps { plan: IReleasePlan; environmentIsDisabled?: boolean; @@ -136,8 +144,11 @@ export const ReleasePlan = ({ ); const { removeReleasePlanFromFeature, startReleasePlanMilestone } = useReleasePlansApi(); - const { deleteMilestoneProgression, loading: milestoneProgressionLoading } = - useMilestoneProgressionsApi(); + const { + deleteMilestoneProgression, + resumeMilestoneProgressions, + loading: milestoneProgressionLoading, + } = useMilestoneProgressionsApi(); const { createOrUpdateSafeguard, deleteSafeguard, @@ -371,12 +382,12 @@ export const ReleasePlan = ({ return; try { - await deleteMilestoneProgression( + await deleteMilestoneProgression({ projectId, environment, featureName, - milestoneToDeleteProgression.id, - ); + sourceMilestoneId: milestoneToDeleteProgression.id, + }); await refetch(); setMilestoneToDeleteProgression(null); setToastData({ @@ -389,6 +400,24 @@ export const ReleasePlan = ({ } }; + const onResumeMilestoneProgressions = async () => { + try { + await resumeMilestoneProgressions({ + projectId, + environment, + featureName, + planId: id, + }); + setToastData({ + type: 'success', + text: 'Automation resumed successfully', + }); + refetch(); + } catch (error: unknown) { + setToastApiError(formatUnknownError(error)); + } + }; + const activeIndex = milestones.findIndex( (milestone) => milestone.id === activeMilestoneId, ); @@ -475,13 +504,25 @@ export const ReleasePlan = ({ )} + {releasePlanAutomationsPaused ? ( + + + Resume automation + + } + > + Automation paused by safeguard. Existing users on + this release plan can still access the feature. + + ) : null} + - {releasePlanAutomationsPaused ? ( - - Automation paused by safeguard. Existing users on - this release plan can still access the feature. - - ) : null} {safeguardsEnabled ? ( {safeguards.length > 0 ? ( diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestone/ReleasePlanMilestone.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestone/ReleasePlanMilestone.tsx index 6c5581cdb0..c57c24ec55 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestone/ReleasePlanMilestone.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestone/ReleasePlanMilestone.tsx @@ -104,8 +104,7 @@ interface IReleasePlanMilestoneProps { onStartMilestone?: (milestone: IReleasePlanMilestone) => void; readonly?: boolean; automationSection?: React.ReactNode; - allMilestones: IReleasePlanMilestone[]; - activeMilestoneId?: string; + previousMilestoneStatus?: MilestoneStatus; } export const ReleasePlanMilestone = ({ @@ -114,11 +113,12 @@ export const ReleasePlanMilestone = ({ onStartMilestone, readonly, automationSection, - allMilestones, - activeMilestoneId, + previousMilestoneStatus, }: IReleasePlanMilestoneProps) => { const [expanded, setExpanded] = useState(false); const hasAutomation = Boolean(automationSection); + const isPreviousMilestonePaused = + previousMilestoneStatus?.type === 'paused'; if (!milestone.strategies.length) { return ( @@ -136,11 +136,12 @@ export const ReleasePlanMilestone = ({ (status.type === 'active' && milestone.startedAt) ? ( - {!readonly && ( - - )} + {!readonly && + !isPreviousMilestonePaused && ( + + )} {!readonly && onStartMilestone && ( - {!readonly && ( + {!readonly && !isPreviousMilestonePaused && ( )} {!readonly && onStartMilestone && ( diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestoneItem/MilestoneAutomation.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestoneItem/MilestoneAutomation.tsx index 456243c024..d99ac6eacc 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestoneItem/MilestoneAutomation.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestoneItem/MilestoneAutomation.tsx @@ -54,13 +54,12 @@ export const MilestoneAutomation = ({ pendingProgressionChange?.action === 'changeMilestoneProgression'; const hasPendingDelete = pendingProgressionChange?.action === 'deleteMilestoneProgression'; - const isPaused = Boolean(milestone.pausedAt); const badge = hasPendingDelete ? ( Deleted in draft ) : hasPendingChange ? ( Modified in draft - ) : isPaused ? ( + ) : status?.type === 'paused' ? ( }> Paused diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestoneItem/ReleasePlanMilestoneItem.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestoneItem/ReleasePlanMilestoneItem.tsx index 9dfefd0ffa..d1b1f8c38a 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestoneItem/ReleasePlanMilestoneItem.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/ReleasePlanMilestoneItem/ReleasePlanMilestoneItem.tsx @@ -122,13 +122,13 @@ export const ReleasePlanMilestoneItem = ({ } try { - await changeMilestoneProgression( + await changeMilestoneProgression({ projectId, environment, featureName, - milestone.id, - payload, - ); + sourceMilestoneId: milestone.id, + body: payload, + }); setToastData({ type: 'success', text: 'Automation configured successfully', @@ -151,6 +151,18 @@ export const ReleasePlanMilestoneItem = ({ milestones, ); + const previousMilestone = index > 0 ? milestones[index - 1] : null; + const previousMilestoneStatus = previousMilestone + ? calculateMilestoneStatus( + previousMilestone, + activeMilestoneId, + index - 1, + activeIndex, + environmentIsDisabled, + milestones, + ) + : undefined; + const { pendingProgressionChange, effectiveTransitionCondition } = getPendingProgressionData(milestone, getPendingProgressionChange); @@ -183,8 +195,7 @@ export const ReleasePlanMilestoneItem = ({ status={status} onStartMilestone={onStartMilestone} automationSection={automationSection} - allMilestones={milestones} - activeMilestoneId={activeMilestoneId} + previousMilestoneStatus={previousMilestoneStatus} /> { + if (milestone.pausedAt) { + return { type: 'paused' }; + } + if (milestone.id === activeMilestoneId) { return environmentIsDisabled ? { type: 'paused' } : { type: 'active' }; } diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/SafeguardForm/SafeguardForm.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/SafeguardForm/SafeguardForm.tsx index 744864fb9c..aa74caeb58 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/SafeguardForm/SafeguardForm.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/SafeguardForm/SafeguardForm.tsx @@ -14,6 +14,7 @@ import type { MetricQuerySchemaAggregationMode } from 'openapi/models/metricQuer import type { CreateSafeguardSchemaOperator } from 'openapi/models/createSafeguardSchemaOperator'; import { createStyledIcon, + type FormMode, StyledButtonGroup, StyledFormContainer, StyledLabel, @@ -32,11 +33,9 @@ interface ISafeguardFormProps { safeguard?: ISafeguard; } -type FormMode = 'create' | 'edit' | 'display'; - const getInitialValues = (safeguard?: ISafeguard) => ({ metricName: safeguard?.impactMetric.metricName || '', - appName: safeguard?.impactMetric.labelSelectors.appName[0] || '*', + appName: safeguard?.impactMetric.labelSelectors.appName?.[0] || '*', aggregationMode: (safeguard?.impactMetric.aggregationMode || 'rps') as MetricQuerySchemaAggregationMode, operator: (safeguard?.triggerCondition.operator || @@ -218,7 +217,7 @@ export const SafeguardForm = ({ }; return ( - + Pause automation when @@ -244,7 +243,6 @@ export const SafeguardForm = ({ filtered by handleApplicationChange(String(e.target.value)) @@ -287,12 +285,15 @@ export const SafeguardForm = ({ - handleThresholdChange(Number(e.target.value)) - } + onChange={(e) => { + const value = e.target.value; + handleThresholdChange(Number(value)); + }} placeholder='Value' variant='outlined' size='small' diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/hooks/useMilestoneProgressionForm.ts b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/hooks/useMilestoneProgressionForm.ts index 9fb16ee5d5..a275af091e 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/hooks/useMilestoneProgressionForm.ts +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/hooks/useMilestoneProgressionForm.ts @@ -1,5 +1,5 @@ -import { useState, useCallback } from 'react'; -import { isPast, addMinutes } from 'date-fns'; +import { useCallback, useState } from 'react'; +import { addMinutes, isPast } from 'date-fns'; import type { MilestoneStatus } from '../ReleasePlanMilestone/ReleasePlanMilestoneStatus.tsx'; import { formatDateYMDHM } from 'utils/formatDate.ts'; @@ -112,10 +112,7 @@ export const useMilestoneProgressionForm = ( event: React.ChangeEvent, ) => { const inputValue = event.target.value; - if (inputValue === '' || /^\d+$/.test(inputValue)) { - const value = inputValue === '' ? 0 : Number.parseInt(inputValue); - setTimeValue(value); - } + setTimeValue(Number(inputValue)); }; const clearErrors = useCallback(() => { diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/shared/SharedFormComponents.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/shared/SharedFormComponents.tsx index 2a7c8dfc4a..1dc117ce23 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/shared/SharedFormComponents.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/ReleasePlan/shared/SharedFormComponents.tsx @@ -1,16 +1,29 @@ import { styled, Select, MenuItem } from '@mui/material'; -export const StyledFormContainer = styled('form')(({ theme }) => ({ - display: 'flex', - flexDirection: 'column', - gap: theme.spacing(1.5), - padding: theme.spacing(1.5, 2), - backgroundColor: theme.palette.background.elevation1, - border: `1px solid ${theme.palette.divider}`, - width: '100%', - borderRadius: `${theme.shape.borderRadiusLarge}px`, - position: 'relative', -})); +export type FormMode = 'create' | 'edit' | 'display'; + +interface StyledFormContainerProps { + mode?: FormMode; +} + +export const StyledFormContainer = styled('form')( + ({ theme, mode }) => ({ + display: 'flex', + flexDirection: 'column', + gap: theme.spacing(1.5), + backgroundColor: theme.palette.background.elevation1, + padding: + mode === 'display' ? theme.spacing(1, 1.5) : theme.spacing(1.5, 2), + border: + mode === 'display' ? 'none' : `1px solid ${theme.palette.divider}`, + transition: theme.transitions.create(['padding'], { + duration: theme.transitions.duration.short, + }), + width: '100%', + borderRadius: `${theme.shape.borderRadiusMedium}px`, + position: 'relative', + }), +); export const StyledTopRow = styled('div')(({ theme }) => ({ display: 'flex', diff --git a/frontend/src/component/impact-metrics/ChartConfigModal/ImpactMetricsControls/ModeSelector/ModeSelector.tsx b/frontend/src/component/impact-metrics/ChartConfigModal/ImpactMetricsControls/ModeSelector/ModeSelector.tsx index c603332797..5ec8e97e9f 100644 --- a/frontend/src/component/impact-metrics/ChartConfigModal/ImpactMetricsControls/ModeSelector/ModeSelector.tsx +++ b/frontend/src/component/impact-metrics/ChartConfigModal/ImpactMetricsControls/ModeSelector/ModeSelector.tsx @@ -15,7 +15,7 @@ export const ModeSelector: FC = ({ }) => { if (metricType === 'unknown') return null; return ( - + Mode = ({ {getConfigDescription(config)} - - onEdit(config)} - permission={permission} - projectId={projectId} - > - - - onDelete(config.id)} - permission={permission} - projectId={projectId} - > - - - + {config.mode !== 'read' && ( + + onEdit(config)} + permission={permission} + projectId={projectId} + > + + + onDelete(config.id)} + permission={permission} + projectId={projectId} + > + + + + )} diff --git a/frontend/src/component/impact-metrics/types.ts b/frontend/src/component/impact-metrics/types.ts index 932b666467..ac0b3b6d84 100644 --- a/frontend/src/component/impact-metrics/types.ts +++ b/frontend/src/component/impact-metrics/types.ts @@ -20,6 +20,7 @@ export type AggregationMode = export type DisplayChartConfig = ChartConfig & { type: 'counter' | 'gauge' | 'histogram' | 'unknown'; displayName: string; // e.g. my_metric with unleash_counter stripped + mode?: 'read' | 'write'; }; export type LayoutItem = { diff --git a/frontend/src/hooks/api/actions/useMilestoneProgressionsApi/useMilestoneProgressionsApi.ts b/frontend/src/hooks/api/actions/useMilestoneProgressionsApi/useMilestoneProgressionsApi.ts index 50cea7805f..804bc72c8b 100644 --- a/frontend/src/hooks/api/actions/useMilestoneProgressionsApi/useMilestoneProgressionsApi.ts +++ b/frontend/src/hooks/api/actions/useMilestoneProgressionsApi/useMilestoneProgressionsApi.ts @@ -6,13 +6,19 @@ export const useMilestoneProgressionsApi = () => { propagateErrors: true, }); - const changeMilestoneProgression = async ( - projectId: string, - environment: string, - featureName: string, - sourceMilestoneId: string, - body: ChangeMilestoneProgressionSchema, - ): Promise => { + const changeMilestoneProgression = async ({ + projectId, + environment, + featureName, + sourceMilestoneId, + body, + }: { + projectId: string; + environment: string; + featureName: string; + sourceMilestoneId: string; + body: ChangeMilestoneProgressionSchema; + }): Promise => { const requestId = 'changeMilestoneProgression'; const path = `api/admin/projects/${projectId}/features/${featureName}/environments/${environment}/progressions/${sourceMilestoneId}`; const req = createRequest( @@ -27,12 +33,17 @@ export const useMilestoneProgressionsApi = () => { await makeRequest(req.caller, req.id); }; - const deleteMilestoneProgression = async ( - projectId: string, - environment: string, - featureName: string, - sourceMilestoneId: string, - ): Promise => { + const deleteMilestoneProgression = async ({ + projectId, + environment, + featureName, + sourceMilestoneId, + }: { + projectId: string; + environment: string; + featureName: string; + sourceMilestoneId: string; + }): Promise => { const requestId = 'deleteMilestoneProgression'; const path = `api/admin/projects/${projectId}/features/${featureName}/environments/${environment}/progressions/${sourceMilestoneId}`; const req = createRequest( @@ -46,9 +57,34 @@ export const useMilestoneProgressionsApi = () => { await makeRequest(req.caller, req.id); }; + const resumeMilestoneProgressions = async ({ + projectId, + environment, + featureName, + planId, + }: { + projectId: string; + environment: string; + featureName: string; + planId: string; + }): Promise => { + const requestId = 'resumeProgressions'; + const path = `api/admin/projects/${projectId}/features/${featureName}/environments/${environment}/progressions/${planId}/resume`; + const req = createRequest( + path, + { + method: 'POST', + }, + requestId, + ); + + await makeRequest(req.caller, req.id); + }; + return { changeMilestoneProgression, deleteMilestoneProgression, + resumeMilestoneProgressions, errors, loading, }; diff --git a/frontend/src/interfaces/connectedEdge.ts b/frontend/src/interfaces/connectedEdge.ts index dc4d9bba6f..377512229b 100644 --- a/frontend/src/interfaces/connectedEdge.ts +++ b/frontend/src/interfaces/connectedEdge.ts @@ -5,6 +5,7 @@ export type ConnectedEdge = { edgeVersion: string; instanceId: string; region: string | null; + hosting?: 'hosted' | 'enterprise-self-hosted'; reportedAt: string; started: string; connectedVia?: string; diff --git a/frontend/src/interfaces/uiConfig.ts b/frontend/src/interfaces/uiConfig.ts index 5d06c5073b..f63be56a6b 100644 --- a/frontend/src/interfaces/uiConfig.ts +++ b/frontend/src/interfaces/uiConfig.ts @@ -90,6 +90,7 @@ export type UiFlags = { milestoneProgression?: boolean; featureReleasePlans?: boolean; safeguards?: boolean; + oidcPkceSupport?: boolean; extendedUsageMetrics?: boolean; }; diff --git a/frontend/src/openapi/models/eventSchemaType.ts b/frontend/src/openapi/models/eventSchemaType.ts index 3e1321f6fa..8e908e8325 100644 --- a/frontend/src/openapi/models/eventSchemaType.ts +++ b/frontend/src/openapi/models/eventSchemaType.ts @@ -150,6 +150,8 @@ export const EventSchemaType = { 'banner-created': 'banner-created', 'banner-updated': 'banner-updated', 'banner-deleted': 'banner-deleted', + 'safeguard-changed': 'safeguard-changed', + 'safeguard-deleted': 'safeguard-deleted', 'project-environment-added': 'project-environment-added', 'project-environment-removed': 'project-environment-removed', 'default-strategy-updated': 'default-strategy-updated', diff --git a/frontend/src/openapi/models/impactMetricsConfigSchema.ts b/frontend/src/openapi/models/impactMetricsConfigSchema.ts index 9971eca44b..382bb73211 100644 --- a/frontend/src/openapi/models/impactMetricsConfigSchema.ts +++ b/frontend/src/openapi/models/impactMetricsConfigSchema.ts @@ -5,6 +5,7 @@ */ import type { ImpactMetricsConfigSchemaAggregationMode } from './impactMetricsConfigSchemaAggregationMode.js'; import type { ImpactMetricsConfigSchemaLabelSelectors } from './impactMetricsConfigSchemaLabelSelectors.js'; +import type { ImpactMetricsConfigSchemaMode } from './impactMetricsConfigSchemaMode.js'; import type { ImpactMetricsConfigSchemaTimeRange } from './impactMetricsConfigSchemaTimeRange.js'; import type { ImpactMetricsConfigSchemaType } from './impactMetricsConfigSchemaType.js'; import type { ImpactMetricsConfigSchemaYAxisMin } from './impactMetricsConfigSchemaYAxisMin.js'; @@ -23,6 +24,8 @@ export interface ImpactMetricsConfigSchema { labelSelectors: ImpactMetricsConfigSchemaLabelSelectors; /** The Prometheus metric series to query. It includes both unleash prefix and metric type and display name */ metricName: string; + /** The access mode for this impact metric configuration: "read" when referenced by a safeguard, "write" otherwise. */ + mode?: ImpactMetricsConfigSchemaMode; /** The time range for the metric data. */ timeRange: ImpactMetricsConfigSchemaTimeRange; /** diff --git a/frontend/src/openapi/models/impactMetricsConfigSchemaMode.ts b/frontend/src/openapi/models/impactMetricsConfigSchemaMode.ts new file mode 100644 index 0000000000..2674410307 --- /dev/null +++ b/frontend/src/openapi/models/impactMetricsConfigSchemaMode.ts @@ -0,0 +1,17 @@ +/** + * Generated by Orval + * Do not edit manually. + * See `gen:api` script in package.json + */ + +/** + * The access mode for this impact metric configuration: "read" when referenced by a safeguard, "write" otherwise. + */ +export type ImpactMetricsConfigSchemaMode = + (typeof ImpactMetricsConfigSchemaMode)[keyof typeof ImpactMetricsConfigSchemaMode]; + +// eslint-disable-next-line @typescript-eslint/no-redeclare +export const ImpactMetricsConfigSchemaMode = { + read: 'read', + write: 'write', +} as const; diff --git a/frontend/src/openapi/models/index.ts b/frontend/src/openapi/models/index.ts index 14cc552d20..6e06cc1642 100644 --- a/frontend/src/openapi/models/index.ts +++ b/frontend/src/openapi/models/index.ts @@ -949,6 +949,7 @@ export * from './impactMetricsConfigListSchema.js'; export * from './impactMetricsConfigSchema.js'; export * from './impactMetricsConfigSchemaAggregationMode.js'; export * from './impactMetricsConfigSchemaLabelSelectors.js'; +export * from './impactMetricsConfigSchemaMode.js'; export * from './impactMetricsConfigSchemaTimeRange.js'; export * from './impactMetricsConfigSchemaType.js'; export * from './impactMetricsConfigSchemaYAxisMin.js'; @@ -1283,6 +1284,9 @@ export * from './resetUserPassword401.js'; export * from './resetUserPassword403.js'; export * from './resetUserPassword404.js'; export * from './resourceLimitsSchema.js'; +export * from './resumeMilestoneProgressions401.js'; +export * from './resumeMilestoneProgressions403.js'; +export * from './resumeMilestoneProgressions404.js'; export * from './reviveFeature400.js'; export * from './reviveFeature401.js'; export * from './reviveFeature403.js'; diff --git a/frontend/src/openapi/models/oidcSettingsResponseSchema.ts b/frontend/src/openapi/models/oidcSettingsResponseSchema.ts index 24eb5e41d3..d20201be23 100644 --- a/frontend/src/openapi/models/oidcSettingsResponseSchema.ts +++ b/frontend/src/openapi/models/oidcSettingsResponseSchema.ts @@ -32,6 +32,8 @@ export interface OidcSettingsResponseSchema { enabled?: boolean; /** Should we enable group syncing. Refer to the documentation [Group syncing](https://docs.getunleash.io/how-to/how-to-set-up-group-sso-sync) */ enableGroupSyncing?: boolean; + /** Enable PKCE (Proof Key for Code Exchange) for enhanced security. Recommended for public clients and provides additional protection against authorization code interception attacks. */ + enablePkce?: boolean; /** Support Single sign out when user clicks logout in Unleash. If `true` user is signed out of all OpenID Connect sessions against the clientId they may have active */ enableSingleSignOut?: boolean; /** Specifies the path in the OIDC token response to read which groups the user belongs to from. */ diff --git a/frontend/src/openapi/models/oidcSettingsSchemaOneOf.ts b/frontend/src/openapi/models/oidcSettingsSchemaOneOf.ts index 56248819f7..4d3769e3c4 100644 --- a/frontend/src/openapi/models/oidcSettingsSchemaOneOf.ts +++ b/frontend/src/openapi/models/oidcSettingsSchemaOneOf.ts @@ -29,6 +29,8 @@ export type OidcSettingsSchemaOneOf = { enabled: boolean; /** Should we enable group syncing. Refer to the documentation [Group syncing](https://docs.getunleash.io/how-to/how-to-set-up-group-sso-sync) */ enableGroupSyncing?: boolean; + /** Enable PKCE (Proof Key for Code Exchange) for enhanced security. Recommended for public clients and provides additional protection against authorization code interception attacks. */ + enablePkce?: boolean; /** Support Single sign out when user clicks logout in Unleash. If `true` user is signed out of all OpenID Connect sessions against the clientId they may have active */ enableSingleSignOut?: boolean; /** Specifies the path in the OIDC token response to read which groups the user belongs to from. */ diff --git a/frontend/src/openapi/models/oidcSettingsSchemaOneOfFour.ts b/frontend/src/openapi/models/oidcSettingsSchemaOneOfFour.ts index 402f1cf002..7b7b4670f1 100644 --- a/frontend/src/openapi/models/oidcSettingsSchemaOneOfFour.ts +++ b/frontend/src/openapi/models/oidcSettingsSchemaOneOfFour.ts @@ -29,6 +29,8 @@ export type OidcSettingsSchemaOneOfFour = { enabled?: boolean; /** Should we enable group syncing. Refer to the documentation [Group syncing](https://docs.getunleash.io/how-to/how-to-set-up-group-sso-sync) */ enableGroupSyncing?: boolean; + /** Enable PKCE (Proof Key for Code Exchange) for enhanced security. Recommended for public clients and provides additional protection against authorization code interception attacks. */ + enablePkce?: boolean; /** Support Single sign out when user clicks logout in Unleash. If `true` user is signed out of all OpenID Connect sessions against the clientId they may have active */ enableSingleSignOut?: boolean; /** Specifies the path in the OIDC token response to read which groups the user belongs to from. */ diff --git a/frontend/src/openapi/models/resumeMilestoneProgressions401.ts b/frontend/src/openapi/models/resumeMilestoneProgressions401.ts new file mode 100644 index 0000000000..fb37a6c9cf --- /dev/null +++ b/frontend/src/openapi/models/resumeMilestoneProgressions401.ts @@ -0,0 +1,14 @@ +/** + * Generated by Orval + * Do not edit manually. + * See `gen:api` script in package.json + */ + +export type ResumeMilestoneProgressions401 = { + /** The ID of the error instance */ + id?: string; + /** A description of what went wrong. */ + message?: string; + /** The name of the error kind */ + name?: string; +}; diff --git a/frontend/src/openapi/models/resumeMilestoneProgressions403.ts b/frontend/src/openapi/models/resumeMilestoneProgressions403.ts new file mode 100644 index 0000000000..7e08c62eb2 --- /dev/null +++ b/frontend/src/openapi/models/resumeMilestoneProgressions403.ts @@ -0,0 +1,14 @@ +/** + * Generated by Orval + * Do not edit manually. + * See `gen:api` script in package.json + */ + +export type ResumeMilestoneProgressions403 = { + /** The ID of the error instance */ + id?: string; + /** A description of what went wrong. */ + message?: string; + /** The name of the error kind */ + name?: string; +}; diff --git a/frontend/src/openapi/models/resumeMilestoneProgressions404.ts b/frontend/src/openapi/models/resumeMilestoneProgressions404.ts new file mode 100644 index 0000000000..b52cdff5ff --- /dev/null +++ b/frontend/src/openapi/models/resumeMilestoneProgressions404.ts @@ -0,0 +1,14 @@ +/** + * Generated by Orval + * Do not edit manually. + * See `gen:api` script in package.json + */ + +export type ResumeMilestoneProgressions404 = { + /** The ID of the error instance */ + id?: string; + /** A description of what went wrong. */ + message?: string; + /** The name of the error kind */ + name?: string; +}; diff --git a/src/lib/events/index.ts b/src/lib/events/index.ts index a2c10ed701..89d648a6cd 100644 --- a/src/lib/events/index.ts +++ b/src/lib/events/index.ts @@ -180,6 +180,9 @@ export const BANNER_CREATED = 'banner-created' as const; export const BANNER_UPDATED = 'banner-updated' as const; export const BANNER_DELETED = 'banner-deleted' as const; +export const SAFEGUARD_CHANGED = 'safeguard-changed' as const; +export const SAFEGUARD_DELETED = 'safeguard-deleted' as const; + export const SIGNAL_ENDPOINT_CREATED = 'signal-endpoint-created' as const; export const SIGNAL_ENDPOINT_UPDATED = 'signal-endpoint-updated' as const; export const SIGNAL_ENDPOINT_DELETED = 'signal-endpoint-deleted' as const; @@ -363,6 +366,8 @@ export const IEventTypes = [ BANNER_CREATED, BANNER_UPDATED, BANNER_DELETED, + SAFEGUARD_CHANGED, + SAFEGUARD_DELETED, PROJECT_ENVIRONMENT_ADDED, PROJECT_ENVIRONMENT_REMOVED, DEFAULT_STRATEGY_UPDATED, diff --git a/src/lib/features/access/createAccessService.ts b/src/lib/features/access/createAccessService.ts index de08bb29fd..ccf745b029 100644 --- a/src/lib/features/access/createAccessService.ts +++ b/src/lib/features/access/createAccessService.ts @@ -10,7 +10,9 @@ import FakeEventStore from '../../../test/fixtures/fake-event-store.js'; import { FakeAccountStore } from '../../../test/fixtures/fake-account-store.js'; import FakeRoleStore from '../../../test/fixtures/fake-role-store.js'; import FakeEnvironmentStore from '../project-environments/fake-environment-store.js'; -import FakeAccessStore from '../../../test/fixtures/fake-access-store.js'; +import FakeAccessStore, { + type FakeAccessStoreConfig, +} from '../../../test/fixtures/fake-access-store.js'; import type { IAccessStore, IEventStore, @@ -45,8 +47,13 @@ export const createAccessService = ( ); }; +export type FakeAccessServiceConfig = { + accessStoreConfig?: FakeAccessStoreConfig; +}; + export const createFakeAccessService = ( config: IUnleashConfig, + { accessStoreConfig }: FakeAccessServiceConfig = {}, ): { accessService: AccessService; eventStore: IEventStore; @@ -59,7 +66,7 @@ export const createFakeAccessService = ( const accountStore = new FakeAccountStore(); const roleStore = new FakeRoleStore(); const environmentStore = new FakeEnvironmentStore(); - const accessStore = new FakeAccessStore(roleStore); + const accessStore = new FakeAccessStore(roleStore, accessStoreConfig); const eventService = createFakeEventsService(config, { eventStore }); const groupService = new GroupService( { groupStore, accountStore }, diff --git a/src/lib/services/access-service.test.ts b/src/lib/services/access-service.test.ts index 71af9591d6..41eb9469c0 100644 --- a/src/lib/services/access-service.test.ts +++ b/src/lib/services/access-service.test.ts @@ -1,6 +1,9 @@ import NameExistsError from '../error/name-exists-error.js'; import getLogger from '../../test/fixtures/no-logger.js'; -import { createFakeAccessService } from '../features/access/createAccessService.js'; +import { + createFakeAccessService, + type FakeAccessServiceConfig, +} from '../features/access/createAccessService.js'; import { AccessService, type IRoleCreation, @@ -29,13 +32,15 @@ import { createFakeAccessReadModel } from '../features/access/createAccessReadMo import { ROLE_CREATED } from '../events/index.js'; import { expect } from 'vitest'; -function getSetup() { +function getSetup(accessServiceConfig?: FakeAccessServiceConfig) { const config = createTestConfig({ getLogger, }); - const { accessService, eventStore, accessStore } = - createFakeAccessService(config); + const { accessService, eventStore, accessStore } = createFakeAccessService( + config, + accessServiceConfig, + ); return { accessService, @@ -213,7 +218,24 @@ test('should be able to validate and cleanup with additional properties', async }); test('user with custom root role should get a user root role', async () => { - const { accessService, eventStore } = getSetup(); + const availablePermissions = [ + { + id: 1, + environment: 'development', + name: 'fake', + displayName: 'fake', + type: '', + }, + { + id: 2, + name: 'root-fake-permission', + displayName: '', + type: '', + }, + ]; + const { accessService, eventStore } = getSetup({ + accessStoreConfig: { availablePermissions }, + }); const createRoleInput: IRoleCreation = { name: 'custom-root-role', description: 'test custom root role', diff --git a/src/lib/services/access-service.ts b/src/lib/services/access-service.ts index 81b730c81c..e7f934d2cd 100644 --- a/src/lib/services/access-service.ts +++ b/src/lib/services/access-service.ts @@ -707,6 +707,8 @@ export class AccessService { roleType, }; + await this.validatePermissions(role.permissions); + const rolePermissions = cleanPermissionEnvironment(role.permissions); const newRole = await this.roleStore.create(baseRole); if (rolePermissions) { @@ -756,6 +758,8 @@ export class AccessService { description: role.description, roleType, }; + + await this.validatePermissions(role.permissions); const rolePermissions = cleanPermissionEnvironment(role.permissions); const updatedRole = await this.roleStore.update(baseRole); const existingPermissions = await this.store.getPermissionsForRole( @@ -878,4 +882,33 @@ export class AccessService { async getUserAccessOverview(): Promise { return this.store.getUserAccessOverview(); } + + async validatePermissions(permissions?: PermissionRef[]): Promise { + if (!permissions?.length) { + return; + } + const availablePermissions = await this.store.getAvailablePermissions(); + const invalidPermissions = permissions.filter( + (permission) => + !availablePermissions.some((availablePermission) => + 'id' in permission + ? availablePermission.id === permission.id + : availablePermission.name === permission.name, + ), + ); + + if (invalidPermissions.length > 0) { + const invalidPermissionList = invalidPermissions + .map((permission) => + 'id' in permission + ? `permission with ID: ${permission.id}` + : permission.name, + ) + .join(', '); + + throw new BadDataError( + `Invalid permissions supplied. The following permissions don't exist: ${invalidPermissionList}.`, + ); + } + } } diff --git a/src/lib/types/experimental.ts b/src/lib/types/experimental.ts index 820546d46b..ea6e998839 100644 --- a/src/lib/types/experimental.ts +++ b/src/lib/types/experimental.ts @@ -64,7 +64,8 @@ export type IFlagKey = | 'milestoneProgression' | 'featureReleasePlans' | 'plausibleMetrics' - | 'safeguards'; + | 'safeguards' + | 'oidcPkceSupport'; export type IFlags = Partial<{ [key in IFlagKey]: boolean | Variant }>; @@ -285,6 +286,10 @@ const flags: IFlags = { process.env.UNLEASH_EXPERIMENTAL_SAFEGUARDS, false, ), + oidcPkceSupport: parseEnvVarBoolean( + process.env.UNLEASH_EXPERIMENTAL_OIDC_PKCE_SUPPORT, + false, + ), }; export const defaultExperimentalOptions: IExperimentalOptions = { diff --git a/src/migrations/20251118131212-edge-observability-hosting.js b/src/migrations/20251118131212-edge-observability-hosting.js new file mode 100644 index 0000000000..15427ef832 --- /dev/null +++ b/src/migrations/20251118131212-edge-observability-hosting.js @@ -0,0 +1,19 @@ +exports.up = function(db, cb) { + db.runSql( + ` + ALTER TABLE stat_edge_observability + ADD COLUMN hosting TEXT; + `, + cb, + ); +}; + +exports.down = function(db, cb) { + db.runSql( + ` + ALTER TABLE stat_edge_observability + DROP COLUMN IF EXISTS hosting; + `, + cb, + ); +}; diff --git a/src/test/e2e/services/access-service.e2e.test.ts b/src/test/e2e/services/access-service.e2e.test.ts index 51bf8c87c9..ed988aefc2 100644 --- a/src/test/e2e/services/access-service.e2e.test.ts +++ b/src/test/e2e/services/access-service.e2e.test.ts @@ -1848,3 +1848,56 @@ test('access overview should include users with custom root roles', async () => expect(userAccess.userId).toBe(user.id); expect(userAccess.rootRole).toBe('Mischievous Messenger'); }); + +test("creating a role with permissions that don't exist should throw a bad data error", async () => { + await expect(() => + accessService.createRole( + { + name: 'Oogus Boogus', + type: CUSTOM_ROOT_ROLE_TYPE, + description: + "Well, well, well ... what have we here? Sandy Claws, huh? Oooh, I'm really scared!", + permissions: [{ name: 'BOGUS' }], + createdByUserId: 1, + }, + SYSTEM_USER_AUDIT, + ), + ).rejects.toThrow( + expect.objectContaining({ + name: 'BadDataError', + message: expect.stringMatching(/BOGUS/), + }), + ); +}); + +test("Updating a role with permissions that don't exist should throw a bad data error", async () => { + const custom_role = await accessService.createRole( + { + name: 'Legit custom role', + type: CUSTOM_ROOT_ROLE_TYPE, + description: '', + permissions: [{ name: permissions.CREATE_ADDON }], + createdByUserId: 1, + }, + SYSTEM_USER_AUDIT, + ); + await expect(() => + accessService.updateRole( + { + id: custom_role.id, + name: 'Oogus Boogus', + type: CUSTOM_ROOT_ROLE_TYPE, + description: + 'This might be the last time that you hear the Boogus song', + permissions: [{ name: 'BOGUS' }], + createdByUserId: 1, + }, + SYSTEM_USER_AUDIT, + ), + ).rejects.toThrow( + expect.objectContaining({ + name: 'BadDataError', + message: expect.stringMatching(/BOGUS/), + }), + ); +}); diff --git a/src/test/fixtures/fake-access-store.ts b/src/test/fixtures/fake-access-store.ts index 3dcb4f0be6..20067c15a4 100644 --- a/src/test/fixtures/fake-access-store.ts +++ b/src/test/fixtures/fake-access-store.ts @@ -18,6 +18,10 @@ import { import FakeRoleStore from './fake-role-store.js'; import type { PermissionRef } from '../../lib/services/access-service.js'; +export type FakeAccessStoreConfig = Partial<{ + availablePermissions: IPermission[]; +}>; + export class FakeAccessStore implements IAccessStore { fakeRolesStore: IRoleStore; @@ -25,8 +29,11 @@ export class FakeAccessStore implements IAccessStore { rolePermissions: Map = new Map(); - constructor(roleStore?: IRoleStore) { + availablePermissions: IPermission[] = []; + + constructor(roleStore?: IRoleStore, config?: FakeAccessStoreConfig) { this.fakeRolesStore = roleStore ?? new FakeRoleStore(); + this.availablePermissions = config?.availablePermissions ?? []; } getProjectUserAndGroupCountsForRole( @@ -112,7 +119,7 @@ export class FakeAccessStore implements IAccessStore { } getAvailablePermissions(): Promise { - throw new Error('Method not implemented.'); + return Promise.resolve(this.availablePermissions); } getPermissionsForUser(userId: Number): Promise { diff --git a/website/docs/reference/core-concepts.mdx b/website/docs/reference/core-concepts.mdx index 5527ec061b..2006916084 100644 --- a/website/docs/reference/core-concepts.mdx +++ b/website/docs/reference/core-concepts.mdx @@ -46,7 +46,7 @@ Each project must always have **at least one** active environment. Environments are adjacent to [feature flags](../reference/feature-toggles) in Unleash: neither one contains the other, but they come together to let you define activation strategies. -![Constraints and activation strategies](/img/anatomy-of-unleash-new-feature-rollout.png) +![Constraints and activation strategies](/img/anatomy-of-unleash-environments.png) :::info Environments and API keys @@ -64,10 +64,10 @@ When creating a feature flag, you must assign a unique (across your Unleash inst ## Activation strategies -![An environment containing a feature flag configuration with an activation strategy](/img/anatomy-of-unleash-strategy.png) - [**Activation strategies**](../reference/activation-strategies) (or just **strategies** for short) are the part of feature flags that tell Unleash **who should get a feature**. An activation strategy is assigned to **one **feature flag in **one **environment. +![An environment containing a feature flag configuration with an activation strategy](/img/anatomy-of-unleash-strategy.png) + When you check a [feature flag](../reference/feature-toggles) in an application, the following decides the result: 1. Is the flag active in the current environment? If not, it will be disabled. @@ -122,6 +122,32 @@ Segments are only available to [Pro](/availability#plans) and [Enterprise](https ![An example of segments](/img/anatomy-of-unleash-segments.png) +## Release templates + +[Release templates](/reference/release-templates) provide a way to standardize how you roll out features across your application. While activation strategies define who gets a feature, release templates define how that access expands over time. + +![Illustration showing showing a release template is made up of milestones](/img/anatomy-of-unleash-release-template.png) + +A release template is a blueprint for a rollout. It consists of sequential stages called **milestones**. Each milestone contains one or more **activation strategies** or **segments**. For example, a template might look like this: + +- Milestone 1: Internal users only. +- Milestone 2: Beta users. +- Milestone 3: 50% of all users. +- Milestone 4: 100% of all users. + +![Illustration showing showing that a release template can be applied to a feature flag](/img/anatomy-of-unleash-release-template-apply.png) + +When you apply a release template to a specific feature flag in an environment, it creates a **release plan**. This plan lets you progress through the milestones step-by-step. Release templates ensure that your rollouts are consistent and safe, removing the need to manually configure strategies from scratch every time you launch a new feature. + +![Illustration showing showing a release template applied to a feature flag in an environment](/img/anatomy-of-unleash-release-template-applied.png) + +### Automatic milestone progression and safeguards + +You can further automate your release plans using [impact metrics](/reference/impact-metrics). Impact metrics are data points sent from your application (such as error counts, memory usage, or response latency) that act as real-time health indicators for your feature. + +By defining safeguards based on these metrics, you can allow Unleash to manage the rollout for you. If metrics remain healthy for a set duration, Unleash automatically advances to the next milestone. +If a metric crosses a safety threshold (for example, error rate spikes), Unleash immediately pauses the rollout to prevent incidents. + ## Variants and feature flag payloads By default, a [feature flag](../reference/feature-toggles) in Unleash only tells you whether a feature is enabled or disabled, but you can also add more information to your flags by using [**feature flag variants**](../reference/feature-toggle-variants). Variants also allow you to run [A/B testing experiments](../../feature-flag-tutorials/use-cases/a-b-testing). @@ -132,19 +158,11 @@ When you create new variants for a feature, they must be given a name and a **we You can use the variant payload to attach arbitrary data to a variant. Variants can have different kinds of payloads. -A feature flag can have as many variants as you want. - -### Variants and environments - -Prior to 4.21, variants were independent of [environments](../reference/environments). In other words: if you're on 4.19 or lower, you’ll always have the exact same variants with the exact same weightings and the exact same payloads in all environments. - -![Variants prior to Unleash 4.21](/img/anatomy-of-unleash-variants.png) - -As of version 4.21, a feature can have different variants in different environments. For instance, a development environment might have no variants, while a production environment has 2 variants. Payloads, weightings, and anything else can also differ between environments. +A feature can have different variants in different environments. For instance, a development environment might have no variants, while a production environment has 2 variants. Payloads, weightings, and anything else can also differ between environments. ![Variants after version 4.21](/img/anatomy-of-unleash-variants-environment.png) -## Use case: changing website colors {#use-case} +## Use case: changing website colors Using the concepts we have looked at in the previous sections, let’s create a hypothetical case and see how Unleash would solve it. @@ -205,4 +223,4 @@ if (theme === “green”) { } ``` -Now users that are included in the gradual rollout will get one of the three themes. Users that aren’t included get the old theme. +Now users that are included in the gradual rollout will get one of the three themes. Users that aren’t included get the old theme. \ No newline at end of file diff --git a/website/docs/reference/impact-metrics.mdx b/website/docs/reference/impact-metrics.mdx new file mode 100644 index 0000000000..1f0b92a555 --- /dev/null +++ b/website/docs/reference/impact-metrics.mdx @@ -0,0 +1,189 @@ +--- +title: Impact metrics +--- + +import SearchPriority from '@site/src/components/SearchPriority'; + + + +
+ Impact metrics is an early access feature + + Impact metrics and automated release progression are early access features. Functionality may change. We are actively looking for feedback. Share your experience in the Unleash community Slack or email beta@getunleash.io. + + During this early access period, Impact Metrics are available for Unleash Hosted customers. + +
+ + +## Overview + +Impact metrics are lightweight, application-level time-series metrics stored and visualized directly inside Unleash. +They allow you to connect specific application data, such as request counts, error rates, or memory usage, to your feature flags and release plans. + +Use impact metrics to validate feature impact and automate your release process. For example, you can monitor usage patterns or performance to see if a feature is meeting its goals. + +By combining impact metrics with [release templates](/reference/release-templates), you can reduce manual release operations. +Unleash can monitor your rollout and automatically progress to the next milestone or trigger safeguards that pause the release based on the health of your metrics. + +![Example of impact metrics displaying](/img/impact-metrics.png) + +Impact metrics support three types of data: +- **Counters**: Cumulative values that only increase. These are suitable for request counts, error counts, or event counters. +- **Gauges**: Values that fluctuate up or down, such as memory usage or the number of active users. +- **Histograms**: Distribution of values, useful for measuring things like request duration or response size. Supports percentiles (p50, p95, p99). + +You can use these metrics in two primary areas: +- **Charts**: Visualize data in the Impact Metrics section of the Admin UI. +- **Release management**: Drive automatic milestone progression or trigger safeguards to stop a rollout. + +## Key use cases + +Impact metrics provide real-time data about your features. This enables two primary workflows: [automated releases with safeguards](#automated-releases-with-safeguards) and [feature impact validation](#validate-feature-impact-and-improve-iteratively). + +### Automated releases with safeguards + +Impact metrics integrate directly with release templates so Unleash can automatically progress milestones or pause a rollout when metrics fall outside your defined thresholds. This reduces the manual effort required during releases, especially when teams are shipping more frequently or outside working hours. + +Instead of tracking dashboards or waiting for alerts, you can use counters, gauges, or histograms to define what “healthy” looks like and let Unleash manage the rollout based on objective data. + +Examples: + +- Progress from 25% → 50% only if error rates remain below a threshold. +- Automatically pause when request latency increases during a rollout. + +See [Automate release progression](#automate-release-progression) and [Configure safeguards](#configure-safeguards) for more information. + +### Validate feature impact and improve iteratively + +Beyond automation, impact metrics help you understand whether the features you build are actually solving the right problems. You can track usage patterns, performance trends, or flag-correlated outcomes over time to evaluate whether a feature is meeting expectations. This supports both short-term decisions during a rollout and longer-term decisions about iteration, refinement, or deprecation. + +Examples: + +- Track whether a new feature is being used as expected after rollout. +- Monitor error counts, traffic patterns, or operational health for a feature or its variants. +- Identify features that need follow-up work, optimisation, or removal. + +See [Create impact metrics charts](#create-impact-metrics-charts) for more information. + +## Define and record metrics in the SDK + +:::info +Impact metrics are currently supported by the Node SDK. To request support for additional SDKs, please contact [beta@getunleash.io](mailto:beta@getunleash.io). +::: + +To visualize a metric in Unleash, you must first define the metric in the SDK and then count or record values for it. + +The SDK automatically attaches the following context labels to your metrics to ensure they are queryable in the UI: `appName`, `environment`, `origin` (for example, `origin=sdk` or `origin=Edge`). + +### Counters + +Use counters for cumulative values that only increase, such as the total number of requests or errors. + +```javascript +// 1. Define the counter +unleash.impactMetrics.defineCounter( + 'request_count', + 'Total number of HTTP requests processed' +); + +// 2. Increment the counter +unleash.impactMetrics.incrementCounter('request_count'); +``` + +### Gauges + +Use gauges for values that can go up and down, such as current memory usage or active thread count. + +```javascript +// 1. Define the gauge +unleash.impactMetrics.defineGauge( + 'heap_memory_total', + 'Current heap memory usage in bytes' +); + +// 2. Update the gauge value +const currentHeap = process.memoryUsage().heapUsed; +unleash.impactMetrics.updateGauge('heap_memory_total', currentHeap); +``` + +### Histograms + +Use histograms to measure the distribution of values, such as request duration or response size. Unleash automatically calculates percentiles (p50, p95, p99). + +```javascript +// 1. Define the histogram +unleash.impactMetrics.defineHistogram( + 'request_time_ms', + 'Time taken to process a request in milliseconds' +); + +// 2. Record a value +const duration = 125; +unleash.impactMetrics.observeHistogram('request_time_ms', duration); +``` + +## Create impact metrics charts + +You can visualize your defined metrics in the Unleash Admin UI. + +1. Go to **Impact Metrics** in the sidebar. +2. Click **New Chart**. +3. In the **Add New Chart** dialog, configure the following: + - Data series: Select your counter or gauge (for example, `request_count`). + - Time: Select a window (for example, Last 24 hours). + - Mode (aggregation type): Choose how to display the data. + - For Counters: + - Rate per second + - Count + - For Gauges: + - Sum + - Average + - For Histograms: + - p50 + - p95 + - p99 + - Filters: Optionally filter by `appName`, `environment`, `origin`. + +4. Click **Add chart**. + +![Creating a new impact metrics chart in the Admin UI](/img/add-new-impact-metrics-chart.png) + +The chart will display the data based on your configuration. Note that there is a 1–2 minute delay between data generation and visualization due to the scrape and ingestion cycle. + +## Automate release progression + +Impact metrics integrate with [release templates](/reference/release-templates) to automate the rollout process. Instead of manually updating milestones (for example, moving from 10% to 50%), Unleash can handle this for you. + +To configure automatic progression: + +1. Open a feature flag that [uses a release template](https://docs.getunleash.io/reference/release-templates#apply-a-release-template-to-a-feature-flag). +2. Select a milestone and click **Add automation**. +3. Define the conditions: + - Time: The minimum duration the milestone must run. For example, proceed after 24 hours. +4. Click **Save**. + +When the time conditions are satisfied, Unleash automatically advances the release to the next milestone. + +## Configure safeguards + +Safeguards act as a safety net for your releases. They can automatically pause a rollout if metrics indicate system instability. + +:::info + +To experiment with safeguards during the early access phase, please reach out to beta@getunleash.io for configuration guidance. + +::: + + +## Technical implementation details + +### Ingestion and batching + +Impact metrics are batched and sent on the same interval as [regular SDK metrics](/reference/impression-data). They are ingested via the regular metrics endpoint. + +### Unleash Edge behavior + +Unleash Edge forwards impact metrics received from SDKs to the Unleash API. The origin of the label appears as `origin=Edge`. Daisy-chaining Edge instances is not supported. + +If an Edge instance accumulates a large batch of metrics (e.g., due to a temporary network disconnect), it will send them as a single bulk send upon reconnection. This will appear as a large, sudden spike in your counter graphs, rather than a smooth distribution over time. This is expected behavior. \ No newline at end of file diff --git a/website/sidebars.ts b/website/sidebars.ts index a581cb45be..f0fc51f1bc 100644 --- a/website/sidebars.ts +++ b/website/sidebars.ts @@ -97,7 +97,19 @@ const sidebars: SidebarsConfig = { 'reference/segments', 'reference/unleash-context', 'reference/stickiness', + ], + }, + { + label: 'Release management', + collapsed: true, + type: 'category', + link: { + type: 'doc', + id: 'reference/release-templates', + }, + items: [ 'reference/release-templates', + 'reference/impact-metrics', ], }, { diff --git a/website/static/img/add-new-impact-metrics-chart.png b/website/static/img/add-new-impact-metrics-chart.png new file mode 100644 index 0000000000..526799fa6b Binary files /dev/null and b/website/static/img/add-new-impact-metrics-chart.png differ diff --git a/website/static/img/anatomy-of-unleash-constraint.png b/website/static/img/anatomy-of-unleash-constraint.png index 9ed15f3b08..2c82e8604b 100644 Binary files a/website/static/img/anatomy-of-unleash-constraint.png and b/website/static/img/anatomy-of-unleash-constraint.png differ diff --git a/website/static/img/anatomy-of-unleash-customer-tiers.png b/website/static/img/anatomy-of-unleash-customer-tiers.png index 391110b061..734c862b8a 100644 Binary files a/website/static/img/anatomy-of-unleash-customer-tiers.png and b/website/static/img/anatomy-of-unleash-customer-tiers.png differ diff --git a/website/static/img/anatomy-of-unleash-environment.png b/website/static/img/anatomy-of-unleash-environment.png index 785b88c17d..1f8a22f7ae 100644 Binary files a/website/static/img/anatomy-of-unleash-environment.png and b/website/static/img/anatomy-of-unleash-environment.png differ diff --git a/website/static/img/anatomy-of-unleash-environments-strategies.png b/website/static/img/anatomy-of-unleash-environments-strategies.png index 90c5b90ddc..4d760e1aa9 100644 Binary files a/website/static/img/anatomy-of-unleash-environments-strategies.png and b/website/static/img/anatomy-of-unleash-environments-strategies.png differ diff --git a/website/static/img/anatomy-of-unleash-environments-strategies2.png b/website/static/img/anatomy-of-unleash-environments-strategies2.png index 3b4d505096..5e28330819 100644 Binary files a/website/static/img/anatomy-of-unleash-environments-strategies2.png and b/website/static/img/anatomy-of-unleash-environments-strategies2.png differ diff --git a/website/static/img/anatomy-of-unleash-environments.png b/website/static/img/anatomy-of-unleash-environments.png new file mode 100644 index 0000000000..098420dfdb Binary files /dev/null and b/website/static/img/anatomy-of-unleash-environments.png differ diff --git a/website/static/img/anatomy-of-unleash-features.png b/website/static/img/anatomy-of-unleash-features.png index 1a38108223..598c6f0dcf 100644 Binary files a/website/static/img/anatomy-of-unleash-features.png and b/website/static/img/anatomy-of-unleash-features.png differ diff --git a/website/static/img/anatomy-of-unleash-new-feature-rollout.png b/website/static/img/anatomy-of-unleash-new-feature-rollout.png deleted file mode 100644 index 3f3370f6e4..0000000000 Binary files a/website/static/img/anatomy-of-unleash-new-feature-rollout.png and /dev/null differ diff --git a/website/static/img/anatomy-of-unleash-release-template-applied.png b/website/static/img/anatomy-of-unleash-release-template-applied.png new file mode 100644 index 0000000000..0a3514323a Binary files /dev/null and b/website/static/img/anatomy-of-unleash-release-template-applied.png differ diff --git a/website/static/img/anatomy-of-unleash-release-template-apply.png b/website/static/img/anatomy-of-unleash-release-template-apply.png new file mode 100644 index 0000000000..c70d1e8aaa Binary files /dev/null and b/website/static/img/anatomy-of-unleash-release-template-apply.png differ diff --git a/website/static/img/anatomy-of-unleash-release-template.png b/website/static/img/anatomy-of-unleash-release-template.png new file mode 100644 index 0000000000..65bd97a790 Binary files /dev/null and b/website/static/img/anatomy-of-unleash-release-template.png differ diff --git a/website/static/img/anatomy-of-unleash-segments.png b/website/static/img/anatomy-of-unleash-segments.png index 5aa6fe68b4..f320169535 100644 Binary files a/website/static/img/anatomy-of-unleash-segments.png and b/website/static/img/anatomy-of-unleash-segments.png differ diff --git a/website/static/img/anatomy-of-unleash-strategy.png b/website/static/img/anatomy-of-unleash-strategy.png index 9f3f094bc5..8a901a2883 100644 Binary files a/website/static/img/anatomy-of-unleash-strategy.png and b/website/static/img/anatomy-of-unleash-strategy.png differ diff --git a/website/static/img/anatomy-of-unleash-variants-environment.png b/website/static/img/anatomy-of-unleash-variants-environment.png index e4f0cc7421..cf8096b8df 100644 Binary files a/website/static/img/anatomy-of-unleash-variants-environment.png and b/website/static/img/anatomy-of-unleash-variants-environment.png differ diff --git a/website/static/img/anatomy-of-unleash-variants.png b/website/static/img/anatomy-of-unleash-variants.png index 6ff7f952ee..eecd9f0d70 100644 Binary files a/website/static/img/anatomy-of-unleash-variants.png and b/website/static/img/anatomy-of-unleash-variants.png differ diff --git a/website/static/img/impact-metrics.png b/website/static/img/impact-metrics.png new file mode 100644 index 0000000000..0b6d30e27e Binary files /dev/null and b/website/static/img/impact-metrics.png differ