Added Privacy Policy and changes Terms of Service

apps/abclaunch/src/components/dao-steps/Summary.tsx

@@ -1,16 +1,31 @@
-import { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, Box, Checkbox, Table, Tbody, Td, Text, Th, Thead, Tr, VStack } from "@chakra-ui/react";
+import { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, Box, Checkbox, HStack, Table, Tbody, Td, Text, Th, Thead, Tr, VStack } from "@chakra-ui/react";
+import PrivacyPolicyModal from "commons-ui/src/components/PrivacyPolicyModal";
+import TermsModal from "commons-ui/src/components/TermsModal";
+import { useEffect, useState } from "react";
 import { useRecoilValue, useSetRecoilState } from "recoil";
-import { newDaoNameState, newDaoVotingState, newDaoTokenState, newDaoTokenSupplyState, newDaoAbcState, newDaoCheckedState } from "../../recoil";
+import { newDaoAbcState, newDaoCheckedState, newDaoNameState, newDaoTokenState, newDaoTokenSupplyState, newDaoVotingState } from "../../recoil";
 import { getCollateralTokenInfo } from "../../utils/token-info";
-import TermsModal from "commons-ui/src/components/TermsModal"
+
 
 export default function Summary() {
     const daoName = useRecoilValue(newDaoNameState);
     const votingSettings = useRecoilValue(newDaoVotingState);
     const tokenSettings = useRecoilValue(newDaoTokenState);
     const initialTotalSupply = useRecoilValue(newDaoTokenSupplyState);
     const abcConfig = useRecoilValue(newDaoAbcState);
-    const setChecked = useSetRecoilState(newDaoCheckedState);
+    const setNewDaoChecksGlobal = useSetRecoilState(newDaoCheckedState);
+    const [newDaoChecks, setNewDaoChecks] = useState({
+        daoInfoChecked: false,
+        legalsChecked: false
+    });
+
+    useEffect(()=> {
+        setNewDaoChecksGlobal({
+            daoInfoChecked: newDaoChecks.daoInfoChecked,
+            legalsChecked: newDaoChecks.legalsChecked
+        })
+    }, [newDaoChecks])
+
     return (
         <Box pt="75px">
             <VStack spacing={4}>
@@ -114,7 +129,15 @@ export default function Summary() {
                     <Text fontSize="16px">Review all the settings.</Text>
                     <Text fontSize="16px">If there are any mistakes, fix them before proceeding.</Text>
                 </VStack>
-                <Checkbox colorScheme="brand" onChange={(e) => setChecked(e.target.checked)}><TermsModal location="launch"/></Checkbox>
+                <Checkbox colorScheme="brand" onChange={(e) => setNewDaoChecks({...newDaoChecks, daoInfoChecked: e.target.checked})}><Text as="b">I confirm that the above information is correct</Text></Checkbox>
+                <Checkbox colorScheme="brand" onChange={(e) => setNewDaoChecks({...newDaoChecks, legalsChecked: e.target.checked})}>
+                    <HStack spacing={1}>
+                        <Text as="b">I agree to the</Text>
+                        <TermsModal />
+                        <Text as="b">and</Text>
+                        <PrivacyPolicyModal />
+                    </HStack>
+                </Checkbox>
             </VStack>
         </Box>
     )

apps/abclaunch/src/recoil/newDaoChecked/atom.ts

@@ -1,6 +1,14 @@
 import { atom } from "recoil";
 
-export default atom<boolean>({
+type NewDaoCheckedState = {
+    daoInfoChecked: boolean;
+    legalsChecked: boolean;
+};
+
+export default atom<NewDaoCheckedState>({
     key: 'newDaoChecked',
-    default: false,
+    default: {
+        daoInfoChecked: false,
+        legalsChecked: false,
+    }
 });

apps/abclaunch/src/recoil/newDaoChecked/checkedIsValidSelector.ts

@@ -4,7 +4,7 @@ import newDaoCheckedAtom from "./atom";
 export default selector({
     key: 'newDaoCheckedIsValid',
     get: ({get}) => {
-        const checked = get(newDaoCheckedAtom);
-        return checked;
+        const checks = get(newDaoCheckedAtom);
+        return checks.daoInfoChecked && checks.legalsChecked;
     },
 });

apps/abcswap/src/pages/Swap.tsx

@@ -6,6 +6,7 @@ import { useNavigate, useParams } from "react-router-dom";
 import { formatUnits, parseUnits } from "viem";
 import { useAccount, useBalance } from "wagmi";
 
+import PrivacyPolicyModal from "commons-ui/src/components/PrivacyPolicyModal";
 import TermsModal from "commons-ui/src/components/TermsModal";
 import { TokenSelector } from "commons-ui/src/components/TokenSelector";
 import { useProcessTransactions } from "transactions-modal";
@@ -159,9 +160,9 @@ export default function SimpleConvert() {
                 <HStack>
                     <Box w="452px" h="268px" mt="31px" ml="19px" bgColor="white" borderRadius="16px">
                         <Text mt="24px" ml="31px">You Send</Text>
-                        <TokenSelector token={fromToken} mr="auto" ml="26px" mt="16px"/>
+                        <TokenSelector token={fromToken} mr="auto" ml="26px" mt="16px" />
                         <NumberInput mt='2' value={amount}>
-                            <NumberInputField autoFocus onChange={(e) => handleAmountChange(e.target.value)} w="100%" ml="10px" mt="50px" fontSize="50px" border="none" placeholder='0' _focusVisible={{boxShadow: 'none'}} />
+                            <NumberInputField autoFocus onChange={(e) => handleAmountChange(e.target.value)} w="100%" ml="10px" mt="50px" fontSize="50px" border="none" placeholder='0' _focusVisible={{ boxShadow: 'none' }} />
                         </NumberInput>
                         <VStack ml="26px" mt="8px" alignItems="initial">
                             <HStack>
@@ -188,8 +189,8 @@ export default function SimpleConvert() {
                     </div>
                     <Box w="452px" h="268px" mt="31px" mr="19px" bgColor="white" borderRadius="16px">
                         <Text mt="24px" mr="31px" textAlign="right">You Receive</Text>
-                        <TokenSelector token={toToken} ml="auto" mr="26px" mt="16px"/>
-                        
+                        <TokenSelector token={toToken} ml="auto" mr="26px" mt="16px" />
+
                         <Flex direction="column" align="flex-end" mr="26px" mt="8px">
                             <Input w="100%" mt="50px" pr='0' value={formatDisplayNumber(convertedAmountFormatted)} readOnly fontSize="50px" border="none" placeholder='0' textAlign="right" />
                             <VStack ml="26px" mt="8px" alignItems="end">
@@ -204,7 +205,12 @@ export default function SimpleConvert() {
 
                 <HStack>
                     <Checkbox colorScheme="brand" isChecked={terms} onChange={(e) => setTerms(e.target.checked)}>
-                        <TermsModal location="swap"/>
+                        <HStack spacing={1}>
+                            <Text>I agree to the</Text>
+                            <TermsModal />
+                            <Text>and</Text>
+                            <PrivacyPolicyModal />
+                        </HStack>
                     </Checkbox>
                 </HStack>
             </VStack>