-
Notifications
You must be signed in to change notification settings - Fork 179
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(protocol-designer): magnetic module change hint wire up
closes AUTH-797
- Loading branch information
Showing
6 changed files
with
136 additions
and
40 deletions.
There are no files selected for viewing
38 changes: 38 additions & 0 deletions
38
protocol-designer/src/organisms/BlockingHintModal/__tests__/BlockingHintModal.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
import type * as React from 'react' | ||
import { describe, it, expect, vi, beforeEach } from 'vitest' | ||
import { fireEvent, screen } from '@testing-library/react' | ||
import { i18n } from '../../../assets/localization' | ||
import { renderWithProviders } from '../../../__testing-utils__' | ||
import { BlockingHintModal } from '..' | ||
import { removeHint } from '../../../tutorial/actions' | ||
|
||
vi.mock('../../../tutorial/actions') | ||
|
||
const render = (props: React.ComponentProps<typeof BlockingHintModal>) => { | ||
return renderWithProviders(<BlockingHintModal {...props} />, { | ||
i18nInstance: i18n, | ||
})[0] | ||
} | ||
|
||
describe('BlockingHintModal', () => { | ||
let props: React.ComponentProps<typeof BlockingHintModal> | ||
|
||
beforeEach(() => { | ||
props = { | ||
content: <div>mock content</div>, | ||
handleCancel: vi.fn(), | ||
handleContinue: vi.fn(), | ||
hintKey: 'change_magnet_module_model', | ||
} | ||
}) | ||
it('renders the hint with buttons and checkbox', () => { | ||
render(props) | ||
fireEvent.click(screen.getByRole('button', { name: 'Cancel' })) | ||
expect(props.handleCancel).toHaveBeenCalled() | ||
expect(vi.mocked(removeHint)).toHaveBeenCalled() | ||
fireEvent.click(screen.getByRole('button', { name: 'Continue' })) | ||
expect(props.handleContinue).toHaveBeenCalled() | ||
expect(vi.mocked(removeHint)).toHaveBeenCalled() | ||
screen.getByText('mock content') | ||
}) | ||
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
41 changes: 41 additions & 0 deletions
41
protocol-designer/src/pages/Designer/DeckSetup/MagnetModuleChangeContent.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
import { useTranslation } from 'react-i18next' | ||
import { | ||
DIRECTION_COLUMN, | ||
Flex, | ||
Link, | ||
SPACING, | ||
StyledText, | ||
} from '@opentrons/components' | ||
|
||
export function MagnetModuleChangeContent(): JSX.Element { | ||
const { t } = useTranslation('starting_deck_state') | ||
|
||
return ( | ||
<Flex flexDirection={DIRECTION_COLUMN} gridGap={SPACING.spacing8}> | ||
<StyledText desktopStyle="bodyDefaultRegular"> | ||
{t('gen1_gen2_different_units')} | ||
</StyledText> | ||
<StyledText desktopStyle="bodyDefaultRegular"> | ||
{t('convert_gen1_to_gen2')} | ||
</StyledText> | ||
<StyledText desktopStyle="bodyDefaultRegular"> | ||
{t('convert_gen2_to_gen1')} | ||
</StyledText> | ||
<StyledText desktopStyle="bodyDefaultRegular"> | ||
{t('alter_pause')} | ||
</StyledText> | ||
<Flex> | ||
<StyledText desktopStyle="bodyDefaultRegular"> | ||
{t('read_more_gen1_gen2')}{' '} | ||
<Link | ||
target="_blank" | ||
rel="noopener noreferrer" | ||
href="http://support.opentrons.com/en/articles/1820112-magnetic-module" | ||
> | ||
{t('here')} | ||
</Link> | ||
</StyledText> | ||
</Flex> | ||
</Flex> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
32 changes: 32 additions & 0 deletions
32
protocol-designer/src/pages/Designer/DeckSetup/__tests__/MagnetModuleChangeContent.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
import { describe, it } from 'vitest' | ||
import { screen } from '@testing-library/react' | ||
import { i18n } from '../../../../assets/localization' | ||
import { renderWithProviders } from '../../../../__testing-utils__' | ||
import { MagnetModuleChangeContent } from '../MagnetModuleChangeContent' | ||
|
||
const render = () => { | ||
return renderWithProviders(<MagnetModuleChangeContent />, { | ||
i18nInstance: i18n, | ||
})[0] | ||
} | ||
|
||
describe('MagnetModuleChangeContent', () => { | ||
it('renders the text for the modal content', () => { | ||
render() | ||
screen.getByText( | ||
'Switching between GEN1 and GEN2 Magnetic Modules will clear all non-default engage heights from existing magnet steps in your protocol. GEN1 and GEN2 Magnetic Modules do not use the same units.' | ||
) | ||
screen.getByText( | ||
'To convert engage heights from GEN1 to GEN2, divide your engage height by 2.' | ||
) | ||
screen.getByText( | ||
'To convert engage heights from GEN2 to GEN1, multiply your engage height by 2.' | ||
) | ||
screen.getByText( | ||
'You may also need to alter the time you pause while your magnet is engaged.' | ||
) | ||
screen.getByText( | ||
'Read more about the differences between GEN1 and GEN2 Magnetic Modules' | ||
) | ||
}) | ||
}) |