typescript: misaligned indentation when using function shorthand with generic

[zanona]

Whenever having the following on typescript:

const foo = <T extends string>(key:T) => {};
useEffect(doAction, []);
...

The indented result becomes like:

const foo = <T extends string>(key:T) => {};
   useEffect(doAction, []);
   ....

This is due to foo accepting a generic <T extends string>, as if we take out the generic, the indentation works as expected.

The only workaround at the moment is declaring a long form function as:

const link = function<T extends string>(key:T) {};
useEffect(doAction, []);
...

I've noticed that this doesn't happen on yats.vim, but whenever having both yats.vim and vim-jsx-pretty, I believe that this plugin overrides the indentation rules set by yats.vim.

[yuezk]

It's similar to #86.

It's hard to differentiate the JSX syntax from generic syntax in typescript with plain regex syntax highlighting because the following is also a valid JSX syntax.

const T = 'div';

return <T extends string>text</T>;

Currently, we will treat all the <T as a generic and this problem can be resolved.

BTW, even though I comment out vim-jsx-pretty, this problem still exists on my machine.

[yuezk]

@zanona Update the plugin and try again.

[zanona]

@yuezk That works perfectly now. Thanks so much for adjusting this so quickly.

[malectro]

sorry for the necromancy, but i'm curious if allowing generics with names other than T is an impossible problem to solve or if the TS/Flow highlighting should run after the jsx highlighting? currently vim-polyglot runs vim-javascript before jsx_pretty.