Add Cookie Consent attribute to LFX Footer #457

ahmedomosanya · 2025-07-24T08:27:04Z

feat: upgrade Angular 11→13 and lfx-ui-core to support optional chaining
feat: add cookie consent attribute to LFX footer

Summary by CodeRabbit

New Features
- Added cookie tracking support to the footer component.
Chores
- Upgraded Angular framework and related dependencies to version 13.4.x.
- Updated Node.js engine requirement to version 18 across all environments and workflows.
- Updated build scripts and configuration to align with the latest Angular and Node.js standards.
- Added and updated dependency resolutions and package versions for improved compatibility.
- Updated GitHub Actions workflows to use Node.js 18 for all jobs.

- Upgraded Angular from 11.2.14 to 13.4.0 - Updated @linuxfoundation/lfx-ui-core from 0.0.12 to 0.0.19 - Updated TypeScript from 4.1.6 to 4.6.4 - Updated @auth0/auth0-angular to 2.2.3 for Angular 13 compatibility - Updated ng-bootstrap from 6.2.0 to 12.1.2 - Added @popperjs/core dependency - Configured .npmrc to resolve FontAwesome registry issues - Added allowedCommonJsDependencies configuration - Build now succeeds with optional chaining syntax (?.operator) - Latest LFX UI Core features are now available - Clean builds with no parsing errors Signed-off-by: ahmedomosanya <[email protected]>

Signed-off-by: ahmedomosanya <[email protected]>

coderabbitai · 2025-07-24T08:27:11Z

Walkthrough

This update upgrades Node.js engine requirements, Angular framework and related dependencies, and updates build scripts and configurations to align with Angular 13. It also modifies GitHub Actions workflows to use Node.js 18, adjusts polyfill imports, and adds a cookie-tracking attribute to the <lfx-footer> component in the app template.

Changes

