😍 pass in schema properly so dataProvider doesn't error when unauthor…

…ized and trying to query schema
ericluwj · Mar 26, 2020 · 8512843 · 8512843
1 parent 08c42d8
commit 8512843
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 46 deletions.
diff --git a/example/public/index.html b/example/public/index.html
@@ -5,6 +5,11 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta http-equiv="X-UA-Compatible" content="ie=edge" />
     <title>React App</title>
+    <style type="text/css">
+      body {
+        margin: 0;
+      }
+    </style>
   </head>
 
   <body>

diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -1,12 +1,12 @@
 import * as React from 'react';
 import { Admin } from 'react-admin';
-import { useDataProvider, useAuthProvider, reducers } from '../../';
+import { useAmplifyDataProvider, useAuthProvider, reducers } from '../../';
 
 // things for the dataProvider
 import config from './aws-exports';
 import * as queries from './graphql/queries';
 import * as mutations from './graphql/mutations';
-import * as schema from './graphql/schema.json';
+import schema from './graphql/schema.json';
 
 // Resources
 import { Resource } from 'react-admin';
@@ -21,7 +21,12 @@ import {
 import { MediaList, MediaShow, MediaEdit, MediaIcon } from './Media';
 
 export const App = () => {
-  const dataProvider = useDataProvider({ config, schema, queries, mutations });
+  const dataProvider = useAmplifyDataProvider({
+    config,
+    schema,
+    queries,
+    mutations,
+  });
   const authProvider = useAuthProvider();
 
   return dataProvider ? (

diff --git a/src/buildAmplifyProvider/buildAmplifyProvider.ts b/src/buildAmplifyProvider/buildAmplifyProvider.ts
@@ -43,15 +43,13 @@ export const buildAmplifyProvider = ({
   schema,
   ...options
 }: any) => {
-  const client = createClient({
-    ...options,
-    introspection: { schema: schema.data },
-  });
+  const client = createClient({ ...options });
   const buildQuery = defaultBuildQuery({ queries, mutations, schema });
+  const args = merge({ client, buildQuery }, defaultOptions, options, {
+    introspection: { schema: schema.data.__schema },
+  });
 
-  return buildDataProvider(
-    merge({ client, buildQuery }, defaultOptions, options)
-  ).then((defaultDataProvider: any) => {
+  return buildDataProvider(args).then((defaultDataProvider: any) => {
     return (fetchType: any, resource: any, params: any) => {
       // Amplify does not support multiple deletions so instead we send multiple DELETE requests
       // This can be optimized using the apollo-link-batch-http

diff --git a/src/buildAmplifyProvider/getAuthType.ts b/src/buildAmplifyProvider/getAuthType.ts
@@ -0,0 +1,38 @@
+import { AUTH_TYPE, AuthOptions } from 'aws-appsync-auth-link';
+import { Auth } from 'aws-amplify';
+
+export const getAuthType = (
+  config: Record<string, any>,
+  specifiedAuthType?: AUTH_TYPE | undefined
+): AuthOptions => {
+  const authType =
+    specifiedAuthType ||
+    config.aws_appsync_authenticationType ||
+    AUTH_TYPE.NONE;
+  switch (authType) {
+    case AUTH_TYPE.AMAZON_COGNITO_USER_POOLS:
+      return {
+        // @ts-ignore
+        type: AUTH_TYPE.AMAZON_COGNITO_USER_POOLS,
+        jwtToken: async () => {
+          try {
+            return (await Auth.currentSession()).getAccessToken().getJwtToken();
+          } catch (error) {
+            console.log('error with jwt', error);
+            return Promise.reject('Unauthorized');
+          }
+        },
+      };
+
+    case AUTH_TYPE.API_KEY:
+      return {
+        type: AUTH_TYPE.API_KEY,
+        apiKey: config.aws_appsync_apiKey,
+      };
+    case AUTH_TYPE.NONE:
+    default:
+      return {
+        type: AUTH_TYPE.NONE,
+      };
+  }
+};
diff --git a/src/buildAmplifyProvider/useAmplifyDataProvider.ts b/src/buildAmplifyProvider/useAmplifyDataProvider.ts
@@ -1,11 +1,10 @@
 import { DataProvider } from 'ra-core';
-// import { IntrospectionResultData } from 'apollo-cache-inmemory';
-import { Auth } from 'aws-amplify';
-import { AUTH_TYPE, AuthOptions } from 'aws-appsync-auth-link';
+import { AUTH_TYPE } from 'aws-appsync-auth-link';
 import { useState, useEffect } from 'react';
 
 import { useUser } from '../AmplifyAuthProvider';
 import { buildAmplifyProvider } from './buildAmplifyProvider';
+import { getAuthType } from './getAuthType';
 
 interface useDataProviderArgs {
   config: Record<string, any>;
@@ -18,36 +17,6 @@ interface useDataProviderArgs {
   // };
 }
 
-const getAuthType = (
-  config: Record<string, any>,
-  specifiedAuthType?: AUTH_TYPE | undefined
-): AuthOptions => {
-  const authType =
-    specifiedAuthType ||
-    config.aws_appsync_authenticationType ||
-    AUTH_TYPE.NONE;
-  switch (authType) {
-    case AUTH_TYPE.AMAZON_COGNITO_USER_POOLS:
-      return {
-        // @ts-ignore
-        type: AUTH_TYPE.AMAZON_COGNITO_USER_POOLS,
-        jwtToken: async () =>
-          (await Auth.currentSession()).getAccessToken().getJwtToken(),
-      };
-
-    case AUTH_TYPE.API_KEY:
-      return {
-        type: AUTH_TYPE.API_KEY,
-        apiKey: config.aws_appsync_apiKey,
-      };
-    case AUTH_TYPE.NONE:
-    default:
-      return {
-        type: AUTH_TYPE.NONE,
-      };
-  }
-};
-
 export function useAmplifyDataProvider({
   config,
   schema,
@@ -78,9 +47,9 @@ export function useAmplifyDataProvider({
   let specifiedAuthType = authType || config.aws_appsync_authenticationType;
 
   useEffect(() => {
-    if (specifiedAuthType === AUTH_TYPE.AMAZON_COGNITO_USER_POOLS && !user) {
-      specifiedAuthType = AUTH_TYPE.NONE;
-    }
+    // if (specifiedAuthType === AUTH_TYPE.AMAZON_COGNITO_USER_POOLS && !user) {
+    //   return;
+    // }
 
     buildDataProvider(specifiedAuthType).then(dataProvider =>
       setDataProvider(() => dataProvider)