WIP

Author: gky360

frontend/src/middleware/api.js

@@ -1,3 +1,5 @@
+export * from './apiMiddleware';
+
 const API_ROOT = '/api/v1/';
 
 const callApi = (endpoint, method = 'GET', body) => {

frontend/src/middleware/apiMiddleware.ts

@@ -0,0 +1,89 @@
+import { Middleware } from 'redux';
+
+export const RSAA = '@@chainerui/RSAA';
+
+export interface RSAACall<State = any, Payload = any, Meta = any> {
+  endpoint: string;
+  method: 'GET' | 'HEAD' | 'POST' | 'PUT' | 'PATCH' | 'DELETE' | 'OPTIONS';
+  types: [RSAARequestType, RSAASuccessType, RSAAFailureType];
+  body?: BodyInit | null;
+  headers?: HeadersInit;
+  options?: RequestInit;
+  credentials?: RequestCredentials;
+}
+
+export interface RSAAAction<State = any, Payload = any, Meta = any> {
+  [RSAA]: RSAACall<State, Payload, Meta>;
+}
+
+export interface RSAARequestTypeDescriptor {
+  type: string;
+}
+export interface RSAASuccessTypeDescriptor {
+  type: string;
+}
+export interface RSAAFailureTypeDescriptor {
+  type: string;
+}
+
+export type RSAARequestType = string;
+export type RSAASuccessType = string;
+export type RSAAFailureType = string;
+
+const isPlainObject = (obj: any): boolean => {
+  return obj && typeof obj == 'object' && Object.getPrototypeOf(obj) === Object.prototype;
+};
+
+const isRSAA = <State = any, Payload = any, Meta = any>(
+  action: any
+): action is RSAAAction<State, Payload, Meta> => {
+  return isPlainObject(action) && action.hasOwnProperty(RSAA);
+};
+
+const normalizeTypeDescriptors = (
+  types: [RSAARequestType, RSAASuccessType, RSAAFailureType]
+): [RSAARequestTypeDescriptor, RSAASuccessTypeDescriptor, RSAAFailureTypeDescriptor] => {
+  const [requestType, successType, failureType] = types;
+  return [{ type: requestType }, { type: successType }, { type: failureType }];
+};
+
+export const apiMiddleware: Middleware = () => (next) => (action) => {
+  if (!isRSAA(action)) {
+    return next(action);
+  }
+
+  return (async () => {
+    const callAPI = action[RSAA];
+    const { endpoint, method, types, body, headers, options = {}, credentials } = callAPI;
+    const [requestType, successType, failureType] = normalizeTypeDescriptors(types);
+
+    next(requestType);
+
+    let res;
+    try {
+      res = await fetch(endpoint, {
+        ...options,
+        method,
+        body: body || undefined,
+        credentials,
+        headers: headers || {},
+      });
+    } catch (e) {
+      return next({
+        ...failureType,
+        payload: new RequestError(e.message),
+        error: true,
+      });
+    }
+
+    const isOk = res.ok;
+    if (isOk) {
+      return next(successType);
+    } else {
+      return next({
+        ...failureType,
+        error: true,
+      });
+    }
+  })();
+};