Merge branch 'dev' into fixing-beta-v2

apps/web/app/(app)/gardens/[chain]/[garden]/[community]/[poolId]/[proposalId]/page.tsx

@@ -1,11 +1,12 @@
 "use client";
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Hashicon } from "@emeraldpay/hashicon-react";
 import {
   AdjustmentsHorizontalIcon,
   InformationCircleIcon,
   UserIcon,
 } from "@heroicons/react/24/outline";
+import { ArrowPathIcon } from "@heroicons/react/24/solid";
 import { usePathname, useRouter } from "next/navigation";
 import { toast } from "react-toastify";
 import { Address, encodeAbiParameters, formatUnits } from "viem";
@@ -51,6 +52,9 @@ export default function Page({
     garden: string;
   };
 }) {
+  const [convictionRefreshing, setConvictionRefreshing] = useState(true);
+  const router = useRouter();
+
   const { address } = useAccount();
   const [, proposalNumber] = proposalId.split("-");
   const { data } = useSubgraphQuery<getProposalDataQuery>({
@@ -80,7 +84,6 @@ export default function Page({
     hash: proposalData?.metadataHash,
     enabled: !proposalData?.metadata,
   });
-  const router = useRouter();
   const path = usePathname();
   const metadata = proposalData?.metadata ?? ipfsResult;
   const isProposerConnected =
@@ -115,6 +118,12 @@ export default function Page({
     enabled: proposalData?.proposalNumber != null,
   });
 
+  useEffect(() => {
+    if (convictionRefreshing && currentConvictionPct != null) {
+      setConvictionRefreshing(false);
+    }
+  }, [convictionRefreshing, currentConvictionPct]);
+
   //encode proposal id to pass as argument to distribute function
   const encodedDataProposalId = (proposalId_: bigint) => {
     const encodedProposalId = encodeAbiParameters(
@@ -177,6 +186,14 @@ export default function Page({
     );
   }
 
+  const handleRefreshConviction = async (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setConvictionRefreshing(true);
+    await triggerConvictionRefetch?.();
+    setConvictionRefreshing(false);
+  };
+
   const status = ProposalStatus[proposalData.proposalStatus];
 
   return (

apps/web/components/Button.tsx

@@ -22,7 +22,7 @@ type ButtonProps = {
     | "tooltip-bottom"
     | "tooltip-left"
     | "tooltip-right";
-  children: React.ReactNode;
+  children?: React.ReactNode;
   isLoading?: boolean;
   size?: Size;
   icon?: React.ReactNode;
@@ -70,7 +70,7 @@ const btnStyles: BtnStyles = {
 
 export function Button({
   onClick,
-  className: styles = "",
+  className = "",
   disabled = false,
   tooltip,
   showToolTip = false,
@@ -86,7 +86,7 @@ export function Button({
   const buttonElement = (
     <button
       type={type}
-      className={`${btnStyles[btnStyle][disabled ? "disabled" : color]} flex relative cursor-pointer  justify-center rounded-lg px-6 py-4 transition-all ease-out disabled:cursor-not-allowed h-fit ${styles}`}
+      className={`${btnStyles[btnStyle][disabled ? "disabled" : color]} flex relative cursor-pointer  justify-center rounded-lg px-6 py-4 transition-all ease-out disabled:cursor-not-allowed h-fit ${className}`}
       onClick={onClick}
       disabled={disabled || isLoading}
     >

apps/web/components/Charts/ConvictionBarChart.tsx

@@ -1,10 +1,13 @@
 "use client";
 
-import React, { useMemo } from "react";
+import React, { useEffect, useMemo, useState } from "react";
+import { ArrowPathIcon } from "@heroicons/react/24/solid";
 import type { EChartsOption, MarkLineComponentOption } from "echarts";
 import EChartsReact from "echarts-for-react";
 import { ChartWrapper } from "./ChartWrapper";
+import { Button } from "../Button";
 import { Countdown } from "../Countdown";
+import { Skeleton } from "../Skeleton";
 
 type ScenarioMapping = {
   condition: () => boolean;
@@ -21,6 +24,7 @@ type ConvictionBarChartProps = {
   timeToPass?: number;
   defaultChartMaxValue?: boolean;
   onReadyToExecute?: () => void;
+  refreshConviction?: () => Promise<any>;
 };
 
 export const ConvictionBarChart = ({
@@ -33,7 +37,9 @@ export const ConvictionBarChart = ({
   timeToPass,
   onReadyToExecute,
   defaultChartMaxValue = false,
+  refreshConviction,
 }: ConvictionBarChartProps) => {
+  const [convictionRefreshing, setConvictionRefreshing] = useState(true);
   const supportNeeded = (thresholdPct - proposalSupportPct).toFixed(2);
   const scenarioMappings: Record<string, ScenarioMapping> = {
     //1-SignalingType) Support > 0 && > Conviction
@@ -176,6 +182,20 @@ export const ConvictionBarChart = ({
     );
   }, [timeToPass, currentConvictionPct, proposalSupportPct, thresholdPct]);
 
+  useEffect(() => {
+    if (convictionRefreshing && currentConvictionPct != null) {
+      setConvictionRefreshing(false);
+    }
+  }, [convictionRefreshing, currentConvictionPct]);
+
+  const handleRefreshConviction = async (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setConvictionRefreshing(true);
+    await refreshConviction?.();
+    setConvictionRefreshing(false);
+  };
+
   const supportGtConv = proposalSupportPct > currentConvictionPct;
   const convEqSupport = proposalSupportPct === currentConvictionPct;
 
@@ -335,23 +355,37 @@ export const ConvictionBarChart = ({
     Number(supportNeeded) < 0 &&
     (currentConvictionPct ?? 0) < (thresholdPct ?? 0);
 
-  return (
+  const chart = (
     <>
-      {compact ?
+      <Skeleton isLoading={convictionRefreshing}>
         <EChartsReact
           option={option}
           style={{ height: "100%", width: "100%" }}
+          className="cursor-default"
         />
+      </Skeleton>
+      <Button
+        btnStyle="link"
+        onClick={handleRefreshConviction}
+        tooltip="Refresh conviction"
+        className="!p-3"
+      >
+        <ArrowPathIcon className="w-5" />
+      </Button>
+    </>
+  );
+
+  return (
+    <>
+      {compact ?
+        chart
       : <>
           <ChartWrapper
             message={isSignalingType ? undefined : message}
             growing={growing}
             isSignalingType={isSignalingType}
           >
-            <EChartsReact
-              option={option}
-              style={{ height: "100%", width: "100%" }}
-            />
+            {chart}
           </ChartWrapper>
           {scenarioMappings.supportLTConvictionLTThreshold &&
             proposalWillPass &&

apps/web/components/Forms/ProposalForm.tsx

@@ -12,10 +12,10 @@ import {
   CVStrategyConfig,
   TokenGarden,
 } from "#/subgraph/.graphclient";
+import { FormAddressInput } from "./FormAddressInput";
 import { FormInput } from "./FormInput";
 import { FormPreview, FormRow } from "./FormPreview";
 import { LoadingSpinner } from "../LoadingSpinner";
-import { FormAddressInput } from "./FormAddressInput";
 import { WalletBalance } from "../WalletBalance";
 import { Button, EthAddress, InfoBox } from "@/components";
 import { QUERY_PARAMS } from "@/constants/query-params";

apps/web/components/ProposalCard.tsx

@@ -281,14 +281,15 @@ export function ProposalCard({
                         </div>
                         <ProposalCountDown />
                       </div>
-                      <div className="h-3">
+                      <div className="h-3 flex items-center">
                         <ConvictionBarChart
                           compact
                           currentConvictionPct={currentConvictionPct}
                           thresholdPct={isSignalingType ? 0 : thresholdPct}
                           proposalSupportPct={totalSupportPct}
                           isSignalingType={isSignalingType}
                           proposalNumber={proposalNumber}
+                          refreshConviction={triggerConvictionRefetch}
                         />
                       </div>
                     </div>

apps/web/components/Proposals.tsx

@@ -230,9 +230,9 @@ export function Proposals({
 
   useEffect(() => {
     setMemberActivatedPoints(
-      Number(memberData?.member?.memberCommunity?.[0]?.stakedTokens ?? 0n),
+      Number(memberStrategyData?.memberStrategy?.activatedPoints ?? 0n),
     );
-  }, [memberData?.member?.memberCommunity?.[0]?.stakedTokens]);
+  }, [memberStrategyData?.memberStrategy?.activatedPoints]);
 
   useEffect(() => {
     if (memberActivatedStrategy === false) {

apps/web/hooks/useContractWriteWithConfirmations.ts

@@ -8,6 +8,7 @@ import {
   UserRejectedRequestError,
 } from "viem";
 import {
+  useAccount,
   useChainId,
   useContractWrite,
   UseContractWriteConfig,
@@ -48,6 +49,7 @@ export function useContractWriteWithConfirmations<
     fallbackErrorMessage?: string;
   },
 ) {
+  const { address: walletAddress } = useAccount();
   const toastId = props.contractName + "_" + props.functionName;
   const chainIdFromWallet = useChainId();
   const chainIdFromPath = useChainIdFromPath();
@@ -109,6 +111,7 @@ export function useContractWriteWithConfirmations<
       rawData,
       contract: props.address,
       message: error.message,
+      from: walletAddress,
     };
     try {
       logPayload = {

apps/web/hooks/useConvictionRead.ts

@@ -51,7 +51,7 @@ export const useConvictionRead = ({
     refetch: triggerConvictionRefetch,
   } = useContractRead({
     ...cvStrategyContract,
-    functionName: "updateProposalConviction" as any,
+    functionName: "calculateProposalConviction",
     args: [BigInt(proposalData?.proposalNumber ?? 0)],
     enabled,
   });