Merge pull request #38 from stellarcarbon/develop

hlgrondijs · web-flow · commit 5dda4dcf6bd0 · 2025-09-13T16:36:58.000+02:00
Release small fixes v2
diff --git a/cypress/e2e/dashboard.cy.ts b/cypress/e2e/dashboard.cy.ts
@@ -14,6 +14,7 @@ describe("Anonymous user visiting dashboard", () => {
             type: "HOT_WALLET",
             icon: "https://stellar.creit.tech/wallet-icons/freighter.png",
             isAvailable: true,
+            isPlatformWrapper: false,
             url: "https://freighter.app",
           },
           isAnonymous: true,
@@ -45,6 +46,7 @@ describe("User with personal details visiting dashboard", () => {
             type: "HOT_WALLET",
             icon: "https://stellar.creit.tech/wallet-icons/freighter.png",
             isAvailable: true,
+            isPlatformWrapper: false,
             url: "https://freighter.app",
           },
           isAnonymous: false,
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -19,50 +19,50 @@
     "npm": "11.5.1"
   },
   "dependencies": {
-    "@creit.tech/stellar-wallets-kit": "^1.7.7",
-    "@fortawesome/fontawesome-svg-core": "^6.5.2",
-    "@fortawesome/free-brands-svg-icons": "^6.5.2",
-    "@fortawesome/free-regular-svg-icons": "^6.5.2",
-    "@fortawesome/free-solid-svg-icons": "^6.5.2",
-    "@fortawesome/react-fontawesome": "^0.2.0",
+    "@creit.tech/stellar-wallets-kit": "^1.9.5",
+    "@fortawesome/fontawesome-svg-core": "^6.7.2",
+    "@fortawesome/free-brands-svg-icons": "^6.7.2",
+    "@fortawesome/free-regular-svg-icons": "^6.7.2",
+    "@fortawesome/free-solid-svg-icons": "^6.7.2",
+    "@fortawesome/react-fontawesome": "^0.2.6",
     "@hookform/error-message": "^2.0.1",
-    "@stellar/stellar-sdk": "^12.2.0",
-    "@stellarcarbon/sc-sdk": "0.20.0",
-    "@types/validator": "^13.15.2",
-    "framer-motion": "^12.4.7",
+    "@stellar/stellar-sdk": "^14.1.1",
+    "@stellarcarbon/sc-sdk": "0.21.1",
+    "@types/validator": "^13.15.3",
+    "framer-motion": "^12.23.12",
     "i": "^0.3.7",
     "lodash": "^4.17.21",
     "next": "15.4.5",
     "next-plausible": "^3.12.4",
-    "posthog-js": "^1.236.1",
-    "posthog-node": "^4.11.6",
-    "react": "^18",
-    "react-dom": "^18",
-    "react-hook-form": "^7.49.2",
+    "posthog-js": "^1.265.0",
+    "posthog-node": "^4.18.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-hook-form": "^7.62.0",
     "react-loader-spinner": "^6.1.6",
-    "react-select": "^5.8.1",
+    "react-select": "^5.10.2",
     "validator": "^13.15.15"
   },
   "devDependencies": {
-    "@jest/globals": "^30.0.5",
-    "@testing-library/react": "^14.1.2",
-    "@types/node": "^24.1.0",
-    "@types/react": "^18",
-    "@types/react-dom": "^18",
-    "autoprefixer": "^10.0.1",
+    "@jest/globals": "^30.1.2",
+    "@testing-library/react": "^14.3.1",
+    "@types/node": "^24.3.3",
+    "@types/react": "^18.3.24",
+    "@types/react-dom": "^18.3.7",
+    "autoprefixer": "^10.4.21",
     "cross-env": "^7.0.3",
-    "cypress": "^13.6.2",
-    "eslint": "^9.32.0",
+    "cypress": "^13.17.0",
+    "eslint": "^9.35.0",
     "eslint-config-next": "15.4.5",
     "fake-indexeddb": "^5.0.2",
-    "form-data": "^4.0.0",
+    "form-data": "^4.0.4",
     "openapi-typescript-codegen": "^0.27.0",
     "pino-pretty": "^10.3.1",
-    "postcss": "^8",
-    "start-server-and-test": "^2.0.3",
-    "tailwindcss": "^3.3.0",
+    "postcss": "^8.5.6",
+    "start-server-and-test": "^2.1.0",
+    "tailwindcss": "^3.4.17",
     "ts-node": "^10.9.2",
-    "typescript": "^5",
+    "typescript": "^5.9.2",
     "vitest": "^3.2.4"
   }
 }
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -28,9 +28,6 @@ export default function RootLayout({
 }: {
   children: React.ReactNode;
 }) {
-  console.log(analyticsConfig.plausibleDataDomain);
-  console.log(analyticsConfig.plausibleProps);
-
   return (
     <html lang="en">
       <head></head>
diff --git a/src/components/SCLink.tsx b/src/components/SCLink.tsx
@@ -12,7 +12,7 @@ export default function SCLink({
     <Link
       href={href}
       target={target}
-      className={`underline text-alternateMedium hover:text-alternateLight ${className}`}
+      className={`underline text-stellarYellow hover:text-alternateLight ${className}`}
     >
       {children}
     </Link>
diff --git a/src/components/dashboard/overview/OverviewContactInfo.tsx b/src/components/dashboard/overview/OverviewContactInfo.tsx
@@ -43,10 +43,14 @@ export default function OverviewContactInfo() {
   }, [setShowForm]);
 
   const onClickConfirmRegistration = useCallback(() => {
-    updateAccount(
-      walletConnection!.recipient!.email,
-      walletConnection?.recipient?.name ?? undefined
-    );
+    if (jwt) {
+      updateAccount(
+        walletConnection!.recipient!.email,
+        walletConnection?.recipient?.name ?? undefined
+      );
+    } else {
+      router.push("/sep10");
+    }
   }, [walletConnection, updateAccount]);
 
   const handleDelete = useCallback(() => {
diff --git a/src/components/dashboard/transactions/PendingRetirementsInfo.tsx b/src/components/dashboard/transactions/PendingRetirementsInfo.tsx
@@ -39,9 +39,9 @@ export default function PendingRetirementsInfo() {
   } else if (totalPending % 1 === 0) {
     body = (
       <div className="text-center p-4">
-        Your pending balance is a round number, so it is automatically
-        contributed to a personal certificate. This process should nevers take
-        more than a couple days.
+        Your pending balance is a whole number, so it will be automatically
+        retired into a personal certificate. This should be finalized within
+        an hour.
       </div>
     );
   } else {
diff --git a/src/components/icons/SignIcon.tsx b/src/components/icons/SignIcon.tsx
@@ -5,8 +5,8 @@ interface SignIconProps {
 export default function SignIcon({ large }: SignIconProps) {
   return (
     <svg
-      width={"64px"}
-      height={"64px"}
+      width={"92px"}
+      height={"92px"}
       viewBox="0 0 24 24"
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
diff --git a/src/containers/connect_wallet/AcceptTnC.tsx b/src/containers/connect_wallet/AcceptTnC.tsx
@@ -10,18 +10,24 @@ export default function AcceptTnC() {
     <div className="flex flex-col gap-4">
       <div className="flex flex-col">
         <DashboardHeader>Fine print</DashboardHeader>
-        <span>
-          Read our <Link href="/terms-of-use" target="_blank" className="underline">
+        <span className="mt-2">
+          Read our{" "}
+          <Link href="/terms-of-use" target="_blank" className="underline">
             Terms of Use
-          </Link> and <Link href="/privacy-policy" target="_blank" className="underline">
+          </Link>{" "}
+          and{" "}
+          <Link href="/privacy-policy" target="_blank" className="underline">
             Privacy Policy
-          </Link> before you continue.
+          </Link>{" "}
+          before you continue.
         </span>
       </div>
 
       {tncError && (
         <ConnectWalletFormError
-          message={"You have to accept the terms, as they are part of your contract with Stellarcarbon."}
+          message={
+            "You have to accept the terms, as they are part of your contract with Stellarcarbon."
+          }
         />
       )}
 
@@ -45,8 +51,7 @@ export default function AcceptTnC() {
           className="p-2 cursor-pointer text-sm "
           htmlFor="checkbox_policy"
         >
-          I have read and agree with the Terms of Use and the Privacy
-          Policy.
+          I have read and agree with the Terms of Use and the Privacy Policy.
         </label>
       </div>
     </div>
diff --git a/src/containers/connect_wallet/SelectWallet.tsx b/src/containers/connect_wallet/SelectWallet.tsx
@@ -28,7 +28,7 @@ export default function SelectWallet() {
     <div ref={containerRef} className="flex flex-col gap-4">
       <div className="flex flex-col w-full">
         <DashboardHeader>Wallet selection</DashboardHeader>
-        <span className="hidden md:block">
+        <span className="hidden md:block mt-2">
           Select your wallet. You’ll connect it when you submit the form.
         </span>
 
diff --git a/src/containers/sink/steps/Await.tsx b/src/containers/sink/steps/Await.tsx
@@ -5,11 +5,11 @@ export default function AwaitSinking({ message }: { message: string }) {
   return (
     <ModalStep title="Waiting for API">
       <span className="text-center">{message}</span>
-      <div className="flex-1 flex items-center justify-center my-4">
+      <div className="flex-1 flex items-center justify-center my-12">
         <Hourglass
           visible={true}
-          height="80"
-          width="80"
+          height="92"
+          width="92"
           ariaLabel="hourglass-loading"
           wrapperStyle={{}}
           wrapperClass=""
diff --git a/src/containers/sink/steps/Sign.tsx b/src/containers/sink/steps/Sign.tsx
@@ -7,7 +7,7 @@ export default function SignSinking() {
       <span className="text-center">
         {"Sign the transaction using your wallet in the pop-up."}
       </span>
-      <div className="flex-1 flex items-center justify-center my-4">
+      <div className="flex-1 flex items-center justify-center my-12">
         <SignIcon />
       </div>
     </ModalStep>
diff --git a/src/context/SinkFormContext.tsx b/src/context/SinkFormContext.tsx
@@ -28,7 +28,7 @@ import { BuildSinkCarbonXdrData, PaymentAsset } from "@stellarcarbon/sc-sdk";
 
 type SinkFormContext = {
   register: UseFormRegister<SinkingFormData>;
-  handleSubmit: UseFormHandleSubmit<SinkingFormData, undefined>;
+  handleSubmit: UseFormHandleSubmit<SinkingFormData>;
   watch: UseFormWatch<SinkingFormData>;
   setValue: UseFormSetValue<SinkingFormData>;
 
diff --git a/src/context/SinkingContext.tsx b/src/context/SinkingContext.tsx
@@ -117,7 +117,10 @@ export const SinkingContextProvider = ({ children }: PropsWithChildren) => {
         const result = await server.submitTransaction(
           TransactionBuilder.fromXDR(signedTxXdr, appConfig.network)
         );
-        setStep(CheckoutSteps.COMPLETED);
+        setTimeout(() => {
+          // Let the user wait a bit so their dashboard can be updated
+          setStep(CheckoutSteps.COMPLETED);
+        }, 1000);
       } catch (error) {
         displayHorizonError(error);
       }
diff --git a/src/hooks/useSCAccount.tsx b/src/hooks/useSCAccount.tsx
@@ -76,6 +76,7 @@ export function useSCAccount() {
 
       if (res.response.status === 200 && res.data) {
         updateWalletConnection(res.data);
+        setIsStale(false);
       }
     },
     [jwt, walletConnection, updateWalletConnection]
diff --git a/src/hooks/useTransactionHistory.tsx b/src/hooks/useTransactionHistory.tsx
@@ -37,11 +37,11 @@ const defaultData: TransactionHistoryData = {
 export function useTransactionHistory(
   account?: string
 ): UseMyTransactionsResult {
-  const [data, setData] = useState<TransactionHistoryData>(defaultData);
+  const [txData, setTxData] = useState<TransactionHistoryData>(defaultData);
   const [loading, setLoading] = useState<boolean>(false);
 
-  const fetchData = useCallback(async () => {
-    if (!account) return;
+  const fetchTxData = useCallback(async (): Promise<TransactionHistoryData> => {
+    if (!account) return defaultData;
     setLoading(true);
 
     const response = await getSinkTxsForRecipient({
@@ -50,39 +50,36 @@ export function useTransactionHistory(
 
     if (response.data === undefined) {
       setLoading(false);
-      return;
+      return defaultData;
     }
 
     const serializedTransactions =
       TransactionHistoryService.serializeTxsResponse(response.data);
 
-    setData({
+    setLoading(false);
+
+    return {
       myTransactions: serializedTransactions,
       totalSunk: Number(response.data.total_carbon_sunk),
       totalPending: Number(response.data.total_carbon_pending),
       retirementGraceDays: response.data.retirement_grace_days,
-    });
-
-    setLoading(false);
+    };
   }, [account]);
 
   async function pollForNewTransaction(
     maxRetries: number = 5,
-    delay: number = 3000 // delay in milliseconds
+    delay: number = 800 // delay in milliseconds
   ): Promise<void> {
     if (!account) throw new Error("No account for polling");
 
     let retries = 0;
-    const oldTransactions = data.myTransactions;
+    const oldTransactions = txData.myTransactions;
 
     while (retries < maxRetries) {
-      const transactionRecords =
-        await TransactionHistoryService.fetchAccountHistory(account);
+      const transactionRecords = await fetchTxData();
 
-      if (hasNewItem(transactionRecords)) {
-        setData((prev) => {
-          return { ...prev, myTransactions: transactionRecords };
-        });
+      if (hasNewItem(transactionRecords.myTransactions)) {
+        setTxData(transactionRecords);
         return;
       }
 
@@ -107,21 +104,23 @@ export function useTransactionHistory(
 
   useEffect(() => {
     if (!account) {
-      setData(defaultData);
+      setTxData(defaultData);
     } else {
-      fetchData();
+      fetchTxData().then((txData) => {
+        setTxData(txData);
+      });
     }
-  }, [fetchData, account]);
+  }, [fetchTxData, account]);
 
   const refetch = useCallback(() => {
-    if (account) fetchData();
-  }, [account, fetchData]);
+    if (account) fetchTxData();
+  }, [account, fetchTxData]);
 
   return {
-    myTransactions: data.myTransactions,
-    totalSunk: data.totalSunk,
-    totalPending: data.totalPending,
-    retirementGraceDays: data.retirementGraceDays,
+    myTransactions: txData.myTransactions,
+    totalSunk: txData.totalSunk,
+    totalPending: txData.totalPending,
+    retirementGraceDays: txData.retirementGraceDays,
     loading,
     refetch,
     pollForNewTransaction,
diff --git a/tailwind.config.ts b/tailwind.config.ts
@@ -59,6 +59,8 @@ const config: Config = {
         alternateMedium: "#fde047",
         alternateFull: "#facc15",
         alternateGray: "#4f4b37",
+
+        stellarYellow: "rgb(253, 218, 36)",
       },
       fontFamily: {
         noto: ["Noto Sans", "sans-serif"],

Original file line number	Diff line number	Diff line change
`@@ -12,7 +12,7 @@ export default function SCLink({`
`12`	`12`	`<Link`
`13`	`13`	`href={href}`
`14`	`14`	`target={target}`
`15`		- className={`underline text-alternateMedium hover:text-alternateLight ${className}`}
	`15`	+ className={`underline text-stellarYellow hover:text-alternateLight ${className}`}
`16`	`16`	`>`
`17`	`17`	`{children}`
`18`	`18`	`</Link>`