granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Basic error handling for API errors in SSR

Browse source
This commit is contained in:
Justin Edmund 2023-01-23 14:43:01 -08:00
parent 4174c2cfa2
commit 0c8102c66f
6 changed files with 213 additions and 175 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
pages/[username].tsx
View file

@ -15,6 +15,7 @@ import organizeRaids from '~utils/organizeRaids'
import useDidMountEffect from '~utils/useDidMountEffect'
import { elements, allElement } from '~data/elements'
import { emptyPaginationObject } from '~utils/emptyStates'
import { printError } from '~utils/reportError'
import GridRep from '~components/GridRep'
import GridRepCollection from '~components/GridRepCollection'
@ -350,6 +351,7 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
// Set headers for server-side requests
setUserToken(req, res)
try {
// Fetch and organize raids
let { raids, sortedRaids } = await api.endpoints.raids
.getAll()
@ -395,6 +397,9 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
// Will be passed to the page component as props
},
}
} catch (error) {
printError(error, 'axios')
}
}
export default ProfileRoute

15
pages/new/index.tsx
View file

@ -5,11 +5,12 @@ import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
import Party from '~components/Party'
import { appState } from '~utils/appState'
import { groupWeaponKeys } from '~utils/groupWeaponKeys'
import api from '~utils/api'
import organizeRaids from '~utils/organizeRaids'
import setUserToken from '~utils/setUserToken'
import api from '~utils/api'
import { appState } from '~utils/appState'
import { groupWeaponKeys } from '~utils/groupWeaponKeys'
import { printError } from '~utils/reportError'
import type { NextApiRequest, NextApiResponse } from 'next'
import type { GroupedWeaponKeys } from '~utils/groupWeaponKeys'
@ -82,13 +83,12 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
// Set headers for server-side requests
setUserToken(req, res)
try {
let { raids, sortedRaids } = await api.endpoints.raids
.getAll()
.then((response) => organizeRaids(response.data))
let jobs = await api.endpoints.jobs
.getAll()
.then((response) => {
let jobs = await api.endpoints.jobs.getAll().then((response) => {
return response.data
})
@ -109,6 +109,9 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
// Will be passed to the page component as props
},
}
} catch (error) {
printError(error, 'axios')
}
}
export default NewRoute

22
pages/p/[party].tsx
View file

@ -6,17 +6,17 @@ import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
import Party from '~components/Party'
import { appState } from '~utils/appState'
import { groupWeaponKeys } from '~utils/groupWeaponKeys'
import api from '~utils/api'
import generateTitle from '~utils/generateTitle'
import organizeRaids from '~utils/organizeRaids'
import setUserToken from '~utils/setUserToken'
import api from '~utils/api'
import { appState } from '~utils/appState'
import { groupWeaponKeys } from '~utils/groupWeaponKeys'
import { GridType } from '~utils/enums'
import { printError } from '~utils/reportError'
import type { NextApiRequest, NextApiResponse } from 'next'
import type { GroupedWeaponKeys } from '~utils/groupWeaponKeys'
import { useQueryState } from 'next-usequerystate'
interface Props {
party: Party
@ -154,19 +154,16 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
// Set headers for server-side requests
setUserToken(req, res)
try {
let { raids, sortedRaids } = await api.endpoints.raids
.getAll()
.then((response) => organizeRaids(response.data))
let jobs = await api.endpoints.jobs
.getAll()
.then((response) => {
let jobs = await api.endpoints.jobs.getAll().then((response) => {
return response.data
})
let jobSkills = await api
.allJobSkills()
.then((response) => response.data)
let jobSkills = await api.allJobSkills().then((response) => response.data)
let weaponKeys = await api.endpoints.weapon_keys
.getAll()
@ -175,7 +172,7 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
let party: Party | null = null
if (query.party) {
let response = await api.endpoints.parties.getOne({
id: query.party
id: query.party,
})
party = response.data.party
} else {
@ -223,6 +220,9 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
// Will be passed to the page component as props
},
}
} catch (error) {
printError(error, 'axios')
}
}
export default PartyRoute

5
pages/saved.tsx
View file

@ -16,6 +16,7 @@ import organizeRaids from '~utils/organizeRaids'
import useDidMountEffect from '~utils/useDidMountEffect'
import { elements, allElement } from '~data/elements'
import { emptyPaginationObject } from '~utils/emptyStates'
import { printError } from '~utils/reportError'
import GridRep from '~components/GridRep'
import GridRepCollection from '~components/GridRepCollection'
@ -352,6 +353,7 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
// Set headers for server-side requests
setUserToken(req, res)
try {
// Fetch and organize raids
let { raids, sortedRaids } = await api.endpoints.raids
.getAll()
@ -386,6 +388,9 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
// Will be passed to the page component as props
},
}
} catch (error) {
printError(error, 'axios')
}
}
export default SavedRoute

5
pages/teams.tsx
View file

@ -16,6 +16,7 @@ import organizeRaids from '~utils/organizeRaids'
import useDidMountEffect from '~utils/useDidMountEffect'
import { elements, allElement } from '~data/elements'
import { emptyPaginationObject } from '~utils/emptyStates'
import { printError } from '~utils/reportError'
import GridRep from '~components/GridRep'
import GridRepCollection from '~components/GridRepCollection'
@ -364,6 +365,7 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
setUserToken(req, res)
// Fetch and organize raids
try {
let { raids, sortedRaids } = await api.endpoints.raids
.getAll()
.then((response) => organizeRaids(response.data))
@ -397,6 +399,9 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
// Will be passed to the page component as props
},
}
} catch (error) {
printError(error, 'axios')
}
}
export default TeamsRoute

20
utils/reportError.tsx Normal file
View file

@ -0,0 +1,20 @@
import { AxiosError } from 'axios'
function handleError(error: any) {
if (error instanceof Error) return error.message
}
function handleAxiosError(error: any) {
const axiosError = error as AxiosError
return axiosError.response
}
export function printError(error: any, type?: string) {
if (type === 'axios') {
const response = handleAxiosError(error)
console.log(`${response?.status} ${response?.statusText}`)
console.log(response?.data.toJSON())
} else {
console.log(handleError(error))
}
}