feat(project-editor): footer validation rules (contact email, social link URLs, payment icons)

Real gaps, not fabricated: isValidEmail existed in primitives.ts but was
never called anywhere; social-link URL check only lived as a per-row
template hint (never blocked publish or set the nav badge); payment icons
with only src or only alt set were silently accepted.

- invalid-contact-email: company.contacts.email must be a valid email (error)
- invalid-social-link-url: footer.socialLinks entries need a valid http(s) URL (warning)
- incomplete-payment-icon: a payment icon needs both src and alt, or neither (warning)

Wired into footer-section via the existing fieldError() pattern. Header has
no equivalent gap today (every header field is a bool/enum, always valid by
construction) so nothing was added there.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/app/features/project-editor/sections/footer-section.component.html

@@ -4,7 +4,7 @@
     <app-form-field [label]="'builder.companyName' | translate" [hint]="'builder.companyNameDesc' | translate"><app-input [ngModel]="bootstrap.company.companyName" (ngModelChange)="updateCompanyName($event)" /></app-form-field>
     <app-form-field [label]="'builder.address' | translate" [hint]="'builder.addressDesc' | translate"><app-input [ngModel]="bootstrap.company.address.street || ''" (ngModelChange)="updateAddress($event)" /></app-form-field>
     <app-form-field [label]="'builder.phone' | translate" [hint]="'builder.phoneDesc' | translate"><app-input [ngModel]="bootstrap.company.contacts.phone || ''" (ngModelChange)="updatePhone($event)" /></app-form-field>
-    <app-form-field [label]="'builder.email' | translate" [hint]="'builder.emailDesc' | translate"><app-input [ngModel]="bootstrap.company.contacts.email" (ngModelChange)="updateEmail($event)" /></app-form-field>
+    <app-form-field [label]="'builder.email' | translate" [hint]="'builder.emailDesc' | translate" [error]="fieldError('company.contacts.email')"><app-input [ngModel]="bootstrap.company.contacts.email" (ngModelChange)="updateEmail($event)" /></app-form-field>
     <app-form-field class="full" [label]="'builder.copyright' | translate" [hint]="'builder.copyrightDesc' | translate"><app-input [ngModel]="copyrightValue()" (ngModelChange)="updateCopyright($event)" /></app-form-field>
     <app-form-field class="full" [label]="'builder.footerLogo' | translate" [hint]="'builder.footerLogoDesc' | translate">
       <app-image-field [value]="bootstrap.footer?.logoUrl || ''" (valueChange)="updateLogo($event)" />
@@ -12,6 +12,9 @@
 
     <div class="full">
       <label><span>{{ 'builder.paymentIcons' | translate }}</span><small class="field-desc">{{ 'builder.paymentIconsDesc' | translate }}</small></label>
+      @if (fieldError('footer.paymentIcons'); as msg) {
+        <p class="editor-error">{{ msg }}</p>
+      }
       <app-key-value-editor
         [rows]="paymentIconRows()"
         [addLabel]="'builder.addPaymentIcon' | translate"
@@ -30,6 +33,9 @@
 
     <div class="full">
       <label><span>{{ 'builder.socialLinks' | translate }}</span><small class="field-desc">{{ 'builder.socialLinksDesc' | translate }}</small></label>
+      @if (fieldError('footer.socialLinks'); as msg) {
+        <p class="editor-error">{{ msg }}</p>
+      }
       <app-key-value-editor
         [rows]="socialLinkRows()"
         [addLabel]="'builder.addSocialLink' | translate"

src/app/features/project-editor/sections/footer-section.component.ts

@@ -2,6 +2,7 @@ import { ChangeDetectionStrategy, Component, computed, inject } from '@angular/c
 import { FormsModule } from '@angular/forms';
 import { ProjectEditorFacade } from '../facade/project-editor.facade';
 import { TranslatePipe } from '../../../i18n/translate.pipe';
+import { TranslateService } from '../../../i18n/translate.service';
 import { InputComponent } from '../../../shared/ui/input/input.component';
 import { FormFieldComponent } from '../../../shared/ui/form-field/form-field.component';
 import { SectionCardComponent } from '../../../shared/ui/section-card/section-card.component';
@@ -28,7 +29,12 @@ import { isValidHttpUrl } from '../schema/validators/primitives';
 })
 export class ProjectEditorFooterSectionComponent {
   private readonly facade = inject(ProjectEditorFacade);
+  private readonly translate = inject(TranslateService);
   readonly bootstrap = this.facade.bootstrap;
+  readonly fieldError = (key: string): string | null => {
+    const messageKey = this.facade.fieldError(key);
+    return messageKey ? this.translate.t(messageKey) : null;
+  };
 
   readonly staticPagesValue = computed(() => (this.bootstrap()?.footer?.staticPageKeys ?? this.bootstrap()?.footer?.legalPageKeys ?? []).join(', '));
   readonly copyrightValue = computed(() => {

src/app/features/project-editor/services/project-validator.service.ts

@@ -3,6 +3,7 @@ import { BootstrapConfig } from '../../../shared/models/config';
 import { ProjectEditorSectionId } from '../models/project-editor.model';
 import {
   extractStyleBlocks,
+  isValidEmail,
   isValidHexColor,
   isValidHttpUrl,
   normalizeRoute,
@@ -56,6 +57,9 @@ export class ProjectValidator {
       ...this.cssIssues(bootstrap),
       ...this.translationIssues(bootstrap),
       ...this.layoutIssues(bootstrap),
+      ...this.footerContactIssues(bootstrap),
+      ...this.footerSocialLinkIssues(bootstrap),
+      ...this.footerPaymentIconIssues(bootstrap),
     ];
   }
 
@@ -222,4 +226,26 @@ export class ProjectValidator {
       ? [error('invalid-layouts', 'builder.validationInvalidLayouts', 'theme', 'layout.type')]
       : [];
   }
+
+  private footerContactIssues(bootstrap: BootstrapConfig): ProjectValidationIssue[] {
+    const email = bootstrap.company?.contacts?.email;
+    return !email || isValidEmail(email)
+      ? []
+      : [error('invalid-contact-email', 'builder.validationInvalidContactEmail', 'footer', 'company.contacts.email')];
+  }
+
+  private footerSocialLinkIssues(bootstrap: BootstrapConfig): ProjectValidationIssue[] {
+    const hasInvalidUrl = (bootstrap.footer?.socialLinks ?? []).some(link => !!link.url && !isValidHttpUrl(link.url));
+    return hasInvalidUrl
+      ? [warning('invalid-social-link-url', 'builder.validationInvalidSocialLinkUrl', 'footer', 'footer.socialLinks')]
+      : [];
+  }
+
+  /** A payment icon row with only one of src/alt set is a broken image reference or missing accessibility text. */
+  private footerPaymentIconIssues(bootstrap: BootstrapConfig): ProjectValidationIssue[] {
+    const hasIncompleteRow = (bootstrap.footer?.paymentIcons ?? []).some(icon => !!icon.src !== !!icon.alt);
+    return hasIncompleteRow
+      ? [warning('incomplete-payment-icon', 'builder.validationIncompletePaymentIcon', 'footer', 'footer.paymentIcons')]
+      : [];
+  }
 }