import { AddLinkEventTracker, GetSessionDataManager, ILinkEventTracker, RemoveLinkEventTracker } from '@nitrots/nitro-renderer'; import { FC, useEffect } from 'react'; import { FaCog, FaEdit, FaEye, FaEyeSlash, FaPlus, FaTrash } from 'react-icons/fa'; import { GetConfigurationValue, LocalizeText } from '../../api'; import { Column, Grid, NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, NitroCardTabsView, NitroCardView } from '../../common'; import { useCatalog } from '../../hooks'; import { CatalogAdminProvider, useCatalogAdmin } from './CatalogAdminContext'; import { CatalogAdminOfferEditView } from './views/admin/CatalogAdminOfferEditView'; import { CatalogAdminPageEditView } from './views/admin/CatalogAdminPageEditView'; import { CatalogIconView } from './views/catalog-icon/CatalogIconView'; import { CatalogGiftView } from './views/gift/CatalogGiftView'; import { CatalogNavigationView } from './views/navigation/CatalogNavigationView'; import { GetCatalogLayout } from './views/page/layout/GetCatalogLayout'; import { MarketplacePostOfferView } from './views/page/layout/marketplace/MarketplacePostOfferView'; const CatalogClassicViewInner: FC<{}> = () => { const { isVisible = false, setIsVisible = null, rootNode = null, currentPage = null, navigationHidden = false, setNavigationHidden = null, activeNodes = [], searchResult = null, setSearchResult = null, openPageByName = null, openPageByOfferId = null, activateNode = null } = useCatalog(); const catalogAdmin = useCatalogAdmin(); const adminMode = catalogAdmin?.adminMode ?? false; const setAdminMode = catalogAdmin?.setAdminMode ?? (() => {}); const hasPendingChanges = catalogAdmin?.hasPendingChanges ?? false; const publishCatalog = catalogAdmin?.publishCatalog ?? (() => {}); const loading = catalogAdmin?.loading ?? false; const isMod = GetSessionDataManager().isModerator; useEffect(() => { const linkTracker: ILinkEventTracker = { linkReceived: (url: string) => { const parts = url.split('/'); if(parts.length < 2) return; switch(parts[1]) { case 'show': setIsVisible(true); return; case 'hide': setIsVisible(false); return; case 'toggle': setIsVisible(prevValue => !prevValue); return; case 'open': if(parts.length > 2) { if(parts.length === 4) { switch(parts[2]) { case 'offerId': openPageByOfferId(parseInt(parts[3])); return; } } else { openPageByName(parts[2]); } } else { setIsVisible(true); } return; } }, eventUrlPrefix: 'catalog/' }; AddLinkEventTracker(linkTracker); return () => RemoveLinkEventTracker(linkTracker); }, [ setIsVisible, openPageByOfferId, openPageByName ]); return ( <> { isVisible && setIsVisible(false) } /> { /* Admin banner */ } { adminMode &&
⚙ Admin Mode
} { rootNode && (rootNode.children.length > 0) && rootNode.children.map((child, index) => { if(!adminMode && !child.isVisible) return null; const isHidden = !child.isVisible; return ( { if(searchResult) setSearchResult(null); activateNode(child); } } >
{ GetConfigurationValue('catalog.tab.icons') && } { child.localization } { adminMode && isHidden && } { adminMode &&
e.stopPropagation() }> { catalogAdmin.setEditingPageNode(child); catalogAdmin.setEditingRootPage(false); catalogAdmin.setEditingPageData(true); } } /> catalogAdmin.togglePageVisible(child.pageId) }> { isHidden ? : } { if(confirm(LocalizeText('catalog.admin.delete.category.confirm', [ 'name' ], [ child.localization ]))) catalogAdmin.deletePage(child.pageId); } } />
}
); }) } { /* Admin toggle button in tabs bar */ } { isMod && setAdminMode(!adminMode) }> }
{ /* Admin: add new root category */ } { adminMode && rootNode &&
} { !navigationHidden && { activeNodes && (activeNodes.length > 0) && } } { adminMode && } { GetCatalogLayout(currentPage, () => setNavigationHidden(true)) }
} ); }; export const CatalogClassicView: FC<{}> = () => { return ( ); };