add confirm to marketplace

This commit is contained in:
dank074 2022-01-04 02:20:52 -06:00
parent e5e26f106c
commit e44f32bd68
6 changed files with 64 additions and 58 deletions

View File

@ -1,11 +1,6 @@
import { BuyMarketplaceOfferMessageComposer, CancelMarketplaceOfferMessageComposer } from '@nitrots/nitro-renderer';
import { FC, useCallback } from 'react';
import { GetRoomEngine, LocalizeText } from '../../../../../../../api';
import { SendMessageHook } from '../../../../../../../hooks';
import { NitroCardGridItemView } from '../../../../../../../layout';
import { NotificationAlertType } from '../../../../../../notification-center/common/NotificationAlertType';
import { NotificationUtilities } from '../../../../../../notification-center/common/NotificationUtilities';
import { GetCurrencyAmount } from '../../../../../../purse/common/CurrencyHelper';
import { MarketplaceOfferData } from '../common/MarketplaceOfferData';
import { MarketPlaceOfferState } from '../common/MarketplaceOfferState';
@ -16,11 +11,12 @@ export interface MarketplaceItemViewProps
{
offerData: MarketplaceOfferData;
type?: number;
onClick(offerData: MarketplaceOfferData): void;
}
export const MarketplaceItemView: FC<MarketplaceItemViewProps> = props =>
{
const { offerData = null, type = PUBLIC_OFFER } = props;
const { offerData = null, type = PUBLIC_OFFER, onClick = null } = props;
const getImageUrlForOffer = useCallback( () =>
{
@ -76,22 +72,6 @@ export const MarketplaceItemView: FC<MarketplaceItemViewProps> = props =>
return LocalizeText('catalog.marketplace.offer.time_left', ['time'], [text] );
}, [offerData]);
const takeItemBack = useCallback(() =>
{
SendMessageHook(new CancelMarketplaceOfferMessageComposer(offerData.offerId));
}, [offerData.offerId]);
const buyOffer = useCallback(() =>
{
if(offerData.price > GetCurrencyAmount(-1))
{
NotificationUtilities.simpleAlert(LocalizeText('catalog.alert.notenough.credits.description'), NotificationAlertType.DEFAULT, null, null, LocalizeText('catalog.alert.notenough.title'));
return;
}
SendMessageHook(new BuyMarketplaceOfferMessageComposer(offerData.offerId));
}, [offerData.offerId, offerData.price]);
return (
<NitroCardGridItemView className='w-100 marketplace-item align-items-center'>
<img src={ getImageUrlForOffer() } className='mx-3' alt='' />
@ -111,9 +91,9 @@ export const MarketplaceItemView: FC<MarketplaceItemViewProps> = props =>
}
</div>
<div className='btn-group-vertical mx-1 gap-2'>
{ (type === OWN_OFFER && offerData.status !== MarketPlaceOfferState.SOLD) && <button className='btn btn-secondary btn-sm' onClick={ takeItemBack }>{ LocalizeText('catalog.marketplace.offer.pick') }</button>}
{ (type === OWN_OFFER && offerData.status !== MarketPlaceOfferState.SOLD) && <button className='btn btn-secondary btn-sm' onClick={ () => onClick(offerData) }>{ LocalizeText('catalog.marketplace.offer.pick') }</button>}
{ type === PUBLIC_OFFER && <>
<button className='btn btn-secondary btn-sm' onClick={ buyOffer } >{ LocalizeText('buy') }</button>
<button className='btn btn-secondary btn-sm' onClick={ () => onClick(offerData) } >{ LocalizeText('buy') }</button>
<button className='btn btn-secondary btn-sm' disabled={true}>{ LocalizeText('catalog.marketplace.view_more') }</button>
</>}
</div>

View File

@ -1,4 +1,4 @@
import { GetMarketplaceOwnOffersMessageComposer, MarketplaceCancelOfferResultEvent, MarketplaceOwnOffersEvent, RedeemMarketplaceOfferCreditsMessageComposer } from '@nitrots/nitro-renderer';
import { CancelMarketplaceOfferMessageComposer, GetMarketplaceOwnOffersMessageComposer, MarketplaceCancelOfferResultEvent, MarketplaceOwnOffersEvent, RedeemMarketplaceOfferCreditsMessageComposer } from '@nitrots/nitro-renderer';
import { FC, useCallback, useState } from 'react';
import { LocalizeText } from '../../../../../../../api';
import { BatchUpdates, CreateMessageHook, SendMessageHook, UseMountEffect } from '../../../../../../../hooks';
@ -96,6 +96,11 @@ export const CatalogLayoutMarketplaceOwnItemsView: FC<CatalogLayoutMarketplaceOw
SendMessageHook(new RedeemMarketplaceOfferCreditsMessageComposer());
}, []);
const takeItemBack = useCallback( (offerData: MarketplaceOfferData) =>
{
SendMessageHook(new CancelMarketplaceOfferMessageComposer(offerData.offerId));
}, []);
return (
<>
{ (creditsWaiting <= 0) && <NitroLayoutBase className='text-black'>{LocalizeText('catalog.marketplace.redeem.no_sold_items')}</NitroLayoutBase>}
@ -107,7 +112,7 @@ export const CatalogLayoutMarketplaceOwnItemsView: FC<CatalogLayoutMarketplaceOw
<div className='text-black'>{LocalizeText('catalog.marketplace.items_found', ['count'], [offers.size.toString()])}</div>
<NitroCardGridView columns={1} className='text-black'>
{
Array.from(offers.values()).map( (entry, index) => <MarketplaceItemView key={ index } offerData={ entry } type={ OWN_OFFER } />)
Array.from(offers.values()).map( (entry, index) => <MarketplaceItemView key={ index } offerData={ entry } type={ OWN_OFFER } onClick={takeItemBack} />)
}
</NitroCardGridView>
</>

View File

@ -5,6 +5,7 @@ import { CatalogPostMarketplaceOfferEvent } from '../../../../../../../events/ca
import { SendMessageHook, useUiEvent } from '../../../../../../../hooks';
import { NitroCardContentView, NitroCardHeaderView, NitroCardView, NitroLayoutFlex } from '../../../../../../../layout';
import { FurnitureItem } from '../../../../../../inventory/common/FurnitureItem';
import { NotificationUtilities } from '../../../../../../notification-center/common/NotificationUtilities';
export const MarketplacePostOfferView : FC<{}> = props =>
{
@ -68,12 +69,15 @@ export const MarketplacePostOfferView : FC<{}> = props =>
const postItem = useCallback( () =>
{
if(isNaN(askingPrice) || askingPrice <= 0) return;
if(isNaN(askingPrice) || askingPrice <= 0 || !item) return;
NotificationUtilities.confirm(LocalizeText('inventory.marketplace.confirm_offer.info', ['furniname', 'price'], [getFurniTitle(), askingPrice.toString()]), () =>
{
SendMessageHook(new MakeOfferMessageComposer(askingPrice, item.isWallItem ? 2 : 1, item.id));
setItem(null);
}, [askingPrice, item]);
},
() => { setItem(null)}, null, null, LocalizeText('inventory.marketplace.confirm_offer.title'));
}, [askingPrice, getFurniTitle, item]);
return ( item &&
<NitroCardView uniqueKey="catalog-mp-post-offer" className="nitro-marketplace-post-offer" simple={ true }>

View File

@ -1,10 +1,11 @@
import { GetMarketplaceOffersMessageComposer, MarketplaceBuyOfferResultEvent, MarketPlaceOffersEvent } from '@nitrots/nitro-renderer';
import { BuyMarketplaceOfferMessageComposer, GetMarketplaceOffersMessageComposer, MarketplaceBuyOfferResultEvent, MarketPlaceOffersEvent } from '@nitrots/nitro-renderer';
import { FC, useCallback, useMemo, useState } from 'react';
import { LocalizeText } from '../../../../../../../api';
import { BatchUpdates, CreateMessageHook, SendMessageHook } from '../../../../../../../hooks';
import { NitroCardGridView } from '../../../../../../../layout';
import { NotificationAlertType } from '../../../../../../notification-center/common/NotificationAlertType';
import { NotificationUtilities } from '../../../../../../notification-center/common/NotificationUtilities';
import { GetCurrencyAmount } from '../../../../../../purse/common/CurrencyHelper';
import { CatalogLayoutProps } from '../../CatalogLayout.types';
import { IMarketplaceSearchOptions } from '../common/IMarketplaceSearchOptions';
import { MarketplaceOfferData } from '../common/MarketplaceOfferData';
@ -47,6 +48,21 @@ export const CatalogLayoutMarketplacePublicItemsView: FC<CatalogLayoutMarketplac
return [];
}, [searchType]);
const purchaseItem = useCallback((offerData: MarketplaceOfferData) =>
{
if(offerData.price > GetCurrencyAmount(-1))
{
NotificationUtilities.simpleAlert(LocalizeText('catalog.alert.notenough.credits.description'), NotificationAlertType.DEFAULT, null, null, LocalizeText('catalog.alert.notenough.title'));
return;
}
const offerId = offerData.offerId;
NotificationUtilities.confirm(LocalizeText('catalog.marketplace.confirm_header'), () =>
{
SendMessageHook(new BuyMarketplaceOfferMessageComposer(offerId));
},
null, null, null, LocalizeText('catalog.marketplace.confirm_title'));
},[]);
const onMarketPlaceOffersEvent = useCallback( (event: MarketPlaceOffersEvent) =>
{
const parser = event.getParser();
@ -109,8 +125,12 @@ export const CatalogLayoutMarketplacePublicItemsView: FC<CatalogLayoutMarketplac
return newVal;
});
// for now just let user know
NotificationUtilities.simpleAlert(LocalizeText('catalog.marketplace.confirm_higher_header'), NotificationAlertType.DEFAULT, null, null, LocalizeText('catalog.marketplace.confirm_higher_title'));
NotificationUtilities.confirm(LocalizeText('catalog.marketplace.confirm_higher_header') +
'\n' + LocalizeText('catalog.marketplace.confirm_price', ['price'], [parser.newPrice.toString()]), () =>
{
SendMessageHook(new BuyMarketplaceOfferMessageComposer(parser.offerId));
},
null, null, null, LocalizeText('catalog.marketplace.confirm_higher_title'));
break;
case 4:
NotificationUtilities.simpleAlert(LocalizeText('catalog.alert.notenough.credits.description'), NotificationAlertType.DEFAULT, null, null, LocalizeText('catalog.alert.notenough.title'));
@ -139,7 +159,7 @@ export const CatalogLayoutMarketplacePublicItemsView: FC<CatalogLayoutMarketplac
<div className='text-black'>{LocalizeText('catalog.marketplace.items_found', ['count'], [offers.size.toString()])}</div>
<NitroCardGridView columns={1} className='text-black'>
{
Array.from(offers.values()).map( (entry, index) => <MarketplaceItemView key={ index } offerData={ entry } type={ PUBLIC_OFFER } />)
Array.from(offers.values()).map( (entry, index) => <MarketplaceItemView key={ index } offerData={ entry } type={ PUBLIC_OFFER } onClick={purchaseItem} />)
}
</NitroCardGridView>
</>);

