diff --git a/src/components/InputList.tsx b/src/components/InputList.tsx index a5e2d6601..b2dcdfe0f 100644 --- a/src/components/InputList.tsx +++ b/src/components/InputList.tsx @@ -16,20 +16,20 @@ export interface InputListProps { labelAndDescription?: (setting: SettingData) => JSX.Element[]; setting: SettingData | CustomListsSetting; disabled: boolean; - value: Array; + value: Array; altValue?: string; additionalData?: any; onSubmit?: any; onEmpty?: string; title?: string; capitalize?: boolean; - onChange?: (value: any) => {}; + onChange?: (value: any) => object; readOnly?: boolean; disableButton?: boolean; } export interface InputListState { - listItems: Array; + listItems: Array; newItem?: string; options?: JSX.Element[]; } @@ -225,7 +225,7 @@ export default class InputList extends React.Component< } } - renderToolTip(item: {} | string, format: string) { + renderToolTip(item: object | string, format: string) { const icons = { geographic: , }; @@ -262,14 +262,13 @@ export default class InputList extends React.Component< } } // Items that have already been selected, and should be eliminated from the menu. - const listItems = this.state - ? this.state.listItems - : this.props.value || this.props.setting.default; + const listItems = + this.state?.listItems || + this.props.value || + this.props.setting.default || + []; // Items that haven't been selected yet. - const remainingOptions = listItems - ? allOptions.filter((o) => listItems.indexOf(o.props.value) < 0) - : []; - return remainingOptions; + return allOptions.filter((o) => !listItems.includes(o.props.value)); } updateNewItem() { @@ -280,7 +279,7 @@ export default class InputList extends React.Component< this.setState({ ...this.state, ...{ newItem: (ref as any).getValue() } }); } - async removeListItem(listItem: string | {}) { + async removeListItem(listItem: string | object) { await this.setState({ listItems: this.state.listItems.filter( (stateListItem) => stateListItem !== listItem diff --git a/src/components/__tests__/InputList-test.tsx b/src/components/__tests__/InputList-test.tsx index 4d61f6fec..1b1168b37 100644 --- a/src/components/__tests__/InputList-test.tsx +++ b/src/components/__tests__/InputList-test.tsx @@ -374,6 +374,24 @@ describe("InputList", () => { ); expect(wrapper.state()["listItems"].includes("Option 1")).to.be.true; }); + it("doesn't lose options when nothing is selected", () => { + const setting = { + ...wrapper.prop("setting"), + ...{ type: "menu", default: null, format: "narrow" }, + }; + wrapper = mount( + , + { context } + ); + const options = wrapper.find("option"); + expect(options.length).to.equal(3); + }); it("optionally eliminates already-selected options from the menu", () => { let options = wrapper.find("option"); expect(options.length).to.equal(3);