diff --git a/frontend/src/component/common/DialogFormTemplate/ConfigButtons/ToggleConfigButton.tsx b/frontend/src/component/common/DialogFormTemplate/ConfigButtons/ToggleConfigButton.tsx
new file mode 100644
index 0000000000..8c0f624ef8
--- /dev/null
+++ b/frontend/src/component/common/DialogFormTemplate/ConfigButtons/ToggleConfigButton.tsx
@@ -0,0 +1,51 @@
+import { ButtonLabel, StyledTooltipContent } from './ConfigButton.styles';
+import { TooltipResolver } from 'component/common/TooltipResolver/TooltipResolver';
+import { Button } from '@mui/material';
+import type { ReactNode } from 'react';
+
+type ToggleConfigButtonProps = {
+ onClick: () => void;
+ currentValue: boolean;
+ label: string;
+ icon: ReactNode;
+ labelWidth?: string;
+ tooltip: {
+ header: string;
+ description: string;
+ additionalContent?: ReactNode;
+ };
+};
+
+export function ToggleConfigButton({
+ onClick,
+ currentValue,
+ label,
+ icon,
+ labelWidth,
+ tooltip,
+}: ToggleConfigButtonProps) {
+ return (
+
+ {tooltip.header}
+ {tooltip.description}
+ {tooltip.additionalContent}
+
+ }
+ variant='custom'
+ >
+
+
+ );
+}
diff --git a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureTogglesHeader/CreateFeatureDialog.tsx b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureTogglesHeader/CreateFeatureDialog.tsx
index 65a396f0f0..813d5fe657 100644
--- a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureTogglesHeader/CreateFeatureDialog.tsx
+++ b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureTogglesHeader/CreateFeatureDialog.tsx
@@ -36,6 +36,7 @@ import Label from '@mui/icons-material/Label';
import { ProjectIcon } from 'component/common/ProjectIcon/ProjectIcon';
import { MultiSelectConfigButton } from 'component/common/DialogFormTemplate/ConfigButtons/MultiSelectConfigButton';
import type { ITag } from 'interfaces/tags';
+import { ToggleConfigButton } from 'component/common/DialogFormTemplate/ConfigButtons/ToggleConfigButton';
interface ICreateFeatureDialogProps {
open: boolean;
@@ -335,35 +336,19 @@ export const CreateFeatureDialog = ({
onClose={clearDocumentationOverride}
/>
-
+
+ setImpressionData(!impressionData)
}
- options={[
- { label: 'On', value: true },
- { label: 'Off', value: false },
- ]}
- onChange={(value: boolean) => {
- setImpressionData(value);
- }}
- button={{
- label: `Impression data ${impressionData ? 'on' : 'off'}`,
- icon: ,
- labelWidth: `${'impression data off'.length}ch`,
- }}
- search={{
- label: 'Filter impression data states',
- placeholder: 'Select impression data state',
- }}
- onOpen={() =>
- setDocumentation(
- configButtonData.impressionData,
- )
- }
- onClose={clearDocumentationOverride}
+ label={`Impression data ${impressionData ? 'on' : 'off'}`}
+ icon={}
+ labelWidth={`${'impression data off'.length}ch`}
/>
>
}