Mirror/robosats
1
0
Fork 0
mirror of https://github.com/RoboSats/robosats.git synced 2024-12-13 10:56:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix Tor connection icon in web

Browse Source
This commit is contained in:
Reckless_Satoshi 2022-10-07 12:33:22 -07:00
parent 9bda934ee5
commit 19cc6e93ca
No known key found for this signature in database
GPG Key ID: 9C4585B561315571
2 changed files with 76 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

128
frontend/src/components/TorConnection.tsx
View File

@ -2,6 +2,52 @@ import React, { useEffect, useState } from 'react';
import { Box, CircularProgress, Tooltip } from '@mui/material';
import { TorIcon } from './Icons';
import { useTranslation } from 'react-i18next';
import { gridQuickFilterValuesSelector } from '@mui/x-data-grid';
interface Props {
color: 'inherit' | 'error' | 'warning' | 'success' | 'primary' | 'secondary' | 'info' | undefined;
tooltipOpen?: boolean | undefined;
title: string;
progress: boolean;
}
const TorIndicator = ({ color, tooltipOpen = undefined, title, progress }: Props): JSX.Element => {
return (
<Tooltip
open={tooltipOpen}
enterTouchDelay={0}
enterDelay={1000}
placement='right'
title={title}
>
<Box sx={{ display: 'inline-flex', position: 'fixed', left: '0.5em', top: '0.5em' }}>
{progress ? (
<>
<CircularProgress color={color} thickness={6} size={22} />
<Box
sx={{
top: 0,
left: 0,
bottom: 0,
right: 0,
position: 'absolute',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
}}
>
<TorIcon color={color} sx={{ width: 20, height: 20 }} />
</Box>
</>
) : (
<Box>
<TorIcon color={color} sx={{ width: 20, height: 20 }} />
</Box>
)}
</Box>
</Tooltip>
);
};
const TorConnection = (): JSX.Element => {
const [torStatus, setTorStatus] = useState<string>('NOTINIT');
@ -13,66 +59,38 @@ const TorConnection = (): JSX.Element => {
});
}, []);
if (window?.NativeRobosats && (torStatus === 'NOTINIT' || torStatus === 'STARTING')) {
if (!window?.NativeRobosats) {
return <></>;
}
if (torStatus === 'NOTINIT') {
return (
<Box sx={{ display: 'inline-flex', position: 'fixed', left: '0.5em', top: '0.5em' }}>
<Tooltip open={true} placement='right' title={t('Connecting to TOR network')}>
<CircularProgress color='warning' thickness={6} size={23} />
</Tooltip>
<Box
sx={{
top: 0,
left: 0,
bottom: 0,
right: 0,
position: 'absolute',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
}}
>
<TorIcon color='warning' sx={{ width: 20, height: 20 }} />
</Box>
</Box>
<TorIndicator
color='primary'
progress={true}
tooltipOpen={true}
title={t('Initializing TOR daemon')}
/>
);
} else if (window?.NativeRobosats && (torStatus === '"Done"' || torStatus === 'DONE')) {
} else if (torStatus === 'STARTING') {
return (
<Box
sx={{
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
position: 'fixed',
left: '0.5em',
top: '0.5em',
}}
>
<Tooltip
enterTouchDelay={0}
enterDelay={1000}
placement='right'
title={t('Connected to TOR network')}
>
<TorIcon color='success' sx={{ width: 20, height: 20 }} />
</Tooltip>
</Box>
<TorIndicator
color='warning'
progress={true}
tooltipOpen={true}
title={t('Connecting to TOR network')}
/>
);
} else if (true) {
} else if (torStatus === '"Done"' || torStatus === 'DONE') {
return <TorIndicator color='success' progress={false} title={t('Connected to TOR network')} />;
} else {
return (
<Box
sx={{
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
position: 'fixed',
left: '0.5em',
top: '0.5em',
}}
>
<Tooltip open={true} placement='right' title={t('TOR connection error')}>
<TorIcon color='error' sx={{ width: 20, height: 20 }} />
</Tooltip>
</Box>
<TorIndicator
color='error'
progress={false}
tooltipOpen={true}
title={t('Connection error')}
/>
);
}
};

5
frontend/static/locales/en.json
View File

@ -7,9 +7,10 @@
"You are self-hosting RoboSats": "You are self-hosting RoboSats",
"RoboSats client is served from your own node granting you the strongest security and privacy.": "RoboSats client is served from your own node granting you the strongest security and privacy.",
"Connected to TOR network": "Connected to TOR network",
"TOR connection error": "TOR connection error",
"Initializing TOR daemon": "Initializing TOR daemon",
"Connecting to TOR network": "Connecting to TOR network",
"Connected to TOR network": "Connected to TOR network",
"Connection error": "Connection error",
"USER GENERATION PAGE - UserGenPage.js": "Landing Page and User Generation",
"Simple and Private LN P2P Exchange": "Simple and Private LN P2P Exchange",