Skip to content
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.

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

feature (ui): Add an MMDL Notification Banner on Mako Homepage #925

Merged
merged 24 commits into from
Dec 31, 2024

Conversation

RanyeM
Copy link
Collaborator

@RanyeM RanyeM commented Dec 12, 2024

🎫 Linked Ticket

https://jiraent.cms.gov/projects/OY2/issues/OY2-30885?filter=myopenissues

💬 Description / Notes

A notification banner is created in the Mako application that highlights the new MMDL feature.
The banner should appear only the first time the user accesses Mako after the MMDL feature has been added.
The banner should be dismissible by the user, with a clear and accessible option to close the banner.
Ensure that the banner does not reappear once dismissed by the user, even after subsequent logins.
The design and placement of the banner should align with the existing UI/UX standards of the Mako application.
The “Go to FAQs” button should take you to the section on the FAQ page where the MMDL links are located. The dropdown list should be expanded by default.

🛠 Changes

A notification banner was created in the Mako application to highlight the new MMDL feature.
The banner appears only the first time the user accesses Mako after adding the MMDL feature.
The banner can be dismissible by the user, with a clear and accessible option to close the banner.
banner does not reappear once dismissed by the user, even after subsequent logins.
The design and placement of the banner align with the existing UI/UX standards of the Mako application.
The “Go to FAQs” button takes you to the FAQ page section where the MMDL links are located.

@RanyeM RanyeM self-assigned this Dec 12, 2024
Copy link
Contributor

github-actions bot commented Dec 12, 2024

Coverage Report

Status Category Percentage Covered / Total
🔵 Lines 75.15% 6484 / 8627
🔵 Statements 74.38% 6809 / 9154
🔵 Functions 69.7% 1958 / 2809
🔵 Branches 42.58% 1218 / 2860
File Coverage
File Stmts Branches Functions Lines Uncovered Lines
Changed Files
react-app/src/components/Banner/MMDLSpaBanner.tsx 66.66% 50% 50% 80% 7, 9
react-app/src/components/Layout/index.test.tsx 100% 70% 97.91% 100%
react-app/src/components/Layout/index.tsx 93.02% 94.44% 100% 95% 82, 254-255
Generated in workflow #1262 for commit 84bafe3 by the Vitest Coverage Report Action

@charmcitygavin
Copy link
Collaborator

@RanyeM: It looks like there's a docs directory that got included in this PR. I don't see this directory on main currently. Could it have been merged in by mistake? I'm not sure where it comes from but I'm assuming it's not related to the banner work.

Copy link
Collaborator

@charmcitygavin charmcitygavin left a comment

Choose a reason for hiding this comment

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

The banner looks great! Awesome work. 🎉 The only questions I have are about that stray docs dir and banner persistence.

react-app/src/components/Banner/MMDLSpaBanner.tsx Outdated Show resolved Hide resolved
docs/Gemfile.lock Outdated Show resolved Hide resolved
react-app/src/components/Layout/index.tsx Outdated Show resolved Hide resolved
@RanyeM RanyeM temporarily deployed to add-mmdl-banner December 12, 2024 19:15 — with GitHub Actions Inactive
@RanyeM RanyeM temporarily deployed to add-mmdl-banner December 12, 2024 19:17 — with GitHub Actions Inactive
@RanyeM RanyeM temporarily deployed to add-mmdl-banner-kibana December 12, 2024 19:17 — with GitHub Actions Inactive
@RanyeM RanyeM temporarily deployed to add-mmdl-banner-app December 12, 2024 19:17 — with GitHub Actions Inactive
@charmcitygavin charmcitygavin merged commit b1382ce into main Dec 31, 2024
13 of 15 checks passed
@charmcitygavin charmcitygavin deleted the add-mmdl-banner branch December 31, 2024 19:59
benjaminpaige pushed a commit that referenced this pull request Jan 2, 2025
* feature: merged with main

* feature: added mmdl banner based on if user is signed in

* fix: removed docs

* fix: faq pops out into another tab and formatted code

* fix: PR comments

* fix: removed localstorage

* fix: updated changes and removed svg

* fix: updated changes and removed svg

* Improve button text vertical spacing

* Replace missing bun.lockb file

* Make tests more specific

* Don't display banner on FAQ page

* Resolve a11y errors by using a landmark wrapper

* Prevent mobile menu from overlapping alert banner

* Ensure there's no gap between mobile menu and edge

* Clean up mobile menu layout

---------

Co-authored-by: Gavin St. Ours <[email protected]>
Copy link
Contributor

github-actions bot commented Jan 2, 2025

🎉 This PR is included in version 1.5.0-val.100 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants