React Hooks - JSDoc with destructured array variables

Solution 1:

It would help:

    /**
     * @typedef {Boolean} LoadingState — documentation for isLoading
     * @description Additional doc
     */
    /**
     * @typedef {Function} LoadingStateSetter — documentation for setIsLoading
     */
    /**
     * @type {[LoadingState, LoadingStateSetter]} Loading
     */
    const [isLoading, setIsLoading] = React.useState();

In this example we declare two additional types: LoadingState and LoadingStateSetter. Then we add some description for them and finally, we declare the Loading type for the result of React.useState()

You also can declare it in a more simple way like this:

    /**
      * @type {[Boolean, Function]} Loading
      */
    const [isLoading, setIsLoading] = React.useState();

But I didn't find a way to add a description in this case.

I've checked the description of such way of documentation in VSCode

Solution 2:

You can try this:

/** @type {boolean} */
const initialState = false
const [isLoading, setIsLoading] = React.useState(initialState)

Solution 3:

The actual best solution to be found here is by using parentheses. Otherwise jsdoc does not seem to catch it:

const [authFormInput, setAuthFormInput] = useState(/** @type {AuthFormInput} */({..}));