stuff, with a side of things

frontend/src/contexts/AppContext.tsx

@@ -1,4 +1,4 @@
-import Axios, { AxiosResponse } from 'axios'
+import axios, { AxiosResponse } from 'axios'
 import React, { createContext, useContext } from 'react'
 
 type Props = {
@@ -6,7 +6,7 @@ type Props = {
   baseURL?: string
 }
 
-type Context = {
+type AppContextInterface = {
   get: <T>(path: string) => Promise<T>
   patch: <T>(path: string, body: Partial<T>) => Promise<T>
   post: <T, R = T>(path: string, body: Partial<T>) => Promise<R>
@@ -14,30 +14,35 @@ type Context = {
   destroy: (path: string) => Promise<string>
 }
 
-const AppContext = createContext<Context | null>(null)
+const AppContext = createContext<AppContextInterface | null>(null)
 
 export const AppContextProvider = ({ children, baseURL }: Props) => {
-  const axios = Axios.create({ baseURL })
+  const api = axios.create({ baseURL })
+
+  api.interceptors.request.use((config) => {
+    config.url += '?format=json'
+    return config
+  })
 
   async function get<T>(path: string): Promise<T> {
-    const res = await axios.get<T>(path)
+    const res = await api.get<T>(path)
     return res.data
   }
   async function patch<T>(path: string, body: Partial<T>) {
-    const res = await axios.patch<T>(path, body)
+    const res = await api.patch<T>(path, body)
     return res.data
   }
   async function post<T, R = T>(path: string, body: Partial<T>) {
-    const res = await axios.post<T, AxiosResponse<R>>(path, body)
+    const res = await api.post<T, AxiosResponse<R>>(path, body)
     return res.data
   }
   async function create<T>(path: string, body: Partial<T>) {
     // unauthed POST
-    const res = await axios.post<T>(path, body)
+    const res = await api.post<T>(path, body)
     return res.data
   }
   async function destroy(path: string) {
-    const res = await axios.delete<string>(path)
+    const res = await api.delete<string>(path)
     return res.data
   }