zer0-os · domw30 · May 4, 2022 · May 3, 2022 · May 3, 2022 · May 3, 2022
diff --git a/src/components/Cards/ImageCard/ImageCard.module.scss b/src/components/Cards/ImageCard/ImageCard.module.scss
@@ -53,10 +53,12 @@ $placeholder-background: #000;
 		width: 100% !important;
 		object-fit: cover;
 		overflow: hidden;
+		border-radius: 8px 8px 0 0;
 
 		img,
 		video {
 			width: 100%;
+			border-radius: 8px 8px 0 0;
 		}
 
 		// Hide default spinner in image

diff --git a/src/components/Confirmation/Confirmation.module.scss b/src/components/Confirmation/Confirmation.module.scss
@@ -158,7 +158,6 @@ $gutter: 16px;
 
 .Confirmation .Buttons {
 	display: flex;
-	flex-direction: column;
 	justify-content: center;
 }
 

diff --git a/src/components/NFTMedia/NFTMedia.module.scss b/src/components/NFTMedia/NFTMedia.module.scss
@@ -13,6 +13,7 @@
 	max-width: 100%;
 	max-height: 100%;
 	transition: opacity var(--animation-time-medium) ease-in-out;
+	border-radius: 8px;
 }
 
 .Cover {

diff --git a/src/components/StatsWidget/StatsWidget.module.scss b/src/components/StatsWidget/StatsWidget.module.scss
@@ -6,6 +6,7 @@
 	flex-direction: column;
 	justify-content: center;
 	padding: 16px;
+	height: 100%;
 }
 
 .previewView {
@@ -16,7 +17,6 @@
 .normalView {
 	background: #1a1022;
 	border-radius: var(--box-radius);
-	height: 100%;
 }
 
 .StatsFieldName {

diff --git a/src/components/Wizard/Wizard.tsx b/src/components/Wizard/Wizard.tsx
@@ -9,7 +9,7 @@ import Confirmation from './Presets/Confirmation';
 import NFTDetails from './Presets/NFTDetails';
 
 type WizardProps = {
-	header: string;
+	header?: string;
 	headerClassName?: string;
 	subHeader?: string;
 	children: React.ReactNode;
@@ -33,11 +33,14 @@ const Wizard = ({
 		)}
 	>
 		{/* Header */}
-		<div className={classNames(styles.Header, headerClassName)}>
-			<h1 className="glow-text-white">{header}</h1>
-			{subHeader && <h2>{subHeader}</h2>}
-			{sectionDivider && <hr className="glow" />}
-		</div>
+		{header && (
+			<div className={classNames(styles.Header, headerClassName)}>
+				<h1 className="glow-text-white">{header}</h1>
+				{subHeader && <h2>{subHeader}</h2>}
+
+				{sectionDivider && <hr className="glow" />}
+			</div>
+		)}
 
 		{/* Wizard Body */}
 		{children}

diff --git a/src/containers/flows/AcceptBid/AcceptBid.constants.tsx b/src/containers/flows/AcceptBid/AcceptBid.constants.tsx
@@ -48,7 +48,9 @@ export const ERRORS = {
 	TRANSACTION: 'Transaction failed. Please try again',
 	LIBRARY: 'Failed to connect with Web3 wallet.',
 	CONSOLE_TEXT: 'Failed to check zAuction approval status',
-	REJECTED_WALLET: 'Rejected by wallet',
+	REJECTED_WALLET: 'Rejected by wallet.',
+	DATA_CONSUMED:
+		'The bid you are trying to accept is no longer valid. Please select another bid to accept',
 };
 
 export const MESSAGES = {
@@ -64,6 +66,8 @@ export const MESSAGES = {
 		'Waiting for transaction approval. You should receive a request in your wallet.',
 	SUCCESS_CONFIRMATION: 'Success! Bid accepted and ownership transferred',
 	CONFIRM_BID_AMOUNT: 'Are you sure you want to accept a bid of',
+	DATA_CONSUMED: 'data already consumed',
+	INCORRECT_BIDDER: 'recovered incorrect bidder',
 };
 
 export const getConfirmNFTPriceDetails = (

diff --git a/src/containers/flows/AcceptBid/AcceptBid.tsx b/src/containers/flows/AcceptBid/AcceptBid.tsx
@@ -167,7 +167,7 @@ const AcceptBid = ({
 			setStepContent(StepContent.Success);
 		} catch (e) {
 			setCurrentStep(Step.ConfirmDetails);
-			setError(ERRORS.TRANSACTION);
+			setError(e.message);
 			setStepContent(StepContent.Details);
 		}
 		if (!isMounted.current) return;

diff --git a/src/containers/flows/AcceptBid/hooks/useAcceptBid.test.tsx b/src/containers/flows/AcceptBid/hooks/useAcceptBid.test.tsx
@@ -109,8 +109,26 @@ test('status updates as expected', async () => {
 	expect(hook.status).toBeUndefined();
 });
 
-test('handles failed/rejected signature', async () => {
-	mockAcceptBid.mockRejectedValue(undefined);
+test('handles failed/rejected signature when data has already been consumed', async () => {
+	mockAcceptBid.mockRejectedValue(new Error('data already consumed'));
+	const hook = setupHook();
+
+	var err: Error | undefined;
+	try {
+		await act(async () => {
+			await hook.accept(mockBid);
+		});
+	} catch (e) {
+		err = e as Error;
+	}
+
+	expect(mockAcceptBid).toBeCalledTimes(1);
+	expect(err?.message).toBe(ERRORS.DATA_CONSUMED);
+	expect(console.error).toHaveBeenCalled();
+});
+
+test('handles failed/rejected signature when rejected by wallet', async () => {
+	mockAcceptBid.mockRejectedValue(new Error('Rejected by wallet.'));
 	const hook = setupHook();
 
 	var err: Error | undefined;

diff --git a/src/containers/flows/AcceptBid/hooks/useAcceptBid.ts b/src/containers/flows/AcceptBid/hooks/useAcceptBid.ts
@@ -39,6 +39,9 @@ const useAcceptBid = (): UseAcceptBidReturn => {
 				tx = await sdk.zauction.acceptBid(bid, library.getSigner());
 			} catch (err) {
 				console.error(err);
+				if (err.message.includes(MESSAGES.DATA_CONSUMED)) {
+					throw new Error(ERRORS.DATA_CONSUMED);
+				}
 				throw new Error(ERRORS.REJECTED_WALLET);
 			}
 

diff --git a/src/containers/flows/BuyNow/Steps/Details.module.scss b/src/containers/flows/BuyNow/Steps/Details.module.scss
@@ -13,7 +13,7 @@
 		margin-top: 32px;
 		text-align: center;
 
-		span {
+		> span:first-child {
 			color: var(--color-grey-lighter-2);
 		}
 

diff --git a/src/containers/flows/MakeABid/MakeABid.constants.tsx b/src/containers/flows/MakeABid/MakeABid.constants.tsx
@@ -69,6 +69,6 @@ export const getSuccessNotification = (
 export const getWildBalance = (balance: number) =>
 	`Your balance: ${Number(balance).toLocaleString()} WILD`;
 
-export const getUsdEstimation = (bid: string) => `Approx. ${bid} USD`;
+export const getUsdEstimation = (bid: string) => `Approx. $${bid} USD`;
 
 export const getBidAmountText = (bid: string) => `${bid} WILD`;
diff --git a/src/containers/flows/SetBuyNow/SetBuyNow.tsx b/src/containers/flows/SetBuyNow/SetBuyNow.tsx
@@ -48,13 +48,13 @@ const SetBuyNow = ({
 	account,
 }: SetBuyNowProps) => {
 	const editText = account !== domain?.owner ? 'selecting' : 'purchasing';
-	const getTitle = () =>
-		isLoadingDomainData
-			? ''
-			: domain?.currentBuyNowPrice?.gt(0)
-			? 'Edit Buy Now'
-			: 'Set Buy Now';
-	const wizardHeader = getTitle();
+
+	const wizardHeader = isLoadingDomainData
+		? ''
+		: domain?.currentBuyNowPrice?.gt(0)
+		? 'Edit Buy Now'
+		: 'Set Buy Now';
+
 	if (isLoadingDomainData) {
 		return (
 			<Wizard header={wizardHeader}>
@@ -115,7 +115,11 @@ const SetBuyNow = ({
 	return (
 		<Wizard
 			header={wizardHeader}
-			subHeader={`Please review the information and the art to make sure you are ${editText} the right NFT.`}
+			subHeader={
+				step === Step.SetBuyNow || step === Step.WaitingForBuyNowConfirmation
+					? `Please review the information and the art to make sure you are ${editText} the right NFT.`
+					: ''
+			}
 		>
 			{steps[step]}
 		</Wizard>

diff --git a/...FTView/elements/DomainSettings/elements/DocumentSettingsModal/_domain-settings-modal.scss b/...FTView/elements/DomainSettings/elements/DocumentSettingsModal/_domain-settings-modal.scss
@@ -42,7 +42,7 @@ $gutter: 16px;
 
 			&--close-icon {
 				position: absolute;
-				top: -24px;
+				top: 0;
 				right: 0;
 				color: var(--color-grey);
 

diff --git a/...w/elements/DomainSettings/elements/DomainSettingsBody/hooks/useDomainSettingsBodyData.tsx b/...w/elements/DomainSettings/elements/DomainSettingsBody/hooks/useDomainSettingsBodyData.tsx
@@ -52,6 +52,7 @@ export const useDomainSettingsBodyData = (
 	const [gridViewByDefault, setGridViewByDefault] = usePropsState<boolean>(
 		initialDomainSettings.gridViewByDefault,
 	);
+
 	const [customDomainHeader, setCustomDomainHeader] = usePropsState<boolean>(
 		initialDomainSettings.customDomainHeader,
 	);

diff --git a/src/containers/staking/DepositTable/DepositTableCard.module.scss b/src/containers/staking/DepositTable/DepositTableCard.module.scss
@@ -36,6 +36,10 @@
 			}
 		}
 
+		.ButtonContainer {
+			padding-bottom: 2px;
+		}
+
 		.Dropdown {
 			:global(ul) {
 				left: unset;

diff --git a/src/containers/staking/DepositTable/DepositTableCard.tsx b/src/containers/staking/DepositTable/DepositTableCard.tsx
@@ -74,11 +74,13 @@ const DepositTableCard = (props: any) => {
 						transform: 'translateX(calc(-100% + 34px))',
 					}}
 				>
-					<button ref={buttonRef} className={styles.Dots} onClick={() => {}}>
-						<div></div>
-						<div></div>
-						<div></div>
-					</button>
+					<div className={styles.ButtonContainer}>
+						<button ref={buttonRef} className={styles.Dots} onClick={() => {}}>
+							<div></div>
+							<div></div>
+							<div></div>
+						</button>
+					</div>
 				</OptionDropdown>
 			</div>
 			<div className={styles.Body}>

diff --git a/src/containers/staking/DepositTable/DepositTableRow.module.scss b/src/containers/staking/DepositTable/DepositTableRow.module.scss
@@ -64,3 +64,7 @@
 		}
 	}
 }
+
+.ButtonContainer {
+	padding: 4px 0;
+}
diff --git a/src/containers/staking/DepositTable/DepositTableRow.tsx b/src/containers/staking/DepositTable/DepositTableRow.tsx
@@ -101,11 +101,13 @@ const DepositTableRow = (props: any) => {
 						transform: 'translateX(calc(-100% + 8px))',
 					}}
 				>
-					<button ref={buttonRef} className={styles.Dots} onClick={() => {}}>
-						<div></div>
-						<div></div>
-						<div></div>
-					</button>
+					<div className={styles.ButtonContainer}>
+						<button ref={buttonRef} className={styles.Dots} onClick={() => {}}>
+							<div></div>
+							<div></div>
+							<div></div>
+						</button>
+					</div>
 				</OptionDropdown>
 			</td>
 		</tr>

diff --git a/src/containers/staking/StakePoolTable/StakePoolTableRow.module.scss b/src/containers/staking/StakePoolTable/StakePoolTableRow.module.scss
@@ -35,3 +35,7 @@
 		margin-right: auto;
 	}
 }
+
+.ButtonContainer {
+	padding: 4px 0;
+}
diff --git a/src/containers/staking/StakePoolTable/StakePoolTableRow.tsx b/src/containers/staking/StakePoolTable/StakePoolTableRow.tsx
@@ -50,9 +50,11 @@ const StakePoolTableRow = (props: any) => {
 			</td>
 			<td className={styles.Right}>{'$' + toFiat(tvl)}</td>
 			<td>
-				<FutureButton glow onClick={onClick}>
-					Stake
-				</FutureButton>
+				<div className={styles.ButtonContainer}>
+					<FutureButton glow onClick={onClick}>
+						Stake
+					</FutureButton>
+				</div>
 			</td>
 		</tr>
 	);

diff --git a/src/containers/staking/flows/StakeFlow/StakeFlow.tsx b/src/containers/staking/flows/StakeFlow/StakeFlow.tsx
@@ -310,7 +310,6 @@ const StakeFlow = (props: StakeFlowProps) => {
 
 	return (
 		<Wizard
-			header={unstake ? 'Unstake' : 'Stake'}
 			className={cx(
 				styles.Container,
 				'background-primary',
-Original file line number
+Diff line change
@@ Expand Up / @@ -64,3 +64,7 @@ @@
     		}
     	}
     }
+    .ButtonContainer {
+    	padding: 4px 0;
+    }