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.

Sign up for GitHub

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

Jump to bottom

Feature: sort-imports - add option to sort within sub groups or remove new line between some groups #401

Open
2 tasks done
RARgames opened this issue Nov 27, 2024 · 3 comments · May be fixed by #435 or hugop95/eslint-plugin-perfectionist#7
Open
2 tasks done

Feature: sort-imports - add option to sort within sub groups or remove new line between some groups #401

RARgames opened this issue Nov 27, 2024 · 3 comments · May be fixed by #435 or hugop95/eslint-plugin-perfectionist#7
Labels
enhancement New feature or request

Comments

@RARgames
Copy link

RARgames commented Nov 27, 2024 •
edited
Loading

What rule do you want to change?

sort-imports

Describe the problem

I'm not sure if anything like this is possible right now. I couldn't find it in the docs.
Probably a new option is needed e.g. sort only within sub groups, or remove new line between defined groups

I want to achieve something like this:

import React, { useCallback, useState } from 'react';
import { useTranslation } from 'react-i18next';
import classNames from 'classnames';
import { dequal } from 'dequal';
import omit from 'lodash/omit';
import PropTypes from 'prop-types';

Code example

I have customGroup for react-related imports called react,
I want to position it with first group:

 groups: [['react', 'builtin', 'external', 'internal'], ['parent', 'sibling', 'index'], 'unknown'],
 type: 'natural',

now my imports are sorted like this:

import classNames from 'classnames';
import { dequal } from 'dequal';
import omit from 'lodash/omit';
import PropTypes from 'prop-types';
import React, { useCallback, useState } from 'react';
import { useTranslation } from 'react-i18next';

I could change groups to:

 groups: ['react', ['builtin', 'external', 'internal'], ['parent', 'sibling', 'index'], 'unknown'],

to get:

import React, { useCallback, useState } from 'react';
import { useTranslation } from 'react-i18next';

import classNames from 'classnames';
import { dequal } from 'dequal';
import omit from 'lodash/omit';
import PropTypes from 'prop-types';

But I cannot get what I want.

The issue is that ['react', 'builtin', 'external', 'internal'] is treated as 1 group for sorting, and I'd like to get sorting within react separately from the rest. Maybe some syntax like this could help:

groups: [['react', ['builtin', 'external', 'internal']], ['parent', 'sibling', 'index'], 'unknown'],

Entries in the main array are separated by new line as defined in newlinesBetween, but further divisions decide about what is sorted together - just an idea.

Additional comments

No response

Validations

  • Read the docs.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
@RARgames RARgames added the enhancement New feature or request label Nov 27, 2024
@hugop95
Copy link
Contributor

hugop95 commented Nov 27, 2024 •
edited
Loading

Hi @RARgames

If I understand correctly, this issue is solely related to newlines and not to sorting itself.
What you are requesting is currently not possible today. I agree that the newlinesBetween option is a bit lacking and can be improved. However, I don't think groups is the place: groups define order and have no relationship with newlines.

I see two ways to approach this:

  • Improve the newlinesBetween option.
  • Use the new customGroups API that exists in sort-classes or sort-modules: something like newlinesAbove, newlinesUnder and newlinesInside for a given custom group could allow users to define newlines above, under and within a group.

@RARgames
Copy link
Author

Yes, sorry for the long explanation, I was a bit tired.

I'm quite new to perfectionist (saw it some time ago and decided to use it today). However, I think that the 2nd option is even better, as it allows different settings for each custom group.

This was referenced Dec 21, 2024
Merged
Closed
Draft
@hugop95
Copy link
Contributor

hugop95 commented Dec 22, 2024 •
edited
Loading

I see two ways to resolve this:

- customGroups.newlinesAbove and customGroups.newlinesUnder options

  • Options easy to implement.
  • Requires sort-imports to support the array-based custom groups API.

- Allows users to add { newlinesBetween: X } in groups related to newlines

  • { newlinesBetween: never }: Enforce no newlines between the group above and below this token.
  • { newlinesBetween: always }: Enforce one newline between the group above and below this token.
  • { newlinesBetween: ignore }: Allow anything between the group above and below this token (useful when overriding options.newlinesBetween).

Example:

{
  newlinesBetween: "always",
  groups: [
    "group1",
    { newlinesBetween: never }, // Enforce no newlines between group1 and group2
    "group2",
    { newlinesBetween: always }, // Enforce 1 newline between group1 and group2
    "group3",
    { newlinesBetween: ignore } // Don't enforce newline behavior between group3 and group4 
    "group4",
    "group5" // Enforce 1 newline between group4 and group5 due to `options.newlinesBetween`.
  ]
}

@hugop95 hugop95 linked a pull request Dec 26, 2024 that will close this issue
Draft
1 task
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
enhancement New feature or request
Projects
None yet
Milestone
No milestone
2 participants
@RARgames @hugop95