drop in forms

SmartInvoiceXYZ · Jan 19, 2024 · a19a0a0 · a19a0a0
1 parent 734f16d
commit a19a0a0
Show file tree

Hide file tree

Showing 88 changed files with 3,272 additions and 2,170 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -24,9 +24,10 @@
 
     // Allow props spreading
     "react/jsx-props-no-spreading": "off",
-
     // disable prop-types
     "react/prop-types": "off",
+    // typescript
+    "@typescript-eslint/no-explicit-any": "off",
 
     // disable form label
     "jsx-a11y/label-has-associated-control": "off"

diff --git a/jest.config.ts b/jest.config.ts
@@ -1,32 +1,33 @@
-import type {Config} from 'jest';
-import nextJest from 'next/jest.js'
- 
+import type { Config } from 'jest';
+import nextJest from 'next/jest.js';
+
 const createJestConfig = nextJest({
   // Provide the path to your Next.js app to load next.config.js and .env files in your test environment
   dir: './packages/dapp',
-})
+});
 
 const config: Config = {
-    coverageProvider: 'v8',
-    projects: [
-        {
-            preset: "ts-jest",
-            rootDir: "./packages/dapp",
-            setupFilesAfterEnv: ["<rootDir>/test/setupTests.ts"],
-            testEnvironment: 'jsdom',
-            testMatch: ["<rootDir>/test/**/*.test.(ts|tsx|js|jsx)"],
-            transform: {
-                "^.+\\.(js|jsx|ts|tsx)$": [
-                    "ts-jest", {
-                        tsconfig: "<rootDir>/tsconfig.test.json"
-                    }
-                ],
-            },
-            transformIgnorePatterns: ["node_modules/(?!(viem|isows)/)"],
-        }
-    ],
-    verbose: true,
-}
+  coverageProvider: 'v8',
+  projects: [
+    {
+      preset: 'ts-jest',
+      rootDir: './packages/dapp',
+      setupFilesAfterEnv: ['<rootDir>/test/setupTests.ts'],
+      testEnvironment: 'jsdom',
+      testMatch: ['<rootDir>/test/**/*.test.(ts|tsx|js|jsx)'],
+      transform: {
+        '^.+\\.(js|jsx|ts|tsx)$': [
+          'ts-jest',
+          {
+            tsconfig: '<rootDir>/tsconfig.test.json',
+          },
+        ],
+      },
+      transformIgnorePatterns: ['node_modules/(?!(viem|isows)/)'],
+    },
+  ],
+  verbose: true,
+};
 
 // createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
-export default createJestConfig(config);
+export default createJestConfig(config);
diff --git a/package.json b/package.json
@@ -47,6 +47,8 @@
   "license": "MIT",
   "devDependencies": {
     "@babel/eslint-parser": "^7.23.3",
+    "@testing-library/jest-dom": "^6.2.0",
+    "@testing-library/react": "^14.1.2",
     "@typescript-eslint/parser": "^6.17.0",
     "async-prompt": "^1.0.1",
     "dotenv": "^16.3.1",
@@ -62,6 +64,8 @@
     "ethers": "^5.1.0",
     "husky": "^6.0.0",
     "it-all": "^1.0.2",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
     "lint-staged": "^14.0.1",
     "prettier": "^3.1.1",
     "prettier-plugin-solidity": "^1.3.1",
@@ -75,5 +79,9 @@
     "*.{json,md,sol}": [
       "prettier --write"
     ]
+  },
+  "dependencies": {
+    "lodash": "^4.17.21",
+    "next": "^14.0.4"
   }
 }
diff --git a/packages/constants/package.json b/packages/constants/package.json
@@ -4,6 +4,7 @@
   "description": "",
   "main": "index.js",
   "scripts": {
+    "build": "tsc",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "keywords": [],

diff --git a/packages/constants/tsconfig.json b/packages/constants/tsconfig.json
@@ -13,11 +13,7 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",
-    "incremental": true,
-    "paths": {
-      "@/*": ["./*"]
-    }
   },
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "../../jest.config.ts"],
-  "exclude": ["node_modules", "dist"]
+  "exclude": ["node_modules", "dist"],
 }
