diff --git a/docs/header-menu-jsons/navigation.json b/docs/header-menu-jsons/navigation.json
index 60aa12dd..845708d2 100644
--- a/docs/header-menu-jsons/navigation.json
+++ b/docs/header-menu-jsons/navigation.json
@@ -31,7 +31,7 @@
"url": "/docs/lightning/"
},
{
- "title": "
TOR Network",
+ "title": "
Tor Network",
"url": "/docs/tor/"
},
{
diff --git a/docs/header-menu-jsons/navigation_es.json b/docs/header-menu-jsons/navigation_es.json
index f78f8a9a..6ef22134 100644
--- a/docs/header-menu-jsons/navigation_es.json
+++ b/docs/header-menu-jsons/navigation_es.json
@@ -31,7 +31,7 @@
"url": "/docs/es/lightning/"
},
{
- "title": "
La red TOR",
+ "title": "
La red Tor",
"url": "/docs/es/tor/"
},
{
diff --git a/docs/header-menu-jsons/navigation_fr.json b/docs/header-menu-jsons/navigation_fr.json
index 1442935d..fc5ebaf5 100644
--- a/docs/header-menu-jsons/navigation_fr.json
+++ b/docs/header-menu-jsons/navigation_fr.json
@@ -31,7 +31,7 @@
"url": "/docs/fr/lightning/"
},
{
- "title": "
TOR Network",
+ "title": "
Tor Network",
"url": "/docs/fr/tor/"
},
{
diff --git a/docs/header-menu-jsons/navigation_pt.json b/docs/header-menu-jsons/navigation_pt.json
index 4e62ba11..490d9989 100644
--- a/docs/header-menu-jsons/navigation_pt.json
+++ b/docs/header-menu-jsons/navigation_pt.json
@@ -31,7 +31,7 @@
"url": "/docs/pt/lightning/"
},
{
- "title": "
A rede TOR",
+ "title": "
A rede Tor",
"url": "/docs/pt/tor/"
},
{
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 79d0aac7..b4f8ae21 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -3,7 +3,6 @@ import ReactDOM from 'react-dom/client';
import Main from './basic/Main';
import { CssBaseline } from '@mui/material';
import HostAlert from './components/HostAlert';
-import TorConnectionBadge from './components/TorConnection';
import { I18nextProvider } from 'react-i18next';
import i18n from './i18n/Web';
@@ -28,7 +27,6 @@ const App = (): React.JSX.Element => {
{client === 'mobile' ? (
-
) : (
diff --git a/frontend/src/basic/DesktopBar/index.tsx b/frontend/src/basic/DesktopBar/index.tsx
deleted file mode 100644
index 38023fa2..00000000
--- a/frontend/src/basic/DesktopBar/index.tsx
+++ /dev/null
@@ -1,129 +0,0 @@
-import React, { useContext } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Tabs, Tab, Paper } from '@mui/material';
-import MoreTooltip from '../NavBar/DesktopBar/MoreTooltip';
-
-import {
- SettingsApplications,
- SmartToy,
- Storefront,
- AddBox,
- Assignment,
- MoreHoriz,
-} from '@mui/icons-material';
-import RobotAvatar from '../../components/RobotAvatar';
-import { AppContext, type UseAppStoreType, closeAll } from '../../contexts/AppContext';
-import { GarageContext, type UseGarageStoreType } from '../../contexts/GarageContext';
-import { Page } from '../NavBar';
-
-interface DesktopBarProps {
- changePage: (newPage: Page) => void;
-}
-
-const DesktopBar = ({ changePage }: DesktopBarProps): React.JSX.Element => {
- const { t } = useTranslation();
- const { page, settings, open, setOpen, navbarHeight } = useContext(AppContext);
- const { garage } = useContext(GarageContext);
-
- const color = settings.network === 'mainnet' ? 'primary' : 'secondary';
-
- const tabSx = { position: 'relative', bottom: '1em', minWidth: '2em' };
-
- const slot = garage.getSlot();
-
- const onChange = function (_mouseEvent: React.MouseEvent, newPage: Page): void {
- changePage(newPage);
- };
-
- return (
-
-
- {
- setOpen({ ...closeAll, profile: !open.profile });
- }}
- icon={
- slot?.hashId ? (
-
- ) : (
- <>>
- )
- }
- />
-
- }
- iconPosition='start'
- />
-
- }
- iconPosition='start'
- />
- } iconPosition='start' />
- }
- iconPosition='start'
- />
- }
- iconPosition='start'
- />
-
- {
- setOpen((open) => {
- return { ...open, more: !open.more };
- });
- }}
- icon={
-
-
-
- }
- iconPosition='start'
- />
-
-
- );
-};
-
-export default DesktopBar;
diff --git a/frontend/src/basic/NavBar/AppBar/index.tsx b/frontend/src/basic/NavBar/AppBar/index.tsx
index 1e7bf442..63a69612 100644
--- a/frontend/src/basic/NavBar/AppBar/index.tsx
+++ b/frontend/src/basic/NavBar/AppBar/index.tsx
@@ -15,6 +15,7 @@ import {
Fab,
Button,
Collapse,
+ CircularProgress,
} from '@mui/material';
import { useTranslation } from 'react-i18next';
import {
@@ -36,7 +37,7 @@ import { UseGarageStoreType, GarageContext } from '../../../contexts/GarageConte
import { Page } from '..';
import RobotAvatar from '../../../components/RobotAvatar';
import { AppContext, closeAll, UseAppStoreType } from '../../../contexts/AppContext';
-import { RoboSatsTextIcon } from '../../../components/Icons';
+import { RoboSatsTextIcon, TorIcon } from '../../../components/Icons';
import { genBase62Token } from '../../../utils';
import { UseFederationStoreType, FederationContext } from '../../../contexts/FederationContext';
@@ -48,13 +49,35 @@ const AppBar = ({ changePage }: AppBarProps): React.JSX.Element => {
const { t } = useTranslation();
const theme = useTheme();
const { garage } = useContext(GarageContext);
- const { open, setOpen, page } = useContext(AppContext);
+ const { open, setOpen, page, torStatus, client } = useContext(AppContext);
const { federation } = useContext(FederationContext);
const [show, setShow] = useState(false);
const [openGarage, setOpenGarage] = useState(false);
+ const [torColor, setTorColor] = useState<
+ 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning' | 'inherit'
+ >('error');
+ const [torProgress, setTorProgress] = useState(true);
+ const [torTitle, setTorTitle] = useState(t('Connection error'));
+
const slot = garage.getSlot();
+ useEffect(() => {
+ if (torStatus === 'OFF' || torStatus === 'STOPPING') {
+ setTorColor('primary');
+ setTorProgress(true);
+ setTorTitle(t('Initializing Tor daemon'));
+ } else if (torStatus === 'STARTING') {
+ setTorColor('warning');
+ setTorProgress(true);
+ setTorTitle(t('Connecting to Tor network'));
+ } else if (torStatus === 'ON') {
+ setTorColor('success');
+ setTorProgress(false);
+ setTorTitle(t('Connected to Tor network'));
+ }
+ }, [torStatus]);
+
const onSectionClick = (newPage: Page) => {
setShow(false);
changePage(newPage);
@@ -274,6 +297,38 @@ const AppBar = ({ changePage }: AppBarProps): React.JSX.Element => {
+ {client === 'mobile' && (
+
+
+
+ {torProgress ? (
+ <>
+
+
+
+
+ >
+ ) : (
+
+
+
+ )}
+
+
+
+
+ )}