cerc-io/laconic-wallet-web
17
0
Fork 2
Code Issues 1 Pull Requests Actions Packages Projects Releases 3 Wiki Activity

UI/UX improvements in laconic wallet web app (#3)

Browse Source 
Part of [laconicd testnet validator enrollment](https://www.notion.so/laconicd-testnet-validator-enrollment-6fc1d3cafcc64fef8c5ed3affa27c675)

- Fix private key shown in dialog box
- Add laconicd network and set as default
- Update web app title and favicon

Co-authored-by: IshaVenikar <ishavenikar7@gmail.com>
Reviewed-on: #3
This commit is contained in:
nabarun 2024-07-29 11:26:10 +00:00
parent e8535fbdd5
commit 4d5fd722fb
17 changed files with 45 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.env.example
View File

@ -2,3 +2,4 @@ REACT_APP_WALLET_CONNECT_PROJECT_ID=
REACT_APP_DEFAULT_GAS_PRICE=0.025 REACT_APP_DEFAULT_GAS_PRICE=0.025
# Reference: https://github.com/cosmos/cosmos-sdk/issues/16020 # Reference: https://github.com/cosmos/cosmos-sdk/issues/16020
REACT_APP_GAS_ADJUSTMENT=2 REACT_APP_GAS_ADJUSTMENT=2
REACT_APP_LACONICD_RPC_URL=https://laconicd.laconic.com

BIN
public/favicon.ico
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 15 KiB

4
public/index.html
View File

@ -7,7 +7,7 @@
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<meta <meta
name="description" name="description"
content="Web site created using create-react-app" content="Laconic Wallet Web App"
/> />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!-- <!--
@ -24,7 +24,7 @@
work correctly both with client-side routing and a non-root public URL. work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`. Learn how to configure a non-root public URL by running `npm run build`.
--> -->
<title>React App</title> <title>Laconic Wallet</title>
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>

BIN
public/logo192.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.2 KiB

After

Width:  |  Height:  |  Size: 16 KiB

BIN
public/logo512.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.4 KiB

After

Width:  |  Height:  |  Size: 63 KiB

4
public/manifest.json
View File

@ -1,6 +1,6 @@
{ {
"short_name": "React App", "short_name": "Laconic Wallet",
"name": "Create React App Sample", "name": "Laconic Wallet Web App",
"icons": [ "icons": [
{ {
"src": "favicon.ico", "src": "favicon.ico",

5
src/App.tsx
View File

@ -223,12 +223,13 @@ const App = (): React.JSX.Element => {
}} }}
> >
<Stack.Screen <Stack.Screen
name="Laconic" name="Home"
component={HomeScreen} component={HomeScreen}
options={{ options={{
// eslint-disable-next-line react/no-unstable-nested-components // eslint-disable-next-line react/no-unstable-nested-components
headerTitle: () => <Text variant="titleLarge">Laconic Wallet</Text>, headerTitle: () => <Text variant="titleLarge">Laconic Wallet</Text>,
}} /> }}
/>
<Stack.Screen <Stack.Screen
name="SignMessage" name="SignMessage"
component={SignMessage} component={SignMessage}

4
src/components/ShowPKDialog.tsx
View File

@ -65,6 +65,10 @@ const ShowPKDialog = () => {
component="pre" component="pre"
variant="body1" variant="body1"
style={styles.dataBoxData} style={styles.dataBoxData}
sx={{
wordWrap: 'break-word',
whiteSpace: 'initial',
}}
> >
{privateKey} {privateKey}
</Typography> </Typography>

8
src/index.tsx
View File

@ -38,7 +38,13 @@ root.render(
<NetworksProvider> <NetworksProvider>
<AccountsProvider> <AccountsProvider>
<WalletConnectProvider> <WalletConnectProvider>
<NavigationContainer linking={linking}> <NavigationContainer
linking={linking}
documentTitle={{
formatter: () =>
`Laconic Wallet`,
}}
>
<React.Fragment> <React.Fragment>
{Platform.OS === 'web' ? ( {Platform.OS === 'web' ? (
<style type="text/css">{` <style type="text/css">{`

2
src/screens/AddNetwork.tsx
View File

@ -198,7 +198,7 @@ const AddNetwork = () => {
), ),
]); ]);
navigation.navigate('Laconic'); navigation.navigate('Home');
}, },
[navigation, namespace, setNetworksData], [navigation, namespace, setNetworksData],
); );

6
src/screens/ApproveTransaction.tsx
View File

@ -214,7 +214,7 @@ const ApproveTransaction = ({ route }: ApproveTransactionProps) => {
await web3wallet!.respondSessionRequest({ topic, response }); await web3wallet!.respondSessionRequest({ topic, response });
setIsRequestAccepted(false); setIsRequestAccepted(false);
navigation.navigate('Laconic'); navigation.navigate('Home');
} catch (error) { } catch (error) {
if (!(error instanceof Error)) { if (!(error instanceof Error)) {
throw error; throw error;
@ -234,7 +234,7 @@ const ApproveTransaction = ({ route }: ApproveTransactionProps) => {
response, response,
}); });
navigation.navigate('Laconic'); navigation.navigate('Home');
}; };
return ( return (
@ -301,7 +301,7 @@ const ApproveTransaction = ({ route }: ApproveTransactionProps) => {
visible={isTxErrorDialogOpen} visible={isTxErrorDialogOpen}
hideDialog={async () => { hideDialog={async () => {
setIsTxErrorDialogOpen(false); setIsTxErrorDialogOpen(false);
navigation.navigate('Laconic'); navigation.navigate('Home');
}} }}
/> />
</> </>

8
src/screens/ApproveTransfer.tsx
View File

@ -336,7 +336,7 @@ const ApproveTransfer = ({ route }: SignRequestProps) => {
const { topic } = requestEvent; const { topic } = requestEvent;
await web3wallet!.respondSessionRequest({ topic, response }); await web3wallet!.respondSessionRequest({ topic, response });
navigation.navigate('Laconic'); navigation.navigate('Home');
} catch (error) { } catch (error) {
if (!(error instanceof Error)) { if (!(error instanceof Error)) {
throw error; throw error;
@ -356,7 +356,7 @@ const ApproveTransfer = ({ route }: SignRequestProps) => {
response, response,
}); });
navigation.navigate('Laconic'); navigation.navigate('Home');
}; };
useEffect(() => { useEffect(() => {
@ -404,7 +404,7 @@ const ApproveTransfer = ({ route }: SignRequestProps) => {
<Appbar.BackAction <Appbar.BackAction
onPress={async () => { onPress={async () => {
await rejectRequestHandler(); await rejectRequestHandler();
navigation.navigate('Laconic'); navigation.navigate('Home');
}} }}
/> />
)} )}
@ -660,7 +660,7 @@ const ApproveTransfer = ({ route }: SignRequestProps) => {
setIsTxErrorDialogOpen(false); setIsTxErrorDialogOpen(false);
if (!isSufficientFunds || !balance || !fees) { if (!isSufficientFunds || !balance || !fees) {
rejectRequestHandler(); rejectRequestHandler();
navigation.navigate('Laconic'); navigation.navigate('Home');
} }
}} }}
/> />

2
src/screens/EditNetwork.tsx
View File

@ -90,7 +90,7 @@ const EditNetwork = ({ route }: EditNetworkProps) => {
setNetworksData(retrievedNetworksData); setNetworksData(retrievedNetworksData);
navigation.navigate('Laconic'); navigation.navigate('Home');
}, },
[networkData, navigation, setNetworksData], [networkData, navigation, setNetworksData],
); );

2
src/screens/InvalidPath.tsx
View File

@ -19,7 +19,7 @@ const InvalidPath = () => {
<Button <Button
mode="contained" mode="contained"
onPress={() => { onPress={() => {
navigation.navigate('Laconic'); navigation.navigate('Home');
}}> }}>
Home Home
</Button> </Button>

6
src/screens/SignRequest.tsx
View File

@ -222,7 +222,7 @@ const SignRequest = ({ route }: SignRequestProps) => {
} }
setIsApproving(false); setIsApproving(false);
navigation.navigate('Laconic'); navigation.navigate('Home');
}; };
const rejectRequestHandler = async () => { const rejectRequestHandler = async () => {
@ -237,7 +237,7 @@ const SignRequest = ({ route }: SignRequestProps) => {
} }
setIsRejecting(false); setIsRejecting(false);
navigation.navigate('Laconic'); navigation.navigate('Home');
}; };
useEffect(() => { useEffect(() => {
@ -252,7 +252,7 @@ const SignRequest = ({ route }: SignRequestProps) => {
<Appbar.BackAction <Appbar.BackAction
onPress={async () => { onPress={async () => {
await rejectRequestHandler(); await rejectRequestHandler();
navigation.navigate('Laconic'); navigation.navigate('Home');
}} }}
/> />
)} )}

2
src/types.ts
View File

@ -5,7 +5,7 @@ import { Web3WalletTypes } from '@walletconnect/web3wallet';
import { EncodeObject } from '@cosmjs/proto-signing'; import { EncodeObject } from '@cosmjs/proto-signing';
export type StackParamsList = { export type StackParamsList = {
Laconic: undefined; Home: undefined;
SignMessage: { SignMessage: {
selectedNamespace: string; selectedNamespace: string;
selectedChainId: string; selectedChainId: string;

12
src/utils/constants.ts
View File

@ -4,6 +4,18 @@ import { EIP155_CHAINS } from './wallet-connect/EIP155Data';
export const EIP155 = 'eip155'; export const EIP155 = 'eip155';
export const COSMOS = 'cosmos'; export const COSMOS = 'cosmos';
export const DEFAULT_NETWORKS = [ export const DEFAULT_NETWORKS = [
{
chainId: 'laconic_9000-1',
networkName: 'laconicd',
namespace: COSMOS,
rpcUrl: process.env.REACT_APP_LACONICD_RPC_URL!,
blockExplorerUrl: '',
nativeDenom: 'photon',
addressPrefix: 'laconic',
coinType: '118',
gasPrice: '0.01',
isDefault: true,
},
{ {
chainId: '1', chainId: '1',
networkName: EIP155_CHAINS['eip155:1'].name, networkName: EIP155_CHAINS['eip155:1'].name,