added transforms and request wrappers

src/redux/auth/api.ts

@@ -1,22 +1,31 @@
-import {api, authMiddleware, errorMiddleware, resultMiddleware} from "~/utils/api";
+import {
-import { API } from "~/constants/api";
+  api,
-import {IResultWithStatus} from "~/redux/types";
+  authMiddleware,
-import {authMeTransform, userLoginTransform} from "~/redux/auth/transforms";
+  errorMiddleware,
-import {IUser} from "~/redux/auth/types";
+  resultMiddleware,
+  configWithToken,
+} from '~/utils/api';
+import { API } from '~/constants/api';
+import { IResultWithStatus } from '~/redux/types';
+import { authMeTransform, userLoginTransform } from '~/redux/auth/transforms';
+import { IUser } from '~/redux/auth/types';
 
-export const apiUserLogin = (
+export const apiUserLogin = ({
-  { username, password }:
+  username,
-  { username: string, password: string }
+  password,
-): Promise<IResultWithStatus<{ token: string, status?: number }>> => (
+}: {
-  api.post(API.USER.LOGIN, { username, password })
+  username: string;
+  password: string;
+}): Promise<IResultWithStatus<{ token: string; status?: number }>> =>
+  api
+    .post(API.USER.LOGIN, { username, password })
     .then(resultMiddleware)
     .catch(errorMiddleware)
-    .then(userLoginTransform)
+    .then(userLoginTransform);
-);
 
-export const getAuthSelf = (): Promise<IResultWithStatus<{ user: IUser }>> => (
+export const getAuthSelf = ({ access }): Promise<IResultWithStatus<{ user: IUser }>> =>
-  api.get(API.USER.ME)
+  api
+    .get(API.USER.ME, configWithToken(access))
     .then(resultMiddleware)
     .catch(errorMiddleware)
-    .then(authMeTransform)
+    .then(authMeTransform);
-);

src/utils/api/index.ts

@@ -1,7 +1,8 @@
-import axios from 'axios';
+import axios, { AxiosRequestConfig } from 'axios';
-import { API } from "~/constants/api";
+import { API } from '~/constants/api';
 import { store } from '~/redux/store';
-import { push } from "connected-react-router";
+import { push } from 'connected-react-router';
+import { IResultWithStatus } from '~/redux/types';
 
 export const authMiddleware = r => {
   store.dispatch(push('/login'));
@@ -12,5 +13,40 @@ export const api = axios.create({
   baseURL: API.BASE,
 });
 
-export const resultMiddleware = ({ status, data }) => ({ status, data });
+export const HTTP_RESPONSES = {
-export const errorMiddleware = ({ status, data, response }) => ({ status, data: data || { response } });
+  SUCCESS: 200,
+  CREATED: 201,
+  CONNECTION_REFUSED: 408,
+  BAD_REQUEST: 400,
+  UNAUTHORIZED: 401,
+  NOT_FOUND: 404,
+  TOO_MANY_REQUESTS: 429,
+};
+
+export const resultMiddleware = <T extends {}>({
+  status,
+  data,
+}: {
+  status: number;
+  data: T;
+}): { status: number; data: T } => {
+  return data && { status, data };
+};
+
+export const errorMiddleware = <T extends any>(debug): IResultWithStatus<T> =>
+  debug && debug.response
+    ? debug.response
+    : {
+      status: HTTP_RESPONSES.CONNECTION_REFUSED,
+      data: null,
+      debug,
+      error: 'Network_Disconnected',
+    };
+
+export const configWithToken = (
+  access: string,
+  config: AxiosRequestConfig = {},
+): AxiosRequestConfig => ({
+  ...config,
+  headers: { ...(config.headers || {}), Authorization: `Bearer ${access}` },
+});

tslint.json

@@ -22,7 +22,8 @@
     "jsx-curly-spacing": [true, "never"],
     "jsx-equals-spacing": [true, "never"],
     "jsx-no-multiline-js": false,
-    "jsx-boolean-value": false
+    "jsx-boolean-value": false,
+    "prefer-array-literal": false
   },
   "rulesDirectory": []
 }