mirror of
https://github.com/RoboSats/robosats.git
synced 2025-01-31 10:31:35 +00:00
Simplify routing (#458)
* Fix payment methods as icons memo * Simplify pages / router * Load current order on robotfetch
This commit is contained in:
parent
db5548ecca
commit
4f2ef09c6f
@ -13,18 +13,8 @@ import { BarChart, FormatListBulleted } from '@mui/icons-material';
|
||||
import { AppContext, UseAppStoreType } from '../../contexts/AppContext';
|
||||
|
||||
const BookPage = (): JSX.Element => {
|
||||
const {
|
||||
robot,
|
||||
fetchBook,
|
||||
clearOrder,
|
||||
windowSize,
|
||||
setPage,
|
||||
setCurrentOrder,
|
||||
baseUrl,
|
||||
book,
|
||||
setDelay,
|
||||
setOrder,
|
||||
} = useContext<UseAppStoreType>(AppContext);
|
||||
const { robot, fetchBook, windowSize, book, setDelay, setOrder } =
|
||||
useContext<UseAppStoreType>(AppContext);
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const [view, setView] = useState<'list' | 'depth'>('list');
|
||||
@ -48,8 +38,6 @@ const BookPage = (): JSX.Element => {
|
||||
const onOrderClicked = function (id: number) {
|
||||
if (robot.avatarLoaded) {
|
||||
navigate('/order/' + id);
|
||||
setPage('order');
|
||||
setCurrentOrder(id);
|
||||
onViewOrder();
|
||||
} else {
|
||||
setOpenNoRobot(true);
|
||||
@ -87,15 +75,13 @@ const BookPage = (): JSX.Element => {
|
||||
|
||||
return (
|
||||
<Grid container direction='column' alignItems='center' spacing={1} sx={{ minWidth: 400 }}>
|
||||
<NoRobotDialog open={openNoRobot} onClose={() => setOpenNoRobot(false)} setPage={setPage} />
|
||||
<NoRobotDialog open={openNoRobot} onClose={() => setOpenNoRobot(false)} />
|
||||
{openMaker ? (
|
||||
<Dialog open={openMaker} onClose={() => setOpenMaker(false)}>
|
||||
<Box sx={{ maxWidth: '18em', padding: '0.5em' }}>
|
||||
<MakerForm
|
||||
hasRobot={robot.avatarLoaded}
|
||||
onOrderCreated={(id) => {
|
||||
clearOrder();
|
||||
setCurrentOrder(id);
|
||||
setPage('order');
|
||||
navigate('/order/' + id);
|
||||
}}
|
||||
|
@ -42,7 +42,6 @@ const Main: React.FC = () => {
|
||||
baseUrl,
|
||||
order,
|
||||
page,
|
||||
setPage,
|
||||
slideDirection,
|
||||
setOpen,
|
||||
windowSize,
|
||||
@ -66,7 +65,6 @@ const Main: React.FC = () => {
|
||||
page={page}
|
||||
openProfile={() => setOpen({ ...closeAll, profile: true })}
|
||||
rewards={robot.earnedRewards}
|
||||
setPage={setPage}
|
||||
windowWidth={windowSize.width}
|
||||
/>
|
||||
{settings.network === 'testnet' ? (
|
||||
|
@ -23,7 +23,7 @@ export interface OpenDialogs {
|
||||
}
|
||||
|
||||
const MainDialogs = (): JSX.Element => {
|
||||
const { open, setOpen, info, limits, robot, setRobot, setPage, setCurrentOrder, baseUrl } =
|
||||
const { open, setOpen, info, limits, robot, setRobot, setCurrentOrder, baseUrl } =
|
||||
useContext<UseAppStoreType>(AppContext);
|
||||
|
||||
const [maxAmount, setMaxAmount] = useState<string>('...loading...');
|
||||
@ -74,7 +74,6 @@ const MainDialogs = (): JSX.Element => {
|
||||
onClose={() => setOpen({ ...open, profile: false })}
|
||||
robot={robot}
|
||||
setRobot={setRobot}
|
||||
setPage={setPage}
|
||||
setCurrentOrder={setCurrentOrder}
|
||||
/>
|
||||
</>
|
||||
|
@ -12,19 +12,8 @@ import { AppContext, UseAppStoreType } from '../../contexts/AppContext';
|
||||
import { NoRobotDialog } from '../../components/Dialogs';
|
||||
|
||||
const MakerPage = (): JSX.Element => {
|
||||
const {
|
||||
robot,
|
||||
book,
|
||||
fav,
|
||||
maker,
|
||||
clearOrder,
|
||||
windowSize,
|
||||
setCurrentOrder,
|
||||
navbarHeight,
|
||||
setPage,
|
||||
setOrder,
|
||||
setDelay,
|
||||
} = useContext<UseAppStoreType>(AppContext);
|
||||
const { robot, book, fav, maker, windowSize, navbarHeight, setOrder, setDelay } =
|
||||
useContext<UseAppStoreType>(AppContext);
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
|
||||
@ -58,8 +47,6 @@ const MakerPage = (): JSX.Element => {
|
||||
const onOrderClicked = function (id: number) {
|
||||
if (robot.avatarLoaded) {
|
||||
navigate('/order/' + id);
|
||||
setPage('order');
|
||||
setCurrentOrder(id);
|
||||
onViewOrder();
|
||||
} else {
|
||||
setOpenNoRobot(true);
|
||||
@ -68,7 +55,7 @@ const MakerPage = (): JSX.Element => {
|
||||
|
||||
return (
|
||||
<Grid container direction='column' alignItems='center' spacing={1}>
|
||||
<NoRobotDialog open={openNoRobot} onClose={() => setOpenNoRobot(false)} setPage={setPage} />
|
||||
<NoRobotDialog open={openNoRobot} onClose={() => setOpenNoRobot(false)} />
|
||||
<Grid item>
|
||||
<Collapse in={matches.length > 0 && showMatches}>
|
||||
<Grid container direction='column' alignItems='center' spacing={1}>
|
||||
@ -102,9 +89,6 @@ const MakerPage = (): JSX.Element => {
|
||||
>
|
||||
<MakerForm
|
||||
onOrderCreated={(id) => {
|
||||
clearOrder();
|
||||
setCurrentOrder(id);
|
||||
setPage('order');
|
||||
navigate('/order/' + id);
|
||||
}}
|
||||
hasRobot={robot.avatarLoaded}
|
||||
|
@ -1,6 +1,6 @@
|
||||
import React, { useContext, useEffect } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useLocation, useNavigate } from 'react-router-dom';
|
||||
import { Tabs, Tab, Paper, useTheme } from '@mui/material';
|
||||
import MoreTooltip from './MoreTooltip';
|
||||
|
||||
@ -38,11 +38,13 @@ const NavBar = ({ width, height }: NavBarProps): JSX.Element => {
|
||||
const theme = useTheme();
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const location = useLocation();
|
||||
const smallBar = width < 50;
|
||||
|
||||
const tabSx = smallBar
|
||||
? { position: 'relative', bottom: robot.avatarLoaded ? '0.9em' : '0.13em', minWidth: '1em' }
|
||||
: { position: 'relative', bottom: '1em', minWidth: '2em' };
|
||||
|
||||
const pagesPosition = {
|
||||
robot: 1,
|
||||
offers: 2,
|
||||
@ -51,6 +53,11 @@ const NavBar = ({ width, height }: NavBarProps): JSX.Element => {
|
||||
settings: 5,
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const pathPage = location.pathname.split('/')[1];
|
||||
setPage(pathPage);
|
||||
}, [location]);
|
||||
|
||||
const handleSlideDirection = function (oldPage: Page, newPage: Page) {
|
||||
const oldPos: number = pagesPosition[oldPage];
|
||||
const newPos: number = pagesPosition[newPage];
|
||||
|
@ -20,7 +20,6 @@ const OrderPage = (): JSX.Element => {
|
||||
setCurrentOrder,
|
||||
badOrder,
|
||||
setBadOrder,
|
||||
setPage,
|
||||
baseUrl,
|
||||
navbarHeight,
|
||||
} = useContext<UseAppStoreType>(AppContext);
|
||||
@ -33,7 +32,7 @@ const OrderPage = (): JSX.Element => {
|
||||
|
||||
const [tab, setTab] = useState<'order' | 'contract'>('contract');
|
||||
|
||||
useEffect(() => setCurrentOrder(Number(params.orderId)), []);
|
||||
useEffect(() => setCurrentOrder(Number(params.orderId)), [params.orderId]);
|
||||
|
||||
const renewOrder = function () {
|
||||
if (order != undefined) {
|
||||
@ -58,16 +57,13 @@ const OrderPage = (): JSX.Element => {
|
||||
setBadOrder(data.bad_request);
|
||||
} else if (data.id) {
|
||||
navigate('/order/' + data.id);
|
||||
setCurrentOrder(data.id);
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const startAgain = function () {
|
||||
navigate('/robot');
|
||||
setPage('robot');
|
||||
};
|
||||
const startAgain = () => navigate('/robot');
|
||||
|
||||
return (
|
||||
<Box>
|
||||
{order == undefined && badOrder == undefined ? <CircularProgress /> : null}
|
||||
|
@ -32,7 +32,6 @@ interface OnboardingProps {
|
||||
setInputToken: (state: string) => void;
|
||||
getGenerateRobot: (token: string) => void;
|
||||
badRequest: string | undefined;
|
||||
setPage: (state: Page) => void;
|
||||
baseUrl: string;
|
||||
}
|
||||
|
||||
@ -44,7 +43,6 @@ const Onboarding = ({
|
||||
setRobot,
|
||||
badRequest,
|
||||
getGenerateRobot,
|
||||
setPage,
|
||||
baseUrl,
|
||||
}: OnboardingProps): JSX.Element => {
|
||||
const { t } = useTranslation();
|
||||
@ -61,11 +59,6 @@ const Onboarding = ({
|
||||
setTimeout(() => setLoading(false), 1000);
|
||||
};
|
||||
|
||||
const changePage = function (newPage: Page) {
|
||||
setPage(newPage);
|
||||
navigate(`/${newPage}`);
|
||||
};
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Accordion expanded={step === '1'} disableGutters={true}>
|
||||
@ -246,11 +239,11 @@ const Onboarding = ({
|
||||
|
||||
<Grid item>
|
||||
<ButtonGroup variant='contained'>
|
||||
<Button color='primary' onClick={() => changePage('offers')}>
|
||||
<Button color='primary' onClick={() => navigate('/offers')}>
|
||||
<Storefront /> <div style={{ width: '0.5em' }} />
|
||||
{t('Offers')}
|
||||
</Button>
|
||||
<Button color='secondary' onClick={() => changePage('create')}>
|
||||
<Button color='secondary' onClick={() => navigate('/create')}>
|
||||
<AddBox /> <div style={{ width: '0.5em' }} />
|
||||
{t('Create')}
|
||||
</Button>
|
||||
|
@ -32,7 +32,6 @@ interface RobotProfileProps {
|
||||
logoutRobot: () => void;
|
||||
inputToken: string;
|
||||
setInputToken: (state: string) => void;
|
||||
setPage: (state: Page) => void;
|
||||
baseUrl: string;
|
||||
badRequest: string;
|
||||
width: number;
|
||||
@ -46,7 +45,6 @@ const RobotProfile = ({
|
||||
setInputToken,
|
||||
setCurrentOrder,
|
||||
logoutRobot,
|
||||
setPage,
|
||||
setView,
|
||||
badRequest,
|
||||
baseUrl,
|
||||
@ -157,8 +155,7 @@ const RobotProfile = ({
|
||||
<Grid item>
|
||||
<Button
|
||||
onClick={() => {
|
||||
navigate('/order/' + robot.activeOrderId);
|
||||
setPage('order');
|
||||
navigate(`/order/${robot.activeOrderId}`);
|
||||
setCurrentOrder(robot.activeOrderId);
|
||||
}}
|
||||
>
|
||||
@ -172,8 +169,7 @@ const RobotProfile = ({
|
||||
<Grid item>
|
||||
<Button
|
||||
onClick={() => {
|
||||
navigate('/order/' + robot.lastOrderId);
|
||||
setPage('order');
|
||||
navigate(`/order/${robot.lastOrderId}`);
|
||||
setCurrentOrder(robot.lastOrderId);
|
||||
}}
|
||||
>
|
||||
|
@ -22,7 +22,7 @@ import { genKey } from '../../pgp';
|
||||
import { AppContext, UseAppStoreType } from '../../contexts/AppContext';
|
||||
|
||||
const RobotPage = (): JSX.Element => {
|
||||
const { robot, setRobot, setPage, setCurrentOrder, fetchRobot, torStatus, windowSize, baseUrl } =
|
||||
const { robot, setRobot, setCurrentOrder, fetchRobot, torStatus, windowSize, baseUrl } =
|
||||
useContext<UseAppStoreType>(AppContext);
|
||||
const { t } = useTranslation();
|
||||
const params = useParams();
|
||||
@ -142,7 +142,6 @@ const RobotPage = (): JSX.Element => {
|
||||
inputToken={inputToken}
|
||||
setInputToken={setInputToken}
|
||||
getGenerateRobot={getGenerateRobot}
|
||||
setPage={setPage}
|
||||
baseUrl={baseUrl}
|
||||
/>
|
||||
) : null}
|
||||
@ -160,7 +159,6 @@ const RobotPage = (): JSX.Element => {
|
||||
inputToken={inputToken}
|
||||
setInputToken={setInputToken}
|
||||
getGenerateRobot={getGenerateRobot}
|
||||
setPage={setPage}
|
||||
baseUrl={baseUrl}
|
||||
/>
|
||||
) : null}
|
||||
@ -174,7 +172,6 @@ const RobotPage = (): JSX.Element => {
|
||||
inputToken={inputToken}
|
||||
setInputToken={setInputToken}
|
||||
getGenerateRobot={getGenerateRobot}
|
||||
setPage={setPage}
|
||||
baseUrl={baseUrl}
|
||||
/>
|
||||
) : null}
|
||||
|
@ -9,7 +9,6 @@ import {
|
||||
Button,
|
||||
} from '@mui/material';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { AppContext, UseAppStoreType } from '../../contexts/AppContext';
|
||||
|
||||
interface Props {
|
||||
open: boolean;
|
||||
@ -17,13 +16,11 @@ interface Props {
|
||||
}
|
||||
|
||||
const NoRobotDialog = ({ open, onClose }: Props): JSX.Element => {
|
||||
const { setPage } = useContext<UseAppStoreType>(AppContext);
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
|
||||
const handleClickGenerate = function () {
|
||||
onClose();
|
||||
setPage('robot');
|
||||
navigate('/robot');
|
||||
};
|
||||
|
||||
|
@ -47,20 +47,10 @@ interface Props {
|
||||
onClose: () => void;
|
||||
robot: Robot;
|
||||
setRobot: (state: Robot) => void;
|
||||
setPage: (state: Page) => void;
|
||||
setCurrentOrder: (state: number) => void;
|
||||
baseUrl: string;
|
||||
}
|
||||
|
||||
const ProfileDialog = ({
|
||||
open = false,
|
||||
baseUrl,
|
||||
onClose,
|
||||
robot,
|
||||
setRobot,
|
||||
setPage,
|
||||
setCurrentOrder,
|
||||
}: Props): JSX.Element => {
|
||||
const ProfileDialog = ({ open = false, baseUrl, onClose, robot, setRobot }: Props): JSX.Element => {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const theme = useTheme();
|
||||
@ -181,9 +171,7 @@ const ProfileDialog = ({
|
||||
{robot.activeOrderId ? (
|
||||
<ListItemButton
|
||||
onClick={() => {
|
||||
navigate('/order/' + robot.activeOrderId);
|
||||
setPage('order');
|
||||
setCurrentOrder(robot.activeOrderId);
|
||||
navigate(`/order/${robot.activeOrderId}`);
|
||||
onClose();
|
||||
}}
|
||||
>
|
||||
@ -200,9 +188,7 @@ const ProfileDialog = ({
|
||||
) : robot.lastOrderId ? (
|
||||
<ListItemButton
|
||||
onClick={() => {
|
||||
navigate('/order/' + robot.lastOrderId);
|
||||
setPage('order');
|
||||
setCurrentOrder(robot.lastOrderId);
|
||||
navigate(`/order/${robot.lastOrderId}`);
|
||||
onClose();
|
||||
}}
|
||||
>
|
||||
|
@ -63,7 +63,7 @@ const MakerForm = ({
|
||||
onOrderCreated = () => null,
|
||||
hasRobot = true,
|
||||
}: MakerFormProps): JSX.Element => {
|
||||
const { fav, setFav, limits, fetchLimits, info, maker, setMaker, setPage, baseUrl } =
|
||||
const { fav, setFav, limits, fetchLimits, info, maker, setMaker, baseUrl } =
|
||||
useContext<UseAppStoreType>(AppContext);
|
||||
|
||||
const { t } = useTranslation();
|
||||
@ -457,7 +457,6 @@ const MakerForm = ({
|
||||
<ConfirmationDialog
|
||||
open={openDialogs}
|
||||
onClose={() => setOpenDialogs(false)}
|
||||
setPage={setPage}
|
||||
onClickDone={handleCreateOrder}
|
||||
hasRobot={hasRobot}
|
||||
/>
|
||||
|
@ -18,7 +18,6 @@ interface NotificationsProps {
|
||||
order: Order | undefined;
|
||||
rewards: number | undefined;
|
||||
page: Page;
|
||||
setPage: (state: Page) => void;
|
||||
openProfile: () => void;
|
||||
windowWidth: number;
|
||||
}
|
||||
@ -63,7 +62,6 @@ const Notifications = ({
|
||||
order,
|
||||
rewards,
|
||||
page,
|
||||
setPage,
|
||||
windowWidth,
|
||||
openProfile,
|
||||
}: NotificationsProps): JSX.Element => {
|
||||
@ -84,7 +82,6 @@ const Notifications = ({
|
||||
const basePageTitle = t('RoboSats - Simple and Private Bitcoin Exchange');
|
||||
|
||||
const moveToOrderPage = function () {
|
||||
setPage('order');
|
||||
navigate(`/order/${order?.id}`);
|
||||
setShow(false);
|
||||
};
|
||||
|
@ -336,13 +336,15 @@ export const useAppStore = () => {
|
||||
|
||||
apiClient.post(baseUrl, '/api/user/', requestBody).then((data: any) => {
|
||||
let newRobot = robot;
|
||||
setCurrentOrder(
|
||||
data.active_order_id
|
||||
? data.active_order_id
|
||||
: data.last_order_id
|
||||
? data.last_order_id
|
||||
: null,
|
||||
);
|
||||
if (currentOrder === undefined) {
|
||||
setCurrentOrder(
|
||||
data.active_order_id
|
||||
? data.active_order_id
|
||||
: data.last_order_id
|
||||
? data.last_order_id
|
||||
: null,
|
||||
);
|
||||
}
|
||||
if (data.bad_request) {
|
||||
setBadRequest(data.bad_request);
|
||||
newRobot = {
|
||||
|
@ -62,8 +62,6 @@ const Main = (): JSX.Element => {
|
||||
setFav,
|
||||
baseUrl,
|
||||
order,
|
||||
page,
|
||||
setPage,
|
||||
currentOrder,
|
||||
setCurrentOrder,
|
||||
open,
|
||||
|
Loading…
Reference in New Issue
Block a user