fix: radio group widget options (#7313)

* Update RadioGroupComponent.tsx

* fix: radio widget validation

* fix: add test for default param

app/client/src/widgets/RadioGroupWidget/widget/index.tsx

@@ -6,6 +6,7 @@ import { EventType } from "constants/AppsmithActionConstants/ActionConstants";
 import { RadioOption } from "../constants";
 import { ValidationTypes } from "constants/WidgetValidation";
 import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
+import { isArray } from "lodash";
 
 class RadioGroupWidget extends BaseWidget<RadioGroupWidgetProps, WidgetState> {
   static getPropertyPaneConfig() {
@@ -26,6 +27,7 @@ class RadioGroupWidget extends BaseWidget<RadioGroupWidgetProps, WidgetState> {
               type: ValidationTypes.ARRAY,
               unique: ["value"],
               params: {
+                default: [],
                 children: {
                   type: ValidationTypes.OBJECT,
                   params: {
@@ -143,7 +145,7 @@ class RadioGroupWidget extends BaseWidget<RadioGroupWidgetProps, WidgetState> {
         key={this.props.widgetId}
         label={`${this.props.label}`}
         onRadioSelectionChange={this.onRadioSelectionChange}
-        options={this.props.options || []}
+        options={isArray(this.props.options) ? this.props.options : []}
         selectedOptionValue={this.props.selectedOptionValue}
         widgetId={this.props.widgetId}
       />
@@ -167,7 +169,7 @@ class RadioGroupWidget extends BaseWidget<RadioGroupWidgetProps, WidgetState> {
 
 export interface RadioGroupWidgetProps extends WidgetProps {
   label: string;
-  options?: RadioOption[];
+  options: RadioOption[];
   selectedOptionValue: string;
   onSelectionChange: string;
   defaultOptionValue: string;

app/client/src/workers/validations.test.ts

@@ -373,6 +373,7 @@ describe("Validate Validators", () => {
       '{ "key": "value" }',
       ["a", "b", "a", "c"],
       "",
+      "[]",
     ];
     const config = {
       type: ValidationTypes.ARRAY,
@@ -455,6 +456,11 @@ describe("Validate Validators", () => {
         message:
           "This property is required for the widget to function correctly",
       },
+      {
+        isValid: true,
+        parsed: [],
+        message: "",
+      },
     ];
     inputs.forEach((input, index) => {
       const result = validate(config, input, DUMMY_WIDGET);
@@ -855,6 +861,25 @@ describe("Validate Validators", () => {
       expect(result).toStrictEqual(expected[index]);
     });
   });
+  it("correctly validates array when default is given", () => {
+    const inputs = [undefined, null, ""];
+    const config = {
+      type: ValidationTypes.ARRAY,
+      params: {
+        required: true,
+        unique: true,
+        default: [],
+      },
+    };
+    const expected = {
+      isValid: true,
+      parsed: [],
+    };
+    inputs.forEach((input) => {
+      const result = validate(config, input, DUMMY_WIDGET);
+      expect(result).toStrictEqual(expected);
+    });
+  });
 });
 
 // describe("Color Picker Text validator", () => {

app/client/src/workers/validations.ts

@@ -549,18 +549,27 @@ export const VALIDATORS: Record<ValidationTypes, Validator> = {
       message: `${WIDGET_TYPE_VALIDATION_ERROR} ${getExpectedType(config)}`,
     };
     if (value === undefined || value === null || value === "") {
-      if (config.params && config.params.required) {
+      if (
+        config.params &&
+        config.params.required &&
+        !isArray(config.params.default)
+      ) {
         invalidResponse.message =
           "This property is required for the widget to function correctly";
         return invalidResponse;
       }
-
       if (value === "") {
         return {
           isValid: true,
           parsed: config.params?.default || [],
         };
       }
+      if (config.params && isArray(config.params.default)) {
+        return {
+          isValid: true,
+          parsed: config.params?.default,
+        };
+      }
 
       return {
         isValid: true,