Skip to content

Commit eae67c7

Browse files
authored
chore(js): update ts, formatting, linting and prettier (#1685)
1 parent 9ed308c commit eae67c7

27 files changed

+1424
-1211
lines changed

.eslintrc.js

+10-14
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,15 @@
1-
module.exports = {
2-
parser: '@typescript-eslint/parser', // Specifies the ESLint parser
3-
extends: [
4-
'plugin:@typescript-eslint/recommended', // Uses the recommended rules from the @typescript-eslint/eslint-plugin
5-
'prettier/@typescript-eslint', // Uses eslint-config-prettier to disable ESLint rules from @typescript-eslint/eslint-plugin that would conflict with prettier
6-
'plugin:prettier/recommended', // Enables eslint-plugin-prettier and displays prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array.
1+
module.exports = {
2+
parser: '@typescript-eslint/parser', // Specifies the ESLint parser
3+
extends: [
4+
'eslint:recommended',
5+
'plugin:@typescript-eslint/recommended', // Uses the recommended rules from the @typescript-eslint/eslint-plugin
76
'plugin:react-hooks/recommended',
87
],
9-
parserOptions: {
10-
ecmaVersion: 2018, // Allows for the parsing of modern ECMAScript features
11-
sourceType: 'module', // Allows for the use of imports
8+
parserOptions: {
9+
ecmaVersion: 2017, // Allows for the parsing of modern ECMAScript features
10+
sourceType: 'module', // Allows for the use of imports
1211
},
13-
rules: {
12+
rules: {
1413
// Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs
15-
"@typescript-eslint/explicit-function-return-type": "off",
16-
"@typescript-eslint/explicit-member-accessibility": [true, "no-public"],
17-
"@typescript-eslint/camelcase": "off"
1814
},
19-
};
15+
}

.github/workflows/platform-validation.yml

+37-34
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
name: platform-validation
22
on:
33
push:
4-
branches: [ main ]
5-
paths-ignore: [ 'docs/**' ]
4+
branches: [main]
5+
paths-ignore: ['docs/**']
66
pull_request:
7-
branches: [ main, 'feature/**' ]
8-
paths-ignore: [ 'docs/**' ]
7+
branches: [main, 'feature/**']
8+
paths-ignore: ['docs/**']
99
concurrency:
1010
group: ${{ github.workflow }}-${{ github.ref }}
1111
cancel-in-progress: true
@@ -14,17 +14,14 @@ jobs:
1414
runs-on: ubuntu-latest
1515
steps:
1616
- name: Checkout Repo
17-
uses: actions/checkout@v2
17+
uses: actions/checkout@v3
1818
- name: Setup Node
19-
uses: actions/setup-node@v2
19+
uses: actions/setup-node@v3
2020
with:
21-
node-version: 16.x
22-
- name: Cache JS Dependencies
23-
uses: c-hive/gha-yarn-cache@v1
24-
- name: Install Yarn
25-
run: npm install --global yarn
21+
node-version: 16
22+
cache: 'yarn'
2623
- name: Install Library Dependencies
27-
run: yarn install
24+
run: yarn install --frozen-lockfile
2825
- name: Build Library
2926
run: yarn build
3027
- name: Install Mobile Dependencies
@@ -51,23 +48,20 @@ jobs:
5148
runs-on: macos-latest
5249
steps:
5350
- name: Checkout Repo
54-
uses: actions/checkout@v2
51+
uses: actions/checkout@v3
5552
- name: Setup Node
56-
uses: actions/setup-node@v2
53+
uses: actions/setup-node@v3
5754
with:
58-
node-version: 16.x
59-
- name: Cache JS Dependencies
60-
uses: c-hive/gha-yarn-cache@v1
61-
- name: Install Yarn
62-
run: npm install --global yarn
55+
node-version: 16
56+
cache: 'yarn'
6357
- name: Install Library Dependencies
64-
run: yarn install
58+
run: yarn install --frozen-lockfile
6559
- name: Build Library
6660
run: yarn build
67-
- name: Install Mobile Dependencies
61+
- name: Install Example Dependencies
6862
run: |-
6963
cd example
70-
yarn install
64+
yarn install --frozen-lockfile
7165
- name: Bundler
7266
run: |-
7367
cd example/ios
@@ -91,18 +85,27 @@ jobs:
9185
runs-on: ubuntu-latest
9286
steps:
9387
- name: Checkout Repo
94-
uses: actions/checkout@v2
88+
uses: actions/checkout@v3
9589
- name: Setup Node
96-
uses: actions/setup-node@v2
90+
uses: actions/setup-node@v3
9791
with:
98-
node-version: 16.x
99-
- name: Cache JS Dependencies
100-
uses: c-hive/gha-yarn-cache@v1
101-
- name: Install Yarn
102-
run: npm install --global yarn
103-
- name: Install Library Dependencies
104-
run: yarn install
105-
- name: Check Lint & Format
92+
node-version: 16
93+
cache: 'yarn'
94+
- name: Install Dependencies
95+
run: |-
96+
yarn install --frozen-lockfile
97+
- name: Install Example Dependencies
98+
run: |-
99+
cd example
100+
yarn install --frozen-lockfile
101+
- name: Check Lint, Format & Types
106102
run: |
107-
npm run lint:ci
108-
npm run format:ci
103+
yarn run ci:lint
104+
yarn run ci:format
105+
yarn run types
106+
- name: Example - Check Lint, Format & Types
107+
run: |
108+
cd example
109+
yarn run ci:lint
110+
yarn run ci:format
111+
yarn run types

.prettierrc.js

+2-6
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
1-
module.exports = {
2-
semi: false,
3-
trailingComma: 'all',
4-
singleQuote: true,
5-
printWidth: 120,
6-
tabWidth: 2,
1+
module.exports = {
2+
singleQuote: true,
73
};

example/.eslintrc.js

+13-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,16 @@
11
module.exports = {
22
root: true,
3-
extends: '@react-native-community',
3+
parser: '@typescript-eslint/parser', // Specifies the ESLint parser
4+
extends: [
5+
'eslint:recommended',
6+
'plugin:@typescript-eslint/recommended', // Uses the recommended rules from the @typescript-eslint/eslint-plugin
7+
'plugin:react-hooks/recommended',
8+
],
9+
parserOptions: {
10+
ecmaVersion: 2017, // Allows for the parsing of modern ECMAScript features
11+
sourceType: 'module', // Allows for the use of imports
12+
},
13+
rules: {
14+
// Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs
15+
},
416
};

example/.prettierrc.js

+1-5
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
11
module.exports = {
2-
arrowParens: 'avoid',
3-
bracketSameLine: true,
4-
bracketSpacing: false,
52
singleQuote: true,
6-
trailingComma: 'all',
7-
};
3+
}

example/__tests__/App-test.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,13 @@
22
* @format
33
*/
44

5-
import 'react-native';
6-
import React from 'react';
7-
import App from '../App';
5+
import React from 'react'
6+
import 'react-native'
7+
import App from '../src/App'
88

99
// Note: test renderer must be required after react-native.
10-
import renderer from 'react-test-renderer';
10+
import renderer from 'react-test-renderer'
1111

1212
it('renders correctly', () => {
13-
renderer.create(<App />);
14-
});
13+
renderer.create(<App />)
14+
})

example/package.json

+11-8
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,14 @@
1111
"windows": "react-native run-windows",
1212
"start": "react-native start",
1313
"test": "jest",
14-
"lint": "eslint . --ext .js,.jsx,.ts,.tsx",
14+
"lint": "eslint src",
1515
"sync:ios": "yarn rimraf ../ios && yarn cpx 'node_modules/react-native-track-player/ios/**' ../ios",
1616
"sync:android": "yarn rimraf ../android && yarn cpx 'node_modules/react-native-track-player/android/**' ../android",
1717
"sync": "yarn sync:ios && yarn sync:android",
18-
"fresh": "rm -rf node_modules ; cd .. && yarn build ; cd example && yarn install"
18+
"fresh": "rm -rf node_modules ; cd .. && yarn build ; cd example && yarn install",
19+
"types": "tsc --noEmit true",
20+
"ci:lint": "eslint src --max-warnings=0",
21+
"ci:format": "prettier --check src"
1922
},
2023
"dependencies": {
2124
"@react-native-community/slider": "4.2.0",
@@ -31,19 +34,19 @@
3134
"@types/jest": "^26.0.23",
3235
"@types/react-native": "^0.64.5",
3336
"@types/react-test-renderer": "^16.9.2",
37+
"@typescript-eslint/eslint-plugin": "^5.36.0",
38+
"@typescript-eslint/parser": "^5.36.0",
3439
"babel-jest": "^26.6.3",
3540
"babel-plugin-module-resolver": "^4.0.0",
3641
"cpx": "^1.5.0",
37-
"eslint": "^7.32.0",
42+
"eslint": "^8.23.0",
43+
"eslint-plugin-react-hooks": "^4.6.0",
3844
"jest": "^26.6.3",
3945
"metro-react-native-babel-preset": "^0.67.0",
4046
"react-native-clean-project": "^4.0.1",
4147
"react-test-renderer": "17.0.2",
4248
"rimraf": "^3.0.2",
43-
"typescript": "^3.8.3"
44-
},
45-
"resolutions": {
46-
"@types/react": "^17"
49+
"typescript": "^4.6.3"
4750
},
4851
"jest": {
4952
"preset": "react-native",
@@ -57,4 +60,4 @@
5760
]
5861
},
5962
"isSwift": true
60-
}
63+
}

