context menu, editing connection

web/src/utility/axios.js

@@ -0,0 +1,5 @@
+import axios from 'axios';
+
+export default axios.create({
+  baseURL: 'http://localhost:3000',
+});

web/src/utility/common.js

@@ -0,0 +1,13 @@
+export class LoadingToken {
+  constructor() {
+    this.isCanceled = false;
+  }
+
+  cancel() {
+    this.isCanceled = true;
+  }
+}
+
+export function sleep(milliseconds) {
+  return new Promise(resolve => window.setTimeout(() => resolve(null), milliseconds));
+}

web/src/utility/useFetch.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import axios from './axios';
+
+export default function useFetch(url, defValue) {
+  const [value, setValue] = React.useState(defValue);
+
+  async function loadValue() {
+    const resp = await axios.get(url);
+    setValue(resp.data);
+  }
+  React.useEffect(() => {
+    loadValue();
+  }, [url]);
+
+  return value;
+}