diff --git a/lib/configs/codeStyle.ts b/lib/configs/codeStyle.ts index bd12cbf6..7e045a97 100644 --- a/lib/configs/codeStyle.ts +++ b/lib/configs/codeStyle.ts @@ -93,13 +93,11 @@ export function codeStyle(options: ConfigOptions): (Linter.Config | Linter.BaseC { avoidQuotes: true }, ], - // Enforce consistent new lines after [ and before ] - '@stylistic/array-bracket-newline': [ - 'error', - 'consistent', - ], + // Enforce new lines after [ and before ] if there are multiline entries or more than 1 item in the array (better git diff) + '@stylistic/array-bracket-newline': ['error', 'consistent'], // Enforce new lines between array elements (better git diff) but allow to have single line arrays '@stylistic/array-element-newline': ['error', 'consistent'], + 'antfu/consistent-list-newline': ['error'], // Same for objects as for arrays '@stylistic/object-curly-newline': [ 'error', diff --git a/tests/fixtures/codestyle/input/array.js b/tests/fixtures/codestyle/input/array.js index d5e5abf9..9d33a3a1 100644 --- a/tests/fixtures/codestyle/input/array.js +++ b/tests/fixtures/codestyle/input/array.js @@ -1,16 +1,52 @@ -// This can be a single line -const arr = ['first', 'second'] +/* eslint-disable no-unused-vars */ -// This is not a single line already and should be one element per line -const arr2 = [ - 'first', 'second', - 'third', 'and', - 'so', 'on' -] - -// This has a missing trailing comma causing too much git diff -const arr3 = [ +// ❌ Trailing comma is required to make multi-line array diff-safe on changing the last element +// Here the trailing comma is missing on a multi-line array and extra comma is present on a single-line array +const items = [ 'first', 'second', 'third' ] +const LATIN_VOWELS = ['a', 'e', 'i', 'o', 'u',] + +// ❌ Multi-line array should have a single element per line to make it diff-safe and readable +// Here the last two elements are on the same line +const VARIANTS = [ + 'primary', + 'secondary', + 'tertiary', 'tertiary-no-background', +] + +// ✅ In general it is recommended to prefer a multi-line array to make it diff-safe on adding/removing elements +// It is especially important for dynamic array which entries may change +const sampleUsers = [ + 'admin', + 'alice', + 'bob', +] +// Even if there is only one element at the moment (more elements may be added later) +const MUTE_NOTIFICATIONS_USER_STATUSES = [ + 'dnd', +] + +// ✅ Single-line arrays are also fine for short and stable arrays which are not expected to change +// This is a developer's choice +const selectedItems = ['default_item'] +const HTML_FORM_ACTIONS = ['POST', 'GET'] + +// ❌ Single-line array should have brackets on the same line while multi-line array should have brackets on the next line +const USER_STATUSES = [ + 'online', + 'away', + 'dnd', + 'invisible', + 'offline'] +// 🚧 Currently this is an edge case and isn't fixed properly... +const WEEKDAYS = ['Monday', + 'Tuesday', + 'Wednesday', + 'Thursday', + 'Friday', + 'Saturday', + 'Sunday', +] diff --git a/tests/fixtures/codestyle/output/array.js b/tests/fixtures/codestyle/output/array.js index d154573f..d3a36487 100644 --- a/tests/fixtures/codestyle/output/array.js +++ b/tests/fixtures/codestyle/output/array.js @@ -1,19 +1,47 @@ -// This can be a single line -const arr = ['first', 'second'] +/* eslint-disable no-unused-vars */ -// This is not a single line already and should be one element per line -const arr2 = [ +// ❌ Trailing comma is required to make multi-line array diff-safe on changing the last element +// Here the trailing comma is missing on a multi-line array and extra comma is present on a single-line array +const items = [ 'first', 'second', 'third', - 'and', - 'so', - 'on', ] +const LATIN_VOWELS = ['a', 'e', 'i', 'o', 'u'] -// This has a missing trailing comma causing too much git diff -const arr3 = [ - 'first', - 'second', - 'third', +// ❌ Multi-line array should have a single element per line to make it diff-safe and readable +// Here the last two elements are on the same line +const VARIANTS = [ + 'primary', + 'secondary', + 'tertiary', + 'tertiary-no-background', +] + +// ✅ In general it is recommended to prefer a multi-line array to make it diff-safe on adding/removing elements +// It is especially important for dynamic array which entries may change +const sampleUsers = [ + 'admin', + 'alice', + 'bob', +] +// Even if there is only one element at the moment (more elements may be added later) +const MUTE_NOTIFICATIONS_USER_STATUSES = [ + 'dnd', +] + +// ✅ Single-line arrays are also fine for short and stable arrays which are not expected to change +// This is a developer's choice +const selectedItems = ['default_item'] +const HTML_FORM_ACTIONS = ['POST', 'GET'] + +// ❌ Single-line array should have brackets on the same line while multi-line array should have brackets on the next line +const USER_STATUSES = [ + 'online', + 'away', + 'dnd', + 'invisible', + 'offline', ] +// 🚧 Currently this is an edge case and isn't fixed properly... +const WEEKDAYS = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']