diff --git a/alem.config.json b/alem.config.json index a8c05397..68df25b1 100644 --- a/alem.config.json +++ b/alem.config.json @@ -31,6 +31,7 @@ } }, "options": { + "ejectStatefulComponents": false, "keepRoute": false, "createLoaderWidget": true, "loadingComponentFile": "src/components/SuspenseLoading.tsx", diff --git a/src/components/Card/ButtonDonation.tsx b/src/components/Card/ButtonDonation.tsx new file mode 100644 index 00000000..7ae2aa58 --- /dev/null +++ b/src/components/Card/ButtonDonation.tsx @@ -0,0 +1,34 @@ +import { context } from "alem"; +import { useDonationModal } from "@app/hooks/useDonationModal"; +import Button from "../Button"; + +const ButtonDonation = ({ allowDonate, projectId }: { allowDonate: boolean; projectId: string }) => { + const { setDonationModalProps } = useDonationModal(); + + return ( +
e.preventDefault()} + style={{ + cursor: "default", + color: "#292929", + }} + > + {/* */} + {allowDonate && context.accountId && ( + + )} +
+ ); +}; + +export default ButtonDonation; diff --git a/src/components/Card/Card.tsx b/src/components/Card/Card.tsx index a3a8d5cd..70cdde48 100644 --- a/src/components/Card/Card.tsx +++ b/src/components/Card/Card.tsx @@ -1,8 +1,6 @@ -import { Big, RouteLink, Social, context, useMemo, useParams } from "alem"; +import { Big, RouteLink, Social } from "alem"; import DonateSDK from "@app/SDK/donate"; import PotSDK from "@app/SDK/pot"; -import { useDonationModal } from "@app/hooks/useDonationModal"; -import useModals from "@app/hooks/useModals"; import routesPath from "@app/routes/routesPath"; import _address from "@app/utils/_address"; import getTagsFromSocialProfileData from "@app/utils/getTagsFromSocialProfileData"; @@ -10,8 +8,8 @@ import ipfsUrlFromCid from "@app/utils/ipfsUrlFromCid"; import yoctosToNear from "@app/utils/yoctosToNear"; import yoctosToUsdWithFallback from "@app/utils/yoctosToUsdWithFallback"; import CardSkeleton from "../../pages/Projects/components/CardSkeleton"; -import Button from "../Button"; import Image from "../mob.near/Image"; +import ButtonDonation from "./ButtonDonation"; import { Amount, AmountDescriptor, @@ -32,17 +30,12 @@ import { } from "./styles"; const Card = (props: any) => { - const { potId } = useParams(); + const { payoutDetails, allowDonate: _allowDonate, potId } = props; - const { payoutDetails, allowDonate: _allowDonate } = props; - - // Start Modals provider - const Modals = useModals(); - const { setDonationModalProps } = useDonationModal(); + // const Modals = useModals(); const projectId = props.project.registrant_id || props.projectId; const profile = Social.getr(`${projectId}/profile`) as any; - const allowDonate = _allowDonate ?? true; const MAX_DESCRIPTION_LENGTH = 80; @@ -68,7 +61,8 @@ const Card = (props: any) => { return totalDonationAmountNear.toString(); }; - const totalAmountNear = useMemo(getTotalAmountNear, [donationsForProject, payoutDetails]); + const totalAmountNear = getTotalAmountNear(); + // useMemo(getTotalAmountNear, [donationsForProject, payoutDetails]); const getImageSrc = (image: any) => { const defaultImageUrl = "https://ipfs.near.social/ipfs/bafkreih4i6kftb34wpdzcuvgafozxz6tk6u4f5kcr2gwvtvxikvwriteci"; @@ -106,7 +100,7 @@ const Card = (props: any) => { return ( <> - + {/* */} @@ -181,20 +175,7 @@ const Card = (props: any) => { {payoutDetails.donorCount === 1 ? "Donor" : "Donors"} )} - {allowDonate && context.accountId && ( - - )} + {payoutDetails && ( diff --git a/src/components/Card/styles.ts b/src/components/Card/styles.ts index 3cd0fb1c..3d90e69a 100644 --- a/src/components/Card/styles.ts +++ b/src/components/Card/styles.ts @@ -16,7 +16,7 @@ export const CardContainer = styled.div` margin-right: auto; transition: all 300ms; &:hover { - transform: translateY(-1rem); + /* transform: translateY(-1rem); */ } `; @@ -111,30 +111,6 @@ export const DonationsInfoItem = styled.div` align-items: center; `; -export const DonationButton = styled.button` - flex-direction: row; - justify-content: center; - align-items: center; - padding: 16px 24px; - background: #fef6ee; - overflow: hidden; - box-shadow: 0px -2.700000047683716px 0px #4a4a4a inset; - border-radius: 6px; - border: 1px solid #4a4a4a; - gap: 8px; - display: inline-flex; - text-align: center; - color: #2e2e2e; - font-size: 14px; - line-height: 16px; - font-weight: 600; - - &:hover { - text-decoration: none; - cursor: pointer; - } -`; - export const Amount = styled.div` font-size: 17px; font-weight: 600; diff --git a/src/modals/ModalDonation/AmountInput/AmountInput.tsx b/src/modals/ModalDonation/AmountInput/AmountInput.tsx index a49add35..2f966e6a 100644 --- a/src/modals/ModalDonation/AmountInput/AmountInput.tsx +++ b/src/modals/ModalDonation/AmountInput/AmountInput.tsx @@ -1,6 +1,6 @@ import NearIcon from "@app/assets/svgs/near-icon"; import Select from "@app/components/Inputs/Select/Select"; -import nearToUsd from "@app/utils/nearToUsd"; +import nearToUsd from "@app/modules/nearToUsd"; import { Container, DropdownWrapper, PotDenomination } from "./styles"; const AmountInput = (props: any) => { diff --git a/src/modals/ModalDonation/ConfirmDirect/ConfirmDirect.tsx b/src/modals/ModalDonation/ConfirmDirect/ConfirmDirect.tsx index af4227eb..13ce6fdc 100644 --- a/src/modals/ModalDonation/ConfirmDirect/ConfirmDirect.tsx +++ b/src/modals/ModalDonation/ConfirmDirect/ConfirmDirect.tsx @@ -8,8 +8,8 @@ import CheckBox from "@app/components/Inputs/Checkbox/Checkbox"; import TextArea from "@app/components/Inputs/TextArea/TextArea"; import ProfileImage from "@app/components/mob.near/ProfileImage"; import constants from "@app/constants"; +import nearToUsd from "@app/modules/nearToUsd"; import hrefWithParams from "@app/utils/hrefWithParams"; -import nearToUsd from "@app/utils/nearToUsd"; import { Amout, ButtonWrapper, Container, FeesRemoval, Label, NoteWrapper } from "./styles"; const ConfirmDirect = ({ diff --git a/src/modals/ModalDonation/ConfirmPot/ConfirmPot.tsx b/src/modals/ModalDonation/ConfirmPot/ConfirmPot.tsx index b666aac5..71db8b52 100644 --- a/src/modals/ModalDonation/ConfirmPot/ConfirmPot.tsx +++ b/src/modals/ModalDonation/ConfirmPot/ConfirmPot.tsx @@ -5,9 +5,9 @@ import Button from "@app/components/Button"; import BreakdownSummary from "@app/components/Cart/BreakdownSummary/BreakdownSummary"; import CheckBox from "@app/components/Inputs/Checkbox/Checkbox"; import ProfileImage from "@app/components/mob.near/ProfileImage"; +import nearToUsd from "@app/modules/nearToUsd"; import _address from "@app/utils/_address"; import hrefWithParams from "@app/utils/hrefWithParams"; -import nearToUsd from "@app/utils/nearToUsd"; import { Amout, ButtonWrapper, diff --git a/src/modals/ModalDonation/FormPot/FormPot.tsx b/src/modals/ModalDonation/FormPot/FormPot.tsx index 8efeafdd..b418c4d5 100644 --- a/src/modals/ModalDonation/FormPot/FormPot.tsx +++ b/src/modals/ModalDonation/FormPot/FormPot.tsx @@ -2,9 +2,9 @@ import { Near, Social, context } from "alem"; import Button from "@app/components/Button"; import ProfileImage from "@app/components/mob.near/ProfileImage"; import constants from "@app/constants"; +import nearToUsd from "@app/modules/nearToUsd"; import _address from "@app/utils/_address"; import hrefWithParams from "@app/utils/hrefWithParams"; -import nearToUsd from "@app/utils/nearToUsd"; import AmountInput from "../AmountInput/AmountInput"; import Alert from "../Banners/Alert"; import VerifyInfo from "../Banners/VerifyInfo"; diff --git a/src/utils/nearToUsd.ts b/src/modules/nearToUsd.ts similarity index 100% rename from src/utils/nearToUsd.ts rename to src/modules/nearToUsd.ts diff --git a/src/pages/CreateProject/components/SuccessfullRegister/SuccessfullRegister.tsx b/src/pages/CreateProject/components/SuccessfullRegister/SuccessfullRegister.tsx index ac521447..fad04a89 100644 --- a/src/pages/CreateProject/components/SuccessfullRegister/SuccessfullRegister.tsx +++ b/src/pages/CreateProject/components/SuccessfullRegister/SuccessfullRegister.tsx @@ -11,7 +11,7 @@ const SuccessfullRegister = ({ registeredProject }: { registeredProject: any })