Files/Paths	Change Summary
.github/workflows/*.yml	Updated Node.js version from 16 to 18 in all workflow setup steps.
.gitignore	Added `.angular/` to ignore Angular's local workspace directory.
angular.json	Modified build options: removed `"aot": true`, added new options (vendorChunk, extractLicenses, etc.), updated allowedCommonJsDependencies.
package.json	Upgraded Angular and related dependencies to v13, updated Node.js engine to 18, revised build scripts, added new dependencies.
edge/package.json	Increased Node.js engine to 18, added `NODE_OPTIONS=--openssl-legacy-provider` to build script.
test/functional/package.json	Added resolutions for several packages to address dependency conflicts.
src/app/app.component.html	Added `cookie-tracking` attribute to `<lfx-footer>`.
src/environments/environment.ts	Updated zone.js error plugin import path.
src/polyfills.ts	Changed zone.js import to package root.
src/test.ts	Updated zone.js testing import path.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant AppComponent
    participant LFXFooter

    User->>AppComponent: Loads application
    AppComponent->>LFXFooter: Renders <lfx-footer cookie-tracking>
    LFXFooter-->>AppComponent: Footer rendered with cookie tracking enabled

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~15 minutes

Possibly related issues

[CLA Landing Page] Add Cookie Consent attribute to LFX Footer easycla#4700: Adds cookie-tracking attribute to <lfx-footer>, matching the issue's request for cookie consent.
[Contributor Console] Add Cookie Consent attribute to LFX Footer easycla#4698: Implements the cookie consent attribute in the Contributor Console footer as described.
[Corporate CLA Console] Add Cookie Consent attribute to LFX Footer easycla#4699: Directly addresses the addition of a cookie consent attribute to the LFX Footer.

Poem

In the garden of code where the carrots grow tall,
We’ve hopped to Node 18 and made Angular enthrall.
With cookies to track and dependencies new,
The workflows are fresher, the builds will ensue.
🥕🐇 Here’s to progress—hip hop hooray!
For every footer, a crumb on the way.

Note

⚡️ Unit Test Generation is now available in beta!

Learn more here, or try it out under "Finishing Touches" below.

📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 0beceb9 and e43896e.

⛔ Files ignored due to path filters (1)

test/functional/yarn.lock is excluded by !**/yarn.lock, !**/*.lock

📒 Files selected for processing (3)

angular.json (1 hunks)
package.json (7 hunks)
test/functional/package.json (1 hunks)

✅ Files skipped from review due to trivial changes (1)

test/functional/package.json

🚧 Files skipped from review as they are similar to previous changes (2)

angular.json
package.json

✨ Finishing Touches

🧪 Generate unit tests

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch feature-cookie-consent

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

Review comments: Directly reply to a review comment made by CodeRabbit. Example:
- I pushed a fix in commit <commit_id>, please review it.
- Explain this complex logic.
- Open a follow-up GitHub issue for this discussion.
Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
- @coderabbitai explain this code block.
- @coderabbitai modularize this function.
PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
- @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
- @coderabbitai read src/utils.ts and explain its main purpose.
- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
- @coderabbitai help me debug CodeRabbit configuration file.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

@coderabbitai pause to pause the reviews on a PR.
@coderabbitai resume to resume the paused reviews.
@coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
@coderabbitai full review to do a full review from scratch and review all the files again.
@coderabbitai summary to regenerate the summary of the PR.
@coderabbitai generate docstrings to generate docstrings for this PR.
@coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
@coderabbitai generate unit tests to generate unit tests for this PR.
@coderabbitai resolve resolve all the CodeRabbit review comments.
@coderabbitai configuration to show the current CodeRabbit configuration for the repository.
@coderabbitai help to get help.

Other keywords and placeholders

Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (`.coderabbit.yaml`)

You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
Please see the configuration documentation for more information.
If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

Visit our Documentation for detailed information on how to use CodeRabbit.
Join our Discord Community to get help, request features, and share feedback.
Follow us on X/Twitter for updates and announcements.

coderabbitai

Actionable comments posted: 6

🧹 Nitpick comments (1)

angular.json (1)

29-34: Move build-time flags out of the default options block

vendorChunk, sourceMap, optimization, buildOptimizer, etc. now apply to all builds (including production) because they’re in the root options object.
That disables optimisation for production unless explicitly overridden and slows dev rebuilds by generating extra chunks/maps.

Consider:

Keep minimal defaults in options

Put the current flags into a dedicated development configuration and set it as the defaultConfiguration.

This matches Angular-CLI best practices and avoids surprises.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 5092222 and 60b4b60.

⛔ Files ignored due to path filters (1)

yarn.lock is excluded by !**/yarn.lock, !**/*.lock

📒 Files selected for processing (8)

.gitignore (1 hunks)
.npmrc (1 hunks)
angular.json (2 hunks)
package.json (5 hunks)
src/app/app.component.html (1 hunks)
src/environments/environment.ts (1 hunks)
src/polyfills.ts (1 hunks)
src/test.ts (1 hunks)

🧰 Additional context used

🪛 GitHub Actions: Yarn Dependency Audit

package.json

[error] 1-1: Yarn install failed due to incompatible Node.js version. Module '@aws-sdk/[email protected]' requires Node >=18.0.0 but found 16.20.2.

🪛 GitHub Actions: Build

package.json

[error] 1-1: Yarn install failed due to incompatible Node.js version. Module '@aws-sdk/[email protected]' requires Node.js >=18.0.0 but found 16.20.2.

🪛 GitHub Actions: Snyk Scan Edge NPM Dependencies

package.json

[error] 1-1: Yarn install failed due to incompatible Node.js version. Module '@aws-sdk/[email protected]' requires Node >=18.0.0 but found Node 16.20.2.

🔇 Additional comments (4)

src/test.ts (1)

7-7: Zone.js Testing Import Verified – No Residual Old Paths Detected

I scanned the repository for any remaining zone.js/dist/zone-testing imports and found none. The use of
import 'zone.js/testing';
is correct for Zone ≥ 0.11.4 (Angular 13). All good to merge.
src/polyfills.ts (1)

62-62: No remaining legacy Zone.js imports found
All occurrences of the old zone.js/dist/zone import have been removed—only the root import 'zone.js'; remains. 🎉

src/environments/environment.ts (1)

26-26: Comment updated to new plugin path – looks good

The comment now points to zone.js/plugins/zone-error, matching the new package layout.

.gitignore (1)

76-76: .angular/ added to .gitignore – good call

Excluding the Angular cache directory keeps commits clean and CI lean.

.npmrc

angular.json

package.json

src/app/app.component.html

…patibility Signed-off-by: ahmedomosanya <[email protected]>

… compatibility Signed-off-by: ahmedomosanya <[email protected]>

Signed-off-by: ahmedomosanya <[email protected]>

- Add resolutions for @cypress/request, form-data, braces, micromatch, cross-spawn, brace-expansion - Update axios, webpack, esbuild, @babel/runtime, webpack-dev-server to secure versions - Reduce vulnerabilities from 11 critical/high/moderate to 1 moderate (Bootstrap XSS) - yarn_audit.sh now passes (only fails on critical vulnerabilities >=16) The remaining Bootstrap vulnerability requires upgrading to v5 which would be a breaking change for UI components and should be handled in a separate PR. Signed-off-by: ahmedomosanya <[email protected]>

- Add security resolutions to test/functional/package.json - Fix @cypress/request, form-data, braces, micromatch, cross-spawn, brace-expansion Signed-off-by: ahmedomosanya <[email protected]>

- Remove duplicate configuration flags from build:dev, build:staging, build:prod scripts - Original scripts used --prod --configuration=dev (duplicate configs since --prod = --configuration=production) - ng update converted --prod to --configuration production, making the duplication explicit - Angular CLI was already using last config and showing warning about override - Each environment config in angular.json already includes production optimizations Before: ng build --configuration production --configuration=dev After: ng build --configuration dev This is the first time these build scripts are semantically correct Signed-off-by: ahmedomosanya <[email protected]>

Signed-off-by: ahmedomosanya <[email protected]>

- Remove 'defaultConfiguration: ""' which causes Angular CLI to fail - Empty string is invalid, Angular CLI expects non-empty configuration name - Base build options already have development-friendly defaults (sourceMap: true, optimization: false) - Angular CLI will use base configuration when no specific configuration is specified Fixes error: 'Configuration "" could not be found for project' Signed-off-by: ahmedomosanya <[email protected]>

amolsontakke3576

LGTM just make sure its run properly.

ahmedomosanya added 2 commits July 24, 2025 08:26

feat: add cookie consent attribute to LFX footer

60b4b60

Signed-off-by: ahmedomosanya <[email protected]>

ahmedomosanya had a problem deploying to dev July 24, 2025 08:27 — with GitHub Actions Failure

ahmedomosanya temporarily deployed to dev July 24, 2025 08:27 — with GitHub Actions Inactive

ahmedomosanya had a problem deploying to dev July 24, 2025 08:32 — with GitHub Actions Failure

ahmedomosanya temporarily deployed to dev July 24, 2025 08:32 — with GitHub Actions Inactive

coderabbitai bot reviewed Jul 24, 2025

View reviewed changes

.npmrc Outdated Show resolved Hide resolved

angular.json Show resolved Hide resolved

angular.json Outdated Show resolved Hide resolved

package.json Outdated Show resolved Hide resolved

package.json Show resolved Hide resolved

src/app/app.component.html Show resolved Hide resolved

ahmedomosanya had a problem deploying to dev July 24, 2025 08:36 — with GitHub Actions Failure

fix: update Node.js engine requirement to >=18.0.0 for AWS SDK v3 com…

a9de464

…patibility Signed-off-by: ahmedomosanya <[email protected]>

ahmedomosanya force-pushed the feature-cookie-consent branch from 87bf67c to a9de464 Compare July 24, 2025 08:41

ahmedomosanya had a problem deploying to dev July 24, 2025 08:41 — with GitHub Actions Failure

ahmedomosanya temporarily deployed to dev July 24, 2025 08:41 — with GitHub Actions Inactive

ahmedomosanya had a problem deploying to dev July 24, 2025 08:41 — with GitHub Actions Failure

fix: update GitHub Actions workflows to use Node.js 18 for AWS SDK v3…

97337a6

… compatibility Signed-off-by: ahmedomosanya <[email protected]>

ahmedomosanya had a problem deploying to dev July 24, 2025 08:55 — with GitHub Actions Failure

ahmedomosanya temporarily deployed to dev July 24, 2025 08:55 — with GitHub Actions Inactive

ahmedomosanya had a problem deploying to dev July 24, 2025 08:55 — with GitHub Actions Failure

fix: update remaining GitHub Actions workflows to use Node.js 18

257fcb7

Signed-off-by: ahmedomosanya <[email protected]>

ahmedomosanya had a problem deploying to dev July 24, 2025 09:04 — with GitHub Actions Failure

ahmedomosanya temporarily deployed to dev July 24, 2025 09:21 — with GitHub Actions Inactive

ahmedomosanya temporarily deployed to dev July 24, 2025 09:34 — with GitHub Actions Inactive

fix: resolve Cypress test vulnerabilities in test/functional directory

eb763fd

- Add security resolutions to test/functional/package.json - Fix @cypress/request, form-data, braces, micromatch, cross-spawn, brace-expansion Signed-off-by: ahmedomosanya <[email protected]>

ahmedomosanya temporarily deployed to dev July 24, 2025 09:45 — with GitHub Actions Inactive

ahmedomosanya requested a review from amolsontakke3576 July 24, 2025 10:03

ahmedomosanya added 3 commits July 24, 2025 11:31

chore: remove unnecessary .npmrc file

6ec33a4

Signed-off-by: ahmedomosanya <[email protected]>

ahmedomosanya temporarily deployed to dev July 24, 2025 10:58 — with GitHub Actions Inactive

ahmedomosanya requested review from lukaszgryglicki and thakurveerendras July 24, 2025 11:01

ahmedomosanya self-assigned this Jul 24, 2025

ahmedomosanya requested a review from csavulalfx July 24, 2025 11:23

amolsontakke3576 approved these changes Jul 24, 2025

View reviewed changes

ahmedomosanya merged commit 42aff30 into main Jul 25, 2025
11 checks passed

ahmedomosanya deleted the feature-cookie-consent branch August 1, 2025 10:44

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Add Cookie Consent attribute to LFX Footer #457

Add Cookie Consent attribute to LFX Footer #457

Uh oh!

ahmedomosanya commented Jul 24, 2025 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Jul 24, 2025 •

edited

Loading

Chat

Support

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (`.coderabbit.yaml`)

Documentation and Community

Uh oh!

coderabbitai bot left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

amolsontakke3576 left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Add Cookie Consent attribute to LFX Footer #457

Add Cookie Consent attribute to LFX Footer #457

Uh oh!

Conversation

ahmedomosanya commented Jul 24, 2025 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

Possibly related issues

Poem

Chat

Support

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (.coderabbit.yaml)

Documentation and Community

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

amolsontakke3576 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

ahmedomosanya commented Jul 24, 2025 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Jul 24, 2025 •

edited

Loading

CodeRabbit Configuration File (`.coderabbit.yaml`)