chore(angular-react): Migrate Footer component to React

[devin-ai-integration]

Summary

Migrates the Angular FooterComponent to a stateless React functional component.

Angular source files (unchanged):

• src/app/core/footer/footer.component.ts
• src/app/core/footer/footer.component.html
• src/app/core/footer/footer.component.scss

New React files:

• src/components/Footer/Footer.tsx — stateless React.FC with the same markup
• src/components/Footer/Footer.module.css — CSS module with camelCase class names, SCSS variables inlined ($mobile-only → only screen and (max-width: 768px))

This is a 1:1 migration of a purely presentational leaf component with no props, state, lifecycle logic, or dependencies on other app files.

Review & Testing Checklist for Human

• Verify the JSX output matches the original Angular template HTML structure and content
• Verify the CSS module faithfully reproduces all SCSS styles with the $mobile-only media query inlined
• Confirm no Angular source files were modified or removed

Notes

• The Angular project does not currently have React configured, so this component cannot be rendered in the existing app yet. It is ready to be wired up once a React runtime is added to the build.
• No new dependencies were introduced.
• rel="noopener noreferrer" was used (React best practice for target="_blank" links), matching the original rel="noopener".

Link to Devin session: https://app.devin.ai/sessions/d32aa181aafc44ddbd0e3b28ea5916ca
Requested by: @charityquinn-cognition

---

Devin Review

Status	Commit
⚪ Not started	—

Run Devin Review

💡 Connect your GitHub account to enable automatic code reviews.

---

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment and CI monitoring

[devin-ai-integration]

Devin Review found 1 potential issue.

View 2 additional findings in Devin Review.

[devin-ai-integration]

🔴 React component added to an Angular project — will not compile or function

The new Footer.tsx is a React component (imports React, uses React.FC, JSX syntax) added to a project that is entirely Angular 9. The project has no React dependency in package.json:13-28, uses Angular CLI (angular.json), and all existing components follow Angular conventions (e.g., src/app/core/footer/footer.component.ts). This component cannot be compiled by the Angular build toolchain, and even if it could, Angular has no mechanism to render a React.FC component. The project already has a working Angular footer component at src/app/core/footer/footer.component.ts that is used in src/app/app.component.html:6 as <app-footer>. This new component is entirely non-functional dead code.

Prompt for agents

The Footer component was written using React (React.FC, JSX) but this is an Angular 9 project. It needs to be rewritten as an Angular component following the existing patterns in this codebase. Look at src/app/core/footer/footer.component.ts, src/app/core/footer/footer.component.html, and src/app/core/footer/footer.component.scss for the existing footer implementation. If the intent is to modify the existing footer, those files should be edited directly. If the intent is to create a new separate component, it should follow the Angular @Component decorator pattern with a selector, templateUrl, and styleUrls, and should be placed under src/app/ following the existing directory structure. The CSS file should also be converted from CSS Modules format (.module.css) to Angular component SCSS (.component.scss) using the existing SCSS conventions (imports from shared/scss, nesting syntax).

---

Was this helpful? React with 👍 or 👎 to provide feedback.

[devin-ai-integration]

This is an intentional Angular-to-React migration as requested. The React component is the migration target — the Angular source files are deliberately left unchanged per the playbook's "Forbidden Actions" (do not remove Angular components). The component will be functional once React is added to the project's build toolchain.