ER: Refactor Modal From Project and Wins Page

[dvernon5]

Emergent Requirement - Problem

Redundant code for a modal/overlay on project and wins pages.

Issue you discovered this emergent requirement in

• Add Search Tips Feature to Projects Page #7866

Date discovered

03/25/25

Did you have to do something temporarily

• YES
• NO

Who was involved

@dvernon5
@daras-cu
@gmgonzal

What happens if this is not addressed

There will be redundant code, and the modal will not be able to be reused easily in the future.

Resources

Example of modal: Projects Page select "Search Tips" link
Potential approach: #7866 (comment)
Additional Information: #7866 (comment)

Recommended Action Items

• Make a new issue(s)
• Discuss with team
• Let a Team Lead know

Potential solutions [draft]

Create two issues:
Issue 1: Factor out the modal from the project page.

• Create a separate JavaScript and CSS file for a modal with generic function and class names.
• Edit current-projects.html and search-tip-modal.html to replace the previous page-specific modal elements with those imported from the newly created files.
• (May also consider hard-coding the modal content in search-tip-modal.html as this does not need to be dynamically generated)

Issue 2: Refactor wins page to use the new modal CSS and JavaScript files, maintaining the mobile-specific functionality.

[github-actions]

Hi @dvernon5.

Please don't forget to add the proper labels to this issue. Currently, the labels for the following are missing:

• Complexity, Role, Feature

NOTE: Please ignore this comment if you do not have 'write' access to this directory.

To add a label, take a look at Github's documentation here.

Also, don't forget to remove the "missing labels" afterwards.
To remove a label, the process is similar to adding a label, but you select a currently added label to remove it.

After the proper labels are added, the merge team will review the issue and add a "Ready for Prioritization" label once it is ready for prioritization.

Additional Resources:

• Wiki: How to create issues
• Wiki: How to read and interpret labels