| import { IconButton } from "@mui/material"; | |||||
| import PropTypes from "prop-types"; | |||||
| import React from "react"; | |||||
| import userPageBtnIcon from "../../assets/images/userPageBtnIcon.png"; | |||||
| import { useTheme } from "@mui/system"; | |||||
| import { useMediaQuery } from "@mui/material"; | |||||
| const EditButton = ({ onEnableEdit }) => { | |||||
| const theme = useTheme(); | |||||
| const matches = useMediaQuery(theme.breakpoints.down("sm")); | |||||
| return ( | |||||
| <IconButton | |||||
| className={"c-btn--primary-outlined c-btn userPageBtn ml-20px no-padding"} | |||||
| onClick={onEnableEdit} | |||||
| > | |||||
| {!matches && "Režim uređivanja"} | |||||
| <img | |||||
| style={{ | |||||
| position: "relative", | |||||
| top: -0.25, | |||||
| paddingLeft: matches ? "0px" : "10px", | |||||
| }} | |||||
| src={userPageBtnIcon} | |||||
| /> | |||||
| </IconButton> | |||||
| ); | |||||
| }; | |||||
| EditButton.propTypes = { | |||||
| onEnableEdit: PropTypes.func, | |||||
| }; | |||||
| export default EditButton; |
| lastName: Yup.string().required(t("login.lastnameRequired")), | lastName: Yup.string().required(t("login.lastnameRequired")), | ||||
| email: Yup.string() | email: Yup.string() | ||||
| .required(t("login.emailRequired")) | .required(t("login.emailRequired")) | ||||
| .matches(/^[\w-.]+@([\w-]+\.)+[\w-]{2,4}$/, "Invalid email format."), | |||||
| .matches(/^[\w-.]+@([\w-]+\.)+[\w-]{2,4}$/, t("login.invalidEmail")), | |||||
| }), | }), | ||||
| onSubmit: handleSubmit, | onSubmit: handleSubmit, | ||||
| validateOnBlur: true, | validateOnBlur: true, |
| forgotPasswordEmail: "Email", | forgotPasswordEmail: "Email", | ||||
| useDifferentEmail: "Use different email address or username", | useDifferentEmail: "Use different email address or username", | ||||
| signInWithGoogle: "Continue with google", | signInWithGoogle: "Continue with google", | ||||
| invalidEmail: "Invalid email format", | |||||
| }, | }, | ||||
| password: { | password: { | ||||
| weak: "weak", | weak: "weak", | ||||
| users: { | users: { | ||||
| management: "User management", | management: "User management", | ||||
| fullName: "Name and surname", | fullName: "Name and surname", | ||||
| position: 'Position', | |||||
| invite: 'Invite', | |||||
| inviteUser: 'Invite user', | |||||
| regLink: 'Registration link', | |||||
| receiver: 'Receiver', | |||||
| user: 'User', | |||||
| contact: 'Contact', | |||||
| phone: 'Phone', | |||||
| socials: 'Social Media', | |||||
| position: "Position", | |||||
| invite: "Invite", | |||||
| inviteUser: "Invite user", | |||||
| regLink: "Registration link", | |||||
| receiver: "Receiver", | |||||
| user: "User", | |||||
| contact: "Contact", | |||||
| phone: "Phone", | |||||
| socials: "Social Media", | |||||
| }, | }, | ||||
| selectionLevels: { | selectionLevels: { | ||||
| done: { | done: { |
| // this._useDifferentEmail = value; | // this._useDifferentEmail = value; | ||||
| // }, | // }, | ||||
| signInWithGoogle: "Prijava putem Google-a", | signInWithGoogle: "Prijava putem Google-a", | ||||
| invalidEmail:"Format adrese nije validan" | |||||
| }, | }, | ||||
| // password: { | // password: { | ||||
| // weak: 'weak', | // weak: 'weak', |
| import React, { useState } from "react"; | import React, { useState } from "react"; | ||||
| import IconButton from "../../components/IconButton/IconButton"; | import IconButton from "../../components/IconButton/IconButton"; | ||||
| import userPageBtnIcon from "../../assets/images/userPageBtnIcon.png"; | |||||
| import planeVector from "../../assets/images/planeVector.png"; | import planeVector from "../../assets/images/planeVector.png"; | ||||
| import lock from "../../assets/images/lock.png"; | import lock from "../../assets/images/lock.png"; | ||||
| // import filters from "../../assets/images/filters.png"; | // import filters from "../../assets/images/filters.png"; | ||||
| import { forgetPassword } from "../../store/actions/login/loginActions"; | import { forgetPassword } from "../../store/actions/login/loginActions"; | ||||
| import { useTranslation } from "react-i18next"; | import { useTranslation } from "react-i18next"; | ||||
| import ConfirmDialog from "../../components/MUI/ConfirmDialog"; | import ConfirmDialog from "../../components/MUI/ConfirmDialog"; | ||||
| import EditButton from "../../components/Button/EditButton"; | |||||
| const UsersPage = () => { | const UsersPage = () => { | ||||
| const theme = useTheme(); | const theme = useTheme(); | ||||
| <h1 className="page-heading">{t("users.management")}</h1> | <h1 className="page-heading">{t("users.management")}</h1> | ||||
| <div className="flex-center"> | <div className="flex-center"> | ||||
| {/* <button></button> */} | {/* <button></button> */} | ||||
| <IconButton | |||||
| className={`${ | |||||
| editEnable && "enabledEdit" | |||||
| } c-btn--primary-outlined editEnableBtn c-btn userPageBtn`} | |||||
| onClick={() => { | |||||
| <EditButton | |||||
| onEnableEdit={() => { | |||||
| setEdit((s) => !s); | setEdit((s) => !s); | ||||
| }} | }} | ||||
| > | |||||
| {!matches && "Režim uređivanja"} | |||||
| <img | |||||
| style={{ | |||||
| position: "relative", | |||||
| top: -0.25, | |||||
| paddingLeft: matches ? "0px" : "10px", | |||||
| }} | |||||
| src={userPageBtnIcon} | |||||
| /> | |||||
| </IconButton> | |||||
| /> | |||||
| <IconButton | <IconButton | ||||
| className={"c-btn--primary c-btn inviteBtn"} | className={"c-btn--primary c-btn inviteBtn"} | ||||
| onClick={() => { | onClick={() => { |