Path Completion: Use File Icon for suggestions

[octref]

Whether it comes from internal or external icon theme.

For example, this isn't really nice

Would be great to show js/ts icons there.

For html path completion it would be much nicer too.

This would probably require changes in CompletionItemKind in LSP.

@mjbvz think you might be interested too.

[mjbvz]

Duplicate of #43204 which I closed as not worth the effort for js/ts. Html paths could be more interesting

[usernamehw]

With modern module bundlers (like webpack) it's possible to import other files (.css, .png,...) from js. Icons would be helpful in that case too.

[dbaeumer]

I am not sure what I should do with this. The CompletionItemKind has values for file and folder. There are no plans in the LSP to have CompletionItemKinds for different file types.

As @mjbvz pointed out he closed this request against TS.

@octref any objection to close this issue?

[octref]

@dbaeumer I do realize LSP isn't the right place to add support for this feature.
@jrieken I see #22206 and am wondering if you can provide any input. We have the dynamically generated icon for type color -- wondering if the same can be done for type file.

[jrieken]

The reason for keeping the number of completion item kinds is low is to lower the burden of implementing the LSP. It's not nice to require an implementor to bring along 50+ icons. Custom, extension defined, icons isn't the answer neither because then e.g. Eclipse-icons will be used inside VS Code leading to an alien-look.

It's a fine line of finding an expressive set of common icons and we will never meet all demands but that's also the idea of it.

[octref]

@jrieken Can we possibly make this a client-specific behavior. For example, when CompletionItemKind is file, read the filename in either label or textedit, match it against VS Code's matching rule for file icons, and use that icon for completion.

If other LSP clients don't have the file icon notion they can always provide one file icon.
It really helps to differentiate between the suggestion items. As @usernamehw said, Webpack allows you to import css/jpg/png/svg and whatever file Webpack's loader could resolve.

[jrieken]

For example, when CompletionItemKind is file, read the filename in either label or textedit, match it against VS Code's matching rule for file icons, and use that icon for completion.

Hm, interesting idea I like. Maybe a little harder to magic-match than colors but we should give it a try