fix-custom-links on footer

packages/web-components/src/components/footer/footer-composite.ts

@@ -191,20 +191,42 @@ class C4DFooterComposite extends MediaQueryMixin(
   /**
    * The legal nav links.
    */
+  private _links?: BasicLinkSet[];
+  private _legalLinks?: BasicLink[];
+  private _adjunctLinks?: BasicLink[];
+
   @property({ attribute: false })
-  legalLinks: BasicLink[] = [];
+  set links(value: BasicLinkSet[] | undefined) {
+    this._links = value;
+    this.requestUpdate('links');
+  }
+  get links() {
+    return this._links;
+  }
 
   /**
    * The adjunct links.
    */
   @property({ attribute: false })
-  adjunctLinks: BasicLink[] = [];
+  set legalLinks(value: BasicLink[] | undefined) {
+    this._legalLinks = value;
+    this.requestUpdate('legalLinks');
+  }
+  get legalLinks() {
+    return this._legalLinks;
+  }
 
   /**
    * The footer links.
    */
   @property({ attribute: false })
-  links: BasicLinkSet[] = [];
+  set adjunctLinks(value: BasicLink[] | undefined) {
+    this._adjunctLinks = value;
+    this.requestUpdate('adjunctLinks');
+  }
+  get adjunctLinks() {
+    return this._adjunctLinks;
+  }
 
   /**
    * The locale list.

packages/web-components/src/components/footer/footer-container.ts

@@ -87,20 +87,32 @@ export interface FooterContainerStateProps
 }
 
 /**
- * @param state The Redux state for masthead.
+ * @param state The Redux state for footer
+ * @param ownProps The current component props
  * @returns The converted version of the given state, tailored for `<c4d-footer-container>`.
  */
 export function mapStateToProps(
-  state: FooterContainerState
+  state: FooterContainerState,
+  ownProps?: FooterContainerStateProps
 ): FooterContainerStateProps {
   const { localeAPI, translateAPI } = state;
   const { language, localeLists } = localeAPI ?? {};
   const { translations } = translateAPI ?? {};
+
+  const hasUserLinks = ownProps?.links !== undefined;
+  const hasUserLegalLinks = ownProps?.legalLinks !== undefined;
+
   return pickBy(
     {
       localeList: !language ? undefined : localeLists?.[language],
-      links: !language ? undefined : translations?.[language]?.footerMenu,
-      legalLinks: !language ? undefined : translations?.[language]?.footerThin,
+      links:
+        hasUserLinks || !language
+          ? undefined
+          : translations?.[language]?.footerMenu,
+      legalLinks:
+        hasUserLegalLinks || !language
+          ? undefined
+          : translations?.[language]?.footerThin,
     },
     (value) => value !== undefined
   );
@@ -130,7 +142,7 @@ export function mapDispatchToProps(
 }
 
 /**
- * Container component for masthead.
+ * Container component for footer.
  *
  * @element c4d-footer-container
  */