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.

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

Upgrade eslint #52

Merged
merged 2 commits into from
Aug 8, 2024
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
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
69 changes: 0 additions & 69 deletions .eslintrc.js

This file was deleted.

130 changes: 130 additions & 0 deletions eslint.config.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,130 @@
import path from 'node:path'
import { fileURLToPath } from 'node:url'

import { fixupPluginRules } from '@eslint/compat'
import { FlatCompat } from '@eslint/eslintrc'
import js from '@eslint/js'
import tsParser from '@typescript-eslint/parser'
import _import from 'eslint-plugin-import'
import jsxA11Y from 'eslint-plugin-jsx-a11y'
import observation from 'eslint-plugin-observation'
import prettier from 'eslint-plugin-prettier'
import react from 'eslint-plugin-react'
import reactNative from 'eslint-plugin-react-native'
import globals from 'globals'

const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(__filename)
const compat = new FlatCompat({
baseDirectory: __dirname,
recommendedConfig: js.configs.recommended,
allConfig: js.configs.all,
})

export default [
...compat.extends('plugin:@typescript-eslint/recommended'),
Copy link
Collaborator

Choose a reason for hiding this comment

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

Eerst extenden we van @react-native nu deze. Waarom?

Copy link
Member Author

Choose a reason for hiding this comment

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

Voor zover ik het begrijp: extends bestaat niet meer sinds eslint 8.0.0. In plaats daarvan bestaat de configuratie uit een array van configuratie-objecten. Er is een utility FileCompat om hieraan eslint-configuraties toe te voegen die nog geen flat eslint-configuration hebben. De helper fixupPluginRules voor plugins doet iets dergelijks, is meer low level, en wordt intern door FileCompat gebruikt.

De configuratie in deze PR werkt voor de eslint packages die wij gebruiken. Als alle eslint packages support voor eslint 8.0.0 hebben gekregen, dan hebben we FlatCompat en fixupPluginRules niet meer nodig.

{
plugins: {
'react-native': fixupPluginRules(reactNative),
react,
'jsx-a11y': jsxA11Y,
import: fixupPluginRules(_import),
prettier,
observation,
},

languageOptions: {
globals: {
...globals.jest,
...globals.browser,
},

parser: tsParser,
},

settings: {
'import/resolver': {
node: {
paths: ['.'],
extensions: ['.js', '.jsx', '.android.js', '.ios.js', '.native.js', '.ts', '.tsx'],
},
},
},

rules: {
'observation/no-function-without-logging': 'error',

'react-native/no-unused-styles': 'error',
'react-native/no-inline-styles': 'off',

'prettier/prettier': 'error',

'no-shadow': 'off',
semi: ['error', 'never'],
'no-console': 'warn',
curly: ['error', 'multi-line'],
'prefer-destructuring': ['error'],
'no-duplicate-imports': 'error',

'sort-imports': [
'error',
{
ignoreDeclarationSort: true,
},
],

'@typescript-eslint/no-shadow': ['error'],
'@typescript-eslint/no-explicit-any': 'off',
'@typescript-eslint/no-var-requires': 'off',
'@typescript-eslint/no-unused-vars': [
'error',
{
args: 'all',
argsIgnorePattern: '^_',
caughtErrors: 'all',
caughtErrorsIgnorePattern: '^_',
destructuredArrayIgnorePattern: '^_',
varsIgnorePattern: '^_',
ignoreRestSiblings: true,
},
],

'import/order': [
'error',
{
groups: ['builtin', 'external', 'internal', ['parent', 'sibling']],

pathGroups: [
{
pattern: 'react+(|-native)',
group: 'external',
position: 'before',
},
],

pathGroupsExcludedImportTypes: ['react+(|-native)'],
'newlines-between': 'always',

alphabetize: {
order: 'asc',
caseInsensitive: true,
},
},
],
},
},
{
files: ['**/*.ts', '**/*.tsx'],

rules: {
'no-undef': 'off',
},
},
{
files: ['**/*test.ts', '**/*test.tsx'],

rules: {
'observation/no-function-without-logging': 'off',
},
},
]
15 changes: 10 additions & 5 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,9 @@
"author": "Observation.org",
"license": "MIT",
"devDependencies": {
"@eslint/compat": "^1.1.1",
"@eslint/eslintrc": "^3.1.0",
"@eslint/js": "^9.8.0",
"@react-native/eslint-config": "0.74.85",
"@react-native/metro-config": "0.74.85",
"@react-native/typescript-config": "0.74.85",
Expand All @@ -15,23 +18,25 @@
"@types/color": "^3.0.6",
"@types/jest": "^29.5.12",
"@types/react": "^18.3.3",
"eslint": "^8.57.0",
"eslint": "^9.8.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-import": "^2.29.1",
"eslint-plugin-jsx-a11y": "^6.9.0",
"eslint-plugin-observation": "https://github.com/observation/eslint-rules.git",
"eslint-plugin-prettier": "^5.1.3",
"eslint-plugin-react": "^7.34.3",
"eslint-plugin-prettier": "^5.2.1",
"eslint-plugin-react": "^7.35.0",
"eslint-plugin-react-hooks": "^4.6.2",
"eslint-plugin-react-native": "^4.1.0",
"globals": "^15.8.0",
"jest": "^29.7.0",
"prettier": "^3.3.2",
"prettier": "^3.3.3",
"react": "18.2.0",
"react-native": "0.74.3",
"react-native-render-html": "^6.3.4",
"react-test-renderer": "18.2.0",
"ts-jest": "^29.2.2",
"typescript": "5.0.4"
"typescript": "5.0.4",
"typescript-eslint": "^7.18.0"
Copy link
Collaborator

Choose a reason for hiding this comment

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

Deze heeft inmiddels versie 8, maar ik weet nou niet of dit makkelijk is om te gebruiken

Copy link
Member Author

Choose a reason for hiding this comment

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

Ten tijde van het maken van deze PR was 7.18.0 de meest recente versie. Daarmee is deze PR ook getest. Voor het bijwerken van dependencies hebben we een aparte user story.

},
"react-native": "src/index.ts",
"scripts": {
Expand Down
1 change: 0 additions & 1 deletion src/components/Accordion.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import React, { useState } from 'react'
import { View } from 'react-native'

// @ts-ignore
import { Collapse, CollapseBody, CollapseHeader } from 'accordion-collapse-react-native'

import Log from '../lib/Log'
Expand Down
4 changes: 2 additions & 2 deletions src/components/BackButton.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
import React from 'react'

import { NavigationHelpers } from '@react-navigation/native'
import { NavigationProp, ParamListBase } from '@react-navigation/native'

import IconButton from '../components/IconButton'
import theme from '../styles/theme'

type Props = {
navigation: NavigationHelpers<{}>
navigation: NavigationProp<ParamListBase>
}

const BackButton = ({ navigation }: Props) => (
Expand Down
16 changes: 8 additions & 8 deletions src/styles/theme.ts
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,7 @@ const margin = {

const rounded = {
borderRadius: 4,
overflow: 'hidden' as 'hidden',
overflow: 'hidden' as const,
}

const input = {
Expand Down Expand Up @@ -128,39 +128,39 @@ export default {
rounded,
roundedLarge: {
borderRadius: 8,
overflow: 'hidden' as 'hidden',
overflow: 'hidden' as const,
},
roundedHuge: {
borderRadius: 10,
overflow: 'hidden' as 'hidden',
overflow: 'hidden' as const,
},
absolute: {
position: 'absolute' as 'absolute',
position: 'absolute' as const,
top: 0,
bottom: 0,
left: 0,
right: 0,
},
absoluteLeft: {
position: 'absolute' as 'absolute',
position: 'absolute' as const,
top: 0,
bottom: 0,
left: 0,
},
absoluteRight: {
position: 'absolute' as 'absolute',
position: 'absolute' as const,
top: 0,
bottom: 0,
right: 0,
},
absoluteBottom: {
position: 'absolute' as 'absolute',
position: 'absolute' as const,
bottom: 0,
left: 0,
right: 0,
},
absoluteTop: {
position: 'absolute' as 'absolute',
position: 'absolute' as const,
top: 0,
left: 0,
right: 0,
Expand Down
Loading
Loading