diff --git a/packages/gui/src/components/plot/add/PlotAddForm.tsx b/packages/gui/src/components/plot/add/PlotAddForm.tsx index e7ee49228f..c7aa9b0792 100644 --- a/packages/gui/src/components/plot/add/PlotAddForm.tsx +++ b/packages/gui/src/components/plot/add/PlotAddForm.tsx @@ -57,6 +57,7 @@ export default function PlotAddForm(props: Props) { const [createNewPoolWallet] = useCreateNewPoolWalletMutation(); const addNFTref = useRef(); const { state } = useLocation(); + const [showingPoolDetails, setShowingPoolDetails] = useState(false); const otherDefaults = { plotCount: 1, @@ -214,14 +215,21 @@ export default function PlotAddForm(props: Props) { } }; + function adjustStepCount() { + if (showingPoolDetails) { + step++; + } + return step++; + } + return (
Add a Plot - - + + diff --git a/packages/gui/src/components/plot/add/PlotAddNFT.tsx b/packages/gui/src/components/plot/add/PlotAddNFT.tsx index bfb5d460af..ed1880936a 100644 --- a/packages/gui/src/components/plot/add/PlotAddNFT.tsx +++ b/packages/gui/src/components/plot/add/PlotAddNFT.tsx @@ -10,16 +10,23 @@ import PlotNFTSelectPool from '../../plotNFT/select/PlotNFTSelectPool'; type Props = { step: number; + setShowingPoolDetails?: (showing: boolean) => void; }; const PlotAddNFT = forwardRef((props: Props, ref) => { - const { step } = props; + const { step, setShowingPoolDetails } = props; const { nfts, external, loading } = usePlotNFTs(); const [showCreatePlotNFT, setShowCreatePlotNFT] = useState(false); const { setValue } = useFormContext(); const hasNFTs = !!nfts?.length || !!external?.length; + React.useEffect(() => { + if (!showCreatePlotNFT && setShowingPoolDetails) { + setShowingPoolDetails(false); + } + }, [showCreatePlotNFT, setShowingPoolDetails]); + function handleJoinPool() { setShowCreatePlotNFT(true); setValue('createNFT', true); @@ -37,6 +44,7 @@ const PlotAddNFT = forwardRef((props: Props, ref) => { onCancel={handleCancelPlotNFT} ref={ref} title={Create a Plot NFT} + setShowingPoolDetails={setShowingPoolDetails} description={ Join a pool and get consistent XCH farming rewards. The average returns are the same, but it is much less diff --git a/packages/gui/src/components/plotNFT/select/PlotNFTSelectBase.tsx b/packages/gui/src/components/plotNFT/select/PlotNFTSelectBase.tsx index 36efa8beac..51aeec9df3 100644 --- a/packages/gui/src/components/plotNFT/select/PlotNFTSelectBase.tsx +++ b/packages/gui/src/components/plotNFT/select/PlotNFTSelectBase.tsx @@ -21,10 +21,11 @@ type Props = { description?: ReactNode; hideFee?: boolean; feeDescription?: ReactNode; + setShowingPoolDetails?: (showing: boolean) => void; }; export default function PlotNFTSelectBase(props: Props) { - const { step, onCancel, title, description, hideFee = false, feeDescription } = props; + const { step, onCancel, title, description, hideFee = false, feeDescription, setShowingPoolDetails } = props; // const { nfts } = usePlotNFTs(); const { setValue } = useFormContext(); const self = useWatch({ @@ -59,6 +60,12 @@ export default function PlotNFTSelectBase(props: Props) { const showPoolInfo = !self && !!poolUrl; + React.useEffect(() => { + if (setShowingPoolDetails) { + setShowingPoolDetails(showPoolInfo); + } + }, [showPoolInfo, setShowingPoolDetails]); + return ( <> void; }; const PlotNFTSelectPool = forwardRef((props: Props, ref) => { @@ -79,6 +80,7 @@ const PlotNFTSelectPool = forwardRef((props: Props, ref) => { submitTitle = Create, hideFee = false, feeDescription, + setShowingPoolDetails, } = props; const [loading, setLoading] = useState(false); const { balance, loading: walletLoading } = useStandardWallet(); @@ -161,6 +163,7 @@ const PlotNFTSelectPool = forwardRef((props: Props, ref) => { description={description} hideFee={hideFee} feeDescription={feeDescription} + setShowingPoolDetails={setShowingPoolDetails} /> {exceededNFTLimit && (