feat: new API

.env.development

@@ -1,2 +1,2 @@
-REACT_APP_PATCH_USER_SETTINGS_URL=https://8aoprv935h.execute-api.us-east-2.amazonaws.com/staging/user-settings
-REACT_APP_PUT_JUSTIFICATIONS_URL=https://8aoprv935h.execute-api.us-east-2.amazonaws.com/staging/justifications
+REACT_APP_USER_SETTINGS_URL=https://8aoprv935h.execute-api.us-east-2.amazonaws.com/staging/user-settings
+REACT_APP_JUSTIFICATIONS_URL=https://8aoprv935h.execute-api.us-east-2.amazonaws.com/staging/justifications

.env.production

@@ -1,2 +1,2 @@
-REACT_APP_PATCH_USER_SETTINGS_URL=https://hgyxlve79a.execute-api.us-east-2.amazonaws.com/production/user-settings
-REACT_APP_PUT_JUSTIFICATIONS_URL=https://hgyxlve79a.execute-api.us-east-2.amazonaws.com/production/justifications
+REACT_APP_USER_SETTINGS_URL=https://hgyxlve79a.execute-api.us-east-2.amazonaws.com/production/user-settings
+REACT_APP_JUSTIFICATIONS_URL=https://hgyxlve79a.execute-api.us-east-2.amazonaws.com/production/justifications

netlify.toml

@@ -15,13 +15,13 @@
   REACT_APP_UNISWAP_EXCHANGE_ADDRESS='0xF506828B166de88cA2EDb2A98D960aBba0D2402A'
   REACT_APP_WEB3_FALLBACK_URL='wss://mainnet.infura.io/ws'
   REACT_APP_DRAW_EVENT_LISTENER_BLOCK_NUMBER='7303699'
-  REACT_APP_PATCH_USER_SETTINGS_URL='https://8aoprv935h.execute-api.us-east-2.amazonaws.com/staging/user-settings'
-  REACT_APP_PUT_JUSTIFICATIONS_URL='https://8aoprv935h.execute-api.us-east-2.amazonaws.com/staging/justifications'
+  REACT_APP_USER_SETTINGS_URL='https://8aoprv935h.execute-api.us-east-2.amazonaws.com/staging/user-settings'
+  REACT_APP_JUSTIFICATIONS_URL='https://8aoprv935h.execute-api.us-east-2.amazonaws.com/staging/justifications'
 
 [context.production.environment]
   REACT_APP_CONTEXT='production'
-  REACT_APP_PATCH_USER_SETTINGS_URL='https://hgyxlve79a.execute-api.us-east-2.amazonaws.com/production/user-settings'
-  REACT_APP_PUT_JUSTIFICATIONS_URL='https://hgyxlve79a.execute-api.us-east-2.amazonaws.com/production/justifications'
+  REACT_APP_USER_SETTINGS_URL='https://hgyxlve79a.execute-api.us-east-2.amazonaws.com/production/user-settings'
+  REACT_APP_JUSTIFICATIONS_URL='https://hgyxlve79a.execute-api.us-east-2.amazonaws.com/production/justifications'
 
 [[redirects]]
   from = "/*"

src/bootstrap/api.js

