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

refactor(app): heater-shaker in app design changes #10366

Merged
merged 5 commits into from
May 24, 2022

Conversation

jerader
Copy link
Collaborator

@jerader jerader commented May 19, 2022

closes #9530 #9779

Overview

This PR makes various UI changes to the H-S set up wizard and the modals to match figma.

Screen Shot 2022-05-23 at 3 11 07 PM

Screen Shot 2022-05-23 at 3 11 21 PM

Screen Shot 2022-05-23 at 3 11 42 PM

Changelog

  • touched various H-S components in the wizard and modals
  • updated a few images to match designs
  • created a test for Heater-Shaker Module Card

Review requests

Go through the H-S setup wizard both with a protocol uploaded and with a protocol not uploaded. Do the pages match the designs?

Open the H-S shaker slideout and send a shaking command, a modal should pop up - Does the H-S confirm attachment modal match designs?

Risk assessment

low, behind ff and h-s

@jerader jerader requested a review from a team as a code owner May 19, 2022 20:27
@jerader jerader requested review from shlokamin, sakibh and howisthisnamenottakenyet and removed request for a team and shlokamin May 19, 2022 20:27
@codecov
Copy link

codecov bot commented May 19, 2022

Codecov Report

Merging #10366 (86b3de4) into edge (3686c14) will decrease coverage by 0.00%.
The diff coverage is 60.00%.

Impacted file tree graph

@@            Coverage Diff             @@
##             edge   #10366      +/-   ##
==========================================
- Coverage   73.98%   73.98%   -0.01%     
==========================================
  Files        2133     2133              
  Lines       56900    56917      +17     
  Branches     5751     5762      +11     
==========================================
+ Hits        42097    42109      +12     
- Misses      13602    13603       +1     
- Partials     1201     1205       +4     
Flag Coverage Δ
app 71.29% <60.00%> (-0.01%) ⬇️
components 52.79% <ø> (ø)
labware-library 49.74% <ø> (ø)
protocol-designer 45.13% <ø> (ø)

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

Impacted Files Coverage Δ
...nisms/Devices/HeaterShakerWizard/AttachAdapter.tsx 100.00% <ø> (ø)
...anisms/Devices/HeaterShakerWizard/AttachModule.tsx 100.00% <ø> (ø)
...ices/HeaterShakerWizard/HeaterShakerModuleCard.tsx 83.33% <ø> (+66.66%) ⬆️
...anisms/Devices/HeaterShakerWizard/Introduction.tsx 96.55% <ø> (ø)
.../organisms/Devices/HeaterShakerWizard/KeyParts.tsx 100.00% <ø> (ø)
...organisms/Devices/HeaterShakerWizard/TestShake.tsx 82.14% <ø> (-0.62%) ⬇️
...isms/Devices/ModuleCard/ConfirmAttachmentModal.tsx 78.94% <ø> (ø)
app/src/organisms/Devices/ModuleCard/index.tsx 73.19% <ø> (+6.21%) ⬆️
components/src/icons/icon-data.ts 100.00% <ø> (ø)
...src/organisms/Devices/HeaterShakerWizard/index.tsx 82.22% <50.00%> (-3.15%) ⬇️
... and 5 more

Copy link
Contributor

@sakibh sakibh left a comment

Choose a reason for hiding this comment

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

Awesome work! Looks good to me. Thanks for adding test coverage for HeaterShakerModuleCard. Just a few small things below not introduced in this PR.

  • In the Introduction component of the heater shaker wizard, the third item shows the display name as Heater-Shaker Module. It should be Heater-Shaker Module GEN1. We can also use getModuleDisplayName just like in the HeaterShakerModuleCard component might have to expose the module model as a prop.
  • In the AttachModule component, for the second item it looks like counterclockwise is one word not two, completely my fault.

@jerader jerader force-pushed the app_hs-wizard-copy-pass-1 branch from 8a5da9e to 3ae9be8 Compare May 23, 2022 13:53
Copy link
Contributor

@howisthisnamenottakenyet howisthisnamenottakenyet left a comment

Choose a reason for hiding this comment

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

A couple more copy changes, an svg flip, a question about image quality, and some button interactivity. Took screenshots and added comments here. https://www.figma.com/file/695ogls23YsQYImRcGYDE1/Heater-Shaker?node-id=4727%3A92660

Copy link
Contributor

@howisthisnamenottakenyet howisthisnamenottakenyet left a comment

Choose a reason for hiding this comment

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

Looks good!

@jerader jerader merged commit 64e800f into edge May 24, 2022
@jerader jerader deleted the app_hs-wizard-copy-pass-1 branch May 24, 2022 15:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

H/S in App Final Copy Pass
3 participants