typescript-vscode-plugins icon indicating copy to clipboard operation
typescript-vscode-plugins copied to clipboard

[HELP] Re-order suggestions/auto-imports

Open svipas opened this issue 1 year ago • 12 comments

I see that I can re-order suggestions/auto-imports. How I can do that if it comes locally (from the project) always first, then if it's from expo or react-native, and, lastly all other suggestions, if of course somehow this is possible or at least make that expo and react-native suggestions comes as a first one.

Another thing is that I have a issue: https://github.com/microsoft/TypeScript/issues/33511#issuecomment-2529155470. TS isn't smart in this case and suggests me Text from lib/lib.dom.d.ts even though Text exists in the React Native and I don't care about built-in Text. How I can fix that I see it as a first in suggestions instead of that lib/lib.dom.d.ts Text? Or maybe even exclude it. And, maybe it would help me to fix quick fix action so it suggests to import?

Would really appreciate your help ❤️

svipas avatar Dec 09 '24 21:12 svipas

How I can fix that I see it as a first in suggestions instead of that lib/lib.dom.d.ts Text? Or maybe even exclude it.

Try setting globalLibCompletions.action to remove

And yes I always had an idea of prioritising relative imports, not sure if it was implemented

zardoy avatar Dec 10 '24 06:12 zardoy

@zardoy Yeah it worked by removing it, but still no suggestions in Quick Fix. I think this should be fixed on TS side. But then the question is maybe it is possible to re-sort them and make sure that suggestions from expo and react-native packages come first?

svipas avatar Dec 10 '24 15:12 svipas

yes, it's possible via patchSuggestins setting

zardoy avatar Dec 10 '24 18:12 zardoy

@zardoy Would you mind showing me how, packages are named expo and react-native

svipas avatar Dec 10 '24 18:12 svipas

Maybe @Ilanaya you know how to do it correctly?

svipas avatar Dec 13 '24 17:12 svipas

@svipas I saw your issue, can't help rn.

I'll be able to work on this and help you only on this weekend.

Ilanaya avatar Dec 13 '24 17:12 Ilanaya

@Ilanaya thank you very much, great news!

svipas avatar Dec 13 '24 17:12 svipas

@svipas This will prioritize react-native's Text in suggestions

image

"tsEssentialPlugins.replaceSuggestions": [
		{
			"suggestion": "Text",
			"filter": {
				"languageMode": "TSX",
				"kind": "class"
			},
			"patch": {
				"sortText": "!"
			},
		},
		{
			"suggestion": "Text",
			"filter": {
				"languageMode": "JSX",
				"kind": "class"
			},
			"patch": {
				"sortText": "!"
			},
		},
	]

I'll see what I can do with quick fixes, but can you clarify this comment in the meantime? I'm not sure if I get the issue here - if you are using lib: ['es6'] in your app's tsconfig.json the desired quickfix is there:

image

Maybe I missing something related to this part of the comment?

I do see expo ("extends": "expo/tsconfig.base") contains "lib": ["DOM", "ESNext"]

Ilanaya avatar Dec 14 '24 11:12 Ilanaya

@Ilanaya wow thank you very much, I will try those things. Another question do you know how I can sort out expo and react-native import suggestions to be at the top? Or better maybe it is possible to have order like this:

  • First always project local imports (as @zardoy mentioned relative imports)
  • Then expo and react-native
  • And, lastly all other suggestions

So basically if I have a file index.ts which exports export const foo = () => {}

I want it to take priority and if I type foo it always becomes first in the list, then imports from expo and react-native and last all other ones from other packages.

Is that somehow possible? Or maybe at least prioritize project local imports like the one example with foo?

I hope you understood what I meant, thank you for helping me!

svipas avatar Dec 14 '24 15:12 svipas

Is that somehow possible? Or maybe at least prioritize project local imports like the one example with foo?

Yes it's easily possible, i think you can even achieve it by configuring the setting above so you prioritise any import which import completion which path starts with ./ or ../ . On the other hand I should implement it myself so aliases configured in tsconfig also take the same effect. Btw i think it's worth highlighting aliased import suggestions in the completions list just like we do with lib.dom completions

zardoy avatar Dec 14 '24 16:12 zardoy

@Ilanaya problem was not only with lib containing dom since expo decided to include it, but also missing this part: "types": ["react-native"] which solved an issue for me, also this now removes dom suggestions like Text from imports, finally!

svipas avatar Dec 15 '24 16:12 svipas

@zardoy Still it takes out imports from other packages first

image

I used this:

  "tsEssentialPlugins.replaceSuggestions": [
		{
			"suggestion": "./",
			"patch": {
				"sortText": "!"
			},
		},
		{
			"suggestion": "../",
			"patch": {
				"sortText": "!"
			},
		},
	],

svipas avatar Dec 15 '24 17:12 svipas