diff --git a/suite-native/module-trading/src/components/general/PickerCloseButton.tsx b/suite-native/module-trading/src/components/general/PickerCloseButton.tsx
deleted file mode 100644
index 3d2f2a3ca7c2..000000000000
--- a/suite-native/module-trading/src/components/general/PickerCloseButton.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import { useMemo } from 'react';
-
-import { LinearGradient } from 'expo-linear-gradient';
-
-import { hexToRgba } from '@suite-common/suite-utils';
-import { Box, Button, ButtonProps, VStack } from '@suite-native/atoms';
-import { Translation } from '@suite-native/intl';
-import { prepareNativeStyle, useNativeStyles } from '@trezor/styles';
-
-export type PickerCloseButtonProps = Omit<
- ButtonProps,
- 'children' | 'colorScheme' | 'viewLeft' | 'viewRight'
->;
-
-export const PICKER_BUTTON_HEIGHT = 52 as const;
-
-const GRADIENT_START = { x: 0.5, y: 0.5 } as const;
-const GRADIENT_END = { x: 0.5, y: 0 } as const;
-
-const spacerStyle = prepareNativeStyle(({ colors, spacings }) => ({
- backgroundColor: colors.backgroundSurfaceElevation0,
- height: spacings.sp32,
-}));
-
-export const PickerCloseButton = (props: PickerCloseButtonProps) => {
- const {
- utils: {
- colors: { backgroundSurfaceElevation0 },
- },
- applyStyle,
- } = useNativeStyles();
-
- const gradientColors = useMemo<[string, string]>(
- () => [backgroundSurfaceElevation0, hexToRgba(backgroundSurfaceElevation0, 0.1)],
- [backgroundSurfaceElevation0],
- );
-
- return (
-
-
-
-
-
-
-
-
- );
-};
diff --git a/suite-native/module-trading/src/components/general/SheetHeaderTitle.tsx b/suite-native/module-trading/src/components/general/SheetHeaderTitle.tsx
index f4d1eb4a1c3e..276952aee2bf 100644
--- a/suite-native/module-trading/src/components/general/SheetHeaderTitle.tsx
+++ b/suite-native/module-trading/src/components/general/SheetHeaderTitle.tsx
@@ -10,11 +10,13 @@ export type SheetHeaderTitleProps = {
} & RequireAllOrNone<{
onLeftButtonPress: () => void;
leftButtonIcon: IconName;
+ leftButtonA11yLabel: string;
}>;
export const SheetHeaderTitle = ({
onLeftButtonPress,
leftButtonIcon,
+ leftButtonA11yLabel,
children,
}: SheetHeaderTitleProps) => (
@@ -26,7 +28,7 @@ export const SheetHeaderTitle = ({
colorScheme="tertiaryElevation0"
size="medium"
accessibilityRole="button"
- accessibilityLabel="Close"
+ accessibilityLabel={leftButtonA11yLabel}
/>
)}
diff --git a/suite-native/module-trading/src/components/general/TradeableAssetsSheet/TradeableAssetsSheetHeader.tsx b/suite-native/module-trading/src/components/general/TradeableAssetsSheet/TradeableAssetsSheetHeader.tsx
index d3f616fcf316..514808390306 100644
--- a/suite-native/module-trading/src/components/general/TradeableAssetsSheet/TradeableAssetsSheetHeader.tsx
+++ b/suite-native/module-trading/src/components/general/TradeableAssetsSheet/TradeableAssetsSheetHeader.tsx
@@ -2,7 +2,7 @@ import { useState } from 'react';
import Animated, { FadeIn, FadeOut, LinearTransition } from 'react-native-reanimated';
import { BottomSheetGrabber, VStack } from '@suite-native/atoms';
-import { Translation } from '@suite-native/intl';
+import { Translation, useTranslate } from '@suite-native/intl';
import { prepareNativeStyle, useNativeStyles } from '@trezor/styles';
import { SheetHeaderTitle } from '../SheetHeaderTitle';
@@ -24,6 +24,7 @@ const wrapperStyle = prepareNativeStyle<{}>(({ spacings }) => ({
export const TradeableAssetsSheetHeader = ({ onClose }: TradeableAssetsSheetHeaderProps) => {
const { applyStyle } = useNativeStyles();
+ const { translate } = useTranslate();
const [isFilterActive, setIsFilterActive] = useState(false);
const [filterValue, setFilterValue] = useState('');
@@ -37,7 +38,11 @@ export const TradeableAssetsSheetHeader = ({ onClose }: TradeableAssetsSheetHead
entering={FadeIn.duration(FOCUS_ANIMATION_DURATION)}
exiting={FadeOut.duration(FOCUS_ANIMATION_DURATION)}
>
-
+
diff --git a/suite-native/module-trading/src/components/general/TradeableAssetsSheet/__tests__/TradeableAssetsSheetHeader.comp.test.tsx b/suite-native/module-trading/src/components/general/TradeableAssetsSheet/__tests__/TradeableAssetsSheetHeader.comp.test.tsx
index 793d05be4101..b7657f0b86ab 100644
--- a/suite-native/module-trading/src/components/general/TradeableAssetsSheet/__tests__/TradeableAssetsSheetHeader.comp.test.tsx
+++ b/suite-native/module-trading/src/components/general/TradeableAssetsSheet/__tests__/TradeableAssetsSheetHeader.comp.test.tsx
@@ -3,17 +3,18 @@ import { fireEvent, render } from '@suite-native/test-utils';
import { TradeableAssetsSheetHeader } from '../TradeableAssetsSheetHeader';
describe('TradeableAssetsSheetHeader', () => {
+ const renderComponent = (onClose = jest.fn()) =>
+ render();
+
it('should display "Coins" and do not display tabs by default', () => {
- const { getByText, queryByText } = render();
+ const { getByText, queryByText } = renderComponent();
expect(getByText('Coins')).toBeDefined();
expect(queryByText('All')).toBeNull();
});
it('should display tabs after focusing search input', () => {
- const { getByPlaceholderText, getByText, queryByText } = render(
- ,
- );
+ const { getByPlaceholderText, getByText, queryByText } = renderComponent();
fireEvent(getByPlaceholderText('Search'), 'focus');
@@ -22,16 +23,25 @@ describe('TradeableAssetsSheetHeader', () => {
});
it('should not display cancel button by default', () => {
- const { queryByText } = render();
+ const { queryByText } = renderComponent();
expect(queryByText('Cancel')).toBeNull();
});
it('should display cancel button after focusing search input', () => {
- const { getByPlaceholderText, getByText } = render();
+ const { getByPlaceholderText, getByText } = renderComponent();
fireEvent(getByPlaceholderText('Search'), 'focus');
expect(getByText('Cancel')).toBeDefined();
});
+
+ it('should call onClose when close button is pressed ', () => {
+ const onClose = jest.fn();
+ const { getByLabelText } = renderComponent(onClose);
+
+ fireEvent.press(getByLabelText('Close'));
+
+ expect(onClose).toHaveBeenCalled();
+ });
});
diff --git a/suite-native/module-trading/src/navigation/__tests__/TradingStackNavigator.comp.test.tsx b/suite-native/module-trading/src/navigation/__tests__/TradingStackNavigator.comp.test.tsx
index 7f300814a22b..36dc030b6903 100644
--- a/suite-native/module-trading/src/navigation/__tests__/TradingStackNavigator.comp.test.tsx
+++ b/suite-native/module-trading/src/navigation/__tests__/TradingStackNavigator.comp.test.tsx
@@ -4,7 +4,7 @@ import { TradingStackNavigator } from '../TradingStackNavigator';
describe('TradingStackNavigator', () => {
it('should render', async () => {
- const { getByText } = renderWithStore();
- await waitFor(() => expect(getByText('Trading placeholder')).toBeDefined());
+ const { getAllByText } = renderWithStore();
+ await waitFor(() => expect(getAllByText('Buy').length).toBe(2));
});
});