feat(components, app): add InlineNotification component for instrument/module card

[ahiuchingau]

Overview

1. Replace the old update banner in module cards to use InlineNotification component
2. Replace "module calibration" -> "module setup" in various copies
3. Update instrument card to match the modules

Test Plan

• A $\color{Red}{\textsf{red}}$ Module setup required banner should show when a module needs calibration (FLEX only)
• A $\color{Yellow}{\textsf{yellow}}$ Setup module for use banner should show when either a fresh (not yet in deck config) Flex Stacker or Absorbance Plate Reader is attached
• The two banners mentioned above should both launch the Module Setup flow when the setup module link is clicked
• A $\color{Yellow}{\textsf{yellow}}$ Firmware update available should show only when a setup flow is not required
• Update now link should update the module firmware without launching a flow

[codecov]

Codecov Report

Attention: Patch coverage is 0% with 183 lines in your changes missing coverage. Please review.

Project coverage is 57.79%. Comparing base (679bb46) to head (85f0108).
Report is 4 commits behind head on edge.

Files with missing lines	Patch %	Lines
app/src/molecules/InstrumentCard/index.tsx	0.00%	60 Missing ⚠️
app/src/molecules/UpdateBanner/index.tsx	0.00%	50 Missing ⚠️
app/src/organisms/ModuleCard/index.tsx	0.00%	35 Missing ⚠️
...rc/organisms/Desktop/Devices/GripperCard/index.tsx	0.00%	13 Missing ⚠️
...ms/Desktop/Devices/PipetteCard/FlexPipetteCard.tsx	0.00%	13 Missing ⚠️
components/src/atoms/InlineNotification/index.tsx	0.00%	11 Missing ⚠️
...pp/src/organisms/ModuleCard/ModuleOverflowMenu.tsx	0.00%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             edge   #18371      +/-   ##
==========================================
- Coverage   57.85%   57.79%   -0.07%     
==========================================
  Files        3252     3252              
  Lines      276196   276158      -38     
  Branches    32255    32194      -61     
==========================================
- Hits       159799   159595     -204     
- Misses     116204   116370     +166     
  Partials      193      193              

Flag	Coverage Δ
protocol-designer	19.22% <0.00%> (+<0.01%)	⬆️
step-generation	4.82% <0.00%> (-0.01%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines	Coverage Δ
components/src/instrument/InstrumentDiagram.tsx	55.55% <ø> (-2.34%)	⬇️
...pp/src/organisms/ModuleCard/ModuleOverflowMenu.tsx	87.50% <0.00%> (-0.69%)	⬇️
components/src/atoms/InlineNotification/index.tsx	74.61% <0.00%> (-8.07%)	⬇️
...rc/organisms/Desktop/Devices/GripperCard/index.tsx	71.97% <0.00%> (-8.48%)	⬇️
...ms/Desktop/Devices/PipetteCard/FlexPipetteCard.tsx	72.98% <0.00%> (-5.74%)	⬇️
app/src/organisms/ModuleCard/index.tsx	55.06% <0.00%> (-6.34%)	⬇️
app/src/molecules/UpdateBanner/index.tsx	30.55% <0.00%> (-69.45%)	⬇️
app/src/molecules/InstrumentCard/index.tsx	32.67% <0.00%> (-54.07%)	⬇️

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[koji]

@ahiuchingau @smb2268 cc: @jerader
According to Felix, the link Alice posted was deprecated. (unfortunately, the primary design link hasn't been updated)
the latest design is here.

[vegano1]

Looks good on my end, tested with flex

[smb2268]

It seems like this was meant to rotate the pipette image to the proper orientation - is this not needed?

[ahiuchingau]

This property has been overwritten by other transform props that get passed down to InsturmentDiagram so the images actually never get flipped – so i removed it

[smb2268]

TY