import {Box, Container, Typography, useMediaQuery} from "@mui/material";
import PropTypes from "prop-types";
import {useState} from "react";
import {timeCalc} from "../ProductPage/timeCalc";
import Breadcrumb from "../../components/Breadcrumbs";
import Tabs from "@mui/material/Tabs";
import Tab from "@mui/material/Tab";
import {CMainOrders} from "../MyOrdersPage/MainOrders";
import {CMainWishList} from "../WishListPage/MainWishList";
import {connect} from "react-redux";
import {actionAuthLogout} from "../../reducers/AuthReducer";
import {actionUserRemove} from "../../reducers/UserReducer";
import {AccountDetails} from "./AccountDetails";
function TabPanel(props) {
const { children, value, index, ...other } = props;
return (
{value === index && (
{children}
)}
);
}
TabPanel.propTypes = {
children: PropTypes.node,
index: PropTypes.number.isRequired,
value: PropTypes.number.isRequired,
};
function a11yProps(index) {
return {
id: `vertical-tab-${index}`,
'aria-controls': `vertical-tabpanel-${index}`,
};
}
const ProfilePage = ({user = {}, promise, authLogOut, userLogOut}) => {
const matches = useMediaQuery('(max-width:899px)')
const matches2 = useMediaQuery('(max-width:768px)')
const [value, setValue] = useState(0)
const handleChange = (event, newValue) => {
setValue(newValue);
};
let formattedTime = 0;
if (Object.keys(user).length !== 0) {
formattedTime = timeCalc(+user.createdAt);
}
const handleLogOut = () => {
authLogOut();
userLogOut();
}
return (
Object.keys(user).length > 1 &&
<>
LOGGED IN AS
{ ` ${user?.login.toUpperCase()}` || 'login' }
>
)
}
export const CProfilePage = connect(state => ({user: state.user, promise: state.promise}),
{authLogOut: actionAuthLogout, userLogOut: actionUserRemove})(ProfilePage)