@@ -0,0 +1,99 @@
+import { useEffect, useState } from 'react'
+import web3DeriveAccount from '../temp/web3-derive-account'
+
+const funcs = [
+  {
+    URL: process.env.REACT_APP_USER_SETTINGS_URL,
+    method: 'GET',
+    name: 'getUserSettings',
+    payload: 'settings'
+  },
+  {
+    URL: process.env.REACT_APP_USER_SETTINGS_URL,
+    method: 'PATCH',
+    name: 'patchUserSettings',
+    payload: 'settings'
+  },
+  {
+    URL: process.env.REACT_APP_JUSTIFICATIONS_URL,
+    method: 'PUT',
+    name: 'putJustifications',
+    payload: 'justification'
+  }
+]
+
+export const API = funcs.reduce((acc, f) => {
+  acc[f.name] = async (web3, account, payload) => {
+    const derivedAccount = await web3DeriveAccount(
+      web3,
+      account,
+      'Kleros Court Secret'
+    )
+    const func = () =>
+      fetch(f.URL, {
+        body: JSON.stringify({
+          payload: {
+            address: account,
+            signature: derivedAccount.sign(JSON.stringify(payload)).signature,
+            [f.payload]: payload
+          }
+        }),
+        headers: { 'Content-Type': 'application/json' },
+        method: f.method === 'GET' ? 'POST' : f.method
+      }).then(res => res.json())
+    const res = await func()
+    if (res.error) {
+      const settings = {
+        derivedAccountAddress: {
+          S: derivedAccount.address
+        }
+      }
+      await fetch(process.env.REACT_APP_USER_SETTINGS_URL, {
+        body: JSON.stringify({
+          payload: {
+            address: account,
+            settings,
+            signature: await web3.eth.personal.sign(
+              JSON.stringify(settings),
+              account
+            )
+          }
+        }),
+        headers: { 'Content-Type': 'application/json' },
+        method: 'PATCH'
+      }).then(res => res.json())
+      return func()
+    }
+    return res
+  }
+  return acc
+}, {})
+
+export const useAPI = funcs.reduce((acc, f) => {
+  acc[f.name] = (web3, account, payload) => {
+    const [state, setState] = useState(
+      f.method === 'GET' ? 'pending' : undefined
+    )
+    let mounted = true
+    const send = async payload => {
+      let state
+      try {
+        if (state !== 'pending') setState('pending')
+        state = await API[f.name](web3, account, payload)
+      } catch (err) {
+        console.error(err)
+        state = { error: 'An unexpected error occurred.' }
+      }
+      if (mounted) setState(state)
+    }
+    if (f.method === 'GET') {
+      useEffect(() => {
+        send(payload)
+        return () => (mounted = false)
+      }, [web3, account, JSON.stringify(payload)])
+      return state
+    }
+    return { send, state }
+  }
+  return acc
+}, {})

src/components/case-details-card.js

@@ -1,6 +1,7 @@
 import { Button, Card, Col, Input, Row, Skeleton, Spin } from 'antd'
 import React, { useCallback, useMemo, useState } from 'react'
 import { useDrizzle, useDrizzleState } from '../temp/drizzle-react-hooks'
+import { API } from '../bootstrap/api'
 import Attachment from '../components/attachment'
 import Breadcrumbs from '../components/breadcrumbs'
 import CourtDrawer from '../components/court-drawer'
@@ -11,7 +12,6 @@ import PropTypes from 'prop-types'
 import ReactMarkdown from 'react-markdown'
 import styled from 'styled-components/macro'
 import { useDataloader } from '../bootstrap/dataloader'
-import web3DeriveAccount from '../temp/web3-derive-account'
 import web3Salt from '../temp/web3-salt'
 
 const StyledCard = styled(Card)`
@@ -330,61 +330,12 @@ const CaseDetailsCard = ({ ID }) => {
               )
             : 0
         )
-        const derivedAccount = await web3DeriveAccount(
-          drizzle.web3,
-          drizzleState.account,
-          'Kleros Court Secret'
-        )
-        const votes = {
+        API.putJustifications(drizzle.web3, drizzleState.account, {
           IDs: votesData.voteIDs,
           appeal: dispute2.votesLengths.length - 1,
           disputeID: ID,
           justification
-        }
-        if (
-          (await (await fetch(process.env.REACT_APP_PUT_JUSTIFICATIONS_URL, {
-            body: JSON.stringify({
-              payload: {
-                address: drizzleState.account,
-                signature: derivedAccount.sign(JSON.stringify(votes)).signature,
-                votes
-              }
-            }),
-            headers: { 'Content-Type': 'application/json' },
-            method: 'PUT'
-          })).json()).error
-        ) {
-          const settings = {
-            derivedAccountAddressForJustifications: {
-              S: derivedAccount.address
-            }
-          }
-          await (await fetch(process.env.REACT_APP_PATCH_USER_SETTINGS_URL, {
-            body: JSON.stringify({
-              payload: {
-                address: drizzleState.account,
-                settings,
-                signature: await drizzle.web3.eth.personal.sign(
-                  JSON.stringify(settings),
-                  drizzleState.account
-                )
-              }
-            }),
-            headers: { 'Content-Type': 'application/json' },
-            method: 'PATCH'
-          })).json()
-          await (await fetch(process.env.REACT_APP_PUT_JUSTIFICATIONS_URL, {
-            body: JSON.stringify({
-              payload: {
-                address: drizzleState.account,
-                signature: derivedAccount.sign(JSON.stringify(votes)).signature,
-                votes
-              }
-            }),
-            headers: { 'Content-Type': 'application/json' },
-            method: 'PUT'
-          })).json()
-        }
+        })
       }
     },
     [