feat(builder): redesign marketplace builder experience and navigation

Renamed the experience consistently to Marketplace Builder everywhere
visible (page title/subtitle, breadcrumbs, sidebar, dashboard quick
action/shortcut copy) - internal ProjectEditor class/selector names
kept as-is to avoid regressions. builder.title/subtitle no longer say
'bootstrap-config editing surface' to end users.

New business-oriented IA (builder-groups.model.ts): 12 existing
ProjectEditorSectionIds regrouped into 8 groups (Marketplace, Branding
and Design, Homepage, Content, Languages, Marketplace Features,
Navigation and Search, Preview) - every existing section mapped to
exactly one group, none dropped, no group points at a page that
doesn't exist.

New Builder landing page at /edit (was a redirect straight into the
General form): readiness percent, recommended next step, one overview
card per group (purpose + real complete/in-progress/not-started/unknown
status, icon+text never color-alone), a Marketplace Readiness
checklist, quick links. All derived from real facade/schema signals
(required-field fill state, modifiedSections, staticPages, catalog
counts via BackofficeDataService) or explicitly marked unknown
(the "preview reviewed" check has no tracking - shown as unknown,
never guessed).

Section pages (/edit/:section) now share one consistent header:
breadcrumb (Builder > Group > Section), draft/published + modified
badges, and a contextual help panel (what is this / where visible /
what happens if you skip it) sourced per group. Sidebar nav rewritten
as grouped, icon-led sections with per-section and per-group status
indicators; layout converted from a top pill-tab bar to a responsive
sidebar (desktop 280px, tablet 72px icon rail, mobile drawer with
Escape-to-close), matching the Sprint 1 admin shell pattern. Section
form components themselves untouched.

Routes: 'edit' is now its own landing route instead of redirecting to
'edit/general'; /builder and /project-editor redirect to 'edit'.
Sprint 1/2 destinations that pointed at edit/general now point at the
new edit landing page.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
sdarbinyan
2026-07-18 09:43:03 +04:00
parent 419cb9a32c
commit 821a1c6ba8
19 changed files with 1699 additions and 152 deletions

View File