diff --git a/packages/dapp/.eslintrc.json b/packages/dapp/.eslintrc.json
@@ -13,14 +13,18 @@
     "sourceType": "module"
   },
   "rules": {
+    "no-unused-vars": "off",
     "react/function-component-definition": "off",
     "react/no-unescaped-entities": "off",
     "react/prop-types": "off",
     "react/require-default-props": "off",
     "import/no-default-export": "off",
     "import/prefer-default-export": "off",
     "@next/next/no-page-custom-font": "off",
-    "react/jsx-filename-extension": [2, { "extensions": [".js", ".jsx", ".ts", ".tsx"] }],
+    "react/jsx-filename-extension": [
+      2,
+      { "extensions": [".js", ".jsx", ".ts", ".tsx"] }
+    ],
     "import/extensions": [
       "error",
       "ignorePackages",
@@ -29,7 +33,7 @@
         "jsx": "never",
         "ts": "never",
         "tsx": "never"
-       }
+      }
     ],
     // exclude test files
     "import/no-extraneous-dependencies": [
@@ -45,10 +49,7 @@
         "optionalDependencies": false
       }
     ],
-    "mocha/no-mocha-arrows": "off",
+    "mocha/no-mocha-arrows": "off"
   },
-  "extends": [
-    "next", 
-    "prettier"
-  ]
+  "extends": ["next", "prettier"]
 }
diff --git a/packages/dapp/package.json b/packages/dapp/package.json
@@ -14,13 +14,14 @@
     "@rainbow-me/rainbowkit": "^1.3.3",
     "@react-pdf/renderer": "^3.1.14",
     "@smart-invoice/constants": "*",
+    "@smart-invoice/forms": "*",
+    "@smart-invoice/graphql": "*",
     "@smart-invoice/hooks": "*",
     "@smart-invoice/ui": "*",
     "@smart-invoice/utils": "*",
     "@tanstack/react-query": "^5.17.9",
     "@tanstack/react-table": "^8.11.3",
     "@vercel/analytics": "^1.1.1",
-    "@wagmi/core": "^1.4.13",
     "abitype": "^0.10.3",
     "base-58": "^0.0.1",
     "dotenv": "^16.0.1",

diff --git a/packages/dapp/pages/contracts.tsx b/packages/dapp/pages/contracts.tsx
@@ -8,17 +8,17 @@ import {
   useBreakpointValue,
 } from '@chakra-ui/react';
 
-import { CONFIG } from '../constants';
-import { useFetchTokensViaIPFS } from '../hooks/useFetchTokensViaIPFS';
-import { Container } from '../shared/Container';
+import { CONFIG } from '@smart-invoice/constants';
+import { useFetchTokensViaIPFS } from '@smart-invoice/hooks';
+import { Container } from '@smart-invoice/ui';
 import {
   getKeys,
   getAccountString,
   getAddressLink,
   getInvoiceFactoryAddress,
   getTokenInfo,
   getTokens,
-} from '../utils';
+} from '@smart-invoice/utils';
 
 const { NETWORK_CONFIG } = CONFIG;
 const chainIds = getKeys(NETWORK_CONFIG);

diff --git a/packages/dapp/pages/create/escrow.tsx b/packages/dapp/pages/create/escrow.tsx
@@ -1,7 +1,6 @@
-import React, { useContext, useEffect, useRef, useState } from 'react';
-import { useWalletClient } from 'wagmi';
-
 /* eslint-disable no-nested-ternary */
+import React, { useEffect, useRef, useState } from 'react';
+import { useWalletClient } from 'wagmi';
 import {
   Button,
   Flex,
@@ -13,34 +12,34 @@ import {
   useBreakpointValue,
 } from '@chakra-ui/react';
 
-import { FormConfirmation } from '../../components/FormConfirmation';
-import { NetworkChangeAlertModal } from '../../components/NetworkChangeAlertModal';
-import { PaymentChunksForm } from '../../components/PaymentChunksForm';
-import { PaymentDetailsForm } from '../../components/PaymentDetailsForm';
-import { ProjectDetailsForm } from '../../components/ProjectDetailsForm';
-import { RegisterSuccess } from '../../components/RegisterSuccess';
-import { ESCROW_STEPS, INVOICE_TYPES } from '../../constants';
 import {
-  CreateContext,
-  CreateContextProvider,
-} from '../../context/CreateContext';
-import { useFetchTokensViaIPFS } from '../../hooks/useFetchTokensViaIPFS';
-import { Container } from '../../shared/Container';
-import { StepInfo } from '../../shared/StepInfo';
+  FormConfirmation,
+  NetworkChangeAlertModal,
+  RegisterSuccess,
+  Container,
+  StepInfo,
+} from '@smart-invoice/ui';
+// import {
+//   PaymentChunksForm,
+//   PaymentDetailsForm,
+//   ProjectDetailsForm,
+// } from '@smart-invoice/forms';
+import { ESCROW_STEPS, INVOICE_TYPES } from '@smart-invoice/constants';
+import { useFetchTokensViaIPFS } from '@smart-invoice/hooks';
 
 type EscrowStepNumber = keyof typeof ESCROW_STEPS;
 
