4

I'm converting React project from jsx to tsx files.

i need full preview of types of one constant:

const canvasProps = {
  setPorts,
  setBoxes,
  setLines,
  selected,
  setSelected,
  actionState,
  setActionState,
  ... // and more
};

on hover on canvasProps I get the preview:

const canvasProps: {
    setPorts: React.Dispatch<React.SetStateAction<{
        shape: string;
        id: string;
        name: string;
        port: portType;
        ref: any;
    }[]>>;
    setBoxes: React.Dispatch<React.SetStateAction<BoxType[]>>;
    ... 13 more ...;
    toggleFlowVisibility: (flow: any) => void;
}

I need to get the full type definition of this constant, which means see the extra 13 types.

(why I need this? I need to declare the properties of React.Context, which depends on functions that have not declared yet (inside a function component) )

so I do I get the full type definition without working hard?

Eliav Louski
  • 518
  • 4
  • 17
  • I'm not sure I fully understand. Where `canvasProps` comes from? Is it an object you declared, or is it declared by 3rd party? – Mosh Feu Jun 22 '20 at 07:19
  • it's object declared inside my 'main' react component, and then this object is used as my context value object (that all the child components using). the thing is, I need to define a context using `React.createContext` outside the main component so all the other children will be able to import it, so I need to predefine the types of each var in this object. – Eliav Louski Jun 22 '20 at 07:24
  • If I understand you correctly, what about make the context structure as interface? so, first, you'll be typesafe when you change the context and second, consume that type in the children. – Mosh Feu Jun 22 '20 at 07:51
  • 1
    Here is a tiny project for a reference - https://github.com/godon019/typescript-react-useContext-example/tree/master/ – Mosh Feu Jun 22 '20 at 07:53
  • thank you for the example, but this exactly what I'm trying to do. but want to take the interface types from VS code inferring (from `canvasProps`). (because canvasProps already exists it will make me easier just to copy types inferring from it to the context interface, I've already done it by hand, but it would be much easier if there was **option to show all full type preview**) – Eliav Louski Jun 22 '20 at 08:56
  • 1
    Agreed. I tried to dig into vscode codebase to find where exactly this tooltip content been calculated but seems it's out vscode itself (but probably it's just me). This is how far I went: https://github.com/moshfeu/vscode/blob/73dfd92e65e213aba107fa0d3b722d17183a1706/extensions/typescript-language-features/src/features/hover.ts#L40. Anyway, it smells like a feature request, or a question on Github, at least. – Mosh Feu Jun 22 '20 at 10:26
  • yup, if it's doesn't exist, you right. – Eliav Louski Jun 22 '20 at 13:17

1 Answers1

0

Adding "noErrorTruncation": true to tsconfig.json has the side effect of expanding ... n more ... from the type preview in VSCode.

Muthu Kumar
  • 11
  • 1