sdarbinyan/marketplaces
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(project-editor): editable nav link labels per locale, add LocaleTabs

Browse Source 
- navigation-section: add LocaleTabs; label input now reads/writes the
  active locale's translation via a new editableLabel() helper instead of
  always the default locale. facade.updateNavLinkLabel() gained an optional
  locale param (defaults to current default locale, so existing callers
  are unaffected) and correctly promotes a plain-string label into a
  per-locale map when writing a non-default locale.
- languages-section: wrap in SectionCard, add LocaleTabs for consistency.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
sdarbinyan
2026-07-16 02:10:38 +04:00
parent 1c51a819ed
commit 0c9a855232
5 changed files with 61 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/app/features/project-editor/sections/navigation-section.component.ts
View File

@@ -1,15 +1,18 @@
import { ChangeDetectionStrategy, Component, computed, inject } from '@angular/core';
import { ChangeDetectionStrategy, Component, computed, inject, signal } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { ProjectEditorFacade } from '../facade/project-editor.facade';
import { TranslatePipe } from '../../../i18n/translate.pipe';
import { NavigationItemConfig } from '../../../shared/models/config';
import { ButtonComponent } from '../../../shared/ui/button/button.component';
import { InputComponent } from '../../../shared/ui/input/input.component';
import { SectionCardComponent } from '../../../shared/ui/section-card/section-card.component';
import { ToggleComponent } from '../../../shared/ui/toggle/toggle.component';
import { LocaleTabsComponent } from '../../../shared/ui/locale-tabs/locale-tabs.component';
@Component({
selector: 'app-project-editor-navigation-section',
standalone: true,
imports: [FormsModule, TranslatePipe, ButtonComponent, InputComponent],
imports: [FormsModule, TranslatePipe, ButtonComponent, InputComponent, SectionCardComponent, ToggleComponent, LocaleTabsComponent],
templateUrl: './navigation-section.component.html',
styleUrls: ['./section.shared.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
@@ -18,6 +21,10 @@ export class ProjectEditorNavigationSectionComponent {
private readonly facade = inject(ProjectEditorFacade);
readonly bootstrap = this.facade.bootstrap;
readonly supportedLocales = computed(() => this.bootstrap()?.tenant.supportedLocales ?? []);
readonly defaultLocale = computed(() => this.bootstrap()?.tenant.defaultLocale ?? '');
readonly activeLocale = signal<string | null>(null);
readonly headerLinks = computed(() => this.sorted(this.bootstrap()?.navigation.header ?? []));
readonly footerLinks = computed<NavigationItemConfig[] | null>(() => {
const footer = this.bootstrap()?.navigation.footer ?? [];
@@ -27,6 +34,11 @@ export class ProjectEditorNavigationSectionComponent {
return 'items' in footer[0] ? null : this.sorted(footer as NavigationItemConfig[]);
});
onActiveLocaleChange(locale: string): void {
this.activeLocale.set(locale);
}
/** Display label used for the row heading — a stable identifier, not tied to the active locale. */
labelOf(item: NavigationItemConfig): string {
if (typeof item.label === 'string' || !item.label) {
return item.label ?? '';
@@ -35,6 +47,19 @@ export class ProjectEditorNavigationSectionComponent {
return item.label[defaultLocale] ?? Object.values(item.label)[0] ?? '';
}
/** Editable label for the currently active locale tab. Falls back to an empty string
* when this locale has no translation yet, so switching locales lets you fill it in. */
editableLabel(item: NavigationItemConfig): string {
const locale = this.activeLocale() ?? this.defaultLocale();
if (!item.label) {
return '';
}
if (typeof item.label === 'string') {
return locale === this.defaultLocale() ? item.label : '';
}
return item.label[locale] ?? '';
}
addLink(target: 'header' | 'footer'): void {
this.facade.addNavLink(target);
}
@@ -48,7 +73,8 @@ export class ProjectEditorNavigationSectionComponent {
}
updateLabel(target: 'header' | 'footer', id: string, value: string): void {
this.facade.updateNavLinkLabel(target, id, value);
const locale = this.activeLocale() ?? this.defaultLocale();
this.facade.updateNavLinkLabel(target, id, value, locale);
}
updateRoute(target: 'header' | 'footer', id: string, value: string): void {