feat: add waiting for invoice message on invoice modal

geyserfund · Mar 27, 2022 · ce1390c · ce1390c
1 parent 95df816
commit ce1390c
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/src/pages/grants/components/ContributeButton.tsx b/src/pages/grants/components/ContributeButton.tsx
@@ -301,6 +301,7 @@ export const ContributeButton = ({ project, confettiEffects, buttonStyle, sats,
 					owners={project.owners.map(owner => owner.user.username)}
 					qrCode={fundingTx.paymentRequest}
 					handleCloseButton={handleCloseButton}
+					invoiceCancelled={fundingTx.canceled}
 				/>
 			</ModalContent>
 		</Modal>

diff --git a/src/pages/grants/components/QrInvoice.tsx b/src/pages/grants/components/QrInvoice.tsx
@@ -23,11 +23,13 @@ interface IQrInvoice {
 	amount: number;
 	owners: string[];
 	qrCode: string;
-	handleCloseButton: () => void
+	invoiceCancelled: boolean;
+	handleCloseButton: () => void;
+
 }
 
 export const QrInvoice = ({
-	comment, title, amount, owners, qrCode}: IQrInvoice) => {
+	comment, title, amount, owners, qrCode, invoiceCancelled}: IQrInvoice) => {
 	const classes = useStyles();
 
 	const [copy, setcopy] = useState(false);
@@ -63,6 +65,10 @@ export const QrInvoice = ({
 				</Box>
 			</Box>
 			<QRCode value={qrCode} onClick={handleCopy} />
+			{invoiceCancelled
+				? <Text color="#EA453B">You cancelled your payment. Please close window and try again.</Text>
+				: <Text color="#EAA13B">Waiting for your payment...</Text>
+			}
 			<Box className={classes.copyText}>
 				<ButtonComponent
 					isFullWidth