duckietm/Nitro-V3
1
0
Fork 0
mirror of https://github.com/duckietm/Nitro-V3.git synced 2026-06-19 15:06:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

🆙 Update catalogue Forum view

Browse Source
This commit is contained in:
duckietm
2026-06-10 10:17:20 +02:00
parent e5ca4936ea
commit 4bfd5e96ec
4 changed files with 78 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/catalog/views/page/layout/CatalogLayoutGuildForumView.tsx
+18 -18
View File
@@ -1,7 +1,8 @@
import { FC, useState } from 'react';
import { FC } from 'react';
import { SanitizeHtml } from '../../../../../api';
import { Column, Grid, Text } from '../../../../../common';
import { useCatalogData, useCatalogUiState, useUserGroups } from '../../../../../hooks';
import { Column, Flex, Grid } from '../../../../../common';
import { LayoutImage } from '../../../../../common/layout/LayoutImage';
import { useCatalogData, useUserGroups } from '../../../../../hooks';
import { CatalogFirstProductSelectorWidgetView } from '../widgets/CatalogFirstProductSelectorWidgetView';
import { CatalogGuildSelectorWidgetView } from '../widgets/CatalogGuildSelectorWidgetView';
import { CatalogPurchaseWidgetView } from '../widgets/CatalogPurchaseWidgetView';
@@ -11,32 +12,31 @@ import { CatalogLayoutProps } from './CatalogLayout.types';
export const CatalogLayouGuildForumView: FC<CatalogLayoutProps> = props =>
{
const { page = null } = props;
const [ selectedGroupIndex, setSelectedGroupIndex ] = useState<number>(0);
const { currentOffer = null } = useCatalogData();
const { setCurrentOffer = null } = useCatalogUiState();
const { data: groups = null } = useUserGroups();
const teaserImage = page.localization.getImage(1);
const hasGroups = !!(groups && groups.length);
return (
<>
<CatalogFirstProductSelectorWidgetView />
<Grid>
<Column className="bg-muted rounded p-2 text-black" overflow="hidden" size={ 7 }>
<div className="overflow-auto" dangerouslySetInnerHTML={ { __html: SanitizeHtml(page.localization.getText(1)) } } />
</Column>
<Column gap={ 1 } overflow="hidden" size={ 5 }>
<Grid overflow="hidden">
<Column overflow="hidden" size={ 8 }>
<div className="nitro-catalog-forum-text grow! min-h-0 overflow-auto text-black" dangerouslySetInnerHTML={ { __html: SanitizeHtml(page.localization.getText(1)) } } />
{ !!currentOffer &&
<>
<Column grow gap={ 1 }>
<Text truncate>{ currentOffer.localizationName }</Text>
<Flex alignItems="center" className="shrink-0" gap={ 2 }>
<CatalogTotalPriceWidget />
<div className="grow!">
<CatalogGuildSelectorWidgetView />
</div>
<div className="flex justify-end">
<CatalogTotalPriceWidget alignItems="end" />
</div>
<CatalogPurchaseWidgetView noGiftOption={ true } />
{ hasGroups &&
<CatalogPurchaseWidgetView noGiftOption={ true } /> }
</Flex> }
</Column>
</> }
<Column alignItems="center" overflow="hidden" size={ 4 }>
{ !!teaserImage &&
<LayoutImage className="max-w-full" imageUrl={ teaserImage } /> }
</Column>
</Grid>
</>
src/components/catalog/views/page/widgets/CatalogGuildSelectorWidgetView.tsx
+5 -3
View File
@@ -1,4 +1,4 @@
import { StringDataType } from '@nitrots/nitro-renderer';
import { CreateLinkEvent, StringDataType } from '@nitrots/nitro-renderer';
import { FC, useEffect, useMemo, useState } from 'react';
import { LocalizeText } from '../../../../../api';
import { Button, Flex } from '../../../../../common';
@@ -45,12 +45,14 @@ export const CatalogGuildSelectorWidgetView: FC<{}> = props =>
if(!groups || !groups.length)
{
return (
<div className="bg-muted rounded p-1 text-black text-center">
<div className="bg-[#5da0aa] rounded-lg p-2 text-black text-center">
{ LocalizeText('catalog.guild_selector.members_only') }
<Button fullWidth classNames={ [ 'mt-1', 'nitro-catalog-swf-button', 'nitro-catalog-swf-buy-button', 'whitespace-normal!', 'text-[10px]!', 'leading-tight!', 'py-1!' ] }>
<div className="mt-1">
<Button classNames={ [ 'nitro-catalog-guild-join-btn' ] } onClick={ () => CreateLinkEvent('navigator/search/hotel_view/group:') }>
{ LocalizeText('catalog.guild_selector.find_groups') }
</Button>
</div>
</div>
);
}
src/components/catalog/views/page/widgets/CatalogPurchaseWidgetView.tsx
+5 -4
View File
@@ -1,9 +1,9 @@
import { CreateLinkEvent, PurchaseFromCatalogComposer } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useMemo, useState } from 'react';
import { BuilderFurniPlaceableStatus, CatalogPurchaseState, CatalogType, DispatchUiEvent, GetClubMemberLevel, LocalizeText, NotificationBubbleType, Offer, ProductTypeEnum, SendMessageComposer } from '../../../../../api';
import { BuilderFurniPlaceableStatus, CatalogPurchaseState, CatalogType, DispatchUiEvent, GetClubMemberLevel, LocalStorageKeys, LocalizeText, NotificationBubbleType, Offer, ProductTypeEnum, SendMessageComposer } from '../../../../../api';
import { Button, LayoutLoadingSpinnerView, Text } from '../../../../../common';
import { CatalogEvent, CatalogInitGiftEvent, CatalogPurchaseFailureEvent, CatalogPurchaseNotAllowedEvent, CatalogPurchaseSoldOutEvent, CatalogPurchasedEvent } from '../../../../../events';
import { useCatalogActions, useCatalogData, useCatalogSkipPurchaseConfirmation, useCatalogUiState, useNotification, usePurse, useUiEvent } from '../../../../../hooks';
import { useCatalogActions, useCatalogData, useCatalogUiState, useLocalStorage, useNotification, usePurse, useUiEvent } from '../../../../../hooks';
interface CatalogPurchaseWidgetViewProps
{
@@ -17,8 +17,9 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
{
const { noGiftOption = false, purchaseCallback = null } = props;
const [ builderPlaceableRefreshTick, setBuilderPlaceableRefreshTick ] = useState(0);
const [ purchaseWillBeGift, setPurchaseWillBeGift ] = useState(false);
const [ purchaseState, setPurchaseState ] = useState(CatalogPurchaseState.NONE);
const [ catalogSkipPurchaseConfirmation ] = useCatalogSkipPurchaseConfirmation();
const [ catalogSkipPurchaseConfirmation, setCatalogSkipPurchaseConfirmation ] = useLocalStorage(LocalStorageKeys.CATALOG_SKIP_PURCHASE_CONFIRMATION, false);
const { currentOffer = null, currentPage = null } = useCatalogData();
const { currentType = CatalogType.NORMAL, purchaseOptions = null, setPurchaseOptions = null, setCatalogPlaceMultipleObjects = null } = useCatalogUiState();
const { requestOfferToMover = null, getBuilderFurniPlaceableStatus = null, getNodesByOfferId = null } = useCatalogActions();
@@ -241,7 +242,7 @@ export const CatalogPurchaseWidgetView: FC<CatalogPurchaseWidgetViewProps> = pro
return <Button classNames={ swfButtonClassNames } variant="danger">{ LocalizeText('generic.failed') + ' - ' + LocalizeText('catalog.alert.limited_edition_sold_out.title') }</Button>;
case CatalogPurchaseState.NONE:
default:
return <Button classNames={ [ ...swfButtonClassNames, 'nitro-catalog-swf-buy-button' ] } variant="success" disabled={ (purchaseOptions.extraParamRequired && (!purchaseOptions.extraData || !purchaseOptions.extraData.length)) } onClick={ event => catalogSkipPurchaseConfirmation ? purchase() : setPurchaseState(CatalogPurchaseState.CONFIRM) }>{ LocalizeText('catalog.purchase_confirmation.' + (currentOffer.isRentOffer ? 'rent' : 'buy')) }</Button>;
return <Button classNames={ [ ...swfButtonClassNames, 'nitro-catalog-swf-buy-button' ] } variant="success" disabled={ (purchaseOptions.extraParamRequired && (!purchaseOptions.extraData || !purchaseOptions.extraData.length)) } onClick={ event => setPurchaseState(CatalogPurchaseState.CONFIRM) }>{ LocalizeText('catalog.purchase_confirmation.' + (currentOffer.isRentOffer ? 'rent' : 'buy')) }</Button>;
}
};
src/css/catalog/CatalogClassicView.css
+44
View File
@@ -639,6 +639,50 @@
overflow: hidden;
}
.nitro-catalog-classic-window .nitro-catalog-forum-text {
scrollbar-width: none !important;
font-size: 12px;
line-height: 15px;
}
.nitro-catalog-classic-window .nitro-catalog-forum-text::-webkit-scrollbar {
width: 0 !important;
height: 0 !important;
display: none !important;
}
.nitro-catalog-classic-window .nitro-catalog-forum-text p,
.nitro-catalog-classic-window .nitro-catalog-forum-text div {
margin: 0 0 8px;
}
.nitro-catalog-classic-window .nitro-catalog-forum-text > :last-child {
margin-bottom: 0;
}
.nitro-catalog-classic-window .nitro-catalog-guild-join-btn {
min-height: 20px !important;
width: auto !important;
padding: 1px 10px !important;
border: 1px solid #1c1c1c !important;
border-radius: 5px !important;
background: linear-gradient(180deg, #ffffff 0%, #eaeaea 55%, #d8d8d8 100%) !important;
box-shadow: inset 0 1px 0 #ffffff !important;
color: #000 !important;
font-size: 11px !important;
font-weight: 400 !important;
text-shadow: none !important;
}
.nitro-catalog-classic-window .nitro-catalog-guild-join-btn:hover {
background: linear-gradient(180deg, #ffffff 0%, #f2f2f2 55%, #e2e2e2 100%) !important;
}
.nitro-catalog-classic-window .nitro-catalog-guild-join-btn:active {
background: linear-gradient(180deg, #d8d8d8 0%, #eaeaea 100%) !important;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}
.nitro-catalog-classic-default-layout {
position: relative;
display: block !important;