Skip to content

Commit

Permalink
Merge pull request #507 from persistenceOne/feedback_updates
Browse files Browse the repository at this point in the history 
router fix
  • Loading branch information
@blackpanther1881
blackpanther1881 authored Jan 15, 2024
2 parents 7b41eaa + 6041561 commit f80d7ba
Show file tree
Hide file tree
Showing 2 changed files with 122 additions and 118 deletions.
15 changes: 7 additions & 8 deletions src/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,14 +79,13 @@ const Main = () => {

address = loginInfo && loginInfo.address;
const page = location.pathname;
useEffect(() => {
if (page === "/dashboard/wallet") {
history.push("/#/dashboard/wallet");
} else if (page === "/dashboard/staking") {
history.push("/#/dashboard/staking");
}
trackPage(page);
}, [page]);

if (page === "/dashboard/wallet") {
console.log(page, "page-1");
history.push("/#/dashboard/wallet");
} else if (page === "/dashboard/staking") {
history.push("/#/dashboard/staking");
}

useEffect(() => {
const fetchApi = async () => {
Expand Down
225 changes: 115 additions & 110 deletions src/containers/Common/MobileSidebar.js
View file
Original file line number Diff line number Diff line change
@@ -1,121 +1,126 @@
import React from 'react';
import SwipeableDrawer from '@material-ui/core/SwipeableDrawer';
import Button from '@material-ui/core/Button';
import List from '@material-ui/core/List';
import Divider from '@material-ui/core/Divider';
import MenuIcon from '@material-ui/icons/Menu';
import {NavLink} from "react-router-dom";
import React from "react";
import SwipeableDrawer from "@material-ui/core/SwipeableDrawer";
import Button from "@material-ui/core/Button";
import List from "@material-ui/core/List";
import Divider from "@material-ui/core/Divider";
import MenuIcon from "@material-ui/icons/Menu";
import { NavLink } from "react-router-dom";
import Icon from "../../components/Icon";
import {useTranslation} from "react-i18next";
import { useTranslation } from "react-i18next";

const EXPLORER_API = process.env.REACT_APP_EXPLORER_API;

const MobileSidebar = () => {
const {t} = useTranslation();
const [state, setState] = React.useState({
top: false,
left: false,
bottom: false,
right: false,
});
const { t } = useTranslation();
const [state, setState] = React.useState({
top: false,
left: false,
bottom: false,
right: false
});

const toggleDrawer = (anchor, open) => (event) => {
if (event && event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) {
return;
}
const toggleDrawer = (anchor, open) => (event) => {
if (
event &&
event.type === "keydown" &&
(event.key === "Tab" || event.key === "Shift")
) {
return;
}

setState({...state, [anchor]: open});
};
setState({ ...state, [anchor]: open });
};

const list = (anchor) => (
<div
className="sidebar-section"
role="presentation"
onClick={toggleDrawer(anchor, false)}
onKeyDown={toggleDrawer(anchor, false)}
>
<List className="mobile-sidebar-container">
<li className="nav-item link">
<NavLink className="nav-link primary-medium-color"
to="/dashboard/wallet">
<div className="icon-container">
<div className="icon-box">
<Icon
viewClass="icon"
icon="wallet"
/>
</div>
</div>
{t("WALLET")}
</NavLink>
</li>
<li className="nav-item link">
<NavLink className="nav-link primary-medium-color"
to="/dashboard/staking">
<div className="icon-container">
<div className="icon-box">
<Icon
viewClass="icon"
icon="staking"/>
</div>
</div>
{t("STAKING")}
</NavLink>
</li>
<li className="nav-item link">
<a className="nav-link primary-medium-color" href={EXPLORER_API}
rel="noopener noreferrer" target="_blank">
<div className="icon-container">
<div className="icon-box">
<Icon
viewClass="icon"
icon="explorer"/>
</div>
</div>
{t("EXPLORER")}
<div className="icon-box">
<Icon
viewClass="icon"
icon="export"/>
</div>
</a>
</li>

<li className="nav-item link">
<a className="nav-link primary-medium-color"
href="https://notes.persistence.one/s/9l80_chis" rel="noopener noreferrer" target="_blank">
<div className="icon-container">
<div className="icon-box">
<Icon
viewClass="icon"
icon="help"/>
</div>
</div>
{t("HELP")}
</a>
</li>
const list = (anchor) => (
<div
className="sidebar-section"
role="presentation"
onClick={toggleDrawer(anchor, false)}
onKeyDown={toggleDrawer(anchor, false)}
>
<List className="mobile-sidebar-container">
<li className="nav-item link">
<NavLink
className="nav-link primary-medium-color"
to="/dashboard/wallet"
>
<div className="icon-container">
<div className="icon-box">
<Icon viewClass="icon" icon="wallet" />
</div>
</div>
{t("WALLET")}
</NavLink>
</li>
<li className="nav-item link">
<NavLink
className="nav-link primary-medium-color"
to="/#dashboard/staking"
>
<div className="icon-container">
<div className="icon-box">
<Icon viewClass="icon" icon="staking" />
</div>
</div>
{t("STAKING")}
</NavLink>
</li>
<li className="nav-item link">
<a
className="nav-link primary-medium-color"
href={EXPLORER_API}
rel="noopener noreferrer"
target="_blank"
>
<div className="icon-container">
<div className="icon-box">
<Icon viewClass="icon" icon="explorer" />
</div>
</div>
{t("EXPLORER")}
<div className="icon-box">
<Icon viewClass="icon" icon="export" />
</div>
</a>
</li>

</List>
<Divider/>
</div>
);
<li className="nav-item link">
<a
className="nav-link primary-medium-color"
href="https://notes.persistence.one/s/9l80_chis"
rel="noopener noreferrer"
target="_blank"
>
<div className="icon-container">
<div className="icon-box">
<Icon viewClass="icon" icon="help" />
</div>
</div>
{t("HELP")}
</a>
</li>
</List>
<Divider />
</div>
);

return (
<div>

<React.Fragment key={'left'}>
<Button onClick={toggleDrawer('left', true)}><MenuIcon/></Button>
<SwipeableDrawer
anchor={'left'}
className="sidebar-container"
open={state['left']}
onClose={toggleDrawer('left', false)}
onOpen={toggleDrawer('left', true)}
>
{list('left')}
</SwipeableDrawer>
</React.Fragment>
</div>
);
return (
<div>
<React.Fragment key={"left"}>
<Button onClick={toggleDrawer("left", true)}>
<MenuIcon />
</Button>
<SwipeableDrawer
anchor={"left"}
className="sidebar-container"
open={state["left"]}
onClose={toggleDrawer("left", false)}
onOpen={toggleDrawer("left", true)}
>
{list("left")}
</SwipeableDrawer>
</React.Fragment>
</div>
);
};
export default MobileSidebar;
export default MobileSidebar;

0 comments on commit f80d7ba

Please sign in to comment.