Working TypeScript example, can't get it to work

[MarkusWendorf]

Good evening,

I'm trying to get unistore to work with TypeScript and properly type my store. I would like to ask for some help on my example (Typescript on React).

Repo: Unistore TypeScript
I'm getting an error: TS2604: JSX element type 'App' does not have any construct or call signatures.
If I ignore the error with @ts-ignore everything works as expected.

What am I missing?

PS:
I would appreciate if you would include a working TypeScript example with every release.

[joseluisq]

Here a TypeScript (TSX) working example using v3.1.0 https://github.com/joseluisq/preact-starter

[stephan281094]

I'm having the same issue, using React. It seems as if connect returns an instance of the component, instead of the constructor. Have a look at the following code snippet.

import * as React from "react";
import { render } from "react-dom";
import createStore from "unistore"
import { connect, Provider } from "unistore/react";

const store = createStore({ bar: "baz" });

const Foo = connect("bar")((props: any) => (
  <h1>{props.bar}</h1>
));

// Throws "JSX element type 'Foo' does not have any construct or call signatures. [2604]".
const App = () => (
  <Provider store={store}>
    <Foo />
  </Provider>
);

render(<App />, document.querySelector(".mount"));

@types/react: 16.7.7
React: 16.6.3
Typescript: 3.1.6
Unistore: 3.1.0

[stephan281094]

@joseluisq Excuse me for the direct mention. Do you also have a working example in React?

[joseluisq]

@stephan281094 No, I don't have one but did you tried this?

[stephan281094]

@joseluisq I actually meant an example where they use both React and TypeScript. The example of ReactStateMuseum isn't written in TypeScript.

To clarify, I did manage to get unistore working with React in plain javascript, but not with TypeScript due to the error @MarkusWendorf is describing in this issue.

[joseluisq]

@joseluisq I actually meant an example where they use both React and TypeScript. The example of ReactStateMuseum isn't written in TypeScript.

To clarify, I did manage to get unistore working with React in plain javascript, but not with TypeScript due to the error @MarkusWendorf is describing in this issue.

Sorry by my incomprehension.

[joseluisq]

Here my exploration about the current error:

unistore/preact

Preact.ComponentConstructor as result

unistore/react

React.Component as result

unistore/react

Note: Just changing React.Component with React.ComponentClass solves the issue.

Thoughts?

[stephan281094]

Thanks for the quick response. Your change got rid of the error, great work! Not sure if this change is compatible with previous versions of React though. Might require some research.

[developit]

looks like React.ComponentClass has been available since React 15.

[developit]

I've opened a PR with the above change.

[stephan281094]

Awesome, thanks!

[developit]

Released as 3.2.0!

[joseluisq]

👍

@developit Is #127 issue already fixed too?