View File

@ -1,13 +1,14 @@
import { CfhSanctionMessageEvent, CfhTopicsInitEvent, IssueDeletedMessageEvent, IssueInfoMessageEvent, IssuePickFailedMessageEvent, ModeratorActionResultMessageEvent, ModeratorInitMessageEvent, ModeratorToolPreferencesEvent, RoomEngineEvent } from '@nitrots/nitro-renderer';
import { FC, useCallback } from 'react';
import { MODTOOLS_NEW_TICKET, PlaySound } from '../../api/utils/PlaySound';
import { NotificationAlertEvent } from '../../events';
import { ModToolsEvent } from '../../events/mod-tools/ModToolsEvent';
import { ModToolsOpenRoomChatlogEvent } from '../../events/mod-tools/ModToolsOpenRoomChatlogEvent';
import { ModToolsOpenRoomInfoEvent } from '../../events/mod-tools/ModToolsOpenRoomInfoEvent';
import { ModToolsOpenUserChatlogEvent } from '../../events/mod-tools/ModToolsOpenUserChatlogEvent';
import { ModToolsOpenUserInfoEvent } from '../../events/mod-tools/ModToolsOpenUserInfoEvent';
import { CreateMessageHook, dispatchUiEvent, useRoomEngineEvent, useUiEvent } from '../../hooks';
import { CreateMessageHook, useRoomEngineEvent, useUiEvent } from '../../hooks';
import { NotificationAlertType } from '../notification-center/common/NotificationAlertType';
import { NotificationUtilities } from '../notification-center/common/NotificationUtilities';
import { SetCfhCategories } from './common/GetCFHCategories';
import { useModToolsContext } from './context/ModToolsContext';
import { ModToolsActions } from './reducers/ModToolsReducer';
@ -39,7 +40,6 @@ export const ModToolsMessageHandler: FC<{}> = props =>
}
});
console.log(parser);
}, [dispatchModToolsState]);
const onIssueInfoMessageEvent = useCallback((event: IssueInfoMessageEvent) =>
@ -68,7 +68,6 @@ export const ModToolsMessageHandler: FC<{}> = props =>
}
});
console.log(parser);
}, [dispatchModToolsState, tickets]);
const onModeratorToolPreferencesEvent = useCallback((event: ModeratorToolPreferencesEvent) =>
@ -77,7 +76,6 @@ export const ModToolsMessageHandler: FC<{}> = props =>
if(!parser) return;
console.log(parser);
}, []);
const onIssuePickFailedMessageEvent = useCallback((event: IssuePickFailedMessageEvent) =>
@ -86,8 +84,7 @@ export const ModToolsMessageHandler: FC<{}> = props =>
if(!parser) return;
// todo: let user know it failed
dispatchUiEvent(new NotificationAlertEvent(['Failed to pick issue'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('Failed to pick issue', NotificationAlertType.DEFAULT, null, null, 'Error')
}, []);
const onIssueDeletedMessageEvent = useCallback((event: IssueDeletedMessageEvent) =>
@ -119,11 +116,11 @@ export const ModToolsMessageHandler: FC<{}> = props =>
if(parser.success)
{
dispatchUiEvent(new NotificationAlertEvent(['Moderation action was successfull'], null, null, null, 'Success', null));
NotificationUtilities.simpleAlert('Moderation action was successfull', NotificationAlertType.MODERATION, null, null, 'Success');
}
else
{
dispatchUiEvent(new NotificationAlertEvent(['There was a problem applying that moderation action'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('There was a problem applying tht moderation action', NotificationAlertType.MODERATION, null, null, 'Error');
}
}, []);
@ -144,7 +141,6 @@ export const ModToolsMessageHandler: FC<{}> = props =>
SetCfhCategories(categories);
console.log(parser);
}, [dispatchModToolsState]);
const onCfhSanctionMessageEvent = useCallback((event: CfhSanctionMessageEvent) =>
@ -153,7 +149,7 @@ export const ModToolsMessageHandler: FC<{}> = props =>
if(!parser) return;
console.log(parser);
// todo: update sanction data
}, []);
CreateMessageHook(ModeratorInitMessageEvent, onModeratorInitMessageEvent);

View File

@ -1,9 +1,10 @@
import { CallForHelpTopicData, DefaultSanctionMessageComposer, ModAlertMessageComposer, ModBanMessageComposer, ModKickMessageComposer, ModMessageMessageComposer, ModMuteMessageComposer, ModTradingLockMessageComposer } from '@nitrots/nitro-renderer';
import { FC, useCallback, useMemo, useState } from 'react';
import { LocalizeText } from '../../../../../api';
import { NotificationAlertEvent } from '../../../../../events';
import { dispatchUiEvent, SendMessageHook } from '../../../../../hooks';
import { SendMessageHook } from '../../../../../hooks';
import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout';
import { NotificationAlertType } from '../../../../notification-center/common/NotificationAlertType';
import { NotificationUtilities } from '../../../../notification-center/common/NotificationUtilities';
import { useModToolsContext } from '../../../context/ModToolsContext';
import { ModActionDefinition } from '../../../utils/ModActionDefinition';
import { ModToolsUserModActionViewProps } from './ModToolsUserModActionView.types';
@ -59,13 +60,13 @@ export const ModToolsUserModActionView: FC<ModToolsUserModActionViewProps> = pro
{
if( (selectedTopic === -1) || (selectedAction === -1) )
{
dispatchUiEvent(new NotificationAlertEvent(['You must select a CFH topic and Sanction'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('You must select a CFH topic and Sanction', NotificationAlertType.DEFAULT, null, null, 'Error');
return;
}
if(!settings || !settings.cfhPermission)
{
dispatchUiEvent(new NotificationAlertEvent(['You do not have permission to do this'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('You do not have permission to do this', NotificationAlertType.DEFAULT, null, null, 'Error');
return;
}
@ -74,13 +75,13 @@ export const ModToolsUserModActionView: FC<ModToolsUserModActionViewProps> = pro
if(!category)
{
dispatchUiEvent(new NotificationAlertEvent(['You must select a CFH topic'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('You must select a CFH topic', NotificationAlertType.DEFAULT, null, null, 'Error');
return;
}
if(!sanction)
{
dispatchUiEvent(new NotificationAlertEvent(['You must select a sanction'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('You must select a sanction', NotificationAlertType.DEFAULT, null, null, 'Error');
return;
}
@ -92,13 +93,13 @@ export const ModToolsUserModActionView: FC<ModToolsUserModActionViewProps> = pro
if(!settings.alertPermission)
{
dispatchUiEvent(new NotificationAlertEvent(['You have insufficient permissions.'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('You have insufficient permissions', NotificationAlertType.DEFAULT, null, null, 'Error');
return;
}
if(message.trim().length === 0)
{
dispatchUiEvent(new NotificationAlertEvent(['Please write a message to user.'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('Please write a message to user', NotificationAlertType.DEFAULT, null, null, 'Error');
return;
}
@ -113,7 +114,7 @@ export const ModToolsUserModActionView: FC<ModToolsUserModActionViewProps> = pro
if(!settings.banPermission)
{
dispatchUiEvent(new NotificationAlertEvent(['You have insufficient permissions.'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('You have insufficient permissions', NotificationAlertType.DEFAULT, null, null, 'Error');
return;
}
@ -125,7 +126,7 @@ export const ModToolsUserModActionView: FC<ModToolsUserModActionViewProps> = pro
if(!settings.kickPermission)
{
dispatchUiEvent(new NotificationAlertEvent(['You have insufficient permissions.'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('You have insufficient permissions', NotificationAlertType.DEFAULT, null, null, 'Error');
return;
}
@ -144,7 +145,7 @@ export const ModToolsUserModActionView: FC<ModToolsUserModActionViewProps> = pro
if(message.trim().length === 0)
{
dispatchUiEvent(new NotificationAlertEvent(['Please write a message to user.'], null, null, null, 'Error', null));
NotificationUtilities.simpleAlert('Please write a message to user', NotificationAlertType.DEFAULT, null, null, 'Error');
return;
}