Skip to content

Commit 08bc8aa

Browse files
author
Harsh Dev Pathak
committed
chore: Optmized wallet federation data and trasaction details
1 parent 4532942 commit 08bc8aa

File tree

17 files changed

+145
-106
lines changed

17 files changed

+145
-106
lines changed

‎index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919

2020
<link rel="shortcut icon" href="src/assets/favicon.webp" type="image/x-icon">
2121
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
22+
<meta name="description" content="Fedimint Web Wallet is an open-source web wallet for federated Bitcoin eCash with Lightning and Nostr Wallet Connect support.">
2223
<title>Fedimint Wallet</title>
2324
</head>
2425

‎public/logo.webp‎ renamed to ‎src/assets/logo.webp‎

File renamed without changes.

‎src/components/Activities.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -220,7 +220,7 @@ export default function Activities() {
220220
const isPositive = ['receive', 'reissue', 'deposit'].includes(
221221
tx.type
222222
);
223-
const isNegative = ['send', 'spend_oob', 'withdraw'].includes(
223+
const isNegative = ['pay', 'spend_oob', 'withdraw'].includes(
224224
tx.type
225225
);
226226
return (

‎src/components/AddFederation.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { useRef, useContext, useState } from 'react';
22
import { useDispatch, useSelector } from 'react-redux';
33
import Tippy from '@tippyjs/react';
44
import type { RootState, AppDispatch } from '../redux/store';
5-
import { setJoining, setWalletId } from '../redux/slices/ActiveWallet';
5+
import { setWalletId } from '../redux/slices/ActiveWallet';
66
import LoadingContext from '../context/Loading';
77
import Alerts from './Alerts';
88
import { JoinFederation as JoinFederationService } from '../services/FederationService';
@@ -26,15 +26,15 @@ export default function AddFederation({
2626
const { setWallet, switchWallet } = useWallet();
2727
const [recover, setRecover] = useState<boolean>(false);
2828
const dispatch = useDispatch<AppDispatch>();
29-
const { joining } = useSelector((state: RootState) => state.activeFederation);
29+
const [joining, setJoining] = useState<boolean>(false);
3030
const { error } = useSelector((state: RootState) => state.Alert);
3131

3232
const handleJoinFederation = async (e?: React.FormEvent, qrData?: string): Promise<void> => {
3333
e?.preventDefault();
3434

3535
const code = inviteCode || qrData;
3636
if (!code) return; // invitecode should not be empty
37-
dispatch(setJoining(true));
37+
setJoining(true);
3838

3939
try {
4040
startProgress();
@@ -61,7 +61,7 @@ export default function AddFederation({
6161
})
6262
);
6363
} finally {
64-
dispatch(setJoining(false));
64+
setJoining(false);
6565
doneProgress();
6666
setJoinForm(false);
6767
setLoader(false);

‎src/components/LnPaymentForm.tsx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import React from 'react';
2+
3+
export default function LnPaymentForm() {
4+
return <></>;
5+
}

‎src/components/Navbar.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
// import React from 'react'
1+
import logo from '../assets/logo.webp';
22

33
export default function Navbar() {
44
return (
55
<>
66
<nav>
7-
<img src="fedimint-web-wallet/logo.webp" alt="logo" width={'180vw'} />
7+
<img src={logo} alt="Fedimint Wallet" width={'180vw'} />
88
</nav>
99
</>
1010
);

‎src/components/SendReceiveFAB.tsx‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import { useState, useEffect, useRef } from 'react';
2+
import { useLocation, useNavigate } from 'react-router';
3+
import Tippy from '@tippyjs/react';
4+
5+
export default function SendReceiveFAB() {
6+
const [open, setOpen] = useState(false);
7+
const location = useLocation();
8+
const [width, setWidth] = useState(window.innerWidth);
9+
const navigate = useNavigate();
10+
const fabRef = useRef<HTMLDivElement | null>(null);
11+
12+
useEffect(() => {
13+
const handleResize = () => setWidth(window.innerWidth);
14+
window.addEventListener('resize', handleResize);
15+
return () => window.removeEventListener('resize', handleResize);
16+
}, []);
17+
18+
useEffect(() => {
19+
const handleClickOutside = (event: MouseEvent) => {
20+
if (fabRef.current && !fabRef.current.contains(event.target as Node)) {
21+
setOpen(false);
22+
}
23+
};
24+
document.addEventListener('mousedown', handleClickOutside);
25+
return () => document.removeEventListener('mousedown', handleClickOutside);
26+
}, []);
27+
28+
if (location.pathname === '/wallet' || width > 750) return null;
29+
30+
return (
31+
<div className="fab-container" ref={fabRef}>
32+
<button className="fab-main" onClick={() => setOpen(!open)}>
33+
<i className="fa-solid fa-bolt"></i>
34+
</button>
35+
36+
<button
37+
className={`fab-side fab-send ${open ? 'open' : ''}`}
38+
onClick={() => navigate('/send')}
39+
>
40+
<Tippy content="Send">
41+
<i className="fa-solid fa-arrow-up"></i>
42+
</Tippy>
43+
</button>
44+
45+
<button
46+
className={`fab-side fab-receive ${open ? 'open' : ''}`}
47+
onClick={() => navigate('/receive')}
48+
>
49+
<Tippy content="Receive">
50+
<i className="fa-solid fa-arrow-down"></i>
51+
</Tippy>
52+
</button>
53+
</div>
54+
);
55+
}

‎src/context/WalletManager.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { useDispatch, useSelector } from 'react-redux';
1111
import type { FederationConfig, FederationMetaData } from '../hooks/Federation.type';
1212
import { fetchFederationDetails } from '../services/FederationService';
1313
import { setWalletId } from '../redux/slices/ActiveWallet';
14-
import { setFederationId } from '../redux/slices/ActiveWallet';
14+
import { setFederationId } from '../redux/slices/FederationDetails';
1515
import { setFederationDetails, setFederationMetaData } from '../redux/slices/FederationDetails';
1616
import { startProgress, doneProgress } from '../utils/ProgressBar';
1717
import LoadingContext from './Loading';
@@ -321,10 +321,9 @@ export const WalletManagerProvider: React.FC<{ children: React.ReactNode }> = ({
321321
throw new Error('Failed to load initial wallet');
322322
}
323323
} else {
324-
logger.log('No wallet found, redirecting to home');
324+
logger.log('No wallet found, while initalizing the wallet');
325325
globalWalletState.isInitialized = true;
326326
dispatch(setWalletStatus('closed'));
327-
navigate('/');
328327
}
329328
} catch (error) {
330329
logger.error('Failed to load initial wallet:', error);
@@ -336,7 +335,7 @@ export const WalletManagerProvider: React.FC<{ children: React.ReactNode }> = ({
336335
message: error instanceof Error ? error.message : 'Failed to load wallet',
337336
})
338337
);
339-
navigate('/');
338+
navigate('/create');
340339
}
341340
})();
342341

‎src/pages/JoinFederation.tsx‎

Lines changed: 34 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@ import { useSelector, useDispatch } from 'react-redux';
55
import type { RootState, AppDispatch } from '../redux/store';
66
import Alerts from '../components/Alerts';
77
import Navbar from '../components/Navbar';
8-
import { setJoining, setFederationId, setNewJoin, setWalletId } from '../redux/slices/ActiveWallet';
8+
import { setNewJoin, setWalletId } from '../redux/slices/ActiveWallet';
9+
import { setFederationId } from '../redux/slices/FederationDetails';
910
import { setErrorWithTimeout } from '../redux/slices/Alerts';
1011
import {
1112
JoinFederation as JoinFederationService,
@@ -18,7 +19,7 @@ import DiscoverFederation from '../components/DiscoverFederation';
1819
import { setWalletStatus } from '../redux/slices/WalletSlice';
1920
import '../style/JoinFederation.css';
2021
import QRScanner from '../components/QrScanner';
21-
import Tippy from '@tippyjs/react';
22+
import { setRecoverySate } from '../redux/slices/ActiveWallet';
2223

2324
export default function JoinFederation() {
2425
const [inviteCode, setInviteCode] = useState<string>('');
@@ -31,14 +32,17 @@ export default function JoinFederation() {
3132
const [recover, setRecover] = useState<boolean>(false);
3233
const navigate = useNavigate();
3334
const dispatch = useDispatch<AppDispatch>();
34-
const { joining } = useSelector((state: RootState) => state.activeFederation);
35+
const [joining, setJoining] = useState<boolean>(false);
3536
const { error } = useSelector((state: RootState) => state.Alert);
37+
const [recovering, setRecovering] = useState<boolean>(false);
3638

37-
const handleJoinFederation = async (code?: string): Promise<void> => {
38-
dispatch(setJoining(true));
39+
const handleJoinFederation = async (code?: string, recover?: boolean): Promise<void> => {
40+
setJoining(true);
41+
if (recover) {
42+
setRecovering(true);
43+
}
3944
try {
4045
startProgress();
41-
logger.log('recovery? ', recover);
4246
const result = await JoinFederationService(
4347
code || inviteCode,
4448
walletName.current?.value || 'fm-default',
@@ -54,7 +58,8 @@ export default function JoinFederation() {
5458
} catch (err) {
5559
dispatch(setErrorWithTimeout({ type: 'Join Error:', message: `${err}` }));
5660
} finally {
57-
dispatch(setJoining(false));
61+
setJoining(false);
62+
setRecovering(false);
5863
doneProgress();
5964
}
6065
};
@@ -167,25 +172,28 @@ export default function JoinFederation() {
167172
: 'N/A'}
168173
</span>
169174
</div>
170-
<label className="recovery-label">
171-
<input
172-
type="checkbox"
173-
checked={recover}
174-
onChange={(e) => setRecover(e.target.checked)}
175-
/>
176-
Recover Wallet{' '}
177-
<Tippy content="It will recover your wallet instead creating new one">
178-
<i className="fa-solid fa-info-circle"></i>
179-
</Tippy>
180-
</label>
181-
<button
182-
onClick={() => {
183-
handleJoinFederation();
184-
}}
185-
disabled={joining}
186-
>
187-
{joining ? 'Joining...' : 'Join'}
188-
</button>
175+
<div className="preview-action-btn">
176+
<button
177+
onClick={() => {
178+
handleJoinFederation();
179+
}}
180+
disabled={joining}
181+
>
182+
<i className="fa-solid fa-arrow-right-to-bracket"></i>{' '}
183+
{joining ? 'Joining...' : 'Join'}
184+
</button>
185+
<button
186+
onClick={() => {
187+
setRecover(true);
188+
dispatch(setRecoverySate({ status: true }));
189+
handleJoinFederation(undefined, true);
190+
}}
191+
disabled={recovering}
192+
>
193+
<i className="fa-solid fa-rotate-right"></i>{' '}
194+
{recovering ? 'Recovering...' : 'Recover'}
195+
</button>
196+
</div>
189197
</div>
190198
</div>
191199
</div>

‎src/pages/Main.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import Header from '../components/Header';
1010
import type { FederationConfig } from '../hooks/Federation.type';
1111
import LoadingContext from '../context/Loading';
1212
import webloader from '../assets/loader.webp';
13+
import SendReceiveFAB from '../components/SendReceiveFAB';
1314

1415
export default function Main() {
1516
const dispatch = useDispatch<AppDispatch>();
@@ -150,6 +151,7 @@ export default function Main() {
150151
</div>
151152
</div>
152153
)}
154+
<SendReceiveFAB />
153155
</main>
154156
)
155157
);

0 commit comments

Comments
 (0)