Extract the api to a new file

Author: shepmaster

ui/frontend/.eslintrc.js

@@ -67,6 +67,7 @@ module.exports = {
         'Header.tsx',
         'PopButton.tsx',
         'Stdin.tsx',
+        'api.ts',
         'compileActions.ts',
         'editor/AceEditor.tsx',
         'editor/SimpleEditor.tsx',

ui/frontend/.prettierignore

@@ -18,6 +18,7 @@ node_modules
 !Header.tsx
 !PopButton.tsx
 !Stdin.tsx
+!api.ts
 !compileActions.ts
 !editor/AceEditor.tsx
 !editor/SimpleEditor.tsx

ui/frontend/actions.ts

@@ -1,4 +1,3 @@
-import fetch from 'isomorphic-fetch';
 import { ThunkAction as ReduxThunkAction, AnyAction } from '@reduxjs/toolkit';
 
 import {
@@ -35,21 +34,6 @@ import { performCompileToLlvmIrOnly } from './reducers/output/llvmIr';
 import { performCompileToMirOnly } from './reducers/output/mir';
 import { performCompileToWasmOnly } from './reducers/output/wasm';
 
-export const routes = {
-  compile: '/compile',
-  execute: '/execute',
-  format: '/format',
-  clippy: '/clippy',
-  miri: '/miri',
-  macroExpansion: '/macro-expansion',
-  meta: {
-    crates: '/meta/crates',
-    versions: '/meta/versions',
-    gistSave: '/meta/gist',
-    gistLoad: '/meta/gist/id',
-  },
-};
-
 export type ThunkAction<T = void> = ReduxThunkAction<T, State, {}, Action>;
 export type SimpleThunkAction<T = void> = ReduxThunkAction<T, State, {}, AnyAction>;
 
@@ -148,87 +132,6 @@ export const reExecuteWithBacktrace = (): ThunkAction => dispatch => {
   dispatch(performExecuteOnly());
 };
 
-type FetchArg = Parameters<typeof fetch>[0];
-
-export function jsonGet(url: FetchArg): Promise<unknown> {
-  return fetchJson(url, {
-    method: 'get',
-  });
-}
-
-export function jsonPost(url: FetchArg, body: Record<string, any>): Promise<unknown> {
-  return fetchJson(url, {
-    method: 'post',
-    body: JSON.stringify(body),
-  });
-}
-
-async function fetchJson(url: FetchArg, args: RequestInit) {
-  const headers = new Headers(args.headers);
-  headers.set('Content-Type', 'application/json');
-
-  let response;
-  try {
-    response = await fetch(url, { ...args, headers });
-  } catch (networkError) {
-    // e.g. server unreachable
-    if (networkError instanceof Error) {
-      throw ({
-        error: `Network error: ${networkError.toString()}`,
-      });
-    } else {
-      throw ({
-        error: 'Unknown error while fetching JSON',
-      });
-    }
-  }
-
-  let body;
-  try {
-    body = await response.json();
-  } catch (convertError) {
-    if (convertError instanceof Error) {
-      throw ({
-        error: `Response was not JSON: ${convertError.toString()}`,
-      });
-    } else {
-      throw ({
-        error: 'Unknown error while converting JSON',
-      });
-    }
-  }
-
-  if (response.ok) {
-    // HTTP 2xx
-    return body;
-  } else {
-    // HTTP 4xx, 5xx (e.g. malformed JSON request)
-    throw body;
-  }
-}
-
-// We made some strange decisions with how the `fetchJson` function
-// communicates errors, so we untwist those here to fit better with
-// redux-toolkit's ideas.
-export const adaptFetchError = async <R>(cb: () => Promise<R>): Promise<R> => {
-  let result;
-
-  try {
-    result = await cb();
-  } catch (e) {
-    if (e && typeof e === 'object' && 'error' in e && typeof e.error === 'string') {
-      throw new Error(e.error);
-    } else {
-      throw new Error('An unknown error occurred');
-    }
-  }
-
-  if (result && typeof result === 'object' && 'error' in result && typeof result.error === 'string') {
-    throw new Error(result.error);
-  }
-
-  return result;
-}
 
 function performAutoOnly(): ThunkAction {
   return function(dispatch, getState) {

ui/frontend/api.ts

@@ -0,0 +1,103 @@
+import fetch from 'isomorphic-fetch';
+
+export const routes = {
+  compile: '/compile',
+  execute: '/execute',
+  format: '/format',
+  clippy: '/clippy',
+  miri: '/miri',
+  macroExpansion: '/macro-expansion',
+  meta: {
+    crates: '/meta/crates',
+    versions: '/meta/versions',
+    gistSave: '/meta/gist',
+    gistLoad: '/meta/gist/id',
+  },
+};
+
+type FetchArg = Parameters<typeof fetch>[0];
+
+export function jsonGet(url: FetchArg): Promise<unknown> {
+  return fetchJson(url, {
+    method: 'get',
+  });
+}
+
+export function jsonPost(url: FetchArg, body: Record<string, any>): Promise<unknown> {
+  return fetchJson(url, {
+    method: 'post',
+    body: JSON.stringify(body),
+  });
+}
+
+async function fetchJson(url: FetchArg, args: RequestInit) {
+  const headers = new Headers(args.headers);
+  headers.set('Content-Type', 'application/json');
+
+  let response;
+  try {
+    response = await fetch(url, { ...args, headers });
+  } catch (networkError) {
+    // e.g. server unreachable
+    if (networkError instanceof Error) {
+      throw {
+        error: `Network error: ${networkError.toString()}`,
+      };
+    } else {
+      throw {
+        error: 'Unknown error while fetching JSON',
+      };
+    }
+  }
+
+  let body;
+  try {
+    body = await response.json();
+  } catch (convertError) {
+    if (convertError instanceof Error) {
+      throw {
+        error: `Response was not JSON: ${convertError.toString()}`,
+      };
+    } else {
+      throw {
+        error: 'Unknown error while converting JSON',
+      };
+    }
+  }
+
+  if (response.ok) {
+    // HTTP 2xx
+    return body;
+  } else {
+    // HTTP 4xx, 5xx (e.g. malformed JSON request)
+    throw body;
+  }
+}
+
+// We made some strange decisions with how the `fetchJson` function
+// communicates errors, so we untwist those here to fit better with
+// redux-toolkit's ideas.
+export const adaptFetchError = async <R>(cb: () => Promise<R>): Promise<R> => {
+  let result;
+
+  try {
+    result = await cb();
+  } catch (e) {
+    if (e && typeof e === 'object' && 'error' in e && typeof e.error === 'string') {
+      throw new Error(e.error);
+    } else {
+      throw new Error('An unknown error occurred');
+    }
+  }
+
+  if (
+    result &&
+    typeof result === 'object' &&
+    'error' in result &&
+    typeof result.error === 'string'
+  ) {
+    throw new Error(result.error);
+  }
+
+  return result;
+};

ui/frontend/compileActions.ts

@@ -1,7 +1,8 @@
 import { AsyncThunk, createAsyncThunk } from '@reduxjs/toolkit';
 import * as z from 'zod';
 
-import { SimpleThunkAction, adaptFetchError, jsonPost, routes } from './actions';
+import { SimpleThunkAction } from './actions';
+import { adaptFetchError, jsonPost, routes } from './api';
 import { compileRequestPayloadSelector } from './selectors';
 
 interface CompileRequestBody {

ui/frontend/reducers/crates.ts

@@ -2,7 +2,7 @@ import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
 import { sortBy } from 'lodash-es';
 import * as z from 'zod';
 
-import { adaptFetchError, jsonGet, routes } from '../actions';
+import { adaptFetchError, jsonGet, routes } from '../api';
 import { Crate } from '../types';
 
 const sliceName = 'crates';

ui/frontend/reducers/output/clippy.ts

@@ -1,7 +1,7 @@
 import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
 import * as z from 'zod';
 
-import { adaptFetchError, jsonPost, routes } from '../../actions';
+import { adaptFetchError, jsonPost, routes } from '../../api';
 import { clippyRequestSelector } from '../../selectors';
 import RootState from '../../state';
 

ui/frontend/reducers/output/execute.ts

@@ -1,7 +1,8 @@
 import { AnyAction, Draft, createAsyncThunk, createSlice } from '@reduxjs/toolkit';
 import * as z from 'zod';
 
-import { SimpleThunkAction, adaptFetchError, jsonPost, routes } from '../../actions';
+import { SimpleThunkAction } from '../../actions';
+import { adaptFetchError, jsonPost, routes } from '../../api';
 import { executeRequestPayloadSelector, executeViaWebsocketSelector } from '../../selectors';
 import { Channel, Edition, Mode } from '../../types';
 import {

ui/frontend/reducers/output/format.ts

@@ -1,7 +1,7 @@
 import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
 import * as z from 'zod';
 
-import { adaptFetchError, jsonPost, routes } from '../../actions';
+import { adaptFetchError, jsonPost, routes } from '../../api';
 import { formatRequestSelector } from '../../selectors';
 import RootState from '../../state';
 

ui/frontend/reducers/output/gist.ts

@@ -1,7 +1,7 @@
 import { Draft, PayloadAction, createAsyncThunk, createSlice } from '@reduxjs/toolkit';
 import * as z from 'zod';
 
-import { adaptFetchError, jsonGet, jsonPost, routes } from '../../actions';
+import { adaptFetchError, jsonGet, jsonPost, routes } from '../../api';
 import { baseUrlSelector, codeSelector } from '../../selectors';
 import RootState from '../../state';
 import { Channel, Edition, Mode } from '../../types';