Feature/issue 75 develop a page for creating new product tour items

frontend/package.json

@@ -9,6 +9,7 @@
     "@mui/icons-material": "^5.15.19",
     "@mui/lab": "^5.0.0-alpha.170",
     "@mui/material": "^5.15.18",
+    "@mui/system": "^5.15.20",
     "@mui/x-data-grid": "^7.3.0",
     "@mui/x-date-pickers": "^7.3.1",
     "@mui/x-date-pickers-pro": "^7.3.1",

frontend/src/assets/theme.js

@@ -5,25 +5,24 @@ const theme = createTheme({
     MuiAppBar: {
       styleOverrides: {
         root: {
-          backgroundColor: 'white',
-          color: '#344054',
+          backgroundColor: "white",
+          color: "#344054",
         },
       },
     },
     MuiDrawer: {
       styleOverrides: {
         paper: {
-          width: '250px',
+          width: "250px",
           flexShrink: 0,
           zIndex: 1200,
         },
       },
     },
   },
   typography: {
-    fontFamily: 'Inter',
+    fontFamily: "Inter",
   },
-
 });
 
 export default theme;

frontend/src/components/ContentArea/ContentArea.jsx

@@ -7,7 +7,7 @@ const ContentArea = ({ children }) => {
 };
 
 ContentArea.propTypes = {
-  children: PropTypes.node.isRequired,
+  children: PropTypes.node,
 };
 
 export default ContentArea;

frontend/src/components/ContentHeader/ContentHeader.jsx

@@ -6,7 +6,7 @@ const ContentHeader = ({ title }) => {
 };
 
 ContentHeader.propTypes = {
-  title: PropTypes.string.isRequired,
+  title: PropTypes.string,
 };
 
 export default ContentHeader;

frontend/src/components/DropdownList/DropdownList.css

@@ -0,0 +1,14 @@
+.dropdown{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+}
+.select{
+    width: 241px;
+    height: 34px;
+    font-size: 13px !important;
+}
+.menuItem{
+    font-size: 13px !important;
+}

frontend/src/components/DropdownList/DropdownList.jsx

@@ -0,0 +1,26 @@
+import MenuItem from '@mui/material/MenuItem';
+import Select from '@mui/material/Select';
+import React from 'react'
+import PropTypes from 'prop-types'
+import './DropdownList.css'
+
+const DropdownList = ({actions = []}) => {
+  return (
+    <div className='dropdown'>
+    <Select
+          defaultValue={actions[0]}
+          className='select'
+        >
+          {actions.map((action, index) => (
+            <MenuItem key={index} className='menuItem' value={action}>{action}</MenuItem>
+          ))}
+        </Select>
+        </div>
+  )
+}
+
+DropdownList.propTypes = {
+    actions: PropTypes.array
+}
+
+export default DropdownList

frontend/src/components/InfoTooltip/InfoTooltip.jsx

@@ -14,7 +14,7 @@ const InfoTooltip = ({ text, title }) => {
 };
 
 InfoTooltip.propTypes = {
-  text: PropTypes.string.isRequired,
+  text: PropTypes.string,
   title: PropTypes.string,
 };
 

frontend/src/components/LeftMenu/LeftMenu.jsx

@@ -19,7 +19,7 @@ function LeftMenu() {
     navigate('/');
   };
   const handleToursClick = () => {
-    navigate(-1);
+    navigate('/tours');
   };
 
   return (

frontend/src/components/List/List.jsx

@@ -21,8 +21,8 @@ const List = ({ items, onSelectItem }) => {
 };
 
 List.propTypes = {
-  items: PropTypes.arrayOf(PropTypes.object).isRequired,
-  onSelectItem: PropTypes.func.isRequired,
+  items: PropTypes.arrayOf(PropTypes.object),
+  onSelectItem: PropTypes.func,
 };
 
 export default List;