From c6ff06838a768585a20fa037b5eb603506d7f3f2 Mon Sep 17 00:00:00 2001
From: nick-delirium <nikita@openreplay.com>
Date: Fri, 7 Jul 2023 16:44:23 +0200
Subject: [PATCH] fix(ui): fix payload for single variant fflag

---
 frontend/app/components/FFlags/NewFFlag/NewFFlag.tsx | 5 +++++
 frontend/app/mstore/types/FeatureFlag.ts             | 2 ++
 2 files changed, 7 insertions(+)

diff --git a/frontend/app/components/FFlags/NewFFlag/NewFFlag.tsx b/frontend/app/components/FFlags/NewFFlag/NewFFlag.tsx
index 4524c591b..823379f56 100644
--- a/frontend/app/components/FFlags/NewFFlag/NewFFlag.tsx
+++ b/frontend/app/components/FFlags/NewFFlag/NewFFlag.tsx
@@ -149,8 +149,13 @@ function NewFFlag({ siteId, fflagId }: { siteId: string; fflagId?: string }) {
               <div className={'mt-6'}>
                 <Payload />
                 <Input
+                  value={current.payload ?? ''}
+                  onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+                    current.setPayload(e.target.value);
+                  }}
                   placeholder={"E.g. red button, {'buttonColor': 'red'}"}
                   className={'mt-2'}
+
                 />
               </div>
             </>
diff --git a/frontend/app/mstore/types/FeatureFlag.ts b/frontend/app/mstore/types/FeatureFlag.ts
index 90293cc4b..eb0438d56 100644
--- a/frontend/app/mstore/types/FeatureFlag.ts
+++ b/frontend/app/mstore/types/FeatureFlag.ts
@@ -104,6 +104,7 @@ export default class FeatureFlag {
       initData,
       {
         ...data,
+        payload: data?.payload === null ? '' : data?.payload,
         isSingleOption: data ? data.flagType === 'single' : true,
         conditions: data?.conditions?.map(c => new Conditions(c)) || [new Conditions()],
         variants: data?.flagType === 'multi' ? data?.variants?.map((v, i) => new Variant(i, v)) : [],
@@ -154,6 +155,7 @@ export default class FeatureFlag {
       updatedAt: this.updatedAt,
       isActive: this.isActive,
       description: this.description,
+      payload: this.payload,
       isPersist: this.isPersist,
       flagType: this.isSingleOption ? 'single' as const : 'multi' as const,
       featureFlagId: this.featureFlagId,