hasura アダプターで react-admin を使用しようとしています。クラッドを使用しようとすると、エラー
The response to 'GET_LIST' must be like { data: ... }, but the received response does not have a 'data' key.
認証は正常に機能していますが、「associado」データをクエリするリクエストが表示されません。AUTH_CHECK リクエストのみが起動され、「associado」テーブルに対する graphql リクエストは起動されません。リクエストが行われずにエラーがスローされます。どうしたの?
CRUD アソシアドのファイル:
import React from 'react';
import { List, Datagrid, TextField, Show, SimpleShowLayout, DateField } from 'react-admin';
export function AssociadoList(props) {
return (
<List {...props}>
<Datagrid>
<TextField source="nome" />
<DateField source="data_aniversario" />
{/*<ReferenceField label="Endereço" source="enderecoId" reference="enderecos">
<TextField source="bairro" />
<TextField source="bairro" />
</ReferenceField>*/}
</Datagrid>
</List>
)
};
export function AssociadoShow(props) {
return (
<Show {...props}>
<SimpleShowLayout>
<TextField source="nome" />
<DateField source="data_aniversario" />
</SimpleShowLayout>
</Show>
)
};
認証プロバイダー:
import { AUTH_LOGIN, AUTH_LOGOUT, AUTH_ERROR, AUTH_CHECK } from 'react-admin';
import graphql from './graphqlClient';
import Cookies from 'universal-cookie';
import { GraphQLClient } from 'graphql-request';
const cookies = new Cookies();
const LOGIN = `
mutation($username:String!, $password:String!){
login(username: $username, password: $password){
token
}
}
`;
const ME = `
query {
me {
username
}
}
`;
export default (type, params) => {
if (type === AUTH_LOGIN) {
const { username, password } = params;
return graphql.request(LOGIN, { username, password }).then(data => {
const token = data.login.token;
cookies.set("authToken", token, { path: "/", sameSite: "strict" });
});
}
if (type === AUTH_LOGOUT) {
cookies.remove("authToken", { path: "/", sameSite: "strict" });
return Promise.resolve();
}
if (type === AUTH_ERROR) {
const graphqlauth = new GraphQLClient(process.env.REACT_APP_HASURA_ENDPOINT, {
headers: {
authorization: 'Bearer ' + cookies.get('authToken'),
},
})
return graphqlauth.request(ME).then(data => { return (data.me.username) ? Promise.resolve() : Promise.reject(); }).catch(e => {
cookies.remove("authToken", { path: "/", sameSite: "strict" });
});
}
if (type === AUTH_CHECK) {
return cookies.get('authToken') ? Promise.resolve() : Promise.reject();
}
return Promise.resolve();
};
および App.js;
import React from 'react';
import { Admin, Resource } from 'react-admin';
import Dashboard from './Dashboard';
import hasuraDataProvider from 'ra-data-hasura';
import authProvider from './authProvider';
import Cookies from 'universal-cookie';
import { AssociadoList, AssociadoShow } from "./Associado";
import portugueseMessages from 'ra-language-portuguese'
const dataProvider = function () {
const cookies = new Cookies();
const dataProvider = hasuraDataProvider(process.env.REACT_APP_HASURA_URL, { "content-type": "application/json", "Authorization": "Bearer " + cookies.get("AuthToken") });
return dataProvider;
}
const messages = {
'pt': portugueseMessages,
};
const i18nProvider = locale => messages[locale];
function App() {
return (
<Admin
dataProvider={dataProvider}
authProvider={authProvider}
dashboard={Dashboard}
locale="pt" i18nProvider={i18nProvider}
>
<Resource name="adear.associado" list={AssociadoList} options={{ label: 'Associado' }} show={AssociadoShow} />
</Admin>
);
}
export default App;
これが私のpackage.jsonです
{
"name": "dashboard",
"version": "0.1.0",
"private": true,
"dependencies": {
"graphql-request": "^1.8.2",
"ra-data-hasura": "^0.0.6",
"ra-language-portuguese": "^1.5.1",
"react": "^16.8.6",
"react-admin": "2.9.5",
"react-cookie": "^4.0.1",
"react-dom": "^16.8.6",
"react-scripts": "3.0.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}