diff --git a/Client/src/Components/Search/index.css b/Client/src/Components/Search/index.css new file mode 100644 index 000000000..e69de29bb diff --git a/Client/src/Components/Search/index.jsx b/Client/src/Components/Search/index.jsx new file mode 100644 index 000000000..391b95c02 --- /dev/null +++ b/Client/src/Components/Search/index.jsx @@ -0,0 +1,49 @@ +import Autocomplete from '@mui/material/Autocomplete'; +import TextField from '@mui/material/TextField'; +import Chip from '@mui/material/Chip'; +import Box from '@mui/material/Box'; +import { useTheme } from "@mui/material"; + +const teamMembers = [ + { title: 'John Doe'}, + { title: 'Jane Smith'}, + { title: 'Alex Johnson'}, +]; + +/** + * @component + * @returns {JSX.Element} + */ + +export default function Search() + { + const theme = useTheme(); + return ( + {/* Add padding to the container */} + option.title} + filterSelectedOptions + renderInput={(params) => ( + + )} + renderTags={(value, getTagProps) => + value.map((option) => ( + + )) + } + /> + + ); +} diff --git a/Client/src/Pages/Home/index.jsx b/Client/src/Pages/Home/index.jsx index 28d7d6ac4..8742da6f1 100644 --- a/Client/src/Pages/Home/index.jsx +++ b/Client/src/Pages/Home/index.jsx @@ -1,4 +1,5 @@ import DropdownTeamMember from "../../Components/DropdownTeamMember"; +import Search from "../../Components/Search"; import "./index.css"; const Home = () => { @@ -6,6 +7,7 @@ const Home = () => { <>
Home
+ ); };