Comment taper un RelayContainer exporté

J’essaie de taper (avec flowtype) les composants que Relay.createContainer avec Relay.createContainer .

J’ai examiné les types exportés par le package ” react -relay”, mais ReactContainer ne semble pas porter sur Props.

J’ai expérimenté avec RelayContainer , ReactClass , React$Component etc. Au final, le résultat le plus proche du résultat attendu est:

 // Foo.js // @flow import React from "react"; import Relay from "react-relay"; type Props = { title: ssortingng; } const Foo({ title }: Props) => (
{title}
); const exported: Class<React$Component> = Relay.createContainer(Foo, { fragments: { ... } }); export default exported;

 // Bar.js // @flow import React from "react"; import Foo from "./Foo.js"; const Bar = () => ; 

Maintenant, le flot va se plaindre dans Foo.js autour de Props que Bar ne fournit pas le titre prop, ce qui est ce que je veux (je voudrais qu’il se plaint dans Bar.js mais c’est un détail). Cependant, si Bar était également un RelayContainer référence au stream de fragment de Foo, il se plaindrait de ne pas pouvoir trouver getFragment dans les propriétés de Foo:

 // Bar.js // @flow import React from "react"; import Relay from "react-relay"; import Foo from "./Foo.js"; const Bar = () => ; export default Relay.createContainer(Bar, { fragments: { baz: () => Relay.QL` fragment on Baz { ${Foo.getFragment("foo")} } ` } } 

En fin de compte, j’essaie de taper la sortie de Relay.createContainer pour qu’elle reprenne la saisie du composant décoré. J’ai regardé dans les types internes du relais et j’ai vu https://github.com/facebook/relay/blob/8567b2732d94d75f0eacdce4cc43c3606960a1d9/src/query/RelayFragmentReference.js#L211 mais je pense que ce n’est pas la façon d’aller append les propriétés de Relay.

Toute idée de comment pourrais-je y parvenir?

Comme @gre l’a fait remarquer, le compilateur de relais génère maintenant des types de stream pour le fragment et ceux-ci sont exportés dans des fichiers générés dans un sous-répertoire __generated__ .

générer ledit fichier en exécutant le compilateur de relais

relay-comstackr --src ./src --schema ./schema.json

Vous importez alors les types de stream pour les accessoires de champ comme suit:

 import type { MyComponent_myField } from "./__generated__/MyComponent_myField.graphql"; class MyComponent extends Component<{ myField: MyComponent_myField, }> { render() { return 
Example
; } } export default createFragmentContainer(MyComponent, { myField: graphql` fragment MyComponent_myField on MyType { edges { node { _id foo } } } ` });

Bien que les types AFAIK actuellement utilisés pour les fragments étalés ne soient pas générés, à moins que vous n’utilisiez le système de module Haste