general settings - display language control added

ErgoWallet · Oct 19, 2020 · a0ae911 · a0ae911
1 parent 1b4a0cf
commit a0ae911
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 21 deletions.
diff --git a/src/main/application/services/wallet/Wallet.ts b/src/main/application/services/wallet/Wallet.ts
@@ -1,5 +1,5 @@
 import {SignedTransaction, UnsignedTransaction} from "./TransactionBuilder";
-import {AdditionalRegisters, Output, TokenValue, Transaction} from "../../../ergoplatform/connector/types";
+import {AdditionalRegisters, Output, Transaction} from "../../../ergoplatform/connector/types";
 
 export type WalletTx = Omit<Transaction, 'outputs'> & {
   value: any;

diff --git a/src/renderer/components/Hex.tsx b/src/renderer/components/Hex.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import styled from "styled-components";
 
 interface HexProps {

diff --git a/src/renderer/modules/app/MainScreen.tsx b/src/renderer/modules/app/MainScreen.tsx
@@ -1,4 +1,4 @@
-import {AppBar, Button, Container, IconButton, Toolbar} from '@material-ui/core';
+import {AppBar, Button, Container, IconButton, Toolbar, Tooltip} from '@material-ui/core';
 import {RouteComponentProps, Router, useNavigate} from '@reach/router';
 import * as React from 'react';
 import Exchange from '../exchange/Exchange';
@@ -7,7 +7,6 @@ import Settings from '../settings/Settings';
 import {makeStyles} from '@material-ui/core/styles';
 import {SettingsOutlined as SettingsIcon} from '@material-ui/icons';
 import AccountBalanceWalletOutlinedIcon from '@material-ui/icons/AccountBalanceWalletOutlined';
-import SyncOutlinedIcon from '@material-ui/icons/SyncOutlined';
 import ExitToAppOutlinedIcon from '@material-ui/icons/ExitToAppOutlined';
 import {ScrollToTop} from "../../components/ScrollToTop";
 
@@ -130,12 +129,16 @@ const MainScreen = (props: MainScreenProps) => {
             {/*</Button>*/}
           </div>
           <div className={classes.grow} />
-          <IconButton onClick={() => navigate('settings')} color="inherit">
-            <SettingsIcon />
-          </IconButton>
-          <IconButton onClick={props.onLogout} edge="end" color="inherit">
-            <ExitToAppOutlinedIcon />
-          </IconButton>
+          <Tooltip title={"Settings"}>
+            <IconButton onClick={() => navigate('settings')} color="inherit">
+              <SettingsIcon />
+            </IconButton>
+          </Tooltip>
+          <Tooltip title={"Close wallet"}>
+            <IconButton onClick={props.onLogout} edge="end" color="inherit">
+              <ExitToAppOutlinedIcon />
+            </IconButton>
+          </Tooltip>
         </Toolbar>
       </AppBar>
 

diff --git a/src/renderer/modules/app/onboarding/CreateWallet/NewMnemonic.tsx b/src/renderer/modules/app/onboarding/CreateWallet/NewMnemonic.tsx
@@ -64,7 +64,7 @@ function NewMnemonic(props: Props) {
               {/* Show 24 word in 3 columns with numbers */}
               {
                 [0, 1, 2].map((i) => (
-                  <Grid item lg={4} md={4} sm={4} container direction={'column'}>
+                  <Grid key={i} item lg={4} md={4} sm={4} container direction={'column'}>
                     { words.slice(i * wordsInColumn, (i + 1) * wordsInColumn).map((word: string, index: number) =>
                       (<div>{index+(i * wordsInColumn + 1)}. <span className={classes.phrase}>{word}</span></div>))
                     }
@@ -78,7 +78,7 @@ function NewMnemonic(props: Props) {
               Never share recovery phrase with anyone, store it securely
             </Alert>
           </Grid>
-          <Grid item xs={12} spacing={1}>
+          <Grid item xs={12}>
             <FormControlLabel
               control={<Checkbox checked={checked} value="remember" color="primary" onChange={handleChange}/>}
               label="I understand that if I lose my recovery phrase, I will not be able to access my wallet"

diff --git a/src/renderer/modules/settings/About.tsx b/src/renderer/modules/settings/About.tsx
@@ -1,16 +1,17 @@
 import * as React from 'react';
+import {Box} from "@material-ui/core";
 
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const pkg = require( '../../../../package.json');
 
 function About () {
   return (
-    <>
-      <div>Ergo Wallet v{pkg.version}</div>
-      <div>
+    <Box>
+      <Box>Ergo Wallet v{pkg.version}</Box>
+      <Box>
         App Icon made by <a href="https://www.flaticon.com/authors/good-ware" rel="noreferrer" target="_blank" title="Good Ware">Good Ware</a> from <a rel="noreferrer" target="_blank" href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a>
-      </div>
-    </>
+      </Box>
+    </Box>
   );
 }
 

diff --git a/src/renderer/modules/settings/Settings.tsx b/src/renderer/modules/settings/Settings.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import {Tabs, Tab, Box} from '@material-ui/core';
+import {Box, MenuItem, Tab, Tabs, TextField} from '@material-ui/core';
 import Paper from '../../components/Paper';
 import About from './About';
 
@@ -28,20 +28,31 @@ function TabPanel(props: TabPanelProps) {
 function Settings(props: any) {
   const [value, setValue] = React.useState(0);
 
-  const handleChange = (event: React.ChangeEvent<{}>, newValue: number) => {
+  const handleTabChange = (event: React.ChangeEvent<{}>, newValue: number) => {
     setValue(newValue);
   };
 
   return (
     <React.Fragment>
-      <Tabs value={value} onChange={handleChange}>
+      <Tabs value={value} onChange={handleTabChange}>
         <Tab label="General"/>
         <Tab label="Wallet"/>
         <Tab label="About"/>
       </Tabs>
       <Paper>
         <TabPanel value={value} index={0}>
-          General settings
+          <TextField
+            fullWidth={true}
+            select
+            label="Display language"
+            value={"English"}
+            variant="outlined"
+          >
+              <MenuItem key={"English"} value={"English"}>
+                English
+              </MenuItem>
+          </TextField>
+
         </TabPanel>
         <TabPanel value={value} index={1}>
           Backup mnemonic phrase