nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-30 08:50:51 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix purchasing wall items with extra data

Browse Source
This commit is contained in:
Bill 2022-03-16 17:46:04 -04:00
parent 9bb976a587
commit 1097cb442e
2 changed files with 31 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/catalog/views/page/widgets/CatalogItemGridWidgetView.tsx
View File

@ -29,7 +29,7 @@ export const CatalogItemGridWidgetView: FC<CatalogItemGridWidgetViewProps> = pro
if(offer.product && (offer.product.productType === ProductTypeEnum.WALL)) if(offer.product && (offer.product.productType === ProductTypeEnum.WALL))
{ {
DispatchUiEvent(new CatalogSetExtraPurchaseParameterEvent(offer.product.extraParam)); setTimeout(() => DispatchUiEvent(new CatalogSetExtraPurchaseParameterEvent(offer.product.extraParam)), 0);
} }
} }

44
src/components/catalog/views/page/widgets/CatalogPurchaseWidgetView.tsx
View File

@ -2,7 +2,7 @@ import { PurchaseFromCatalogComposer } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useMemo, useState } from 'react'; import { FC, useCallback, useEffect, useMemo, useState } from 'react';
import { CreateLinkEvent, GetClubMemberLevel, LocalizeText, SendMessageComposer } from '../../../../../api'; import { CreateLinkEvent, GetClubMemberLevel, LocalizeText, SendMessageComposer } from '../../../../../api';
import { Button, LayoutLoadingSpinnerView } from '../../../../../common'; import { Button, LayoutLoadingSpinnerView } from '../../../../../common';
import { CatalogEvent, CatalogInitGiftEvent, CatalogInitPurchaseEvent, CatalogPurchasedEvent, CatalogPurchaseFailureEvent, CatalogPurchaseNotAllowedEvent, CatalogPurchaseSoldOutEvent, CatalogWidgetEvent } from '../../../../../events'; import { CatalogEvent, CatalogInitGiftEvent, CatalogInitPurchaseEvent, CatalogPurchasedEvent, CatalogPurchaseFailureEvent, CatalogPurchaseNotAllowedEvent, CatalogPurchaseSoldOutEvent, CatalogSetExtraPurchaseParameterEvent, CatalogWidgetEvent } from '../../../../../events';
import { DispatchUiEvent, UseUiEvent } from '../../../../../hooks'; import { DispatchUiEvent, UseUiEvent } from '../../../../../hooks';
import { GetCurrencyAmount } from '../../../../purse/common/CurrencyHelper'; import { GetCurrencyAmount } from '../../../../purse/common/CurrencyHelper';
import { useCatalogContext } from '../../../CatalogContext'; import { useCatalogContext } from '../../../CatalogContext';
@ -20,8 +20,7 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
const { noGiftOption = false, purchaseCallback = null } = props; const { noGiftOption = false, purchaseCallback = null } = props;
const [ purchaseWillBeGift, setPurchaseWillBeGift ] = useState(false); const [ purchaseWillBeGift, setPurchaseWillBeGift ] = useState(false);
const [ purchaseState, setPurchaseState ] = useState(CatalogPurchaseState.NONE); const [ purchaseState, setPurchaseState ] = useState(CatalogPurchaseState.NONE);
const { currentOffer = null, currentPage = null, purchaseOptions = null, setPurchaseOptions = null, getNodesByOfferId = null } = useCatalogContext(); const { currentOffer = null, currentPage = null, purchaseOptions = null, setPurchaseOptions = null } = useCatalogContext();
const { quantity = 1, extraData = '', extraParamRequired = false, previewStuffData = null } = purchaseOptions;
const onCatalogInitPurchaseEvent = useCallback((event: CatalogInitPurchaseEvent) => const onCatalogInitPurchaseEvent = useCallback((event: CatalogInitPurchaseEvent) =>
{ {
@ -33,6 +32,22 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
UseUiEvent(CatalogWidgetEvent.INIT_PURCHASE, onCatalogInitPurchaseEvent); UseUiEvent(CatalogWidgetEvent.INIT_PURCHASE, onCatalogInitPurchaseEvent);
const onCatalogSetExtraPurchaseParameterEvent = useCallback((event: CatalogSetExtraPurchaseParameterEvent) =>
{
if(!currentOffer) return;
setPurchaseOptions(prevValue =>
{
const newValue = { ...prevValue };
newValue.extraData = event.parameter;
return newValue;
});
}, [ currentOffer, setPurchaseOptions ]);
UseUiEvent(CatalogWidgetEvent.SET_EXTRA_PARM, onCatalogSetExtraPurchaseParameterEvent);
const onCatalogEvent = useCallback((event: CatalogEvent) => const onCatalogEvent = useCallback((event: CatalogEvent) =>
{ {
switch(event.type) switch(event.type)
@ -61,7 +76,7 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
{ {
if(!currentOffer) return false; if(!currentOffer) return false;
if(extraParamRequired && (!extraData || !extraData.length)) return false; if(purchaseOptions.extraParamRequired && (!purchaseOptions.extraData || !purchaseOptions.extraData.length)) return false;
if(currentOffer.pricingModel === Offer.PRICING_MODEL_SINGLE) if(currentOffer.pricingModel === Offer.PRICING_MODEL_SINGLE)
{ {
@ -71,9 +86,9 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
} }
return false; return false;
}, [ currentOffer, extraParamRequired, extraData ]); }, [ currentOffer, purchaseOptions ]);
const purchase = useCallback((isGift: boolean = false) => const purchase = (isGift: boolean = false) =>
{ {
if(!currentOffer) return; if(!currentOffer) return;
@ -86,7 +101,7 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
if(isGift) if(isGift)
{ {
DispatchUiEvent(new CatalogInitGiftEvent(currentOffer.page.pageId, currentOffer.offerId, extraData)); DispatchUiEvent(new CatalogInitGiftEvent(currentOffer.page.pageId, currentOffer.offerId, purchaseOptions.extraData));
return; return;
} }
@ -109,18 +124,15 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
// if(nodes) pageId = nodes[0].pageId; // if(nodes) pageId = nodes[0].pageId;
// } // }
SendMessageComposer(new PurchaseFromCatalogComposer(pageId, currentOffer.offerId, extraData, quantity)); SendMessageComposer(new PurchaseFromCatalogComposer(pageId, currentOffer.offerId, purchaseOptions.extraData, purchaseOptions.quantity));
}, [ currentOffer, purchaseCallback, extraData, quantity ]); }
useEffect(() => useEffect(() =>
{ {
if(!currentOffer) return; if(!currentOffer) return;
return () =>
{
setPurchaseState(CatalogPurchaseState.NONE); setPurchaseState(CatalogPurchaseState.NONE);
setPurchaseOptions({ quantity: 1, extraData: '', extraParamRequired: false, previewStuffData: null }); setPurchaseOptions({ quantity: 1, extraData: '', extraParamRequired: false, previewStuffData: null });
}
}, [ currentOffer, setPurchaseOptions ]); }, [ currentOffer, setPurchaseOptions ]);
useEffect(() => useEffect(() =>
@ -142,8 +154,8 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
const PurchaseButton = () => const PurchaseButton = () =>
{ {
const priceCredits = (currentOffer.priceInCredits * quantity); const priceCredits = (currentOffer.priceInCredits * purchaseOptions.quantity);
const pricePoints = (currentOffer.priceInActivityPoints * quantity); const pricePoints = (currentOffer.priceInActivityPoints * purchaseOptions.quantity);
if(GetClubMemberLevel() < currentOffer.clubLevel) return <Button variant="danger" disabled>{ LocalizeText('catalog.alert.hc.required') }</Button>; if(GetClubMemberLevel() < currentOffer.clubLevel) return <Button variant="danger" disabled>{ LocalizeText('catalog.alert.hc.required') }</Button>;
@ -165,7 +177,7 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
return <Button variant="danger">{ LocalizeText('generic.failed') + ' - ' + LocalizeText('catalog.alert.limited_edition_sold_out.title') }</Button>; return <Button variant="danger">{ LocalizeText('generic.failed') + ' - ' + LocalizeText('catalog.alert.limited_edition_sold_out.title') }</Button>;
case CatalogPurchaseState.NONE: case CatalogPurchaseState.NONE:
default: default:
return <Button disabled={ (extraParamRequired && (!extraData || !extraData.length)) } onClick={ event => setPurchaseState(CatalogPurchaseState.CONFIRM) }>{ LocalizeText('catalog.purchase_confirmation.' + (currentOffer.isRentOffer ? 'rent' : 'buy')) }</Button>; return <Button disabled={ (purchaseOptions.extraParamRequired && (!purchaseOptions.extraData || !purchaseOptions.extraData.length)) } onClick={ event => setPurchaseState(CatalogPurchaseState.CONFIRM) }>{ LocalizeText('catalog.purchase_confirmation.' + (currentOffer.isRentOffer ? 'rent' : 'buy')) }</Button>;
} }
} }
@ -173,7 +185,7 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
<> <>
<PurchaseButton /> <PurchaseButton />
{ (!noGiftOption && !currentOffer.isRentOffer) && { (!noGiftOption && !currentOffer.isRentOffer) &&
<Button disabled={ ((quantity > 1) || !currentOffer.giftable || isLimitedSoldOut || (extraParamRequired && (!extraData || !extraData.length))) } onClick={ event => purchase(true) }> <Button disabled={ ((purchaseOptions.quantity > 1) || !currentOffer.giftable || isLimitedSoldOut || (purchaseOptions.extraParamRequired && (!purchaseOptions.extraData || !purchaseOptions.extraData.length))) } onClick={ event => purchase(true) }>
{ LocalizeText('catalog.purchase_confirmation.gift') } { LocalizeText('catalog.purchase_confirmation.gift') }
</Button> } </Button> }
</> </>