2026-07-10 13:43:53 +04:00
|
|
|
import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
|
|
|
|
|
import { FormsModule } from '@angular/forms';
|
|
|
|
|
import { ProjectEditorFacade } from '../facade/project-editor.facade';
|
|
|
|
|
import { TranslatePipe } from '../../../i18n/translate.pipe';
|
|
|
|
|
import { HeaderConfig } from '../../../shared/models/config';
|
|
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
|
selector: 'app-project-editor-header-section',
|
|
|
|
|
standalone: true,
|
|
|
|
|
imports: [FormsModule, TranslatePipe],
|
|
|
|
|
templateUrl: './header-section.component.html',
|
|
|
|
|
styleUrls: ['./section.shared.scss'],
|
|
|
|
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
|
|
|
})
|
|
|
|
|
export class ProjectEditorHeaderSectionComponent {
|
|
|
|
|
private readonly facade = inject(ProjectEditorFacade);
|
|
|
|
|
readonly bootstrap = this.facade.bootstrap;
|
feat(project-editor): finish field descriptions + enum dropdowns across all sections
Wires up the remaining editor sections (theme, header, footer, homepage,
widgets, features, languages, navigation) with the description text and
dropdown UX started for General/Branding:
- Every enum-backed field is now a <select> with a description per option,
not free text: theme.mode, the new site-wide layout.type (previously had
no editor at all - added to the Theme section, and added to that
section's reset-scope), homepage section layout.strategy, and
catalog.navigationMode (also previously unedited, added to Features).
- Every other field (colors, header toggles, footer contact/company fields,
widget props, feature flags, language add, nav link label/url/visible)
gets a one-line plain-language description under its label via the new
*Desc i18n keys (en/ru/hy) prepared earlier.
- Genuinely open text (widget layout variant strings, JSON props) stays
free text, description-only, per the existing widgetLayoutDesc/widgetJsonDesc
wording - not force-fit into a dropdown.
Verified: tsc --noEmit and ng build both clean.
2026-07-15 00:45:41 +04:00
|
|
|
readonly items: Array<{ key: keyof HeaderConfig; label: string; descKey: string }> = [
|
|
|
|
|
{ key: 'showLogo', label: 'builder.showLogo', descKey: 'builder.showLogoDesc' },
|
|
|
|
|
{ key: 'showSearch', label: 'builder.showSearch', descKey: 'builder.showSearchDesc' },
|
|
|
|
|
{ key: 'showCategories', label: 'builder.showCategories', descKey: 'builder.showCategoriesDesc' },
|
|
|
|
|
{ key: 'showLanguages', label: 'builder.showLanguages', descKey: 'builder.showLanguagesDesc' },
|
|
|
|
|
{ key: 'showCart', label: 'builder.showCart', descKey: 'builder.showCartDesc' },
|
|
|
|
|
{ key: 'showProfile', label: 'builder.showProfile', descKey: 'builder.showProfileDesc' },
|
|
|
|
|
{ key: 'showWishlist', label: 'builder.showWishlist', descKey: 'builder.showWishlistDesc' },
|
|
|
|
|
{ key: 'showCompare', label: 'builder.showCompare', descKey: 'builder.showCompareDesc' },
|
|
|
|
|
{ key: 'showRegion', label: 'builder.showRegion', descKey: 'builder.showRegionDesc' },
|
2026-07-10 13:43:53 +04:00
|
|
|
];
|
|
|
|
|
|
|
|
|
|
toggle(key: keyof HeaderConfig, checked: boolean): void {
|
|
|
|
|
this.facade.updateBootstrap(current => ({
|
|
|
|
|
...current,
|
|
|
|
|
header: { ...(current.header ?? {}), [key]: checked }
|
|
|
|
|
}));
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
isChecked(key: keyof HeaderConfig): boolean {
|
|
|
|
|
return !!this.bootstrap()?.header?.[key];
|
|
|
|
|
}
|
|
|
|
|
}
|