Skip to content

Commit 13bb041

Browse files
jameswilddevjameswilddev
committed
Add right icons to selects.
1 parent 27d1266 commit 13bb041

File tree

9 files changed

+422
-101
lines changed

9 files changed

+422
-101
lines changed

‎react-native/components/createCreatableSelectComponent/index.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import * as React from "react";
2+
import type { SvgIcon } from "../../types/SvgIcon";
23
import type { ControlStyle } from "../../types/ControlStyle";
34
import { createFullHeightPopoverComponent } from "../createFullHeightPopoverComponent";
45
import { createCreatableSelectChildrenComponent } from "./createCreatableSelectChildrenComponent";
@@ -8,12 +9,15 @@ import { createCreatableSelectChildrenComponent } from "./createCreatableSelectC
89
* pressing a button.
910
* @template T The value of a listed option.
1011
* @param controlStyle The style to apply to the component.
12+
* @param rightIcon When null, no icon is to be placed on the right side of
13+
* the button. Otherwise, the icon to show there.
1114
* @returns The created React component.
1215
*/
1316
export function createCreatableSelectComponent<
1417
T extends null | number | string
1518
>(
16-
controlStyle: ControlStyle
19+
controlStyle: ControlStyle,
20+
rightIcon: null | SvgIcon
1721
): React.FunctionComponent<{
1822
/**
1923
* When true, it will not be possible to select an option. It will otherwise
@@ -75,7 +79,10 @@ export function createCreatableSelectComponent<
7579
*/
7680
readonly willCreateText: string;
7781
}> {
78-
const FullHeightPopover = createFullHeightPopoverComponent(controlStyle);
82+
const FullHeightPopover = createFullHeightPopoverComponent(
83+
controlStyle,
84+
rightIcon
85+
);
7986
const ContentComponent =
8087
createCreatableSelectChildrenComponent<T>(controlStyle);
8188

‎react-native/components/createCreatableSelectComponent/unit.tsx

Lines changed: 84 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,11 @@ const controlStyle: ControlStyle = {
8181
};
8282

8383
test(`renders as expected with an absent selected value`, () => {
84-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
84+
const RightIcon = jest.fn();
85+
const Component = createCreatableSelectComponent<TestValue>(
86+
controlStyle,
87+
RightIcon
88+
);
8589
const onChange = jest.fn();
8690
const onCreate = jest.fn();
8791

@@ -119,7 +123,7 @@ test(`renders as expected with an absent selected value`, () => {
119123
});
120124

121125
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
122-
fullHeightPopover: { controlStyle },
126+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
123127
});
124128

125129
const close = jest.fn();
@@ -153,10 +157,15 @@ test(`renders as expected with an absent selected value`, () => {
153157
expect(close).not.toHaveBeenCalled();
154158
expect(onChange).not.toHaveBeenCalled();
155159
expect(onCreate).not.toHaveBeenCalled();
160+
expect(RightIcon).not.toHaveBeenCalled();
156161
});
157162

158163
test(`renders as expected with a present selected value`, () => {
159-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
164+
const RightIcon = jest.fn();
165+
const Component = createCreatableSelectComponent<TestValue>(
166+
controlStyle,
167+
RightIcon
168+
);
160169
const onChange = jest.fn();
161170
const onCreate = jest.fn();
162171

@@ -198,7 +207,7 @@ test(`renders as expected with a present selected value`, () => {
198207
});
199208

200209
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
201-
fullHeightPopover: { controlStyle },
210+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
202211
});
203212

204213
const close = jest.fn();
@@ -239,10 +248,15 @@ test(`renders as expected with a present selected value`, () => {
239248
expect(close).not.toHaveBeenCalled();
240249
expect(onChange).not.toHaveBeenCalled();
241250
expect(onCreate).not.toHaveBeenCalled();
251+
expect(RightIcon).not.toHaveBeenCalled();
242252
});
243253

244254
test(`renders as expected when required with an absent selected value`, () => {
245-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
255+
const RightIcon = jest.fn();
256+
const Component = createCreatableSelectComponent<TestValue>(
257+
controlStyle,
258+
RightIcon
259+
);
246260
const onChange = jest.fn();
247261
const onCreate = jest.fn();
248262

@@ -280,7 +294,7 @@ test(`renders as expected when required with an absent selected value`, () => {
280294
});
281295

282296
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
283-
fullHeightPopover: { controlStyle },
297+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
284298
});
285299

286300
const close = jest.fn();
@@ -314,10 +328,15 @@ test(`renders as expected when required with an absent selected value`, () => {
314328
expect(close).not.toHaveBeenCalled();
315329
expect(onChange).not.toHaveBeenCalled();
316330
expect(onCreate).not.toHaveBeenCalled();
331+
expect(RightIcon).not.toHaveBeenCalled();
317332
});
318333

319334
test(`renders as expected when required with a present selected value`, () => {
320-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
335+
const RightIcon = jest.fn();
336+
const Component = createCreatableSelectComponent<TestValue>(
337+
controlStyle,
338+
RightIcon
339+
);
321340
const onChange = jest.fn();
322341
const onCreate = jest.fn();
323342

@@ -359,7 +378,7 @@ test(`renders as expected when required with a present selected value`, () => {
359378
});
360379

361380
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
362-
fullHeightPopover: { controlStyle },
381+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
363382
});
364383

365384
const close = jest.fn();
@@ -400,10 +419,15 @@ test(`renders as expected when required with a present selected value`, () => {
400419
expect(close).not.toHaveBeenCalled();
401420
expect(onChange).not.toHaveBeenCalled();
402421
expect(onCreate).not.toHaveBeenCalled();
422+
expect(RightIcon).not.toHaveBeenCalled();
403423
});
404424

405425
test(`renders as expected when disabled with an absent selected value`, () => {
406-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
426+
const RightIcon = jest.fn();
427+
const Component = createCreatableSelectComponent<TestValue>(
428+
controlStyle,
429+
RightIcon
430+
);
407431
const onChange = jest.fn();
408432
const onCreate = jest.fn();
409433

@@ -441,7 +465,7 @@ test(`renders as expected when disabled with an absent selected value`, () => {
441465
});
442466

443467
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
444-
fullHeightPopover: { controlStyle },
468+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
445469
});
446470

447471
const close = jest.fn();
@@ -475,10 +499,15 @@ test(`renders as expected when disabled with an absent selected value`, () => {
475499
expect(close).not.toHaveBeenCalled();
476500
expect(onChange).not.toHaveBeenCalled();
477501
expect(onCreate).not.toHaveBeenCalled();
502+
expect(RightIcon).not.toHaveBeenCalled();
478503
});
479504

480505
test(`renders as expected when disabled with a present selected value`, () => {
481-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
506+
const RightIcon = jest.fn();
507+
const Component = createCreatableSelectComponent<TestValue>(
508+
controlStyle,
509+
RightIcon
510+
);
482511
const onChange = jest.fn();
483512
const onCreate = jest.fn();
484513

@@ -520,7 +549,7 @@ test(`renders as expected when disabled with a present selected value`, () => {
520549
});
521550

522551
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
523-
fullHeightPopover: { controlStyle },
552+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
524553
});
525554

526555
const close = jest.fn();
@@ -561,10 +590,15 @@ test(`renders as expected when disabled with a present selected value`, () => {
561590
expect(close).not.toHaveBeenCalled();
562591
expect(onChange).not.toHaveBeenCalled();
563592
expect(onCreate).not.toHaveBeenCalled();
593+
expect(RightIcon).not.toHaveBeenCalled();
564594
});
565595

566596
test(`renders as expected when required and disabled with an absent selected value`, () => {
567-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
597+
const RightIcon = jest.fn();
598+
const Component = createCreatableSelectComponent<TestValue>(
599+
controlStyle,
600+
RightIcon
601+
);
568602
const onChange = jest.fn();
569603
const onCreate = jest.fn();
570604

@@ -602,7 +636,7 @@ test(`renders as expected when required and disabled with an absent selected val
602636
});
603637

604638
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
605-
fullHeightPopover: { controlStyle },
639+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
606640
});
607641

608642
const close = jest.fn();
@@ -636,10 +670,15 @@ test(`renders as expected when required and disabled with an absent selected val
636670
expect(close).not.toHaveBeenCalled();
637671
expect(onChange).not.toHaveBeenCalled();
638672
expect(onCreate).not.toHaveBeenCalled();
673+
expect(RightIcon).not.toHaveBeenCalled();
639674
});
640675

641676
test(`renders as expected when required and disabled with a present selected value`, () => {
642-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
677+
const RightIcon = jest.fn();
678+
const Component = createCreatableSelectComponent<TestValue>(
679+
controlStyle,
680+
RightIcon
681+
);
643682
const onChange = jest.fn();
644683
const onCreate = jest.fn();
645684

@@ -681,7 +720,7 @@ test(`renders as expected when required and disabled with a present selected val
681720
});
682721

683722
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
684-
fullHeightPopover: { controlStyle },
723+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
685724
});
686725

687726
const close = jest.fn();
@@ -722,10 +761,15 @@ test(`renders as expected when required and disabled with a present selected val
722761
expect(close).not.toHaveBeenCalled();
723762
expect(onChange).not.toHaveBeenCalled();
724763
expect(onCreate).not.toHaveBeenCalled();
764+
expect(RightIcon).not.toHaveBeenCalled();
725765
});
726766

727767
test(`renders as expected without any options`, () => {
728-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
768+
const RightIcon = jest.fn();
769+
const Component = createCreatableSelectComponent<TestValue>(
770+
controlStyle,
771+
RightIcon
772+
);
729773
const onChange = jest.fn();
730774
const onCreate = jest.fn();
731775

@@ -754,7 +798,7 @@ test(`renders as expected without any options`, () => {
754798
});
755799

756800
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
757-
fullHeightPopover: { controlStyle },
801+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
758802
});
759803

760804
const close = jest.fn();
@@ -779,10 +823,15 @@ test(`renders as expected without any options`, () => {
779823
expect(close).not.toHaveBeenCalled();
780824
expect(onChange).not.toHaveBeenCalled();
781825
expect(onCreate).not.toHaveBeenCalled();
826+
expect(RightIcon).not.toHaveBeenCalled();
782827
});
783828

784829
test(`renders as expected when required without any options`, () => {
785-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
830+
const RightIcon = jest.fn();
831+
const Component = createCreatableSelectComponent<TestValue>(
832+
controlStyle,
833+
RightIcon
834+
);
786835
const onChange = jest.fn();
787836
const onCreate = jest.fn();
788837

@@ -811,7 +860,7 @@ test(`renders as expected when required without any options`, () => {
811860
});
812861

813862
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
814-
fullHeightPopover: { controlStyle },
863+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
815864
});
816865

817866
const close = jest.fn();
@@ -836,10 +885,15 @@ test(`renders as expected when required without any options`, () => {
836885
expect(close).not.toHaveBeenCalled();
837886
expect(onChange).not.toHaveBeenCalled();
838887
expect(onCreate).not.toHaveBeenCalled();
888+
expect(RightIcon).not.toHaveBeenCalled();
839889
});
840890

841891
test(`renders as expected when disabled without any options`, () => {
842-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
892+
const RightIcon = jest.fn();
893+
const Component = createCreatableSelectComponent<TestValue>(
894+
controlStyle,
895+
RightIcon
896+
);
843897
const onChange = jest.fn();
844898
const onCreate = jest.fn();
845899

@@ -868,7 +922,7 @@ test(`renders as expected when disabled without any options`, () => {
868922
});
869923

870924
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
871-
fullHeightPopover: { controlStyle },
925+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
872926
});
873927

874928
const close = jest.fn();
@@ -893,10 +947,15 @@ test(`renders as expected when disabled without any options`, () => {
893947
expect(close).not.toHaveBeenCalled();
894948
expect(onChange).not.toHaveBeenCalled();
895949
expect(onCreate).not.toHaveBeenCalled();
950+
expect(RightIcon).not.toHaveBeenCalled();
896951
});
897952

898953
test(`renders as expected when required and disabled without any options`, () => {
899-
const Component = createCreatableSelectComponent<TestValue>(controlStyle);
954+
const RightIcon = jest.fn();
955+
const Component = createCreatableSelectComponent<TestValue>(
956+
controlStyle,
957+
RightIcon
958+
);
900959
const onChange = jest.fn();
901960
const onCreate = jest.fn();
902961

@@ -925,7 +984,7 @@ test(`renders as expected when required and disabled without any options`, () =>
925984
});
926985

927986
expect(rendered.type).toBeAFunctionWithTheStaticProperties({
928-
fullHeightPopover: { controlStyle },
987+
fullHeightPopover: { controlStyle, rightIcon: RightIcon },
929988
});
930989

931990
const close = jest.fn();
@@ -950,4 +1009,5 @@ test(`renders as expected when required and disabled without any options`, () =>
9501009
expect(close).not.toHaveBeenCalled();
9511010
expect(onChange).not.toHaveBeenCalled();
9521011
expect(onCreate).not.toHaveBeenCalled();
1012+
expect(RightIcon).not.toHaveBeenCalled();
9531013
});

0 commit comments

Comments
 (0)