feat(modal): new navigation with back and forth arrow

This commit is contained in:
alexsparkes
2025-10-29 23:46:15 +00:00
parent 3f1aa9f5cd
commit aa6b1a3be3
9 changed files with 544 additions and 20 deletions

View File

@@ -4,26 +4,71 @@ import { memo } from 'react';
import Tabs from '../../../components/Elements/MainModal/backend/Tabs';
import MarketplaceTab from '../../marketplace/views/Browse';
function Discover({ changeTab, deepLinkData, currentTab }) {
function Discover({
changeTab,
deepLinkData,
currentTab,
onSectionChange,
onProductView,
resetToAll,
onResetToAll,
navigationTrigger,
}) {
return (
<Tabs changeTab={(type) => changeTab(type)} current="discover" currentTab={currentTab}>
<Tabs
changeTab={(type) => changeTab(type)}
current="discover"
currentTab={currentTab}
onSectionChange={onSectionChange}
resetToFirst={resetToAll}
>
<div label={variables.getMessage('modals.main.marketplace.all')} name="all">
<MarketplaceTab type="all" deepLinkData={deepLinkData} />
<MarketplaceTab
type="all"
deepLinkData={deepLinkData}
onProductView={onProductView}
onResetToAll={onResetToAll}
navigationTrigger={navigationTrigger}
/>
</div>
<div label={variables.getMessage('modals.main.marketplace.photo_packs')} name="photo_packs">
<MarketplaceTab type="photo_packs" deepLinkData={deepLinkData} />
<MarketplaceTab
type="photo_packs"
deepLinkData={deepLinkData}
onProductView={onProductView}
onResetToAll={onResetToAll}
navigationTrigger={navigationTrigger}
/>
</div>
<div label={variables.getMessage('modals.main.marketplace.quote_packs')} name="quote_packs">
<MarketplaceTab type="quote_packs" deepLinkData={deepLinkData} />
<MarketplaceTab
type="quote_packs"
deepLinkData={deepLinkData}
onProductView={onProductView}
onResetToAll={onResetToAll}
navigationTrigger={navigationTrigger}
/>
</div>
<div
label={variables.getMessage('modals.main.marketplace.preset_settings')}
name="preset_settings"
>
<MarketplaceTab type="preset_settings" deepLinkData={deepLinkData} />
<MarketplaceTab
type="preset_settings"
deepLinkData={deepLinkData}
onProductView={onProductView}
onResetToAll={onResetToAll}
navigationTrigger={navigationTrigger}
/>
</div>
<div label={variables.getMessage('modals.main.marketplace.collections')} name="collections">
<MarketplaceTab type="collections" deepLinkData={deepLinkData} />
<MarketplaceTab
type="collections"
deepLinkData={deepLinkData}
onProductView={onProductView}
onResetToAll={onResetToAll}
navigationTrigger={navigationTrigger}
/>
</div>
</Tabs>
);

View File

@@ -7,7 +7,12 @@ import Create from '../../marketplace/views/Create';
function Library(props) {
return (
<Tabs changeTab={(type) => props.changeTab(type)} current="library" currentTab={props.currentTab}>
<Tabs
changeTab={(type) => props.changeTab(type)}
current="library"
currentTab={props.currentTab}
onSectionChange={props.onSectionChange}
>
<div label={variables.getMessage('modals.main.addons.added')} name="added">
<Added />
</div>

View File

@@ -90,7 +90,12 @@ const sections = [
function Settings(props) {
return (
<Tabs changeTab={(type) => props.changeTab(type)} current="settings" currentTab={props.currentTab}>
<Tabs
changeTab={(type) => props.changeTab(type)}
current="settings"
currentTab={props.currentTab}
onSectionChange={props.onSectionChange}
>
{sections.map(({ label, name, component: Component }) => (
<div key={name} label={variables.getMessage(label)} name={name}>
<Component />