Files
react-quiz-app/src/components/SelectCategory.tsx
T

32 lines
826 B
TypeScript

import React from 'react';
import { SelectWrapper } from '../App.style';
import { Category } from '../Types';
type Props = {
categoryID: number;
categoryList: Array<Category>;
setCategoryID: (categoryID: number) => void;
};
const SelectCategory = ({ categoryID, categoryList, setCategoryID }: Props) => {
return (
<SelectWrapper
value={categoryID}
onChange={(e: React.ChangeEvent<{ value: unknown }>) => {
e.preventDefault();
setCategoryID(e.target.value as number);
}}
>
<option value={1}>Random Category</option>
{categoryList.map((category) => (
<option value={category.id} key={category.id}>
{category.name.replace(/Entertainment: |Science: /g, '')}
</option>
))}
</SelectWrapper>
);
};
export default SelectCategory;