-export function CreateInvoiceEscrowInner() {
-  const {
-    txHash,
-    loading,
-    currentStep,
-    nextStepEnabled,
-    goBackHandler,
-    nextStepHandler,
-    invoiceType,
-    setInvoiceType,
-  } = useContext(CreateContext);
+export function CreateInvoiceEscrow() {
+  // const {
+  //   txHash,
+  //   loading,
+  //   currentStep,
+  //   nextStepEnabled,
+  //   goBackHandler,
+  //   nextStepHandler,
+  //   invoiceType,
+  //   setInvoiceType,
+  // } = useContext(CreateContext);
   const { data: walletClient } = useWalletClient();
   const chainId = walletClient?.chain?.id;
   const [{ tokenData, allTokens }] = useFetchTokensViaIPFS();
@@ -49,9 +48,9 @@ export function CreateInvoiceEscrowInner() {
   const [showChainChangeAlert, setShowChainChangeAlert] = useState(false);
 
   const { Escrow } = INVOICE_TYPES;
-  useEffect(() => {
-    setInvoiceType(Escrow);
-  }, [invoiceType, setInvoiceType, Escrow]);
+  // useEffect(() => {
+  //   setInvoiceType(Escrow);
+  // }, [invoiceType, setInvoiceType, Escrow]);
 
   useEffect(() => {
     if (chainId === undefined) return;
@@ -82,7 +81,7 @@ export function CreateInvoiceEscrowInner() {
 
   return (
     <Container overlay>
-      {txHash ? (
+      {true ? ( // txHash ? (
         <RegisterSuccess />
       ) : tokenData ? (
         <Stack
@@ -129,7 +128,7 @@ export function CreateInvoiceEscrowInner() {
               borderRadius="0.5rem"
               w="100%"
             >
-              <StepInfo
+              {/* <StepInfo
                 stepNum={currentStep}
                 stepTitle={
                   ESCROW_STEPS[currentStep as EscrowStepNumber].step_title
@@ -140,9 +139,7 @@ export function CreateInvoiceEscrowInner() {
                 goBack={goBackHandler}
               />
 
-              <ProjectDetailsForm
-                display={currentStep === 1}
-              />
+              <ProjectDetailsForm display={currentStep === 1} />
 
               <PaymentDetailsForm
                 display={currentStep === 2}
@@ -180,7 +177,7 @@ export function CreateInvoiceEscrowInner() {
                         ESCROW_STEPS[currentStep as EscrowStepNumber].next
                       }`}
                 </Button>
-              </Grid>
+              </Grid> */}
             </Flex>
           </VStack>
         </Stack>
@@ -191,12 +188,4 @@ export function CreateInvoiceEscrowInner() {
   );
 }
 
-function CreateInvoiceEscrow() {
-  return (
-    <CreateContextProvider>
-      <CreateInvoiceEscrowInner />
-    </CreateContextProvider>
-  );
-}
-
 export default CreateInvoiceEscrow;
diff --git a/packages/dapp/pages/create/index.tsx b/packages/dapp/pages/create/index.tsx
@@ -11,8 +11,8 @@ import {
   useBreakpointValue,
 } from '@chakra-ui/react';
 
-import { INVOICE_TYPES } from '../../constants';
-import { logError } from '../../utils/helpers';
+import { INVOICE_TYPES } from '@smart-invoice/constants';
+import { logError } from '@smart-invoice/utils';
 
 function SelectInvoiceType() {
   const { Instant, Escrow } = INVOICE_TYPES;
@@ -33,7 +33,7 @@ function SelectInvoiceType() {
     }
   };
 
-  const createType = async invoiceType => {
+  const createType = async (invoiceType: any) => {
     try {
       router.push(`/create/${invoiceType}`);
     } catch (error) {