Create SelectInput Component

[seesjays]

Create a dropdown \<select> component in a file /components/selectInput.tsx that matches the design we have. You don't have to change how the actual "dropdown" part with all the options appears, that's handled by the browser.

Ignore the text on the side, that's just for example purposes and doesn't have to be included in the component. We ill work out labelling later.

Here's what the typing should be. You can put the type in the same file you put the component in and it can be moved to the types.ts file later.

// 2 string tuple for each <option> in a select
type selectOption = [string, string];
// the first string is passed into the value={str} prop for the <option>
// the second string is what text the option displays.
// i.e. between the angle brackets

type selectProps = {
  name: string;
  options: dropDownOption[];
  value: string;
  onChange: (event: React.ChangeEvent<HTMLSelectElement>) => void;
};

Relevant docs page