support account disable configure

This commit is contained in:
balzack 2025-02-21 13:11:02 -08:00
parent 8c336c5857
commit c4a6796740
3 changed files with 30 additions and 7 deletions

View File

@ -1,23 +1,45 @@
import { useEffect } from 'react';
import { useEffect, useState } from 'react';
import classes from './Accounts.module.css'
import { useAccounts } from './useAccounts.hook'
import { Modal, Divider, Text, ActionIcon } from '@mantine/core'
import { IconUserPlus, IconReload, IconSettings, IconLockOpen2, IconUserCancel, IconTrash } from '@tabler/icons-react'
import { IconUserPlus, IconUserCheck, IconReload, IconSettings, IconLockOpen2, IconUserCancel, IconTrash } from '@tabler/icons-react'
import { Card } from '../card/Card'
import { Colors } from '../constants/Colors';
export function Accounts({ openSetup }: { openSetup: ()=>void }) {
const { state, actions } = useAccounts();
const [failed, setFailed] = useState(false);
const [blocking, setBlocking] = useState(null as null | number);
useEffect(() => {
actions.reload();
}, []);
const blockAccount = async (accountId: number, block: boolean) => {
if (!blocking) {
setBlocking(accountId);
try {
await actions.blockAccount(accountId, block);
} catch (err) {
console.log(err);
setFailed(true);
}
setBlocking(null);
}
}
const members = state.members.map((member, idx) => {
const options = [
<ActionIcon key="acess" className={classes.action} variant="light" onClick={actions.reload} loading={state.loading}><IconLockOpen2 /></ActionIcon>,
<ActionIcon key="block" className={classes.action} variant="light" onClick={actions.reload} loading={state.loading} color={Colors.pending}><IconUserCancel /></ActionIcon>,
<ActionIcon key="remove" className={classes.action} variant="light" onClick={actions.reload} loading={state.loading} color={Colors.offsync}><IconTrash /></ActionIcon>,
<ActionIcon key="acess" className={classes.action} variant="light" onClick={actions.reload} loading={false}><IconLockOpen2 /></ActionIcon>,
<ActionIcon key="block" className={classes.action} variant="light" loading={blocking === member.accountId} color={Colors.pending} onClick={() => blockAccount(member.accountId, !member.disabled)}>
{ member.disabled && (
<IconUserCheck />
)}
{ !member.disabled && (
<IconUserCancel />
)}
</ActionIcon>,
<ActionIcon key="remove" className={classes.action} variant="light" onClick={actions.reload} loading={false} color={Colors.offsync}><IconTrash /></ActionIcon>,
];
return (

View File

@ -12,6 +12,7 @@ export function useAccounts() {
strings: display.state.strings,
members: [] as Member[],
loading: false,
secretText: '',
});
const updateState = (value: any) => {

View File

@ -25,7 +25,7 @@ export function Setup() {
const copySecret = async () => {
if (!secretCopy) {
try {
navigator.clipboard.writeText(state.secretText)
navigator.clipboard.writeText(state.confirmMFAuthText)
setSecretCopy(true);
setTimeout(() => {
setSecretCopy(false);
@ -230,7 +230,7 @@ export function Setup() {
{secretCopy && <IconCheck />}
{!secretCopy && <IconCopy className={classes.copyIcon} onClick={copySecret} />}
</div>
<PinInput value={state.mfAuthCode} length={6} className={classes.mfaPin} onChange={(event) => actions.setMFAuthCode(event)} />
<PinInput value={state.mfaCode} length={6} className={classes.mfaPin} onChange={(event) => actions.setMFAuthCode(event)} />
<Text className={classes.authMessage}>{state.mfaMessage}</Text>
</div>
<div className={classes.control}>