Feature - #3676 - Status badges with chips and mouse over

[richmahn]

Describe what your pull request addresses (Please include relevant issue numbers):

• Addresses first task of epic Filter for the side menu #1998 - showing multiple status badges for invalidation (still waiting on its implementation in Invalidated Checks #3086 but doesn't block this PR), reminders, verse edits, selections and comments.

Please include detailed Test instructions for your pull request:

NOTE: This does NOT have the filter menu at the top like you see in the images in #1998. It should however have the icons next to the Bible references like you see in those images, minus the ability to see invalidated verses.

• Check out this branch, feature-richmahn-3676 in your main tC repo
• Run npm i && npm run update-apps in tC root directory
• Run the app, load a project
• For tW, in the left sidebar, you should see no badge, one badge, or a badge with a chip with 2 - 5 (5 if invalidation is implemented [Invalidated Checks #3086], 4 if not). So try bookmarking the active verse, making a comment, selecting text, and editing the verse.
• For wA, when the word bank is empty, a check box should appear. This is how it used to behave, but it also uses the new status badge implementation to make it happen, so test it.
• Note that in tW, because there was already a tool tip to show the full selected text when you hover over the Bible reference in the left sidebar, I had to separate the tool tip for the status badge and the tool tip for the Bible reference/selected text. They both use the new 3rd party react-tooltip now. Please check for any oddities. The tool tip SHOULD change position (float right instead of bottom) if there isn't room below to show the whole tool tip. This is expected.

Standard Test Instructions for PR Review Process:

• Double check unit tests that have been written
• Check for documentation for code changes
• Check that there are not inadvertent commits to tC Apps when reviewing a tC Core PR
• Checkout the branch locally and ensure that app runs as expected
  • Ensure tests pass
  • Open and watch the console for errors
  • Make sure all actions perform as expected
  • Import and Load a new Project
  • Load a tool and perform basic actions
  • Switch tools and perform basic actions
  • Switch project to an existing project
  • Load a tool and perform basic actions
  • Switch tools and perform basic actions
  • Next time reverse the order of importing after loading an existing project
• Reviewer should double check the DoD in the ISSUE, including the “spirit” of the story
• Ask Ben or Koz if you have any concerns about implementation (especially UI related)

---

This change is 

[codecov]

Codecov Report

Merging #4260 into sandbox-feature-richmahn-1998 will increase coverage by 0.34%.
The diff coverage is 100%.

@@                        Coverage Diff                        @@
##           sandbox-feature-richmahn-1998    #4260      +/-   ##
=================================================================
+ Coverage                          57.73%   58.08%   +0.34%     
=================================================================
  Files                                248      249       +1     
  Lines                               6869     6883      +14     
  Branches                            1126     1130       +4     
=================================================================
+ Hits                                3966     3998      +32     
+ Misses                              2497     2483      -14     
+ Partials                             406      402       -4

Impacted Files	Coverage Δ
src/js/components/groupMenu/Style.js	100% <ø> (ø)	⬆️
src/js/localStorage/saveMethods.js	0% <ø> (ø)	⬆️
src/js/components/groupMenu/Group.js	100% <ø> (+85.71%)	⬆️
src/js/helpers/statusBadgeHelpers.js	100% <100%> (ø)
src/js/containers/GroupMenuContainer.js	83% <100%> (+3.95%)	⬆️
src/js/components/groupMenu/GroupItem.js	60% <100%> (+46.66%)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 9e4e83b...7532881. Read the comment docs.