Key export fails if password not set, minor UX changes

This commit is contained in:
artur 2024-02-23 13:55:31 +03:00
parent 33b088383d
commit 5ca798958f
3 changed files with 24 additions and 10 deletions

View File

@ -2,9 +2,10 @@ import { useModalSearchParams } from '@/hooks/useModalSearchParams'
import { Modal } from '@/shared/Modal/Modal'
import { MODAL_PARAMS_KEYS } from '@/types/modal'
import { Box, Stack, Typography } from '@mui/material'
import { StyledButton, StyledSettingContainer, StyledSynchedText } from './styled'
import { StyledButton, StyledSettingContainer, StyledSynchText, StyledSynchedText } from './styled'
import { SectionTitle } from '@/shared/SectionTitle/SectionTitle'
import { CheckmarkIcon } from '@/assets'
import GppMaybeOutlinedIcon from '@mui/icons-material/GppMaybeOutlined'
import { Input } from '@/shared/Input/Input'
import { ChangeEvent, FC, useEffect, useState } from 'react'
import { Checkbox } from '@/shared/Checkbox/Checkbox'
@ -27,7 +28,7 @@ export const ModalSettings: FC<ModalSettingsProps> = ({ isSynced }) => {
const { getModalOpened, createHandleCloseReplace } = useModalSearchParams()
const { npub = '' } = useParams<{ npub: string }>()
const keys = useAppSelector(selectKeys)
const [_, copyToClipboard] = useCopyToClipboard()
const [, copyToClipboard] = useCopyToClipboard()
const notify = useEnqueueSnackbar()
@ -101,13 +102,12 @@ export const ModalSettings: FC<ModalSettingsProps> = ({ isSynced }) => {
e.preventDefault()
try {
const key = await swicCall('exportKey', npub) as string
if (await copyToClipboard(key))
notify('Key copied to clipboard!')
else
notify('Failed to copy to clipboard', 'error')
const key = (await swicCall('exportKey', npub)) as string
if (!key) notify('Specify Cloud Sync password first!', 'error')
else if (await copyToClipboard(key)) notify('Key copied to clipboard!')
else notify('Failed to copy to clipboard', 'error')
} catch (error) {
console.log("error", error)
console.log('error', error)
notify(`Failed to copy to clipboard: ${error}`, 'error')
}
}
@ -116,13 +116,19 @@ export const ModalSettings: FC<ModalSettingsProps> = ({ isSynced }) => {
<Modal open={isModalOpened} onClose={onClose} title="Settings">
<Stack gap={'1rem'}>
<StyledSettingContainer onSubmit={handleSubmit}>
<Stack direction={'row'} justifyContent={'space-between'}>
<Stack direction={'row'} justifyContent={'space-between'} alignItems={'start'}>
<SectionTitle>Cloud sync</SectionTitle>
{isSynced && (
<StyledSynchedText>
<CheckmarkIcon /> Synched
</StyledSynchedText>
)}
{!isSynced && (
<StyledSynchText>
{/* <GppMaybeOutlinedIcon style={{ transform: 'scale(0.8)' }} /> */}
Not enabled
</StyledSynchText>
)}
</Stack>
<Box>
<Checkbox onChange={handleChangeCheckbox} checked={isChecked} />

View File

@ -29,3 +29,11 @@ export const StyledSynchedText = styled((props: TypographyProps) => <Typography
color: theme.palette.success.main,
}
})
export const StyledSynchText = styled((props: TypographyProps) => <Typography variant="caption" {...props} />)(({
theme,
}) => {
return {
color: theme.palette.error.main,
}
})

View File

@ -61,7 +61,7 @@ export class Keys {
// We could use string.normalize() to make sure all JS implementations
// are compatible, but since we're looking to make this thing a standard
// then the simplest way is to exclude unicode and only work with ASCII
if (!isValidPassphase(passphrase)) throw new Error('Password must be 4+ ASCII chars')
if (!isValidPassphase(passphrase)) throw new Error('Password must be 6+ ASCII chars')
return new Promise((ok, fail) => {
// NOTE: we should use Argon2 or scrypt later, for now