Merge pull request #14 from vechainfoundation/carpini/adding-back-tra…

…iling-comma

fix: add trailing comma

.prettierrc

@@ -1,5 +1,5 @@
 {
     "singleQuote": true,
-    "trailingComma": "none",
+    "trailingComma": "all",
     "tabWidth": 4
 }

apps/sample-react-app/hardhat.config.ts

@@ -4,8 +4,8 @@ import '@nomicfoundation/hardhat-toolbox';
 const config: HardhatUserConfig = {
     solidity: '0.8.19',
     typechain: {
-        outDir: 'src/hardhat'
-    }
+        outDir: 'src/hardhat',
+    },
 };
 
 export default config;

apps/sample-react-app/src/App.tsx

@@ -11,7 +11,7 @@ import { Fonts, theme } from './Styles';
 
 const nodeOptions: Omit<Options, 'signer'> = {
     node: 'https://testnet.vechain.org/',
-    network: 'test'
+    network: 'test',
 };
 
 const walletConnectOptions: WalletConnectOptions = {
@@ -20,8 +20,8 @@ const walletConnectOptions: WalletConnectOptions = {
         name: 'Sample VeChain dApp',
         description: 'A sample VeChain dApp',
         url: window.location.origin,
-        icons: [`${window.location.origin}/images/logo/my-dapp.png`]
-    }
+        icons: [`${window.location.origin}/images/logo/my-dapp.png`],
+    },
 };
 
 export const App = (): JSX.Element => {

apps/sample-react-app/src/Components/AccountDetailBody.tsx

@@ -13,7 +13,7 @@ interface AccountDetailBodyProps {
 export const AccountDetailBody: React.FC<AccountDetailBodyProps> = ({
     accountAddress,
     source,
-    disconnectWallet
+    disconnectWallet,
 }) => {
     const sourceInfo = useMemo(() => WalletSources[source], [source]);
 

apps/sample-react-app/src/Components/AccountDetailModal.tsx

@@ -17,7 +17,7 @@ export const AccountDetailModal: React.FC<AccountDetailModalProps> = ({
     isOpen,
     onClose,
     address,
-    source
+    source,
 }) => {
     const { disconnect } = useWallet();
 

apps/sample-react-app/src/Components/AddressButton.tsx

@@ -27,7 +27,7 @@ export const AddressButton: React.FC<AddressButtonProps> = ({
             if (onClick) onClick(e);
             if (showCopyIcon) onCopy();
         },
-        [onClick, showCopyIcon, onCopy]
+        [onClick, showCopyIcon, onCopy],
     );
 
     useEffect(() => {

apps/sample-react-app/src/Components/ConnectWalletButton.tsx

@@ -12,12 +12,12 @@ interface ConnectWalletButtonProps {
 }
 
 export const ConnectWalletButton: React.FC<ConnectWalletButtonProps> = ({
-    buttonProps
+    buttonProps,
 }): React.ReactElement => {
     const { isOpen, onOpen, onClose } = useDisclosure();
 
     const {
-        accountState: { address, source }
+        accountState: { address, source },
     } = useWallet();
 
     if (address && source)

apps/sample-react-app/src/Components/ConnectWalletModal.tsx

@@ -9,7 +9,7 @@ import {
     Spinner,
     Text,
     useToast,
-    VStack
+    VStack,
 } from '@chakra-ui/react';
 import { LinkIcon, WalletIcon } from '@heroicons/react/24/solid';
 import React, { useCallback, useState } from 'react';
@@ -25,7 +25,7 @@ interface ConnectedWalletDialogProps {
 
 export const ConnectWalletModal: React.FC<ConnectedWalletDialogProps> = ({
     isOpen,
-    onClose
+    onClose,
 }) => {
     const header = (
         <HStack spacing={2}>
@@ -49,7 +49,7 @@ interface ConnectedWalletBodyProps {
 }
 
 const ConnectedWalletBody: React.FC<ConnectedWalletBodyProps> = ({
-    onClose
+    onClose,
 }) => {
     const toast = useToast();
     const { setAccount } = useWallet();
@@ -64,8 +64,8 @@ const ConnectedWalletBody: React.FC<ConnectedWalletBodyProps> = ({
                 purpose: 'identification',
                 payload: {
                     type: 'text',
-                    content: 'Sign a certificate to prove your identity'
-                }
+                    content: 'Sign a certificate to prove your identity',
+                },
             };
 
             const certResponse = await vendor.sign('cert', message).request();
@@ -76,7 +76,7 @@ const ConnectedWalletBody: React.FC<ConnectedWalletBodyProps> = ({
                 domain: certResponse.annex.domain,
                 timestamp: certResponse.annex.timestamp,
                 signer: certResponse.annex.signer,
-                signature: certResponse.signature
+                signature: certResponse.signature,
             };
 
             Certificate.verify(cert);
@@ -94,10 +94,10 @@ const ConnectedWalletBody: React.FC<ConnectedWalletBodyProps> = ({
                 status: 'success',
                 position: 'bottom-left',
                 duration: 5000,
-                isClosable: true
+                isClosable: true,
             });
         },
-        [toast, setAccount, onClose]
+        [toast, setAccount, onClose],
     );
 
     const connectHandler = useCallback(async () => {
@@ -121,7 +121,7 @@ const ConnectedWalletBody: React.FC<ConnectedWalletBodyProps> = ({
         onSuccessfullConnection,
         setConnectionError,
         setConnectionLoading,
-        connectToWalletHandler
+        connectToWalletHandler,
     ]);
 
     const connect = useCallback(() => {

apps/sample-react-app/src/Components/WalletSourceRadio.tsx

@@ -6,7 +6,7 @@ import {
     Image,
     Text,
     Tooltip,
-    VStack
+    VStack,
 } from '@chakra-ui/react';
 import { ExclamationTriangleIcon } from '@heroicons/react/24/solid';
 import React, { useCallback } from 'react';
@@ -24,7 +24,7 @@ export const WalletSourceRadio: React.FC = () => {
                 setSource(source);
             }
         },
-        [setSource]
+        [setSource],
     );
 
     return (
@@ -58,7 +58,7 @@ const WalletSourceButton: React.FC<WalletSourceButtonProps> = ({
     source,
     isSelected,
     isDisabled,
-    onClick
+    onClick,
 }) => {
     const sourceInfo = WalletSources[source];
     return (
@@ -93,7 +93,7 @@ interface SourceNotDetectedIconProps {
 }
 
 const SourceNotDetectedIcon: React.FC<SourceNotDetectedIconProps> = ({
-    source
+    source,
 }) => {
     const sourceInfo = WalletSources[source];
 

apps/sample-react-app/src/Components/layout/NavBar.tsx

@@ -12,7 +12,7 @@ import {
     useColorModeValue,
     useDisclosure,
     useMediaQuery,
-    VStack
+    VStack,
 } from '@chakra-ui/react';
 import type { JSX } from 'react';
 import React from 'react';
@@ -82,7 +82,7 @@ interface MobileNavBarDrawerProps {
 
 const MobileNavBarDrawer = ({
     isOpen,
-    onClose
+    onClose,
 }: MobileNavBarDrawerProps): JSX.Element => {
     const { accountState, disconnect } = useWallet();
 

apps/sample-react-app/src/Components/layout/StyledContainer.tsx

@@ -6,7 +6,7 @@ interface StyledContainerProps {
 }
 
 export const StyledContainer: React.FC<StyledContainerProps> = ({
-    children
+    children,
 }) => {
     const bodyBg = useColorModeValue('gray.50', 'gray.900');
 

apps/sample-react-app/src/Components/shared/Dialog.tsx

@@ -6,7 +6,7 @@ import {
     ModalContent,
     ModalFooter,
     ModalHeader,
-    ModalOverlay
+    ModalOverlay,
 } from '@chakra-ui/react';
 import React from 'react';
 
@@ -29,7 +29,7 @@ export const Dialog: React.FC<DialogProps> = ({
     body,
     footer,
     showCloseButton = true,
-    closeButtonStyle = {}
+    closeButtonStyle = {},
 }) => {
     return (
         <Modal isOpen={isOpen} onClose={onClose} trapFocus={false}>

apps/sample-react-app/src/Constants/Constants.ts

@@ -13,18 +13,18 @@ const baseLogoUrl = `${process.env.PUBLIC_URL}/images/logo`;
 export const WalletSources: Record<WalletSource, SourceInfo> = {
     [WalletSource.WalletConnect]: {
         name: 'Wallet Connect',
-        logo: `${baseLogoUrl}/wallet-connect-logo.png`
+        logo: `${baseLogoUrl}/wallet-connect-logo.png`,
     },
     [WalletSource.VeWorldExtension]: {
         name: 'VeWorld Extension',
-        logo: `${baseLogoUrl}/veworld_black.png`
+        logo: `${baseLogoUrl}/veworld_black.png`,
     },
     [WalletSource.Sync]: {
         name: 'Sync',
-        logo: `${baseLogoUrl}/sync.png`
+        logo: `${baseLogoUrl}/sync.png`,
     },
     [WalletSource.Sync2]: {
         name: 'Sync 2',
-        logo: `${baseLogoUrl}/sync2.png`
-    }
+        logo: `${baseLogoUrl}/sync2.png`,
+    },
 };

apps/sample-react-app/src/Hooks/useCounter.ts

@@ -9,19 +9,19 @@ const _counter: abi.Function.Definition = {
         {
             internalType: 'uint256',
             name: 'count',
-            type: 'uint256'
-        }
+            type: 'uint256',
+        },
     ],
     stateMutability: 'view',
-    type: 'function'
+    type: 'function',
 };
 
 const _increment: abi.Function.Definition = {
     inputs: [],
     name: 'increment',
     outputs: [],
     stateMutability: 'nonpayable',
-    type: 'function'
+    type: 'function',
 };
 
 type IncrementStatus = 'idle' | 'in-wallet' | 'pending' | 'error';
@@ -41,7 +41,7 @@ export const useCounter = (): UseCounter => {
 
     const contract = useMemo(
         () => thor.account('0x8384738c995d49c5b692560ae688fc8b51af1059'),
-        [thor]
+        [thor],
     );
 
     const setValue = useCallback(async () => {

apps/sample-react-app/src/Screens/components/Counter.tsx

@@ -7,7 +7,7 @@ import {
     Icon,
     Text,
     useToast,
-    VStack
+    VStack,
 } from '@chakra-ui/react';
 import type { JSX } from 'react';
 import React, { useCallback, useMemo } from 'react';
@@ -29,7 +29,7 @@ export const Counter = (): JSX.Element => {
                     title: 'Counter incremented',
                     status: 'success',
                     duration: 2000,
-                    isClosable: true
+                    isClosable: true,
                 });
             })
             // eslint-disable-next-line no-console

apps/sample-react-app/src/Styles/Theme.tsx

@@ -3,6 +3,6 @@ import { extendTheme } from '@chakra-ui/react';
 export const theme = extendTheme({
     fonts: {
         heading: `'JetBrains Mono', sans-serif`,
-        body: `'Inter', sans-serif`
-    }
+        body: `'Inter', sans-serif`,
+    },
 });

apps/sample-react-app/src/Utils/AccountUtils.ts

@@ -12,7 +12,7 @@ export const getPicassoImgSrc = (address: string, base64 = false): string => {
 export const friendlyAddress = (
     address: string,
     lengthBefore = 6,
-    lengthAfter = 4
+    lengthAfter = 4,
 ): string => {
     const before = address.substring(0, lengthBefore);
     const after = address.substring(address.length - lengthAfter);

apps/sample-react-app/src/index.tsx

@@ -13,7 +13,7 @@ if (rootElement) {
     root.render(
         <React.StrictMode>
             <App />
-        </React.StrictMode>
+        </React.StrictMode>,
     );
 }
 

packages/react-wallet-kit/src/AccountReducer.ts

@@ -14,12 +14,12 @@ export type AccountAction =
 
 export const defaultAccountState: AccountState = {
     address: localStorage.getItem(ACCOUNT_KEY),
-    source: localStorage.getItem(WALLET_SOURCE_KEY) as WalletSource
+    source: localStorage.getItem(WALLET_SOURCE_KEY) as WalletSource,
 };
 
 export const accountReducer = (
     state: AccountState,
-    action: AccountAction
+    action: AccountAction,
 ): AccountState => {
     switch (action.type) {
         case 'set-address': {