renamed dropdown -> choice

src/Explorer/Controls/FeaturePanel/__snapshots__/FeaturePanelComponent.test.tsx.snap

@@ -157,8 +157,8 @@ exports[`Feature panel renders all flags 1`] = `
         />
         <StyledCheckboxBase
           checked={false}
-          key="feature.selfServeTypeForTest"
-          label="Self serve type passed on for testing"
+          key="feature.selfServeType"
+          label="Self serve feature"
           onChange={[Function]}
         />
         <StyledCheckboxBase

src/Explorer/Controls/SmartUi/SmartUiComponent.tsx

@@ -28,13 +28,13 @@ export enum UiType {
 
 type numberPromise = () => Promise<number>;
 type stringPromise = () => Promise<string>;
-type dropdownItemPromise = () => Promise<DropdownItem[]>;
+type choiceItemPromise = () => Promise<ChoiceItem[]>;
 type infoPromise = () => Promise<Info>;
 
 /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
-export type DropdownItem = { label: string; key: string };
+export type ChoiceItem = { label: string; key: string };
 
-export type InputType = number | string | boolean | DropdownItem;
+export type InputType = number | string | boolean | ChoiceItem;
 
 export interface BaseInput {
   label: (() => Promise<string>) | string;
@@ -66,8 +66,8 @@ export interface StringInput extends BaseInput {
   defaultValue?: string;
 }
 
-export interface DropdownInput extends BaseInput {
-  choices: (() => Promise<DropdownItem[]>) | DropdownItem[];
+export interface ChoiceInput extends BaseInput {
+  choices: (() => Promise<ChoiceItem[]>) | ChoiceItem[];
   defaultKey?: string;
 }
 
@@ -79,7 +79,7 @@ export interface Info {
   };
 }
 
-export type AnyInput = NumberInput | BooleanInput | StringInput | DropdownInput;
+export type AnyInput = NumberInput | BooleanInput | StringInput | ChoiceInput;
 
 export interface Node {
   id: string;
@@ -214,9 +214,9 @@ export class SmartUiComponent extends React.Component<SmartUiComponentProps, Sma
         return booleanInput;
       }
       default: {
-        const enumInput = input as DropdownInput;
+        const enumInput = input as ChoiceInput;
         if (enumInput.choices instanceof Function) {
-          enumInput.choices = await (enumInput.choices as dropdownItemPromise)();
+          enumInput.choices = await (enumInput.choices as choiceItemPromise)();
         }
         return enumInput;
       }
@@ -332,7 +332,7 @@ export class SmartUiComponent extends React.Component<SmartUiComponentProps, Sma
     const value = this.state.currentValues.get(dataFieldName) as number;
     if (input.uiType === UiType.Spinner) {
       return (
-        <div>
+        <>
           <SpinButton
             {...props}
             value={value?.toString()}
@@ -350,7 +350,7 @@ export class SmartUiComponent extends React.Component<SmartUiComponentProps, Sma
           {this.state.errors.has(dataFieldName) && (
             <MessageBar messageBarType={MessageBarType.error}>Error: {this.state.errors.get(dataFieldName)}</MessageBar>
           )}
-        </div>
+        </>
       );
     } else if (input.uiType === UiType.Slider) {
       return (
@@ -406,7 +406,7 @@ export class SmartUiComponent extends React.Component<SmartUiComponentProps, Sma
     );
   }
 
-  private renderDropdownInput(input: DropdownInput): JSX.Element {
+  private renderChoiceInput(input: ChoiceInput): JSX.Element {
     const { label, defaultKey: defaultKey, dataFieldName, choices, placeholder } = input;
     return (
       <Dropdown
@@ -418,7 +418,7 @@ export class SmartUiComponent extends React.Component<SmartUiComponentProps, Sma
         }
         onChange={(_, item: IDropdownOption) => this.onInputChange(input, item.key.toString())}
         placeholder={placeholder as string}
-        options={(choices as DropdownItem[]).map(c => ({
+        options={(choices as ChoiceItem[]).map(c => ({
           key: c.key,
           text: c.label
         }))}
@@ -449,7 +449,7 @@ export class SmartUiComponent extends React.Component<SmartUiComponentProps, Sma
       case "boolean":
         return this.renderBooleanInput(input as BooleanInput);
       case "object":
-        return this.renderDropdownInput(input as DropdownInput);
+        return this.renderChoiceInput(input as ChoiceInput);
       default:
         throw new Error(`Unknown input type: ${input.type}`);
     }

src/SelfServe/Example/SelfServeExample.tsx

@@ -1,7 +1,7 @@
 import { PropertyInfo, OnChange, Values } from "../PropertyDecorators";
 import { ClassInfo, IsDisplayable } from "../ClassDecorators";
 import { SelfServeBaseClass } from "../SelfServeUtils";
-import { DropdownItem, Info, InputType, UiType } from "../../Explorer/Controls/SmartUi/SmartUiComponent";
+import { ChoiceItem, Info, InputType, UiType } from "../../Explorer/Controls/SmartUi/SmartUiComponent";
 import { SessionStorageUtility } from "../../Shared/StorageUtility";
 
 export enum Regions {
@@ -10,7 +10,7 @@ export enum Regions {
   EastUS2 = "EUS2"
 }
 
-export const regionDropdownItems: DropdownItem[] = [
+export const regionDropdownItems: ChoiceItem[] = [
   { label: "North Central US", key: Regions.NorthCentralUS },
   { label: "West US", key: Regions.WestUS },
   { label: "East US 2", key: Regions.EastUS2 }
@@ -123,11 +123,11 @@ export default class SelfServeExample extends SelfServeBaseClass {
 
   /*
   @Values() :
-    - input: NumberInputOptions | StringInputOptions | BooleanInputOptions | DropdownInputOptions
+    - input: NumberInputOptions | StringInputOptions | BooleanInputOptions | ChoiceInputOptions
     - role: Specifies the required options to display the property as TextBox, Number Spinner/Slider, Radio buton or Dropdown.
   */
   @Values({ label: "Regions", choices: regionDropdownItems })
-  regions: DropdownItem;
+  regions: ChoiceItem;
 
   @Values({
     label: "Enable Logging",

src/SelfServe/PropertyDecorators.tsx

@@ -1,4 +1,4 @@
-import { DropdownItem, Info, InputType, UiType } from "../Explorer/Controls/SmartUi/SmartUiComponent";
+import { ChoiceItem, Info, InputType, UiType } from "../Explorer/Controls/SmartUi/SmartUiComponent";
 import { addPropertyToMap } from "./SelfServeUtils";
 
 interface Decorator {
@@ -27,11 +27,11 @@ export interface BooleanInputOptions extends InputOptionsBase {
   falseLabel: (() => Promise<string>) | string;
 }
 
-export interface DropdownInputOptions extends InputOptionsBase {
-  choices: (() => Promise<DropdownItem[]>) | DropdownItem[];
+export interface ChoiceInputOptions extends InputOptionsBase {
+  choices: (() => Promise<ChoiceItem[]>) | ChoiceItem[];
 }
 
-type InputOptions = NumberInputOptions | StringInputOptions | BooleanInputOptions | DropdownInputOptions;
+type InputOptions = NumberInputOptions | StringInputOptions | BooleanInputOptions | ChoiceInputOptions;
 
 function isNumberInputOptions(inputOptions: InputOptions): inputOptions is NumberInputOptions {
   return !!(inputOptions as NumberInputOptions).min;
@@ -41,8 +41,8 @@ function isBooleanInputOptions(inputOptions: InputOptions): inputOptions is Bool
   return !!(inputOptions as BooleanInputOptions).trueLabel;
 }
 
-function isDropdownInputOptions(inputOptions: InputOptions): inputOptions is DropdownInputOptions {
-  return !!(inputOptions as DropdownInputOptions).choices;
+function isChoiceInputOptions(inputOptions: InputOptions): inputOptions is ChoiceInputOptions {
+  return !!(inputOptions as ChoiceInputOptions).choices;
 }
 
 const addToMap = (...decorators: Decorator[]): PropertyDecorator => {
@@ -92,11 +92,11 @@ export const Values = (inputOptions: InputOptions): PropertyDecorator => {
       { name: "trueLabel", value: booleanInputOptions.trueLabel },
       { name: "falseLabel", value: booleanInputOptions.falseLabel }
     );
-  } else if (isDropdownInputOptions(inputOptions)) {
-    const dropdownInputOptions = inputOptions as DropdownInputOptions;
+  } else if (isChoiceInputOptions(inputOptions)) {
+    const choiceInputOptions = inputOptions as ChoiceInputOptions;
     return addToMap(
-      { name: "label", value: dropdownInputOptions.label },
-      { name: "choices", value: dropdownInputOptions.choices }
+      { name: "label", value: choiceInputOptions.label },
+      { name: "choices", value: choiceInputOptions.choices }
     );
   } else {
     const stringInputOptions = inputOptions as StringInputOptions;

src/SelfServe/SelfServeUtils.test.tsx

@@ -252,7 +252,7 @@ describe("SelfServeUtils", () => {
               type: "object",
               label: "Invalid Regions",
               placeholder: "placeholder text",
-              errorMessage: "label and choices are required for Dropdown input 'invalidRegions'."
+              errorMessage: "label and choices are required for Choice input 'invalidRegions'."
             },
             children: [] as Node[]
           }

src/SelfServe/SelfServeUtils.tsx

@@ -1,6 +1,6 @@
 import "reflect-metadata";
 import {
-  DropdownItem,
+  ChoiceItem,
   Node,
   Info,
   InputTypeValue,
@@ -9,7 +9,7 @@ import {
   NumberInput,
   StringInput,
   BooleanInput,
-  DropdownInput,
+  ChoiceInput,
   InputType
 } from "../Explorer/Controls/SmartUi/SmartUiComponent";
 
@@ -58,7 +58,7 @@ export interface CommonInputTypes {
   step?: (() => Promise<number>) | number;
   trueLabel?: (() => Promise<string>) | string;
   falseLabel?: (() => Promise<string>) | string;
-  choices?: (() => Promise<DropdownItem[]>) | DropdownItem[];
+  choices?: (() => Promise<ChoiceItem[]>) | ChoiceItem[];
   uiType?: string;
   errorMessage?: string;
   onChange?: (currentState: Map<string, InputType>, newValue: InputType) => Map<string, InputType>;
@@ -187,8 +187,8 @@ const getInput = (value: CommonInputTypes): AnyInput => {
       return value as BooleanInput;
     default:
       if (!value.label || !value.choices) {
-        value.errorMessage = `label and choices are required for Dropdown input '${value.id}'.`;
+        value.errorMessage = `label and choices are required for Choice input '${value.id}'.`;
       }
-      return value as DropdownInput;
+      return value as ChoiceInput;
   }
 };