total-typescript/react-typescript-tutorial

Prettier (in StackBlitz) removes trailing comma in generic arguments in tsx files

kimroen opened this issue · 1 comments

As an example, in this challenge: src/05-generics/39-generic-props.problem.tsx.

This happens in all challenges involving a single unconstrained type argument in a TSX file (which admittedly doesn't happen extremely often).

We need to add a comma after the T, like this:

-export const Table = (props: TableProps) => {
+export const Table = <T,>(props: TableProps<T>) => {

However, when saving the file in StackBlitz Prettier removes the ,, making the file invalid:

-export const Table = <T,>(props: TableProps<T>) => {
+export const Table = <T>(props: TableProps<T>) => {

Luckily, the optional way of doing this with T extends unknown works here:

-export const Table = <T,>(props: TableProps<T>) => {
+export const Table = <T extends unknown>(props: TableProps<T>) => {

This should have been fixed in Prettier in 2019 though, so I'm not sure why this would be happening here: prettier/prettier#6114

This just got me again, in https://github.com/total-typescript/react-typescript-tutorial/blob/main/src/08-advanced-patterns/66-forward-ref-as-local-function.problem.tsx I added the expected types at the top and then when saving the <T,> was changed to <T> for the declaration for Table further down the file, causing syntax errors.