-
@@ -787,6 +389,49 @@ bottomBarPhone =()=>{
isOpen={this.state.openCommuniy}
handleClickCloseCommunity={this.handleClickCloseCommunity}
/>
+
+
+
+
+
+
+
{this.bottomBarDesktop()}
diff --git a/frontend/src/components/Dialogs/ExchangeSummary.tsx b/frontend/src/components/Dialogs/ExchangeSummary.tsx
new file mode 100644
index 00000000..3b759ec9
--- /dev/null
+++ b/frontend/src/components/Dialogs/ExchangeSummary.tsx
@@ -0,0 +1,169 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+
+import {
+ Dialog,
+ DialogContent,
+ Divider,
+ Grid,
+ List,
+ ListItemText,
+ ListItem,
+ ListItemIcon,
+ Typography,
+} from "@mui/material";
+
+import InventoryIcon from '@mui/icons-material/Inventory';
+import SellIcon from '@mui/icons-material/Sell';
+import SmartToyIcon from '@mui/icons-material/SmartToy';
+import PercentIcon from '@mui/icons-material/Percent';
+import PriceChangeIcon from '@mui/icons-material/PriceChange';
+import BookIcon from '@mui/icons-material/Book';
+
+import { pn } from "../../utils/prettyNumbers";
+
+type Props = {
+ isOpen: boolean;
+ handleClickCloseExchangeSummary: () => void;
+ numPublicBuyOrders: number;
+ numPublicSellOrders: number;
+ bookLiquidity: number;
+ activeRobotsToday: number;
+ lastDayNonkycBtcPremium: number;
+ makerFee: number;
+ takerFee: number;
+}
+
+const ExchangeSummaryDialog = ({
+ isOpen,
+ handleClickCloseExchangeSummary,
+ numPublicBuyOrders,
+ numPublicSellOrders,
+ bookLiquidity,
+ activeRobotsToday,
+ lastDayNonkycBtcPremium,
+ makerFee,
+ takerFee,
+}: Props): JSX.Element => {
+ const { t } = useTranslation();
+
+ return (
+
+ );
+};
+
+export default ExchangeSummaryDialog;
diff --git a/frontend/src/components/Dialogs/Profile.tsx b/frontend/src/components/Dialogs/Profile.tsx
new file mode 100644
index 00000000..27815e91
--- /dev/null
+++ b/frontend/src/components/Dialogs/Profile.tsx
@@ -0,0 +1,329 @@
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Link as LinkRouter } from "react-router-dom";
+
+import {
+ Avatar,
+ Badge,
+ Button,
+ CircularProgress,
+ Dialog,
+ DialogContent,
+ Divider,
+ FormControlLabel,
+ Grid,
+ IconButton,
+ List,
+ ListItemAvatar,
+ ListItemButton,
+ ListItemText,
+ ListItem,
+ ListItemIcon,
+ Switch,
+ TextField,
+ Tooltip,
+ Typography,
+} from "@mui/material";
+
+import BoltIcon from "@mui/icons-material/Bolt";
+import NumbersIcon from "@mui/icons-material/Numbers";
+import PasswordIcon from "@mui/icons-material/Password";
+import ContentCopy from "@mui/icons-material/ContentCopy";
+import PersonAddAltIcon from "@mui/icons-material/PersonAddAlt";
+import EmojiEventsIcon from "@mui/icons-material/EmojiEvents";
+
+import { getCookie } from "../../utils/cookies";
+
+type Props = {
+ isOpen: boolean;
+ handleClickCloseProfile: () => void;
+ nickname: string;
+ activeOrderId: string | number;
+ lastOrderId: string | number;
+ referralCode: string;
+ handleSubmitInvoiceClicked: (e:any, invoice: string) => void;
+ host: string;
+ showRewardsSpinner: boolean;
+ withdrawn: boolean;
+ badInvoice: boolean | string;
+ earnedRewards: number;
+ setAppState: (state: any) => void; // TODO: move to a ContextProvider
+}
+
+const ProfileDialog = ({
+ isOpen,
+ handleClickCloseProfile,
+ nickname,
+ activeOrderId,
+ lastOrderId,
+ referralCode,
+ handleSubmitInvoiceClicked,
+ host,
+ showRewardsSpinner,
+ withdrawn,
+ badInvoice,
+ earnedRewards,
+ setAppState,
+}: Props): JSX.Element => {
+ const { t } = useTranslation();
+
+ const [rewardInvoice, setRewardInvoice] = useState("");
+ const [showRewards, setShowRewards] = useState(false);
+ const [openClaimRewards, setOpenClaimRewards] = useState(false);
+
+ const copyTokenHandler = () => {
+ const robotToken = getCookie("robot_token");
+
+ if (robotToken) {
+ navigator.clipboard.writeText(robotToken);
+ setAppState({copiedToken:true});
+ }
+ };
+
+ const copyReferralCodeHandler = () => {
+ navigator.clipboard.writeText(`http://${host}/ref/${referralCode}`);
+ };
+
+ return (
+ ,
+ }}
+ />
+ ) :
+ t("Cannot remember")
+ }
+
+
+
+
+
+
+
+ setShowRewards(!showRewards)}
+ />
+ }
+ />
+
+
+
+ {showRewards && (
+ <>
+
+
+
+
+
+
+
+
+
+
+ ,
+ }}
+ />
+
+
+
+
+
+
+
+
+ {!openClaimRewards ? (
+
+
+
+ {`${earnedRewards} Sats`}
+
+
+
+
+
+
+
+ ) : (
+
+ )}
+
+
+ {showRewardsSpinner && (
+
+
+
+ )}
+
+ {withdrawn && (
+
+
+ {t("There it goes, thank you!🥇")}
+
+
+ )}
+
+ )}
+
+
+
+ );
+};
+
+export default ProfileDialog;
diff --git a/frontend/src/components/Dialogs/Stats.tsx b/frontend/src/components/Dialogs/Stats.tsx
new file mode 100644
index 00000000..9f77ddf9
--- /dev/null
+++ b/frontend/src/components/Dialogs/Stats.tsx
@@ -0,0 +1,196 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+
+import {
+ Dialog,
+ DialogContent,
+ Divider,
+ Link,
+ List,
+ ListItemText,
+ ListItem,
+ ListItemIcon,
+ Typography,
+} from "@mui/material";
+
+import BoltIcon from "@mui/icons-material/Bolt";
+import PublicIcon from "@mui/icons-material/Public";
+import DnsIcon from "@mui/icons-material/Dns";
+import WebIcon from "@mui/icons-material/Web";
+import FavoriteIcon from "@mui/icons-material/Favorite";
+import GitHubIcon from "@mui/icons-material/GitHub";
+import EqualizerIcon from "@mui/icons-material/Equalizer";
+
+import { AmbossIcon, BitcoinSignIcon } from "../Icons";
+
+import { pn } from "../../utils/prettyNumbers";
+
+type Props = {
+ isOpen: boolean;
+ handleClickCloseStatsForNerds: () => void;
+ lndVersion: string;
+ network: string;
+ nodeAlias: string;
+ nodeId: string;
+ alternativeName: string;
+ alternativeSite: string;
+ robosatsRunningCommitHash: string;
+ lastDayVolume: number;
+ lifetimeVolume: number;
+}
+
+const StatsDialog = ({
+ isOpen,
+ handleClickCloseStatsForNerds,
+ lndVersion,
+ network,
+ nodeAlias,
+ nodeId,
+ alternativeName,
+ alternativeSite,
+ robosatsRunningCommitHash,
+ lastDayVolume,
+ lifetimeVolume,
+}: Props): JSX.Element => {
+ const { t } = useTranslation();
+
+ return (
+