diff --git a/src/components/inventory/InventoryView.tsx b/src/components/inventory/InventoryView.tsx index 9c5c54eb..f7bc7162 100644 --- a/src/components/inventory/InventoryView.tsx +++ b/src/components/inventory/InventoryView.tsx @@ -151,12 +151,12 @@ export const InventoryView: FC<{}> = props => } }, [ furnitureState.groupItems, unseenTracker ]); - const switchTab = useCallback((prevTab: string, nextTab: string) => + const switchTab = (prevTab: string, nextTab: string) => { if(nextTab) setCurrentTab(nextTab); resetTrackerForTab(prevTab); - }, [ resetTrackerForTab ]); + } useEffect(() => { diff --git a/src/components/inventory/views/badge/InventoryBadgeItemView.tsx b/src/components/inventory/views/badge/InventoryBadgeItemView.tsx index a4f45692..fb279cda 100644 --- a/src/components/inventory/views/badge/InventoryBadgeItemView.tsx +++ b/src/components/inventory/views/badge/InventoryBadgeItemView.tsx @@ -1,5 +1,5 @@ import { MouseEventType } from '@nitrots/nitro-renderer'; -import { FC, MouseEvent, useCallback } from 'react'; +import { FC, MouseEvent } from 'react'; import { LayoutGridItem } from '../../../../common/layout/LayoutGridItem'; import { BadgeImageView } from '../../../../views/shared/badge-image/BadgeImageView'; import { useInventoryContext } from '../../context/InventoryContext'; @@ -15,7 +15,7 @@ export const InventoryBadgeItemView: FC = props => const { badgeCode = null } = props; const { badgeState = null, dispatchBadgeState = null } = useInventoryContext(); - const onMouseEvent = useCallback((event: MouseEvent) => + const onMouseEvent = (event: MouseEvent) => { switch(event.type) { @@ -25,7 +25,7 @@ export const InventoryBadgeItemView: FC = props => payload: { badgeCode } }); } - }, [ badgeCode, dispatchBadgeState ]); + } return ( diff --git a/src/components/inventory/views/badge/InventoryBadgeView.tsx b/src/components/inventory/views/badge/InventoryBadgeView.tsx index 4b967ff8..3fb20a0b 100644 --- a/src/components/inventory/views/badge/InventoryBadgeView.tsx +++ b/src/components/inventory/views/badge/InventoryBadgeView.tsx @@ -21,6 +21,34 @@ export const InventoryBadgeView: FC = props => const { badgeState = null, dispatchBadgeState = null } = useInventoryContext(); const { needsBadgeUpdate = false, badge = null, badges = [], activeBadges = [] } = badgeState; + const isWearingBadge = (badgeCode: string) => (activeBadges.indexOf(badgeCode) >= 0); + + const canWearBadges = () => (activeBadges.length < 5); + + const toggleBadge = () => + { + if(isWearingBadge(badge)) + { + dispatchBadgeState({ + type: InventoryBadgeActions.REMOVE_ACTIVE_BADGE, + payload: { + badgeCode: badge + } + }); + } + else + { + if(!canWearBadges()) return; + + dispatchBadgeState({ + type: InventoryBadgeActions.ADD_ACTIVE_BADGE, + payload: { + badgeCode: badge + } + }); + } + } + useEffect(() => { if(needsBadgeUpdate) @@ -46,40 +74,6 @@ export const InventoryBadgeView: FC = props => }, [ needsBadgeUpdate, badges, dispatchBadgeState ]); - function isWearingBadge(badgeCode: string): boolean - { - return (activeBadges.indexOf(badgeCode) >= 0); - } - - function canWearBadges(): boolean - { - return (activeBadges.length < 5); - } - - function toggleBadge(): void - { - if(isWearingBadge(badge)) - { - dispatchBadgeState({ - type: InventoryBadgeActions.REMOVE_ACTIVE_BADGE, - payload: { - badgeCode: badge - } - }); - } - else - { - if(!canWearBadges()) return; - - dispatchBadgeState({ - type: InventoryBadgeActions.ADD_ACTIVE_BADGE, - payload: { - badgeCode: badge - } - }); - } - } - return ( @@ -105,7 +99,7 @@ export const InventoryBadgeView: FC = props => { LocalizeBadgeName(badge) } - + } diff --git a/src/components/inventory/views/bot/InventoryBotItemView.tsx b/src/components/inventory/views/bot/InventoryBotItemView.tsx index caef8594..2fd9c894 100644 --- a/src/components/inventory/views/bot/InventoryBotItemView.tsx +++ b/src/components/inventory/views/bot/InventoryBotItemView.tsx @@ -1,5 +1,5 @@ import { MouseEventType } from '@nitrots/nitro-renderer'; -import { FC, MouseEvent, useCallback, useEffect, useState } from 'react'; +import { FC, MouseEvent, useEffect, useState } from 'react'; import { LayoutGridItem } from '../../../../common/layout/LayoutGridItem'; import { AvatarImageView } from '../../../../views/shared/avatar-image/AvatarImageView'; import { BotItem } from '../../common/BotItem'; @@ -15,11 +15,11 @@ export interface InventoryBotItemViewProps export const InventoryBotItemView: FC = props => { const { botItem } = props; - const { botState = null, dispatchBotState = null } = useInventoryContext(); const [ isMouseDown, setMouseDown ] = useState(false); + const { botState = null, dispatchBotState = null } = useInventoryContext(); const isActive = (botState.botItem === botItem); - const onMouseEvent = useCallback((event: MouseEvent) => + const onMouseEvent = (event: MouseEvent) => { switch(event.type) { @@ -40,7 +40,7 @@ export const InventoryBotItemView: FC = props => attemptBotPlacement(botItem); return; } - }, [ isActive, isMouseDown, botItem, dispatchBotState ]); + } useEffect(() => { diff --git a/src/components/inventory/views/bot/InventoryBotView.tsx b/src/components/inventory/views/bot/InventoryBotView.tsx index 71a86e48..6fe2c04c 100644 --- a/src/components/inventory/views/bot/InventoryBotView.tsx +++ b/src/components/inventory/views/bot/InventoryBotView.tsx @@ -89,7 +89,7 @@ export const InventoryBotView: FC = props => { botItem.botData.name } { !!roomSession && - } } diff --git a/src/components/inventory/views/furniture/InventoryFurnitureItemView.tsx b/src/components/inventory/views/furniture/InventoryFurnitureItemView.tsx index 9b458566..988955e8 100644 --- a/src/components/inventory/views/furniture/InventoryFurnitureItemView.tsx +++ b/src/components/inventory/views/furniture/InventoryFurnitureItemView.tsx @@ -1,5 +1,5 @@ import { MouseEventType } from '@nitrots/nitro-renderer'; -import { FC, MouseEvent, useCallback, useEffect, useState } from 'react'; +import { FC, MouseEvent, useEffect, useState } from 'react'; import { LayoutGridItem } from '../../../../common/layout/LayoutGridItem'; import { attemptItemPlacement } from '../../common/FurnitureUtilities'; import { GroupItem } from '../../common/GroupItem'; @@ -18,7 +18,7 @@ export const InventoryFurnitureItemView: FC = p const { furnitureState, dispatchFurnitureState } = useInventoryContext(); const isActive = (furnitureState.groupItem === groupItem); - const onMouseEvent = useCallback((event: MouseEvent) => + const onMouseEvent = (event: MouseEvent) => { switch(event.type) { @@ -39,7 +39,7 @@ export const InventoryFurnitureItemView: FC = p attemptItemPlacement(groupItem); return; } - }, [ isActive, isMouseDown, groupItem, dispatchFurnitureState ]); + } useEffect(() => { diff --git a/src/components/inventory/views/furniture/InventoryFurnitureView.tsx b/src/components/inventory/views/furniture/InventoryFurnitureView.tsx index ff37cb99..38c6abe3 100644 --- a/src/components/inventory/views/furniture/InventoryFurnitureView.tsx +++ b/src/components/inventory/views/furniture/InventoryFurnitureView.tsx @@ -129,15 +129,16 @@ export const InventoryFurnitureView: FC = props => { groupItem && { groupItem.name } - { !!roomSession && - } - { (groupItem && groupItem.isSellable) && - - } + + { !!roomSession && + } + { (groupItem && groupItem.isSellable) && + } + } diff --git a/src/components/inventory/views/pet/InventoryPetItemView.tsx b/src/components/inventory/views/pet/InventoryPetItemView.tsx index 446a4ac7..8f56d00d 100644 --- a/src/components/inventory/views/pet/InventoryPetItemView.tsx +++ b/src/components/inventory/views/pet/InventoryPetItemView.tsx @@ -1,5 +1,5 @@ import { MouseEventType } from '@nitrots/nitro-renderer'; -import { FC, MouseEvent, useCallback, useEffect, useState } from 'react'; +import { FC, MouseEvent, useEffect, useState } from 'react'; import { LayoutGridItem } from '../../../../common/layout/LayoutGridItem'; import { PetImageView } from '../../../../views/shared/pet-image/PetImageView'; import { PetItem } from '../../common/PetItem'; @@ -19,7 +19,7 @@ export const InventoryPetItemView: FC = props => const { petState = null, dispatchPetState = null } = useInventoryContext(); const isActive = (petState.petItem === petItem); - const onMouseEvent = useCallback((event: MouseEvent) => + const onMouseEvent = (event: MouseEvent) => { switch(event.type) { @@ -40,7 +40,7 @@ export const InventoryPetItemView: FC = props => attemptPetPlacement(petItem); return; } - }, [ isActive, isMouseDown, petItem, dispatchPetState ]); + } useEffect(() => { diff --git a/src/components/inventory/views/pet/InventoryPetView.tsx b/src/components/inventory/views/pet/InventoryPetView.tsx index 7e800330..91486b95 100644 --- a/src/components/inventory/views/pet/InventoryPetView.tsx +++ b/src/components/inventory/views/pet/InventoryPetView.tsx @@ -88,7 +88,7 @@ export const InventoryPetView: FC = props => { petItem.petData.name } { !!roomSession && - } } diff --git a/src/components/inventory/views/trade/InventoryTradeView.tsx b/src/components/inventory/views/trade/InventoryTradeView.tsx index 5bc8b551..df705d65 100644 --- a/src/components/inventory/views/trade/InventoryTradeView.tsx +++ b/src/components/inventory/views/trade/InventoryTradeView.tsx @@ -1,6 +1,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FurnitureListComposer, IObjectData, TradingAcceptComposer, TradingConfirmationComposer, TradingListAddItemComposer, TradingListAddItemsComposer, TradingListItemRemoveComposer, TradingUnacceptComposer } from '@nitrots/nitro-renderer'; -import { FC, useCallback, useEffect, useMemo, useState } from 'react'; +import { FC, useEffect, useState } from 'react'; import { LocalizeText } from '../../../../api'; import { Base } from '../../../../common/Base'; import { Button } from '../../../../common/Button'; @@ -26,7 +26,6 @@ export interface InventoryTradeViewProps cancelTrade: () => void; } - const MAX_ITEMS_TO_TRADE: number = 9; export const InventoryTradeView: FC = props => @@ -40,7 +39,7 @@ export const InventoryTradeView: FC = props => const { furnitureState = null, dispatchFurnitureState = null } = useInventoryContext(); const { needsFurniUpdate = false, groupItems = [], tradeData = null } = furnitureState; - const canTradeItem = useCallback((isWallItem: boolean, spriteId: number, category: number, groupable: boolean, stuffData: IObjectData) => + const canTradeItem = (isWallItem: boolean, spriteId: number, category: number, groupable: boolean, stuffData: IObjectData) => { if(!tradeData || !tradeData.ownUser || tradeData.ownUser.accepts || !tradeData.ownUser.items) return false; @@ -67,9 +66,9 @@ export const InventoryTradeView: FC = props => } return !!tradeData.ownUser.items.getValue(type); - }, [ tradeData ]); + } - const attemptItemOffer = useCallback((count: number) => + const attemptItemOffer = (count: number) => { if(!tradeData || !groupItem) return; @@ -124,42 +123,25 @@ export const InventoryTradeView: FC = props => { NotificationUtilities.simpleAlert(LocalizeText('trading.items.too_many_items.desc'), NotificationAlertType.DEFAULT, null, null, LocalizeText('trading.items.too_many_items.title')); } - }, [ groupItem, tradeData, canTradeItem ]); + } - const removeItem = useCallback((group: GroupItem) => + const removeItem = (group: GroupItem) => { const item = group.getLastItem(); if(!item) return; SendMessageHook(new TradingListItemRemoveComposer(item.id)); - }, []); + } - useEffect(() => - { - if(needsFurniUpdate) - { - dispatchFurnitureState({ - type: InventoryFurnitureActions.SET_NEEDS_UPDATE, - payload: { - flag: false - } - }); - - SendMessageHook(new FurnitureListComposer()); - } - - }, [ needsFurniUpdate, groupItems, dispatchFurnitureState ]); - - const progressTrade = useCallback(() => + const progressTrade = () => { switch(tradeData.state) { case TradeState.TRADING_STATE_RUNNING: if(!tradeData.otherUser.itemCount && !tradeData.ownUser.accepts) { - // eslint-disable-next-line no-template-curly-in-string - NotificationUtilities.simpleAlert(LocalizeText('${inventory.trading.warning.other_not_offering}'), null, null, null); + NotificationUtilities.simpleAlert(LocalizeText('inventory.trading.warning.other_not_offering'), null, null, null); } if(tradeData.ownUser.accepts) @@ -182,7 +164,7 @@ export const InventoryTradeView: FC = props => }); return; } - }, [ tradeData, dispatchFurnitureState ]); + } const getLockIcon = (accepts: boolean) => { @@ -192,24 +174,21 @@ export const InventoryTradeView: FC = props => return }; - const getTradeButton = useMemo(() => + useEffect(() => { - if(!tradeData) return null; - - switch(tradeData.state) + if(needsFurniUpdate) { - case TradeState.TRADING_STATE_READY: - return ; - case TradeState.TRADING_STATE_RUNNING: - return ; - case TradeState.TRADING_STATE_COUNTDOWN: - return ; - case TradeState.TRADING_STATE_CONFIRMING: - return ; - case TradeState.TRADING_STATE_CONFIRMED: - return ; + dispatchFurnitureState({ + type: InventoryFurnitureActions.SET_NEEDS_UPDATE, + payload: { + flag: false + } + }); + + SendMessageHook(new FurnitureListComposer()); } - }, [ tradeData, countdownTick, progressTrade ]); + + }, [ needsFurniUpdate, groupItems, dispatchFurnitureState ]); useEffect(() => { @@ -223,7 +202,7 @@ export const InventoryTradeView: FC = props => { const newValue = (prevValue - 1); - if(newValue === -1) + if(newValue === 0) { dispatchFurnitureState({ type: InventoryFurnitureActions.SET_TRADE_STATE, @@ -258,7 +237,7 @@ export const InventoryTradeView: FC = props => return ( (count && setGroupItem(item)) }> { ((count > 0) && (groupItem === item)) && - } @@ -287,7 +266,7 @@ export const InventoryTradeView: FC = props => return ( setOwnGroupItem(item) }> { (ownGroupItem === item) && - } @@ -319,8 +298,17 @@ export const InventoryTradeView: FC = props => - - { getTradeButton } + + { (tradeData.state === TradeState.TRADING_STATE_READY) && + } + { (tradeData.state === TradeState.TRADING_STATE_RUNNING) && + } + { (tradeData.state === TradeState.TRADING_STATE_COUNTDOWN) && + } + { (tradeData.state === TradeState.TRADING_STATE_CONFIRMING) && + } + { (tradeData.state === TradeState.TRADING_STATE_CONFIRMED) && + }