From 8f5b5a853d7dfe155a5db3f102183dd32db89254 Mon Sep 17 00:00:00 2001
From: klotske <ilya@mokhov.vg>
Date: Fri, 13 Jan 2023 22:35:23 +0300
Subject: [PATCH] Add interactionFlag to hide default choice

---
 website/src/components/Survey/LabelRadioGroup.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/website/src/components/Survey/LabelRadioGroup.tsx b/website/src/components/Survey/LabelRadioGroup.tsx
index 9cae671a..918976ed 100644
--- a/website/src/components/Survey/LabelRadioGroup.tsx
+++ b/website/src/components/Survey/LabelRadioGroup.tsx
@@ -10,6 +10,7 @@ interface LabelRadioGroupProps {
 
 export const LabelRadioGroup = (props: LabelRadioGroupProps) => {
   const [labelValues, setLabelValues] = useState<number[]>(Array.from({ length: props.labelIDs.length }).map(() => 0));
+  const [interactionFlag, setInteractionFlag] = useState(false);
 
   return (
     <Flex direction="column" justify="center">
@@ -23,12 +24,14 @@ export const LabelRadioGroup = (props: LabelRadioGroupProps) => {
             newState[idx] = newValue;
             props.onChange(labelValues);
             setLabelValues(newState);
+            if (!interactionFlag) setInteractionFlag(true);
           }}
           states={[
             { text: "No", value: 0 },
             { text: "Yes", value: 1 },
           ]}
           isDisabled={props.isDisabled}
+          interactionFlag={interactionFlag}
         />
       ))}
     </Flex>
@@ -47,6 +50,7 @@ interface LabelRadioItemProps {
   clickHandler: (newVal: number) => unknown;
   states: ButtonState[];
   isDisabled: boolean;
+  interactionFlag: boolean;
 }
 
 const LabelRadioItem = (props: LabelRadioItemProps) => {
@@ -64,7 +68,7 @@ const LabelRadioItem = (props: LabelRadioItemProps) => {
       <Flex direction="row" gap={6} justify="center">
         {props.states.map((item, idx) => (
           <Button
-            colorScheme={item.value === props.labelValue ? item.colorScheme || "blue" : "gray"}
+            colorScheme={item.value === props.labelValue && props.interactionFlag ? item.colorScheme || "blue" : "gray"}
             isDisabled={props.isDisabled}
             size="lg"
             key={idx}