mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2025-03-13 06:30:01 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

add learn more section for current device verification

Browse source
This commit is contained in:
Ajay Bura 2025-01-29 22:21:40 +05:30
parent 55248378f4
commit 64d80a8684
1 changed files with 38 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
src/app/features/settings/devices/Verificaton.tsx
View file

@ -1,9 +1,40 @@
import React from 'react';
import { Button, Text } from 'folds';
import React, { useState } from 'react';
import { Box, Button, config, Text } from 'folds';
import { SettingTile } from '../../../components/setting-tile';
import * as css from './style.css';
function LearnStartVerificationFromOtherDevice() {
return (
<Box direction="Column">
<br />
<Text size="T200">Steps to start verification from other device.</Text>
<Text as="div" size="T200">
<ul style={{ margin: `${config.space.S100} 0` }}>
<li>Open your other verified device.</li>
<li>
Open <i>&quot;Settings&quot;</i>.
</li>
<li>
Open <i>&quot;Devices/Sessions&quot;</i> section.
</li>
<li>Find this device to verify.</li>
<li>
Click <i>&quot;Start Verification&quot;</i>.
</li>
<li>Follow the prompt.</li>
</ul>
</Text>
<Text size="T200">
If you do not have any verified device press the <i>&quot;Verify Manually&quot;</i> button
and enter recovery key to recover your device identity and access to encrypted messages.
</Text>
</Box>
);
}
export function ManualVerificationTile() {
const [learnMore, setLearnMore] = useState(false);
return (
<div className={css.UnverifiedCard}>
<SettingTile
@ -15,9 +46,13 @@ export function ManualVerificationTile() {
>
<Text size="L400">Unverified</Text>
<Text size="T200">
Start verification from other device or verify manually with recovery key.
Start verification from other device or verify manually with recovery key.{' '}
<Text as="a" size="T200" onClick={() => setLearnMore(!learnMore)}>
<b>{learnMore ? 'View Less' : 'Learn More'}</b>
</Text>
</Text>
</SettingTile>
{learnMore && <LearnStartVerificationFromOtherDevice />}
</div>
);
}