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.

Sign up for GitHub

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

Jump to bottom

[DTRA-V2] fix: change actionsheet content #16765

Merged
merged 2 commits into from
Sep 12, 2024
Merged

[DTRA-V2] fix: change actionsheet content #16765

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
37317ee
fix: change actionsheet content
henry-deriv Sep 9, 2024
acf2fde
fix: failing test
henry-deriv Sep 9, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 11 additions & 6 deletions packages/trader/src/AppV2/Components/TradeParameters/Barrier/barrier-description.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,33 +6,38 @@ const BarrierDescription = ({ isDays }: { isDays: boolean }) => {
return (
<ActionSheet.Content className='barrier-params__description-content'>
{isDays ? (
<Text>
<Localize i18n_default_text='The barrier will be fixed at the set price.' />
</Text>
<div className='content-section'>
<Text bold>
<Localize i18n_default_text='Fixed price:' />
</Text>
<Text>
<Localize i18n_default_text='Barrier set at specific price.' />
</Text>
</div>
) : (
<>
<div className='content-section'>
<Text bold>
<Localize i18n_default_text='Above spot:' />
</Text>
<Text>
<Localize i18n_default_text='The barrier will move relative to the current spot, maintaining a set distance above it.' />
<Localize i18n_default_text='Barrier set above spot price.' />
</Text>
</div>
<div className='content-section'>
<Text bold>
<Localize i18n_default_text='Below spot:' />
</Text>
<Text>
<Localize i18n_default_text='The barrier will move relative to the current spot, maintaining a set distance below it.' />
<Localize i18n_default_text='Barrier set below spot price.' />
</Text>
</div>
<div className='content-section'>
<Text bold>
<Localize i18n_default_text='Fixed price:' />
</Text>
<Text>
<Localize i18n_default_text='The barrier will be fixed at the set price.' />
<Localize i18n_default_text='Barrier set at specific price.' />
</Text>
</div>
</>
Expand Down
7 changes: 5 additions & 2 deletions packages/trader/src/AppV2/Components/TradeParameters/Barrier/barrier.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,12 @@
}
}
&-content {
padding: var(--core-spacing-1200);
padding: 0 var(--core-spacing-800);
.content-section {
margin-bottom: var(--core-spacing-400);
margin-bottom: var(--core-spacing-800);
display: flex;
flex-direction: column;
gap: var(--core-spacing-400);
}
}
}
Expand Down
8 changes: 7 additions & 1 deletion packages/trader/src/AppV2/Components/TradeParameters/Multiplier/multiplier.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,13 @@ const Multiplier = observer(({ is_minimized }: TMultiplierProps) => {
},
{
id: 2,
component: <TradeParamDefinition description={<Localize i18n_default_text='Content goes here' />} />,
component: (
<TradeParamDefinition
description={
<Localize i18n_default_text='Multipliers amplify your potential profit if the market moves in your favour, with losses limited to your initial capital.' />
}
/>
),
},
];

Expand Down
1 change: 0 additions & 1 deletion packages/trader/src/AppV2/Components/TradeParameters/Strike/__tests__/strike.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,6 @@ describe('Strike', () => {
expect(screen.getByText('Payout per point:')).toBeInTheDocument();
expect(screen.getByText(/14.245555/)).toBeInTheDocument();
expect(screen.getByText('Save')).toBeInTheDocument();
expect(screen.getByText('Content goes here.')).toBeInTheDocument();
});

it('should not render Payout per point information if proposal_info is empty object', () => {
Expand Down
20 changes: 19 additions & 1 deletion packages/trader/src/AppV2/Components/TradeParameters/Strike/strike.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,25 @@ const Strike = observer(({ is_minimized }: TStrikeProps) => {
},
{
id: 2,
component: <TradeParamDefinition description={<Localize i18n_default_text='Content goes here.' />} />,
component: (
<TradeParamDefinition
description={
<>
<p>
<Localize i18n_default_text='It is the price where you can start receiving a payout from an option.' />
</p>
<br />
Copy link
Contributor

Choose a reason for hiding this comment

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

May we avoid using <br/>? You can always add a className to <p>

Copy link
Contributor Author

Choose a reason for hiding this comment

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

why?

Copy link
Contributor

Choose a reason for hiding this comment

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

We are adding styles not by using tags, but by applying classes + <br/> is not semantic (only if you're writing poetry).
Not critical, but up to you

<p>
<Localize i18n_default_text='For a Call option, you receive a payout if the final price is higher than the strike price.' />
</p>
<br />
<p>
<Localize i18n_default_text='For a Put option, you receive a payout if the final price is lower than the strike price.' />
</p>
</>
}
/>
),
},
];
const classname = clsx('trade-params__option', is_minimized && 'trade-params__option--minimized');
Expand Down
Loading