Skip to content

Commit 634ab4e

Browse files
Merge pull request #55 from rootstrap/chore/eslint-sonar
chore: add sonarjs plugin for eslint
2 parents 8d788d6 + 0c5dbc5 commit 634ab4e

File tree

8 files changed

+51
-31
lines changed

8 files changed

+51
-31
lines changed

.eslintrc.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,12 @@ const path = require('path');
22

33
module.exports = {
44
// Configuration for JavaScript files
5-
extends: ['@react-native-community', 'plugin:prettier/recommended'],
6-
plugins: ['unicorn'],
5+
extends: [
6+
'@react-native-community',
7+
'plugin:prettier/recommended',
8+
'plugin:sonarjs/recommended-legacy',
9+
],
10+
plugins: ['unicorn', 'sonarjs'],
711
rules: {
812
'prettier/prettier': [
913
'error',

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -116,6 +116,7 @@
116116
"eslint": "^8.57.0",
117117
"eslint-plugin-i18n-json": "^4.0.0",
118118
"eslint-plugin-simple-import-sort": "^10.0.0",
119+
"eslint-plugin-sonarjs": "^1.0.4",
119120
"eslint-plugin-tailwindcss": "^3.15.2",
120121
"eslint-plugin-testing-library": "^6.2.2",
121122
"eslint-plugin-unicorn": "^46.0.1",

pnpm-lock.yaml

Lines changed: 13 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/components/login-form.test.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ afterEach(cleanup);
88
const onSubmitMock: jest.Mock<LoginFormProps['onSubmit']> = jest.fn();
99

1010
describe('LoginForm Form ', () => {
11+
const LOGIN_BUTTON = 'login-button';
1112
it('renders correctly', async () => {
1213
render(<LoginForm />);
1314
expect(await screen.findByText(/Sign in/i)).toBeOnTheScreen();
@@ -16,7 +17,7 @@ describe('LoginForm Form ', () => {
1617
it('should display required error when values are empty', async () => {
1718
render(<LoginForm />);
1819

19-
const button = screen.getByTestId('login-button');
20+
const button = screen.getByTestId(LOGIN_BUTTON);
2021
expect(screen.queryByText(/Email is required/i)).not.toBeOnTheScreen();
2122
fireEvent.press(button);
2223
expect(await screen.findByText(/Email is required/i)).toBeOnTheScreen();
@@ -26,7 +27,7 @@ describe('LoginForm Form ', () => {
2627
it('should display matching error when email is invalid', async () => {
2728
render(<LoginForm />);
2829

29-
const button = screen.getByTestId('login-button');
30+
const button = screen.getByTestId(LOGIN_BUTTON);
3031
const emailInput = screen.getByTestId('email-input');
3132
const passwordInput = screen.getByTestId('password-input');
3233

@@ -41,7 +42,7 @@ describe('LoginForm Form ', () => {
4142
it('Should call LoginForm with correct values when values are valid', async () => {
4243
render(<LoginForm onSubmit={onSubmitMock} />);
4344

44-
const button = screen.getByTestId('login-button');
45+
const button = screen.getByTestId(LOGIN_BUTTON);
4546
const emailInput = screen.getByTestId('email-input');
4647
const passwordInput = screen.getByTestId('password-input');
4748

src/ui/button.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { ActivityIndicator, Pressable, Text } from 'react-native';
44
import type { VariantProps } from 'tailwind-variants';
55
import { tv } from 'tailwind-variants';
66

7+
const TEXT_WHITE = 'text-white';
78
const button = tv({
89
slots: {
910
container: 'my-2 flex flex-row items-center justify-center rounded-md px-4',
@@ -21,7 +22,7 @@ const button = tv({
2122
secondary: {
2223
container: 'bg-primary-600',
2324
label: 'text-secondary-600',
24-
indicator: 'text-white',
25+
indicator: TEXT_WHITE,
2526
},
2627
outline: {
2728
container: 'border border-neutral-400',
@@ -30,8 +31,8 @@ const button = tv({
3031
},
3132
destructive: {
3233
container: 'bg-red-600',
33-
label: 'text-white',
34-
indicator: 'text-white',
34+
label: TEXT_WHITE,
35+
indicator: TEXT_WHITE,
3536
},
3637
ghost: {
3738
container: 'bg-transparent',

src/ui/checkbox.test.tsx

Lines changed: 15 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,10 @@ import { Checkbox, Radio, Switch } from './checkbox';
88
afterEach(cleanup);
99

1010
describe('Checkbox, Radio & Switch components ', () => {
11+
const CHECKBOX_LABEL = 'checkbox-label';
12+
const AGREE_TERMS = 'I agree to terms and conditions';
13+
const RADIO_LABEL = 'radio-label';
14+
const SWITCH_LABEL = 'switch-label';
1115
it('<Checkbox /> renders correctly and call on change on Press', () => {
1216
const mockOnChange = jest.fn((checked) => checked);
1317
render(
@@ -19,7 +23,7 @@ describe('Checkbox, Radio & Switch components ', () => {
1923
/>
2024
);
2125
expect(screen.getByTestId('checkbox')).toBeOnTheScreen();
22-
expect(screen.queryByTestId('checkbox-label')).not.toBeOnTheScreen();
26+
expect(screen.queryByTestId(CHECKBOX_LABEL)).not.toBeOnTheScreen();
2327
expect(screen.getByTestId('checkbox')).toBeEnabled();
2428

2529
expect(screen.getByTestId('checkbox')).not.toBeChecked();
@@ -64,7 +68,7 @@ describe('Checkbox, Radio & Switch components ', () => {
6468
/>
6569
);
6670
expect(screen.getByTestId('checkbox')).toBeOnTheScreen();
67-
expect(screen.getByTestId('checkbox-label')).toBeOnTheScreen();
71+
expect(screen.getByTestId(CHECKBOX_LABEL)).toBeOnTheScreen();
6872
expect(
6973
screen.getByTestId('checkbox').props.accessibilityState.checked
7074
).toBe(false);
@@ -75,9 +79,7 @@ describe('Checkbox, Radio & Switch components ', () => {
7579
expect(screen.getByTestId('checkbox').props.accessibilityLabel).toBe(
7680
'agree'
7781
);
78-
expect(screen.getByTestId('checkbox-label')).toHaveTextContent(
79-
'I agree to terms and conditions'
80-
);
82+
expect(screen.getByTestId(CHECKBOX_LABEL)).toHaveTextContent(AGREE_TERMS);
8183
fireEvent.press(screen.getByTestId('checkbox'));
8284
expect(mockOnChange).toHaveBeenCalledTimes(0);
8385
});
@@ -93,7 +95,7 @@ describe('Checkbox, Radio & Switch components ', () => {
9395
/>
9496
);
9597
expect(screen.getByTestId('radio')).toBeOnTheScreen();
96-
expect(screen.queryByTestId('radio-label')).not.toBeOnTheScreen();
98+
expect(screen.queryByTestId(RADIO_LABEL)).not.toBeOnTheScreen();
9799
expect(screen.getByTestId('radio')).toBeEnabled();
98100
expect(screen.getByTestId('radio')).not.toBeChecked();
99101
expect(screen.getByTestId('radio').props.accessibilityRole).toBe('radio');
@@ -115,17 +117,15 @@ describe('Checkbox, Radio & Switch components ', () => {
115117
/>
116118
);
117119
expect(screen.getByTestId('radio')).toBeOnTheScreen();
118-
expect(screen.getByTestId('radio-label')).toBeOnTheScreen();
119-
expect(screen.getByTestId('radio-label')).toHaveTextContent(
120-
'I agree to terms and conditions'
121-
);
120+
expect(screen.getByTestId(RADIO_LABEL)).toBeOnTheScreen();
121+
expect(screen.getByTestId(RADIO_LABEL)).toHaveTextContent(AGREE_TERMS);
122122

123123
expect(screen.getByTestId('radio').props.accessibilityState.checked).toBe(
124124
false
125125
);
126126
expect(screen.getByTestId('radio').props.accessibilityRole).toBe('radio');
127127
expect(screen.getByTestId('radio').props.accessibilityLabel).toBe('agree');
128-
fireEvent.press(screen.getByTestId('radio-label'));
128+
fireEvent.press(screen.getByTestId(RADIO_LABEL));
129129
expect(mockOnChange).toHaveBeenCalledTimes(1);
130130
expect(mockOnChange).toHaveBeenCalledWith(true);
131131
});
@@ -158,7 +158,7 @@ describe('Checkbox, Radio & Switch components ', () => {
158158
/>
159159
);
160160
expect(screen.getByTestId('switch')).toBeOnTheScreen();
161-
expect(screen.queryByTestId('switch-label')).not.toBeOnTheScreen();
161+
expect(screen.queryByTestId(SWITCH_LABEL)).not.toBeOnTheScreen();
162162
expect(screen.getByTestId('switch')).toBeEnabled();
163163
expect(screen.getByTestId('switch').props.accessibilityState.checked).toBe(
164164
false
@@ -182,16 +182,14 @@ describe('Checkbox, Radio & Switch components ', () => {
182182
/>
183183
);
184184
expect(screen.getByTestId('switch')).toBeOnTheScreen();
185-
expect(screen.getByTestId('switch-label')).toBeOnTheScreen();
186-
expect(screen.getByTestId('switch-label')).toHaveTextContent(
187-
'I agree to terms and conditions'
188-
);
185+
expect(screen.getByTestId(SWITCH_LABEL)).toBeOnTheScreen();
186+
expect(screen.getByTestId(SWITCH_LABEL)).toHaveTextContent(AGREE_TERMS);
189187
expect(screen.getByTestId('switch').props.accessibilityState.checked).toBe(
190188
false
191189
);
192190
expect(screen.getByTestId('switch').props.accessibilityRole).toBe('switch');
193191
expect(screen.getByTestId('switch').props.accessibilityLabel).toBe('agree');
194-
fireEvent.press(screen.getByTestId('switch-label'));
192+
fireEvent.press(screen.getByTestId(SWITCH_LABEL));
195193
expect(mockOnChange).toHaveBeenCalledTimes(1);
196194
expect(mockOnChange).toHaveBeenCalledWith(true);
197195
});

src/ui/input.test.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { Input } from './input';
88
afterEach(cleanup);
99

1010
describe('Input component ', () => {
11+
const INPUT_ERROR = 'input-error';
1112
it('renders correctly ', () => {
1213
render(<Input testID="input" />);
1314
expect(screen.getByTestId('input')).toBeOnTheScreen();
@@ -47,7 +48,7 @@ describe('Input component ', () => {
4748
render(<Input testID="input" error="This is an error message" />);
4849
expect(screen.getByTestId('input')).toBeOnTheScreen();
4950

50-
expect(screen.getByTestId('input-error')).toHaveTextContent(
51+
expect(screen.getByTestId(INPUT_ERROR)).toHaveTextContent(
5152
'This is an error message'
5253
);
5354
});
@@ -63,8 +64,8 @@ describe('Input component ', () => {
6364
expect(screen.getByTestId('input')).toBeOnTheScreen();
6465

6566
expect(screen.getByTestId('input-label')).toHaveTextContent('Username');
66-
expect(screen.getByTestId('input-error')).toBeOnTheScreen();
67-
expect(screen.getByTestId('input-error')).toHaveTextContent(
67+
expect(screen.getByTestId(INPUT_ERROR)).toBeOnTheScreen();
68+
expect(screen.getByTestId(INPUT_ERROR)).toHaveTextContent(
6869
'This is an error message'
6970
);
7071
expect(

src/ui/progress-bar.test.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,15 @@ import type { ProgressBarRef } from './progress-bar';
66
import { ProgressBar } from './progress-bar';
77

88
describe('ProgressBar component', () => {
9+
const PROGRESS_BAR = 'progress-bar';
910
it('renders correctly', () => {
1011
render(<ProgressBar className="custom-class" />);
1112
expect(screen.getByTestId('progress-bar-container')).toBeTruthy();
1213
});
1314

1415
it('sets initial progress correctly', () => {
1516
render(<ProgressBar initialProgress={50} />);
16-
const progressBar = screen.getByTestId('progress-bar');
17+
const progressBar = screen.getByTestId(PROGRESS_BAR);
1718
expect(progressBar.props.style).toEqual(
1819
expect.objectContaining({ width: '50%' })
1920
);
@@ -24,15 +25,15 @@ describe('ProgressBar component', () => {
2425
const progressAnimationDuration = 250;
2526
const ref = createRef<ProgressBarRef>();
2627
render(<ProgressBar ref={ref} initialProgress={0} />);
27-
const progressBar = screen.getByTestId('progress-bar');
28+
const progressBar = screen.getByTestId(PROGRESS_BAR);
2829

2930
// Call setProgress and check the updated value
3031
if (ref.current) {
3132
expect(getAnimatedStyle(progressBar)).toMatchObject({ width: '0%' });
3233
jest.useFakeTimers();
3334
ref.current.setProgress(finalValue);
3435
jest.advanceTimersByTime(progressAnimationDuration); // Duration of the animation
35-
const updatedProgressBar = await screen.findByTestId('progress-bar');
36+
const updatedProgressBar = await screen.findByTestId(PROGRESS_BAR);
3637
expect(getAnimatedStyle(updatedProgressBar)).toMatchObject({
3738
width: `${finalValue}%`,
3839
});

0 commit comments

Comments
 (0)