Skip to content

Commit

Permalink
Overall improvements in node admin for HOPRd 2.1.5 (#640)
Browse files Browse the repository at this point in the history
* overall improvements in node admin

* better withdraw validation"

* format

* test for a space in an alias

* format
  • Loading branch information
mjadach-iv authored Nov 12, 2024
1 parent fb45691 commit 9cf6f90
Show file tree
Hide file tree
Showing 5 changed files with 63 additions and 21 deletions.
30 changes: 26 additions & 4 deletions src/components/Modal/node/AddAliasModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,19 +28,29 @@ export const CreateAliasModal = (props: CreateAliasModalProps) => {
const [alias, set_alias] = useState<string>('');
const [peerId, set_peerId] = useState<string>(props.peerId ? props.peerId : '');
const [duplicateAlias, set_duplicateAlias] = useState(false);
const [duplicatePeerId, set_duplicatePeerId] = useState(false);
const [openModal, setOpenModal] = useState(false);

const aliasesArr = aliases ? Object.keys(aliases) : [];
const aliasPeerIdsArr = aliases ? Object.values(aliases) : [];
const aliasIncludesASpace = alias.includes(' ');

const setPropPeerId = () => {
if (props.peerId) set_peerId(props.peerId);
};
useEffect(setPropPeerId, [props.peerId]);

const handleChangePeerId = (event: React.ChangeEvent<HTMLInputElement>) => {
if (aliasPeerIdsArr.includes(event.target.value)) {
set_duplicatePeerId(true);
} else {
set_duplicatePeerId(false);
}
set_peerId(event.target.value);
};

const handleChangeAlias = (event: React.ChangeEvent<HTMLInputElement>) => {
if (aliases && Object.keys(aliases).includes(event.target.value)) {
if (aliasesArr.includes(event.target.value)) {
set_duplicateAlias(true);
} else {
set_duplicateAlias(false);
Expand All @@ -54,6 +64,7 @@ export const CreateAliasModal = (props: CreateAliasModalProps) => {

const handleCloseModal = () => {
set_duplicateAlias(false);
set_duplicatePeerId(false);
setOpenModal(false);
set_peerId(props.peerId ? props.peerId : '');
set_alias('');
Expand Down Expand Up @@ -150,6 +161,9 @@ export const CreateAliasModal = (props: CreateAliasModalProps) => {
placeholder="12D3Ko...Z3rz5F"
onChange={handleChangePeerId}
value={peerId}
error={duplicatePeerId}
helperText={duplicatePeerId ? 'This Peer Id already has an alias!' : ''}
style={{ minHeight: '79px' }}
/>
<TextField
type="text"
Expand All @@ -158,14 +172,22 @@ export const CreateAliasModal = (props: CreateAliasModalProps) => {
placeholder="Alias"
onChange={handleChangeAlias}
value={alias}
error={duplicateAlias}
helperText={duplicateAlias ? 'This is a duplicate alias!' : ''}
error={duplicateAlias || alias.includes(' ')}
helperText={
duplicateAlias
? 'This is a duplicate alias!'
: aliasIncludesASpace
? "An alias can't include a space"
: ''
}
style={{ minHeight: '79px' }}
/>
</SDialogContent>
<DialogActions>
<Button
disabled={alias.length === 0 || peerId.length === 0 || duplicateAlias}
disabled={
alias.length === 0 || peerId.length === 0 || duplicateAlias || duplicatePeerId || aliasIncludesASpace
}
onClick={handleAddAlias}
style={{
marginRight: '16px',
Expand Down
28 changes: 24 additions & 4 deletions src/components/Modal/node/WithdrawModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -76,16 +76,21 @@ const WithdrawModal = ({ initialCurrency }: WithdrawModalProps) => {
const dispatch = useAppDispatch();
const hoprBalance = useAppSelector((state) => state.node.balances.data.hopr);
const nativeBalance = useAppSelector((state) => state.node.balances.data.native);
const safeAddress = useAppSelector((state) => state.node.info.data?.hoprNodeSafe);
const loginData = useAppSelector((store) => store.auth.loginData);
const { apiEndpoint, apiToken } = useAppSelector((state) => state.auth.loginData);
// local states
const [openModal, set_openModal] = useState(false);
const [currency, set_currency] = useState<'HOPR' | 'NATIVE'>(initialCurrency ?? 'NATIVE');
const [amount, set_amount] = useState<string>('');
const [maxAmount, set_maxAmount] = useState<string>('');
const [recipient, set_recipient] = useState<string>('');
const [isLoading, set_isLoading] = useState(false);
const [transactionHash, set_transactionHash] = useState('');

const withdrawingZeroOrLess = amount ? parseEther(amount) <= parseEther('0') : false;
const withdrawingMoreThanTheWallet = amount ? parseEther(amount) > parseEther(maxAmount) : false;

useEffect(() => {
setMaxAmount();
}, [currency]);
Expand All @@ -101,8 +106,10 @@ const WithdrawModal = ({ initialCurrency }: WithdrawModalProps) => {
const setMaxAmount = () => {
if (currency === 'HOPR' && hoprBalance.formatted) {
set_amount(hoprBalance.formatted);
set_maxAmount(hoprBalance.formatted);
} else if (currency === 'NATIVE' && nativeBalance.formatted) {
set_amount(nativeBalance.formatted);
set_maxAmount(nativeBalance.formatted);
}
};

Expand Down Expand Up @@ -193,8 +200,18 @@ const WithdrawModal = ({ initialCurrency }: WithdrawModalProps) => {
}}
select
>
<MenuItem value={'HOPR'}>{HOPR_TOKEN_USED}</MenuItem>
<MenuItem value={'NATIVE'}>xDai</MenuItem>
<MenuItem
value={'NATIVE'}
disabled={!nativeBalance.value || nativeBalance.value === '0'}
>
xDai
</MenuItem>
<MenuItem
value={'HOPR'}
disabled={!hoprBalance.value || hoprBalance.value === '0'}
>
{HOPR_TOKEN_USED}
</MenuItem>
</TextField>
<TextFieldWithoutArrows
type="number"
Expand All @@ -208,19 +225,22 @@ const WithdrawModal = ({ initialCurrency }: WithdrawModalProps) => {
<MaxButton onClick={setMaxAmount}>Max</MaxButton>
</InputAdornment>
),
inputProps: { min: 0 },
inputProps: { min: 0, step: 'any' },
}}
/>
<TextField
type="text"
label="Recipient"
placeholder="0x4f5a...1728"
placeholder={
safeAddress ? `${safeAddress.substring(0, 6)}...${safeAddress.substring(38)}` : '0x4f5a...1728'
}
value={recipient}
onChange={(e) => set_recipient(e.target.value)}
/>
<Button
onClick={handleWithdraw}
pending={isLoading}
disabled={!recipient || !amount || withdrawingZeroOrLess || withdrawingMoreThanTheWallet}
>
Withdraw
</Button>
Expand Down
2 changes: 1 addition & 1 deletion src/pages/node/channelsOutgoing.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,7 @@ function ChannelsPage() {
e instanceof sdkApiError &&
e.hoprdErrorPayload?.error?.includes('channel closure time has not elapsed yet, remaining')
) {
let errMsg = `Closing of outgoing channel ${channelId} halted. C${e.hoprdErrorPayload?.error.substring(1)}`;
const errMsg = `Closing of outgoing channel ${channelId} halted. C${e.hoprdErrorPayload?.error.substring(1)}`;
sendNotification({
notificationPayload: {
source: 'node',
Expand Down
12 changes: 12 additions & 0 deletions src/pages/node/info/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@ function InfoPage() {
: null;
const blockNumber = blockNumberFromMetrics ?? blockNumberFromInfo;
const blockNumberCheckSum = blockNumberCheckSumFromMetrics ?? blockNumberCheckSumFromInfo;
const ticketPrice = useAppSelector((store) => store.node.ticketPrice.data);

useEffect(() => {
fetchInfoData();
Expand Down Expand Up @@ -324,6 +325,17 @@ function InfoPage() {
</th>
<td>{blockNumberCheckSum ? blockNumberCheckSum : '-'}</td>
</tr>
<tr>
<th>
<Tooltip
title="The current price of a single ticket"
notWide
>
<span>Current ticket price</span>
</Tooltip>
</th>
<td>{ticketPrice ? formatEther(BigInt(ticketPrice as string)) : '-'} wxHOPR</td>
</tr>
</tbody>
</TableExtended>

Expand Down
12 changes: 0 additions & 12 deletions src/pages/node/tickets.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ function TicketsPage() {
const statisticsFetching = useAppSelector((store) => store.node.statistics.isFetching);
const redeemTicketsFetching = useAppSelector((store) => store.node.redeemTickets.isFetching);
const redeemTicketsErrors = useAppSelector((store) => store.node.redeemTickets.error);
const ticketPrice = useAppSelector((store) => store.node.ticketPrice.data);
const loginData = useAppSelector((store) => store.auth.loginData);

useEffect(() => {
Expand Down Expand Up @@ -92,17 +91,6 @@ function TicketsPage() {
style={{ marginBottom: '32px' }}
>
<tbody>
<tr>
<th>
<Tooltip
title="The price of a single ticket."
notWide
>
<span>Ticket price</span>
</Tooltip>
</th>
<td>{ticketPrice ? formatEther(BigInt(ticketPrice as string)) : '-'} wxHOPR</td>
</tr>
<tr>
<th>
<Tooltip
Expand Down

0 comments on commit 9cf6f90

Please sign in to comment.