'init'

2026-01-30 05:01:05 +02:00
commit 83f38dc63f
327 changed files with 18725 additions and 0 deletions
--- a/app/views/CreateSeed/CreateSeed.tsx
+++ b/app/views/CreateSeed/CreateSeed.tsx
@@ -0,0 +1,95 @@
+import { IconChevronRight, } from '@tabler/icons-react';
+import { Flex, Text, Transition } from '@mantine/core';
+import { TextChain } from '@/app/components/TextChain/TextChain';
+import { useEffect, useState } from 'react';
+import { generateMnemonic } from 'web-bip39';
+import wordlist from 'web-bip39/wordlists/english'
+import { CopyButtonIcon } from '@/app/components/CopyButtonIcon/CopyButtonIcon';
+import { modals } from '@mantine/modals';
+import { useClipboard } from '@mantine/hooks';
+import { useNavigate } from 'react-router-dom';
+import { useMemory } from '@/app/providers/MemoryProvider/useMemory';
+import useWindow from '@/app/hooks/useWindow';
+import { AnimatedButton } from '@/app/components/AnimatedButton/AnimatedButton';
+import { AuthFlowBreadcrumbs } from '@/app/components/AuthFlowBreadcrumbs/AuthFlowBreadcrumbs';
+
+export function CreateSeed() {
+	const [phrase, setPhrase] = useMemory("seed-phrase", "", true);
+	const {copy} = useClipboard();
+	const navigate = useNavigate();
+	const {setSize, setResizeble} = useWindow();
+	const [mounted, setMounted] = useState(false);
+	
+    useEffect(() => {
+        setSize(385, 555); 
+		setResizeble(false);
+		setTimeout(() => setMounted(true), 100);
+    }, []);
+
+	const openCopyModal = () => {
+		modals.openConfirmModal({
+			title: 'Stop',
+			centered: true,
+			children: (
+			  <Text size="sm">
+				Do you really just want to copy your secret phrase and that's it? 
+				We still recommend writing it down on a piece of paper rather than just copying it.
+			  </Text>
+			),
+			withCloseButton: false,
+			labels: { confirm: 'Copy', cancel: "Cancel" },
+			confirmProps: { color: 'red' },
+			onCancel: () => copy("")
+		  });
+	}
+
+	const generate = async () => {
+		const mnemonic = await generateMnemonic(wordlist);
+		setPhrase(mnemonic);
+	}
+
+	useEffect(() => {
+		generate();
+	}, []);
+
+	return (
+		<Flex w={'100%'} h={520}>
+			<Flex w={385} h={'100%'} direction={'column'} justify={'space-between'}>
+				<AuthFlowBreadcrumbs title="Create account"></AuthFlowBreadcrumbs>
+				
+				<Transition mounted={mounted} transition="slide-up" duration={400} timingFunction="ease">
+					{(styles) => (
+						<Flex w={'100%'} direction={'column'} pl={'sm'} pr={'sm'} align={'center'} style={styles}>
+							<Text c="dimmed" ta={'center'} size={'xs'}>
+								This seed phrase is needed to access your correspondence, save it in a safe place
+							</Text>
+						</Flex>
+					)}
+				</Transition>
+
+				<Transition mounted={mounted} transition="slide-up" duration={500} timingFunction="ease">
+					{(styles) => (
+						<Flex p={'sm'} justify={'center'} align={'center'} style={styles}>
+							<TextChain text={phrase}></TextChain>
+						</Flex>
+					)}
+				</Transition>
+
+				<Transition mounted={mounted} transition="slide-up" duration={600} timingFunction="ease">
+					{(styles) => (
+						<Flex p={'sm'} direction={'column'} gap={'lg'} style={styles}>
+							<CopyButtonIcon onClick={openCopyModal} fullWidth size={'md'} value={phrase} caption='Copy phrase'></CopyButtonIcon>
+							<AnimatedButton animated={
+								['#2DA5FF', '#87DBFF']
+							} rightSection={
+								<IconChevronRight size={14}></IconChevronRight>
+							} fullWidth onClick={() => navigate('/confirm-seed')} size={'md'}>
+								Next step
+							</AnimatedButton>
+						</Flex>
+					)}
+				</Transition>
+			</Flex>
+		</Flex>
+	);
+}