Question or Bug Report // parth-sort-order for named imports

[HansKre]

Hey!

Love this extension! It's amazing and saving me tons of my time! Thank you so much for making it!

I have observed following behavior for named imports and wanted to check if this is how it is supposed to be:

Observed behavior

import React from 'react';
import { DialogContent } from '../DialogContent';
import { Label } from '../Label';
import { Slugs } from '../Slugs';
import {
  Details,
  ToolReference,
} from '@my-package/components;

Expected behavior

For me, following sort-order would make much more sense:

import React from 'react';
import {
  Details,
  ToolReference,
} from '@my-package/components;
import { DialogContent } from '../DialogContent';
import { Label } from '../Label';
import { Slugs } from '../Slugs';

Please let me know your opinion. Would be happy to contribute myself. Just wanted to align with you upfront.

My config

"typescript.extension.sortImports.sortMethod": "path",
  "typescript.extension.sortImports.pathSortOrder": [
    "package",
    "relativeUpLevel",
    "relativeDownLevel"
  ],
  "typescript.extension.sortImports.sortOnSave": true,
  "typescript.extension.sortImports.pathSortOrderOverride": ["react"]

[neilsoult]

I believe the problem is the trailing comma and missing end quote. If you replace

import {
  Details,
  ToolReference,
} from '@my-package/components;

with

import {
  Details,
  ToolReference
} from '@my-package/components';

I think you will find it sorts as expected.

[HansKre]

Removed trailing comma from multiline named-import and gave it a try with:

import React from 'react';
import { DialogContent } from '../DialogContent';
import { Label } from '../Label';
import { Slugs } from '../Slugs';
import {
  Details,
  ToolReference,
  ToolReference1,
  ToolReference2,
  ToolReference3
} from '@my-package/components';

Result

import React from 'react';
import { Details, ToolReference, ToolReference1, ToolReference2, ToolReference3 } from '@my-package/components';
import { DialogContent } from '../DialogContent';
import { Label } from '../Label';
import { Slugs } from '../Slugs';

Now, the sort-order is correct indeed, but it's not multi-line anymore.
I intentionally added couple more named imports to see if this behavior was there only for one or two named imports, but multi-line seems to get removed regardless.

[neilsoult]

Unless you set maxNamedImportsInSingleLine to a value (it defaults to 0, which means disabled), this is the correct behavior.

[HansKre]

Updated config to be:

"typescript.extension.sortImports.sortMethod": "path",
  "typescript.extension.sortImports.pathSortOrder": [
    "package",
    "relativeUpLevel",
    "relativeDownLevel"
  ],
  "typescript.extension.sortImports.sortOnSave": true,
  "typescript.extension.sortImports.pathSortOrderOverride": ["react"],
  "typescript.extension.sortImports.enableJavascript": true,
  "typescript.extension.sortImports.forceTrailingCommas": "multiLineOnly",
  "typescript.extension.sortImports.maxNamedImportsInSingleLine": 1

** Step1: Input**

note the missing trailing comma after ToolReference

import React from 'react';
import { DialogContent } from '../DialogContent';
import { Label } from '../Label';
import { Slugs } from '../Slugs';
import {
  Details,
  ToolReference
} from '@my-package/components;

** Step 2: Execute Sort imports**

Output

Note the added trailing comma after ToolReference. This is added by the extension.

import React from 'react';
import {
  Details,
  ToolReference,
} from '@my-package/components;
import { DialogContent } from '../DialogContent';
import { Label } from '../Label';
import { Slugs } from '../Slugs';

** Step 3: Execute Sort Imports based on above Output **

import React from 'react';
import { DialogContent } from '../DialogContent';
import { Label } from '../Label';
import { Slugs } from '../Slugs';
import {
  Details,
  ToolReference,
} from '@my-package/components;

You are right, that trailing comma after a multi-line named import seems to be the issue. What do you think?

[neilsoult]

you still have a missing quote from your import path, this is causing problems I believe. This is not intentional is it? Shouldn't it be '@my-package/components' and not '@my-package/components as it is above?

[HansKre]

Sorry, you are right, but this is just ja copy-paste mistake that I made, since I did not want to disclose actual package name. The actual code has correct number of quotes.

[neilsoult]

I see. It appears the trailing comma functionality is broken and prevents correct sorting.

[neilsoult]

fix released in v1.17.0