diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.tsx
index a522318ac3..32d32317c9 100644
--- a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.tsx
+++ b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureLifecycle/FeatureLifecycleTooltip.tsx
@@ -273,12 +273,12 @@ const LiveStageDescription: FC<{
<>
Is this feature complete?
- Marking the feature as complete does not affect any
- configuration, but it moves the feature into it’s next life
- cycle stage and is an indication that you have learned what you
+ Marking the feature flag as complete does not affect any
+ configuration; however, it moves the feature flag to its next
+ lifecycle stage and indicates that you have learned what you
needed in order to progress with the feature. It serves as a
- reminder to start cleaning up the flag and removing it from the
- code.
+ reminder to start cleaning up the feature flag and removing it
+ from the code.
{
const { markFeatureCompleted } = useFeatureLifecycleApi();
+ const { parentVariantOptions: variantOptions } = useParentVariantOptions(
+ projectId,
+ featureId,
+ );
const [status, setStatus] = useState('kept');
const [variant, setVariant] = useState(undefined);
const onClick = async () => {
@@ -96,18 +101,26 @@ export const MarkCompletedDialogue = ({
}}
control={}
/>
- }
+ 0}
+ show={
+ }
+ />
+ }
/>
0 &&
+ status === 'kept-with-variant'
+ }
show={
{
+ setShowMarkCompletedDialogue({
+ featureId: original.name,
+ open: true,
+ });
+ }}
onUncomplete={refetch}
onArchive={() =>
setFeatureArchiveState(original.name)
diff --git a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/hooks/useRowActions.tsx b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/hooks/useRowActions.tsx
index de10233345..5ba17bf051 100644
--- a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/hooks/useRowActions.tsx
+++ b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/hooks/useRowActions.tsx
@@ -1,6 +1,7 @@
import { useState } from 'react';
import { FeatureArchiveDialog } from 'component/common/FeatureArchiveDialog/FeatureArchiveDialog';
import { FeatureStaleDialog } from 'component/common/FeatureStaleDialog/FeatureStaleDialog';
+import { MarkCompletedDialogue } from 'component/feature/FeatureView/FeatureOverview/FeatureLifecycle/MarkCompletedDialogue';
export const useRowActions = (onChange: () => void, projectId: string) => {
const [featureArchiveState, setFeatureArchiveState] = useState<
@@ -12,6 +13,13 @@ export const useRowActions = (onChange: () => void, projectId: string) => {
stale?: boolean;
}>({});
+ const [showMarkCompletedDialogue, setShowMarkCompletedDialogue] = useState<{
+ featureId: string;
+ open: boolean;
+ }>({
+ featureId: 'default',
+ open: false,
+ });
const rowActionsDialogs = (
<>
void, projectId: string) => {
featureIds={[featureArchiveState || '']}
projectId={projectId}
/>
+ {
+ setShowMarkCompletedDialogue({
+ ...showMarkCompletedDialogue,
+ open,
+ });
+ }}
+ projectId={projectId}
+ featureId={showMarkCompletedDialogue.featureId}
+ onComplete={onChange}
+ />
>
);
@@ -41,5 +61,6 @@ export const useRowActions = (onChange: () => void, projectId: string) => {
rowActionsDialogs,
setFeatureArchiveState,
setFeatureStaleDialogState,
+ setShowMarkCompletedDialogue,
};
};