Skip to content

feat: add navigation links to make footer consistent #13

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ahmed-arb merged 17 commits into from
Aug 29, 2025
Merged

feat: add navigation links to make footer consistent #13

Show file tree
Hide file tree
Changes from 10 commits
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
4e083fd
fix: made footer consistent where using custom footer
May 27, 2025
84988dc
fix: added LMS footer navlinks
May 29, 2025
8393f68
fix: linting error fixed and removed unecessary vars
Jun 6, 2025
eb2cf3d
fix: code refactoring
Jun 6, 2025
0ce52e3
fix: code refactoring
Jun 6, 2025
d6f6833
fix: code clean
Jun 6, 2025
b764c82
fix: snapshot updated
Jun 10, 2025
40fb466
Merge branch 'teak/indigo' into zubair/TIA-137-61
zubairshakoorarbisoft Jun 10, 2025
973e1b8
fix: redundant images removed after conflict resolution
Jun 10, 2025
e3ed25f
fix: conflict resolved and snapshot updated
Jun 10, 2025
a8ee834
fix: updated footer links according legacy pages
Jun 18, 2025
fe2cf7a
fix: code ckean
Jun 18, 2025
a339ec0
fix: code clean
Jun 18, 2025
c14be31
fix: code clean
Jun 18, 2025
c5d04cb
fix: lint errors fixed
Jun 18, 2025
4f6b37d
fix: fixed typo
Jun 19, 2025
4e78bcc
test: update the test coverage for the footer nav
arbirali Jun 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 23 additions & 5 deletions src/components/Footer.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,13 +70,31 @@ class SiteFooter extends React.Component {
</li>
</ul>
</div>

<nav className="nav-colophon" aria-label="About">
Comment thread
ahmed-arb marked this conversation as resolved.
Outdated
<ol>
<li><a href={`${config.LMS_BASE_URL}/about`}>About Us</a></li>
<li><a href={`${config.LMS_BASE_URL}/blog`}>Blog</a></li>
<li><a href={`${config.LMS_BASE_URL}/donate`}>Donate</a></li>
<li><a href={`${config.LMS_BASE_URL}/tos`}>Terms of Service</a></li>
<li><a href={`${config.LMS_BASE_URL}/privacy`}>Privacy Policy</a></li>
<li><a href={`${config.LMS_BASE_URL}/help`}>Help</a></li>
<li><a href={`${config.LMS_BASE_URL}/contact`}>Contact Us</a></li>
</ol>
</nav>
Copy link
Copy Markdown

@DawoudSheraz DawoudSheraz Jun 11, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This will cause some conflicting behavior across legacy and MFE pages. In tutor-indigo, footer links on legacy pages can be toggled (https://github.com/overhangio/tutor-indigo/blob/release/tutorindigo/templates/indigo/lms/templates/footer.html). In here, the links will show all the times. The behavior needs to be consistent.

</div>
<span className="copyright-site">{intl.formatMessage(messages['footer.copyright.text'])}</span>

<span className="copyright-site">
{intl.formatMessage(messages['footer.copyright.text'])}
</span>

{showLanguageSelector && (
<LanguageSelector
options={supportedLanguages}
onSubmit={onLanguageSelected}
/>
<div className="language-selector-footer">
<LanguageSelector
options={supportedLanguages}
onSubmit={onLanguageSelected}
/>
</div>
)}
</footer>
</div>
Expand Down
240 changes: 206 additions & 34 deletions src/components/__snapshots__/Footer.test.jsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,51 +48,111 @@ exports[`<Footer /> renders correctly renders with a language selector 1`] = `
</li>
</ul>
</div>
<nav
aria-label="About"
className="nav-colophon"
>
<ol>
<li>
<a
href="http://localhost:18000/about"
>
About Us
</a>
</li>
<li>
<a
href="http://localhost:18000/blog"
>
Blog
</a>
</li>
<li>
<a
href="http://localhost:18000/donate"
>
Donate
</a>
</li>
<li>
<a
href="http://localhost:18000/tos"
>
Terms of Service
</a>
</li>
<li>
<a
href="http://localhost:18000/privacy"
>
Privacy Policy
</a>
</li>
<li>
<a
href="http://localhost:18000/help"
>
Help
</a>
</li>
<li>
<a
href="http://localhost:18000/contact"
>
Contact Us
</a>
</li>
</ol>
</nav>
</div>
<span
className="copyright-site"
>
Copyrights ©2025. All Rights Reserved.
</span>
<form
className="form-inline"
onSubmit={[Function]}
<div
className="language-selector-footer"
>
<div
className="form-group"
<form
className="form-inline"
onSubmit={[Function]}
>
<label
className="d-inline-block m-0"
htmlFor="site-footer-language-select"
<div
className="form-group"
>
Choose Language
</label>
<select
className="form-control-sm mx-2"
defaultValue="en"
id="site-footer-language-select"
name="site-footer-language-select"
>
<option
value="en"
<label
className="d-inline-block m-0"
htmlFor="site-footer-language-select"
>
English
</option>
<option
value="es"
Choose Language
</label>
<select
className="form-control-sm mx-2"
defaultValue="en"
id="site-footer-language-select"
name="site-footer-language-select"
>
Español
</option>
</select>
<button
className="btn btn-outline-primary btn-sm"
data-testid="site-footer-submit-btn"
type="submit"
>
Apply
</button>
</div>
</form>
<option
value="en"
>
English
</option>
<option
value="es"
>
Español
</option>
</select>
<button
className="btn btn-outline-primary btn-sm"
data-testid="site-footer-submit-btn"
type="submit"
>
Apply
</button>
</div>
</form>
</div>
</footer>
</div>
`;
Expand Down Expand Up @@ -145,6 +205,62 @@ exports[`<Footer /> renders correctly renders without a language selector 1`] =
</li>
</ul>
</div>
<nav
aria-label="About"
className="nav-colophon"
>
<ol>
<li>
<a
href="http://localhost:18000/about"
>
About Us
</a>
</li>
<li>
<a
href="http://localhost:18000/blog"
>
Blog
</a>
</li>
<li>
<a
href="http://localhost:18000/donate"
>
Donate
</a>
</li>
<li>
<a
href="http://localhost:18000/tos"
>
Terms of Service
</a>
</li>
<li>
<a
href="http://localhost:18000/privacy"
>
Privacy Policy
</a>
</li>
<li>
<a
href="http://localhost:18000/help"
>
Help
</a>
</li>
<li>
<a
href="http://localhost:18000/contact"
>
Contact Us
</a>
</li>
</ol>
</nav>
</div>
<span
className="copyright-site"
Expand Down Expand Up @@ -203,6 +319,62 @@ exports[`<Footer /> renders correctly renders without a language selector in es
</li>
</ul>
</div>
<nav
aria-label="About"
className="nav-colophon"
>
<ol>
<li>
<a
href="http://localhost:18000/about"
>
About Us
</a>
</li>
<li>
<a
href="http://localhost:18000/blog"
>
Blog
</a>
</li>
<li>
<a
href="http://localhost:18000/donate"
>
Donate
</a>
</li>
<li>
<a
href="http://localhost:18000/tos"
>
Terms of Service
</a>
</li>
<li>
<a
href="http://localhost:18000/privacy"
>
Privacy Policy
</a>
</li>
<li>
<a
href="http://localhost:18000/help"
>
Help
</a>
</li>
<li>
<a
href="http://localhost:18000/contact"
>
Contact Us
</a>
</li>
</ol>
</nav>
</div>
<span
className="copyright-site"
Expand Down