diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycle.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycle.tsx index 2bdf1164a6..995b468bcd 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycle.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycle.tsx @@ -4,6 +4,7 @@ import useFeatureLifecycleApi from 'hooks/api/actions/useFeatureLifecycleApi/use import { populateCurrentStage } from './populateCurrentStage'; import type { FC } from 'react'; import type { Lifecycle } from 'interfaces/featureToggle'; +import { usePlausibleTracker } from 'hooks/usePlausibleTracker'; export interface LifecycleFeature { lifecycle?: Lifecycle; @@ -27,9 +28,16 @@ export const FeatureLifecycle: FC<{ const { markFeatureUncompleted, loading } = useFeatureLifecycleApi(); + const { trackEvent } = usePlausibleTracker(); + const onUncompleteHandler = async () => { await markFeatureUncompleted(feature.name, feature.project); onUncomplete(); + trackEvent('feature-lifecycle', { + props: { + eventType: 'uncomplete', + }, + }); }; return currentStage ? ( diff --git a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/hooks/useDefaultColumnVisibility.ts b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/hooks/useDefaultColumnVisibility.ts index 0d28f5eecf..afea38fbd7 100644 --- a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/hooks/useDefaultColumnVisibility.ts +++ b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/hooks/useDefaultColumnVisibility.ts @@ -1,6 +1,7 @@ import { useCallback } from 'react'; import { useMediaQuery, useTheme } from '@mui/material'; import type { VisibilityState } from '@tanstack/react-table'; +import { useUiFlag } from 'hooks/useUiFlag'; const staticColumns = ['select', 'actions', 'name', 'favorite']; @@ -21,6 +22,7 @@ export const useDefaultColumnVisibility = (allColumnIds: string[]) => { const isTinyScreen = useMediaQuery(theme.breakpoints.down('sm')); const isSmallScreen = useMediaQuery(theme.breakpoints.down('md')); const isMediumScreen = useMediaQuery(theme.breakpoints.down('lg')); + const featureLifecycleEnabled = useUiFlag('featureLifecycle'); const showEnvironments = useCallback( (environmentsToShow: number = 0) => @@ -53,6 +55,7 @@ export const useDefaultColumnVisibility = (allColumnIds: string[]) => { return formatAsColumnVisibility(allColumnIds, [ ...staticColumns, 'lastSeenAt', + ...(featureLifecycleEnabled ? ['lifecycle'] : []), 'createdAt', 'type', 'tags', diff --git a/website/docs/reference/feature-lifecycle.md b/website/docs/reference/feature-lifecycle.md index 2f5f6d4cee..69afeb0656 100644 --- a/website/docs/reference/feature-lifecycle.md +++ b/website/docs/reference/feature-lifecycle.md @@ -4,14 +4,15 @@ title: Feature Lifecycle :::info Availability -Feature lifecycle was introduced in Unleash 6.1.0 +Feature lifecycle is currently in beta ::: ![Feature Lifecycle example](/img/feature-lifecycle.png 'Feature Lifecycle example') -Feature Lifecycle facilitates tracking the progression of features through various stages in their development and operational phases. -This systematic approach helps in identifying potential bottlenecks and improving the overall efficiency of the software development process. +In Unleash, the feature lifecycle encompasses a holistic view of how mature your feature is based on data collected through metrics and interactions with the Unleash system. +As such, the lifecycle mirrors your software development process and allows you to identify bottlenecks at any stage of the lifecycle. +These findings may give you insights or clues to improve the efficiency of your software development process. Read more about how Unleash progresses a feature through the lifecycle below. ## Lifecycle stages