WIP preserve local changes before duckie merge

src/hooks/inventory/index.ts

@@ -1,6 +1,7 @@
 export * from './useInventoryBadges';
 export * from './useInventoryBots';
 export * from './useInventoryFurni';
+export * from './useInventoryNickIcons';
 export * from './useInventoryPets';
 export * from './useInventoryPrefixes';
 export * from './useInventoryTrade';

src/hooks/inventory/useInventoryFurni.ts

@@ -292,6 +292,41 @@ const useInventoryFurniState = () =>
         setNeedsUpdate(false);
     }, [ isVisible, needsUpdate ]);
 
+    useEffect(() =>
+    {
+        const refreshFurnitureLocalization = () =>
+        {
+            setGroupItems(prevValue =>
+            {
+                if(!prevValue?.length) return prevValue;
+
+                return prevValue.map(groupItem =>
+                {
+                    const nextGroupItem = groupItem.clone();
+
+                    nextGroupItem.refreshLocalization();
+
+                    return nextGroupItem;
+                });
+            });
+
+            setSelectedItem(prevValue =>
+            {
+                if(!prevValue) return prevValue;
+
+                const nextGroupItem = prevValue.clone();
+
+                nextGroupItem.refreshLocalization();
+
+                return nextGroupItem;
+            });
+        };
+
+        window.addEventListener('nitro-localization-updated', refreshFurnitureLocalization);
+
+        return () => window.removeEventListener('nitro-localization-updated', refreshFurnitureLocalization);
+    }, []);
+
     return { isVisible, groupItems, setGroupItems, selectedItem, setSelectedItem, activate, deactivate, getWallItemById, getFloorItemById, getItemsByType };
 };
 

src/hooks/inventory/useInventoryNickIcons.ts

@@ -0,0 +1,80 @@
+import { RequestNickIconsComposer, SetActiveNickIconComposer, UserNickIconsEvent } from '@nitrots/nitro-renderer';
+import { useEffect, useState } from 'react';
+import { useBetween } from 'use-between';
+import { INickIconItem, SendMessageComposer } from '../../api';
+import { useMessageEvent } from '../events';
+import { useSharedVisibility } from '../useSharedVisibility';
+
+const useInventoryNickIconsState = () =>
+{
+    const [ needsUpdate, setNeedsUpdate ] = useState(true);
+    const [ nickIcons, setNickIcons ] = useState<INickIconItem[]>([]);
+    const [ activeNickIcon, setActiveNickIcon ] = useState<INickIconItem | null>(null);
+    const [ selectedNickIcon, setSelectedNickIcon ] = useState<INickIconItem | null>(null);
+    const { isVisible = false, activate = null, deactivate = null } = useSharedVisibility();
+
+    useMessageEvent<UserNickIconsEvent>(UserNickIconsEvent, event =>
+    {
+        const parser = event.getParser();
+        const ownedNickIcons = parser.nickIcons
+            .filter(icon => icon.owned)
+            .map(icon => ({
+                id: icon.id,
+                iconKey: icon.iconKey,
+                displayName: icon.displayName,
+                points: icon.points,
+                pointsType: icon.pointsType,
+                owned: true,
+                active: icon.active
+            }));
+
+        setNickIcons(ownedNickIcons);
+        setActiveNickIcon(ownedNickIcons.find(icon => icon.active) || null);
+    });
+
+    const activateNickIcon = (nickIconId: number) =>
+    {
+        SendMessageComposer(new SetActiveNickIconComposer(nickIconId));
+    };
+
+    const deactivateNickIcon = () =>
+    {
+        SendMessageComposer(new SetActiveNickIconComposer(0));
+    };
+
+    useEffect(() =>
+    {
+        if(!nickIcons.length)
+        {
+            setSelectedNickIcon(null);
+            return;
+        }
+
+        setSelectedNickIcon(prevValue =>
+        {
+            if(prevValue && nickIcons.find(icon => icon.id === prevValue.id)) return prevValue;
+            return nickIcons[0];
+        });
+    }, [ nickIcons ]);
+
+    useEffect(() =>
+    {
+        if(!isVisible || !needsUpdate) return;
+
+        SendMessageComposer(new RequestNickIconsComposer());
+        setNeedsUpdate(false);
+    }, [ isVisible, needsUpdate ]);
+
+    return {
+        nickIcons,
+        activeNickIcon,
+        selectedNickIcon,
+        setSelectedNickIcon,
+        activateNickIcon,
+        deactivateNickIcon,
+        activate,
+        deactivate
+    };
+};
+
+export const useInventoryNickIcons = () => useBetween(useInventoryNickIconsState);

src/hooks/inventory/useInventoryPrefixes.ts

@@ -1,4 +1,4 @@
-import { ActivePrefixUpdatedEvent, PrefixReceivedEvent, RequestPrefixesComposer, SetActivePrefixComposer, DeletePrefixComposer, UserPrefixesEvent } from '@nitrots/nitro-renderer';
+import { ActivePrefixUpdatedEvent, DeletePrefixComposer, PrefixReceivedEvent, RequestPrefixesComposer, SetActivePrefixComposer, UserNickIconsEvent, UserPrefixesEvent } from '@nitrots/nitro-renderer';
 import { useEffect, useState } from 'react';
 import { useBetween } from 'use-between';
 import { IPrefixItem, SendMessageComposer, UnseenItemCategory } from '../../api';
@@ -24,6 +24,7 @@ const useInventoryPrefixesState = () =>
             color: p.color,
             icon: p.icon || '',
             effect: p.effect || '',
+            font: p.font || '',
             active: p.active
         }));
 
@@ -33,6 +34,28 @@ const useInventoryPrefixesState = () =>
         setActivePrefix(active);
     });
 
+    useMessageEvent<UserNickIconsEvent>(UserNickIconsEvent, event =>
+    {
+        const parser = event.getParser();
+        const newPrefixes: IPrefixItem[] = parser.ownedPrefixes.map(prefix => ({
+            id: prefix.id,
+            displayName: prefix.displayName,
+            text: prefix.text,
+            color: prefix.color,
+            icon: prefix.icon || '',
+            effect: prefix.effect || '',
+            font: prefix.font || '',
+            active: prefix.active,
+            isCustom: prefix.isCustom,
+            points: prefix.points,
+            pointsType: prefix.pointsType,
+            catalogPrefixId: prefix.catalogPrefixId
+        }));
+
+        setPrefixes(newPrefixes);
+        setActivePrefix(newPrefixes.find(prefix => prefix.active) || null);
+    });
+
     useMessageEvent<PrefixReceivedEvent>(PrefixReceivedEvent, event =>
     {
         const parser = event.getParser();
@@ -42,6 +65,7 @@ const useInventoryPrefixesState = () =>
             color: parser.color,
             icon: parser.icon || '',
             effect: parser.effect || '',
+            font: parser.font || '',
             active: false
         };
 
@@ -69,8 +93,8 @@ const useInventoryPrefixesState = () =>
             setActivePrefix(prev =>
             {
                 const found = prefixes.find(p => p.id === parser.prefixId);
-                if(found) return { ...found, active: true };
-                return { id: parser.prefixId, text: parser.text, color: parser.color, icon: parser.icon || '', effect: parser.effect || '', active: true };
+                if(found) return { ...found, active: true, font: parser.font || found.font || '' };
+                return { id: parser.prefixId, text: parser.text, color: parser.color, icon: parser.icon || '', effect: parser.effect || '', font: parser.font || '', active: true };
             });
         }
     });