diff --git a/my-app/package-lock.json b/my-app/package-lock.json
index 0abcee1..be6cf03 100644
--- a/my-app/package-lock.json
+++ b/my-app/package-lock.json
@@ -28,6 +28,7 @@
"framer-motion": "^11.1.9",
"i18next": "^23.11.4",
"i18next-xhr-backend": "^3.2.2",
+ "material-ui-popup-state": "^5.1.0",
"react": "^18.3.1",
"react-bootstrap": "^2.10.2",
"react-country-flag": "^3.1.0",
@@ -15617,6 +15618,25 @@
"tmpl": "1.0.5"
}
},
+ "node_modules/material-ui-popup-state": {
+ "version": "5.1.0",
+ "resolved": "https://registry.npmjs.org/material-ui-popup-state/-/material-ui-popup-state-5.1.0.tgz",
+ "integrity": "sha512-kG0xGqdPx3WM6AYnq0h7hCb3gk2M1FM/G/NFQN+HahcyABxCx3EFzLj5mdJICu2NYj0etZ2s7VDhAbrAezkxYg==",
+ "dependencies": {
+ "@babel/runtime": "^7.20.6",
+ "@types/prop-types": "^15.7.3",
+ "@types/react": "^18.0.26",
+ "classnames": "^2.2.6",
+ "prop-types": "^15.7.2"
+ },
+ "engines": {
+ "node": ">=16"
+ },
+ "peerDependencies": {
+ "@mui/material": "^5.0.0",
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+ }
+ },
"node_modules/mdn-data": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.4.tgz",
diff --git a/my-app/package.json b/my-app/package.json
index c23dae6..3771e64 100644
--- a/my-app/package.json
+++ b/my-app/package.json
@@ -23,6 +23,7 @@
"framer-motion": "^11.1.9",
"i18next": "^23.11.4",
"i18next-xhr-backend": "^3.2.2",
+ "material-ui-popup-state": "^5.1.0",
"react": "^18.3.1",
"react-bootstrap": "^2.10.2",
"react-country-flag": "^3.1.0",
diff --git a/my-app/src/components/header.tsx b/my-app/src/components/header.tsx
index dcd5d42..5786744 100644
--- a/my-app/src/components/header.tsx
+++ b/my-app/src/components/header.tsx
@@ -13,6 +13,11 @@ import { FormControl } from 'react-bootstrap';
import { Box, InputLabel, MenuItem} from '@mui/material';
import Select, { SelectChangeEvent } from '@mui/material/Select';
+import Menu from '@mui/material/Menu';
+// import MenuItem from '@mui/material/MenuItem';
+import PopupState, { bindHover, bindMenu } from 'material-ui-popup-state';
+import Button from '@mui/material/Button';
+
function Header()
{
const { i18n, t } = useTranslation();
@@ -70,6 +75,29 @@ function Header()
+
+
+
+ {/*