example/src/App.tsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, {useState, useEffect} from 'react';
1+
import React, { useState, useEffect } from 'react';
22
import TrackPlayer from 'react-native-track-player';
33
import {
44
SafeAreaView,
@@ -8,9 +8,9 @@ import {
88
ActivityIndicator,
99
} from 'react-native';
1010

11-
import {Button, PlayerControls, Progress, TrackInfo} from './components';
12-
import {SetupService, QueueInitalTracksService} from './services';
13-
import {useCurrentTrack} from './hooks';
11+
import { Button, PlayerControls, Progress, TrackInfo } from './components';
12+
import { SetupService, QueueInitalTracksService } from './services';
13+
import { useCurrentTrack } from './hooks';
1414

1515
const App: React.FC = () => {
1616
const track = useCurrentTrack();
@@ -33,7 +33,7 @@ const App: React.FC = () => {
3333
if (!isPlayerReady) {
3434
return (
3535
<SafeAreaView style={styles.screenContainer}>
36-
<ActivityIndicator/>
36+
<ActivityIndicator />
3737
</SafeAreaView>
3838
);
3939
}
@@ -49,11 +49,11 @@ const App: React.FC = () => {
4949
type="primary"
5050
/>
5151
</View>
52-
<TrackInfo track={track}/>
52+
<TrackInfo track={track} />
5353
<Progress />
5454
</View>
5555
<View style={styles.actionRowContainer}>
56-
<PlayerControls/>
56+
<PlayerControls />
5757
</View>
5858
</SafeAreaView>
5959
);

example/src/components/Button.tsx

+1-5
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,5 @@
11
import React from 'react';
2-
import {
3-
StyleSheet,
4-
Text,
5-
TouchableWithoutFeedback,
6-
} from 'react-native';
2+
import { StyleSheet, Text, TouchableWithoutFeedback } from 'react-native';
73

84
export interface ButtonProps {
95
title: string;

example/src/components/PlayPauseButton.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import React from 'react';
2-
import {ActivityIndicator, View, StyleSheet} from 'react-native';
3-
import {usePlaybackState, State} from 'react-native-track-player';
2+
import { ActivityIndicator, View, StyleSheet } from 'react-native';
3+
import { usePlaybackState, State } from 'react-native-track-player';
44

5-
import {Button} from './Button';
6-
import {useOnTogglePlayback} from '../hooks';
5+
import { Button } from './Button';
6+
import { useOnTogglePlayback } from '../hooks';
77

88
export const PlayPauseButton: React.FC = () => {
99
const state = usePlaybackState();

example/src/components/PlayerControls.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import React from 'react';
2-
import {View, StyleSheet} from 'react-native';
2+
import { View, StyleSheet } from 'react-native';
33
import TrackPlayer from 'react-native-track-player';
44

5-
import {Button} from './Button';
6-
import {PlayPauseButton} from './PlayPauseButton';
5+
import { Button } from './Button';
6+
import { PlayPauseButton } from './PlayPauseButton';
77

88
export const PlayerControls: React.FC = () => {
99
return (
@@ -31,6 +31,6 @@ const styles = StyleSheet.create({
3131
},
3232
row: {
3333
flexDirection: 'row',
34-
justifyContent: 'space-evenly'
34+
justifyContent: 'space-evenly',
3535
},
3636
});

example/src/components/Progress.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ export const Progress: React.FC = () => {
1515
thumbTintColor="#FFD479"
1616
minimumTrackTintColor="#FFD479"
1717
maximumTrackTintColor="#FFFFFF"
18-
onSlidingComplete={value => {
18+
onSlidingComplete={(value) => {
1919
TrackPlayer.seekTo(value);
2020
}}
2121
/>

example/src/components/TrackInfo.tsx

+3-8
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,6 @@
11
import React from 'react';
2-
import {
3-
Image,
4-
StyleSheet,
5-
Text,
6-
View,
7-
} from 'react-native';
8-
import type {Track} from 'react-native-track-player';
2+
import { Image, StyleSheet, Text, View } from 'react-native';
3+
import type { Track } from 'react-native-track-player';
94

105
export interface TrackInfoProps {
116
track?: Track;
@@ -14,7 +9,7 @@ export interface TrackInfoProps {
149
export const TrackInfo: React.FC<TrackInfoProps> = ({ track }) => {
1510
return (
1611
<View style={styles.container}>
17-
<Image style={styles.artwork} source={{uri: `${track?.artwork}`}} />
12+
<Image style={styles.artwork} source={{ uri: `${track?.artwork}` }} />
1813
<Text style={styles.titleText}>{track?.title}</Text>
1914
<Text style={styles.artistText}>{track?.artist}</Text>
2015
</View>

example/src/hooks/useCurrentTrack.ts

+10-10
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
1-
import {useState, useEffect} from 'react';
2-
import TrackPlayer, {useTrackPlayerEvents, Event} from 'react-native-track-player';
3-
import type {Track} from 'react-native-track-player';
1+
import { useState, useEffect } from 'react';
2+
import TrackPlayer, {
3+
useTrackPlayerEvents,
4+
Event,
5+
} from 'react-native-track-player';
6+
import type { Track } from 'react-native-track-player';
47

5-
export const useCurrentTrack = (): Track|undefined => {
8+
export const useCurrentTrack = (): Track | undefined => {
69
const [index, setIndex] = useState<number | undefined>();
710
const [track, setTrack] = useState<Track | undefined>();
811

9-
useTrackPlayerEvents(
10-
[Event.PlaybackTrackChanged],
11-
async ({ nextTrack }) => {
12-
setIndex(nextTrack);
13-
},
14-
);
12+
useTrackPlayerEvents([Event.PlaybackTrackChanged], async ({ nextTrack }) => {
13+
setIndex(nextTrack);
14+
});
1515

1616
useEffect(() => {
1717
if (index === undefined) return;

0 commit comments

Comments
 (0)