@@ -406,8 +406,8 @@ export const en: Translations = {
notAvailable: 'n/a',
},
builder: {
title: 'Marketplace Project Editor',
subtitle: 'Configuration-only bootstrap editing surface.',
title: 'Marketplace Builder',
subtitle: 'Build your marketplace step by step.',
general: 'General',
branding: 'Branding',
theme: 'Theme',
@@ -685,6 +685,83 @@ export const en: Translations = {
linkLabelDesc: 'Text shown for this navigation link.',
linkUrlDesc: 'Path or URL this navigation link points to.',
linkVisibleDesc: 'Whether this navigation link is shown to shoppers.',
appName: 'Marketplace Builder',
breadcrumbRoot: 'Marketplace Builder',
statusComplete: 'Complete',
statusInProgress: 'In progress',
statusNotStarted: 'Not started',
statusUnknown: 'Not tracked yet',
draftBadge: 'Draft',
publishedBadge: 'Published',
modifiedBadge: 'Unsaved changes',
helpToggleShow: 'What is this?',
helpToggleHide: 'Hide help',
helpWhatIsThis: 'What is this',
helpWhySkip: 'Why configure it',
helpWhereVisible: 'Where shoppers see it',
helpWhatIfSkip: "What happens if you skip it",
helpWhenReturn: 'When to come back to this',
openSidebar: 'Open sections menu',
closeSidebar: 'Close sections menu',
overviewTitle: 'Marketplace Builder',
overviewSubtitle: 'Build your marketplace step by step',
overviewReadinessLabel: 'Your marketplace is {{percent}}% configured',
overviewReadinessHint: 'Based on the required fields you have filled in so far.',
overviewNextStepLabel: 'Recommended next step',
overviewNextStepFallback: 'All required steps are done - you are ready to publish.',
overviewQuickLinksTitle: 'Quick links',
overviewSectionsTitle: 'Builder sections',
overviewOpenSection: 'Open section',
overviewReadinessTitle: 'Marketplace readiness',
readinessLogoUploaded: 'Logo uploaded',
readinessHomepageConfigured: 'Homepage configured',
readinessThemeConfigured: 'Theme configured',
readinessLanguagesConfigured: 'Languages configured',
readinessContentPagesAdded: 'Info pages added',
readinessPreviewReviewed: 'Preview reviewed',
readinessPublished: 'Marketplace published',
readinessCategoriesExist: 'Categories exist',
readinessProductsExist: 'Products exist',
groupMarketplaceLabel: 'Marketplace',
groupMarketplaceDescription: 'Name, address, and the core details of your marketplace.',
groupMarketplacePurpose: 'The basic information that defines your marketplace: name, domain, and default language.',
groupMarketplaceWhere: 'The name and address show up in the browser tab, search results, and every storefront page.',
groupMarketplaceSkip: "Without a name and address, your marketplace won't feel finished to shoppers.",
groupBrandingLabel: 'Branding & Design',
groupBrandingDescription: 'Logo, colors, header and footer - your store\'s visual identity.',
groupBrandingPurpose: "Set how your marketplace looks: logo, color palette, and the header/footer chrome.",
groupBrandingWhere: 'Changes show up on every page a shopper sees.',
groupBrandingSkip: "Your marketplace will use default styling that doesn't reflect your brand.",
groupHomepageLabel: 'Homepage',
groupHomepageDescription: 'The banners, showcases, and widgets shoppers see first.',
groupHomepagePurpose: 'Build your homepage from blocks: a hero banner, featured categories and products, promotions.',
groupHomepageWhere: "It's the first page a shopper sees when they open your marketplace.",
groupHomepageSkip: 'Your homepage will stay empty or use a default layout.',
groupContentLabel: 'Content',
groupContentDescription: 'About us, contacts, delivery, returns, and other info pages.',
groupContentPurpose: 'Add the pages shoppers trust: about us, contacts, delivery and return terms.',
groupContentWhere: "Links to these pages usually appear in the site footer.",
groupContentSkip: "Shoppers won't find answers about delivery, returns, or how to contact you - that hurts trust.",
groupLanguagesLabel: 'Languages',
groupLanguagesDescription: 'Which languages your marketplace works in.',
groupLanguagesPurpose: 'Pick a default language and add more for shoppers in other regions.',
groupLanguagesWhere: 'The language switcher is visible in the header on every page.',
groupLanguagesSkip: 'Your marketplace will only be available in the default language.',
groupFeaturesLabel: 'Marketplace Features',
groupFeaturesDescription: 'Wishlist, compare, reviews, guest checkout, and more.',
groupFeaturesPurpose: 'Turn shopper-facing features on or off: wishlist, product comparison, guest checkout.',
groupFeaturesWhere: 'Affects the catalog, product, and checkout pages.',
groupFeaturesSkip: 'Your marketplace will use the default feature set.',
groupNavigationLabel: 'Navigation & Search',
groupNavigationDescription: "The site menu and how shoppers find products.",
groupNavigationPurpose: 'Configure the menu items and how catalog navigation is structured.',
groupNavigationWhere: 'Visible in the site header on every page.',
groupNavigationSkip: 'Shoppers will use the default navigation.',
groupPreviewLabel: 'Preview',
groupPreviewDescription: 'See how your marketplace looks on desktop, tablet, and phone.',
groupPreviewPurpose: 'Check your marketplace through a shopper\'s eyes before publishing - across screen sizes.',
groupPreviewWhere: "This is a preview - shoppers never see it.",
groupPreviewSkip: 'You can publish your changes without reviewing them first.',
},
dashboard: {
title: 'Dashboard',
@@ -708,7 +785,7 @@ export const en: Translations = {
statePendingBackend: 'Awaiting backend integration',
never: 'Never',
quickActionsTitle: 'Quick Actions',
actionEditProject: 'Edit Project',
actionEditProject: 'Marketplace Builder',
actionCategories: 'Categories',
actionProducts: 'Products',
actionStaticPages: 'Static Pages',