🆙 Updated Background profiles

Please make sure you change your UI-Config !!!
This commit is contained in:
duckietm
2026-05-04 15:26:29 +02:00
parent da9e394901
commit 6fce62fb47
4 changed files with 857 additions and 1630 deletions
+12 -31
View File
@@ -1,15 +1,10 @@
import { GetSessionDataManager, HabboClubLevelEnum} from '@nitrots/nitro-renderer';
import { Dispatch, FC, SetStateAction, useCallback, useMemo, useState } from 'react';
import { Base, Grid, Flex, NitroCardView, NitroCardHeaderView, NitroCardTabsView, NitroCardTabsItemView, NitroCardContentView, Text, LayoutCurrencyIcon } from '../../common';
import { Base, Grid, Flex, NitroCardView, NitroCardHeaderView, NitroCardTabsView, NitroCardTabsItemView, NitroCardContentView, Text } from '../../common';
import { useRoom } from '../../hooks';
import { GetClubMemberLevel, GetConfigurationValue } from '../../api';
import { GetConfigurationValue } from '../../api';
interface ItemData {
interface ItemData {
id: number;
isHcOnly: boolean;
minRank: number;
isAmbassadorOnly: boolean;
selectable: boolean;
}
interface BackgroundsViewProps {
@@ -40,30 +35,18 @@ export const BackgroundsView: FC<BackgroundsViewProps> = ({
}) => {
const [activeTab, setActiveTab] = useState<TabType>('backgrounds');
const { roomSession } = useRoom();
const userData = useMemo(() => ({
isHcMember: GetClubMemberLevel() >= HabboClubLevelEnum.CLUB,
securityLevel: GetSessionDataManager().canChangeName,
isAmbassador: GetSessionDataManager().isAmbassador
}), []);
const processData = useCallback((configData: any[], dataType: string): ItemData[] => {
const processData = useCallback((configData: any[], idField: string): ItemData[] => {
if (!configData?.length) return [];
return configData
.filter(item => {
const meetsRank = userData.securityLevel >= item.minRank;
const ambassadorEligible = !item.isAmbassadorOnly || userData.isAmbassador;
return item.isHcOnly || (meetsRank && ambassadorEligible);
})
.map(item => ({ id: item[`${dataType}Id`], ...item, selectable: !item.isHcOnly || userData.isHcMember }));
}, [userData]);
return configData.map(item => ({ id: item[idField] }));
}, []);
const allData = useMemo(() => ({
backgrounds: processData(GetConfigurationValue('backgrounds.data'), 'background'),
stands: processData(GetConfigurationValue('stands.data'), 'stand'),
overlays: processData(GetConfigurationValue('overlays.data'), 'overlay'),
cards: processData(GetConfigurationValue('cards.data') || GetConfigurationValue('backgrounds.data'), 'background')
backgrounds: processData(GetConfigurationValue('backgrounds.data'), 'backgroundId'),
stands: processData(GetConfigurationValue('stands.data'), 'standId'),
overlays: processData(GetConfigurationValue('overlays.data'), 'overlayId'),
cards: processData(GetConfigurationValue('cards.data') || GetConfigurationValue('backgrounds.data'), 'backgroundId')
}), [processData]);
const handleSelection = useCallback((id: number) => {
@@ -83,14 +66,12 @@ export const BackgroundsView: FC<BackgroundsViewProps> = ({
pointer
position="relative"
key={item.id}
onClick={() => item.selectable && handleSelection(item.id)}
className={item.selectable ? '' : 'non-selectable'}
onClick={() => handleSelection(item.id)}
>
<Base
className={`profile-${type} ${type}-${item.id}`}
style={type === 'card-background' ? { width: 60, height: 80, borderRadius: 4 } : undefined}
/>
{item.isHcOnly && <LayoutCurrencyIcon position="absolute" className="top-1 inset-e-1" type="hc" />}
</Flex>
), [handleSelection]);