Merge pull request #212 from jedmund/unauth-teams
Allow editing of unauth teams
This commit is contained in:
commit
72ac1b8a02
18 changed files with 207 additions and 95 deletions
|
|
@ -23,6 +23,7 @@ import './index.scss'
|
|||
// Props
|
||||
interface Props {
|
||||
new: boolean
|
||||
editable: boolean
|
||||
characters?: GridCharacter[]
|
||||
createParty: (details?: DetailsObject) => Promise<Party>
|
||||
pushHistory?: (path: string) => void
|
||||
|
|
@ -75,17 +76,6 @@ const CharacterGrid = (props: Props) => {
|
|||
[key: number]: number | undefined
|
||||
}>({})
|
||||
|
||||
// Set the editable flag only on first load
|
||||
useEffect(() => {
|
||||
// If user is logged in and matches
|
||||
if (
|
||||
(accountData && party.user && accountData.userId === party.user.id) ||
|
||||
props.new
|
||||
)
|
||||
appState.party.editable = true
|
||||
else appState.party.editable = false
|
||||
}, [props.new, accountData, party])
|
||||
|
||||
useEffect(() => {
|
||||
setJob(appState.party.job)
|
||||
setJobSkills(appState.party.jobSkills)
|
||||
|
|
@ -115,7 +105,7 @@ const CharacterGrid = (props: Props) => {
|
|||
.catch((error) => console.error(error))
|
||||
})
|
||||
} else {
|
||||
if (party.editable)
|
||||
if (props.editable)
|
||||
saveCharacter(party.id, character, position)
|
||||
.then((response) => handleCharacterResponse(response.data))
|
||||
.catch((error) => {
|
||||
|
|
@ -232,7 +222,7 @@ const CharacterGrid = (props: Props) => {
|
|||
}
|
||||
|
||||
function saveJobSkill(skill: JobSkill, position: number) {
|
||||
if (party.id && appState.party.editable) {
|
||||
if (party.id && props.editable) {
|
||||
const positionedKey = `skill${position}_id`
|
||||
|
||||
let skillObject: {
|
||||
|
|
@ -522,7 +512,7 @@ const CharacterGrid = (props: Props) => {
|
|||
job={job}
|
||||
jobSkills={jobSkills}
|
||||
jobAccessory={jobAccessory}
|
||||
editable={party.editable}
|
||||
editable={props.editable}
|
||||
saveJob={saveJob}
|
||||
saveSkill={saveJobSkill}
|
||||
saveAccessory={saveAccessory}
|
||||
|
|
@ -541,7 +531,7 @@ const CharacterGrid = (props: Props) => {
|
|||
<li key={`grid_unit_${i}`}>
|
||||
<CharacterUnit
|
||||
gridCharacter={grid.characters[i]}
|
||||
editable={party.editable}
|
||||
editable={props.editable}
|
||||
position={i}
|
||||
updateObject={receiveCharacterFromSearch}
|
||||
updateUncap={initiateUncapUpdate}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next'
|
|||
import axios, { AxiosError, AxiosResponse } from 'axios'
|
||||
|
||||
import api from '~utils/api'
|
||||
import setUserToken from '~utils/setUserToken'
|
||||
import { setHeaders } from '~utils/userToken'
|
||||
import { accountState } from '~utils/accountState'
|
||||
|
||||
import Button from '~components/Button'
|
||||
|
|
@ -147,7 +147,7 @@ const LoginModal = (props: Props) => {
|
|||
setCookie('account', cookieObj, { path: '/', expires: expiresAt })
|
||||
|
||||
// Set Axios default headers
|
||||
setUserToken()
|
||||
setHeaders()
|
||||
}
|
||||
|
||||
function storeUserInfo(response: AxiosResponse) {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
import React, { useEffect, useState } from 'react'
|
||||
import { getCookie } from 'cookies-next'
|
||||
import { useRouter } from 'next/router'
|
||||
import { useSnapshot } from 'valtio'
|
||||
import clonedeep from 'lodash.clonedeep'
|
||||
import ls from 'local-storage'
|
||||
|
||||
import PartySegmentedControl from '~components/PartySegmentedControl'
|
||||
import PartyDetails from '~components/PartyDetails'
|
||||
|
|
@ -13,6 +15,8 @@ import api from '~utils/api'
|
|||
import { appState, initialAppState } from '~utils/appState'
|
||||
import { GridType } from '~utils/enums'
|
||||
import { retrieveCookies } from '~utils/retrieveCookies'
|
||||
import { accountCookie, setEditKey, unsetEditKey } from '~utils/userToken'
|
||||
|
||||
import type { DetailsObject } from '~types'
|
||||
|
||||
import './index.scss'
|
||||
|
|
@ -36,6 +40,7 @@ const Party = (props: Props) => {
|
|||
|
||||
// Set up states
|
||||
const { party } = useSnapshot(appState)
|
||||
const [editable, setEditable] = useState(false)
|
||||
const [currentTab, setCurrentTab] = useState<GridType>(GridType.Weapon)
|
||||
|
||||
// Retrieve cookies
|
||||
|
|
@ -48,6 +53,41 @@ const Party = (props: Props) => {
|
|||
if (props.team) storeParty(props.team)
|
||||
}, [])
|
||||
|
||||
// Set editable on first load
|
||||
useEffect(() => {
|
||||
// Get cookie
|
||||
const cookie = getCookie('account')
|
||||
const accountData: AccountCookie = cookie
|
||||
? JSON.parse(cookie as string)
|
||||
: null
|
||||
|
||||
let editable = false
|
||||
unsetEditKey()
|
||||
|
||||
if (props.new) editable = true
|
||||
|
||||
if (accountData && props.team && !props.new) {
|
||||
if (accountData.token) {
|
||||
// Authenticated
|
||||
if (props.team.user && accountData.userId === props.team.user.id) {
|
||||
editable = true
|
||||
}
|
||||
} else {
|
||||
// Not authenticated
|
||||
if (!props.team.user && accountData.userId === props.team.local_id) {
|
||||
// Set editable
|
||||
editable = true
|
||||
|
||||
// Also set edit key header
|
||||
setEditKey(props.team.id, props.team.user)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
appState.party.editable = editable
|
||||
setEditable(editable)
|
||||
})
|
||||
|
||||
// Set selected tab from props
|
||||
useEffect(() => {
|
||||
setCurrentTab(props.selectedTab)
|
||||
|
|
@ -59,13 +99,13 @@ const Party = (props: Props) => {
|
|||
if (details) payload = formatDetailsObject(details)
|
||||
|
||||
return await api.endpoints.parties
|
||||
.create(payload)
|
||||
.create({ ...payload, ...localId() })
|
||||
.then((response) => storeParty(response.data.party))
|
||||
}
|
||||
|
||||
// Methods: Updating the party's details
|
||||
async function updateDetails(details: DetailsObject) {
|
||||
if (!appState.party.id) return await createParty(details)
|
||||
if (!props.team) return await createParty(details)
|
||||
else updateParty(details)
|
||||
}
|
||||
|
||||
|
|
@ -92,9 +132,9 @@ const Party = (props: Props) => {
|
|||
async function updateParty(details: DetailsObject) {
|
||||
const payload = formatDetailsObject(details)
|
||||
|
||||
if (appState.party.id) {
|
||||
if (props.team && props.team.id) {
|
||||
return await api.endpoints.parties
|
||||
.update(appState.party.id, payload)
|
||||
.update(props.team.id, payload)
|
||||
.then((response) => storeParty(response.data.party))
|
||||
}
|
||||
}
|
||||
|
|
@ -103,8 +143,8 @@ const Party = (props: Props) => {
|
|||
appState.party.extra = event.target.checked
|
||||
|
||||
// Only save if this is a saved party
|
||||
if (appState.party.id) {
|
||||
api.endpoints.parties.update(appState.party.id, {
|
||||
if (props.team && props.team.id) {
|
||||
api.endpoints.parties.update(props.team.id, {
|
||||
party: { extra: event.target.checked },
|
||||
})
|
||||
}
|
||||
|
|
@ -112,9 +152,9 @@ const Party = (props: Props) => {
|
|||
|
||||
// Deleting the party
|
||||
function deleteTeam() {
|
||||
if (appState.party.editable && appState.party.id) {
|
||||
if (props.team && editable) {
|
||||
api.endpoints.parties
|
||||
.destroy({ id: appState.party.id })
|
||||
.destroy({ id: props.team.id })
|
||||
.then(() => {
|
||||
// Push to route
|
||||
if (cookies && cookies.account.username) {
|
||||
|
|
@ -139,7 +179,7 @@ const Party = (props: Props) => {
|
|||
}
|
||||
|
||||
// Methods: Storing party data
|
||||
const storeParty = function (team: Party) {
|
||||
const storeParty = function (team: any) {
|
||||
// Store the important party and state-keeping values in global state
|
||||
appState.party.name = team.name
|
||||
appState.party.description = team.description
|
||||
|
|
@ -162,6 +202,12 @@ const Party = (props: Props) => {
|
|||
|
||||
appState.party.detailsVisible = false
|
||||
|
||||
// Store the edit key in local storage
|
||||
if (team.edit_key) {
|
||||
storeEditKey(team.id, team.edit_key)
|
||||
setEditKey(team.id, team.user)
|
||||
}
|
||||
|
||||
// Populate state
|
||||
storeCharacters(team.characters)
|
||||
storeWeapons(team.weapons)
|
||||
|
|
@ -183,6 +229,10 @@ const Party = (props: Props) => {
|
|||
return team
|
||||
}
|
||||
|
||||
const storeEditKey = (id: string, key: string) => {
|
||||
ls(id, key)
|
||||
}
|
||||
|
||||
const storeCharacters = (list: Array<GridCharacter>) => {
|
||||
list.forEach((object: GridCharacter) => {
|
||||
if (object.position != null)
|
||||
|
|
@ -240,6 +290,15 @@ const Party = (props: Props) => {
|
|||
}
|
||||
}
|
||||
|
||||
// Methods: Unauth validation
|
||||
function localId() {
|
||||
const cookie = accountCookie()
|
||||
const parsed = JSON.parse(cookie as string)
|
||||
if (parsed && !parsed.token) {
|
||||
return { local_id: parsed.userId }
|
||||
} else return {}
|
||||
}
|
||||
|
||||
// Render: JSX components
|
||||
const navigation = (
|
||||
<PartySegmentedControl
|
||||
|
|
@ -252,6 +311,7 @@ const Party = (props: Props) => {
|
|||
const weaponGrid = (
|
||||
<WeaponGrid
|
||||
new={props.new || false}
|
||||
editable={editable}
|
||||
weapons={props.team?.weapons}
|
||||
createParty={createParty}
|
||||
pushHistory={props.pushHistory}
|
||||
|
|
@ -261,6 +321,7 @@ const Party = (props: Props) => {
|
|||
const summonGrid = (
|
||||
<SummonGrid
|
||||
new={props.new || false}
|
||||
editable={editable}
|
||||
summons={props.team?.summons}
|
||||
createParty={createParty}
|
||||
pushHistory={props.pushHistory}
|
||||
|
|
@ -270,6 +331,7 @@ const Party = (props: Props) => {
|
|||
const characterGrid = (
|
||||
<CharacterGrid
|
||||
new={props.new || false}
|
||||
editable={editable}
|
||||
characters={props.team?.characters}
|
||||
createParty={createParty}
|
||||
pushHistory={props.pushHistory}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { useTranslation } from 'next-i18next'
|
|||
import { AxiosResponse } from 'axios'
|
||||
|
||||
import api from '~utils/api'
|
||||
import setUserToken from '~utils/setUserToken'
|
||||
import { setHeaders } from '~utils/userToken'
|
||||
import { accountState } from '~utils/accountState'
|
||||
|
||||
import Button from '~components/Button'
|
||||
|
|
@ -103,7 +103,7 @@ const SignupModal = (props: Props) => {
|
|||
setCookie('account', cookieObj, { path: '/', expires: expiresAt })
|
||||
|
||||
// Set Axios default headers
|
||||
setUserToken()
|
||||
setHeaders()
|
||||
}
|
||||
|
||||
function fetchUserInfo(id: string) {
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@ import './index.scss'
|
|||
// Props
|
||||
interface Props {
|
||||
new: boolean
|
||||
editable: boolean
|
||||
summons?: GridSummon[]
|
||||
createParty: (details?: DetailsObject) => Promise<Party>
|
||||
pushHistory?: (path: string) => void
|
||||
|
|
@ -55,17 +56,6 @@ const SummonGrid = (props: Props) => {
|
|||
[key: number]: number
|
||||
}>({})
|
||||
|
||||
// Set the editable flag only on first load
|
||||
useEffect(() => {
|
||||
// If user is logged in and matches
|
||||
if (
|
||||
(accountData && party.user && accountData.userId === party.user.id) ||
|
||||
props.new
|
||||
)
|
||||
appState.party.editable = true
|
||||
else appState.party.editable = false
|
||||
}, [props.new, accountData, party])
|
||||
|
||||
// Initialize an array of current uncap values for each summon
|
||||
useEffect(() => {
|
||||
let initialPreviousUncapValues: { [key: number]: number } = {}
|
||||
|
|
@ -100,7 +90,7 @@ const SummonGrid = (props: Props) => {
|
|||
)
|
||||
})
|
||||
} else {
|
||||
if (party.editable)
|
||||
if (props.editable)
|
||||
saveSummon(party.id, summon, position)
|
||||
.then((response) => handleSummonResponse(response.data))
|
||||
.catch((error) => {
|
||||
|
|
@ -401,7 +391,7 @@ const SummonGrid = (props: Props) => {
|
|||
<div className="Label">{t('summons.main')}</div>
|
||||
<SummonUnit
|
||||
gridSummon={grid.summons.mainSummon}
|
||||
editable={party.editable}
|
||||
editable={props.editable}
|
||||
key="grid_main_summon"
|
||||
position={-1}
|
||||
unitType={0}
|
||||
|
|
@ -418,7 +408,7 @@ const SummonGrid = (props: Props) => {
|
|||
<div className="Label Friend">{t('summons.friend')}</div>
|
||||
<SummonUnit
|
||||
gridSummon={grid.summons.friendSummon}
|
||||
editable={party.editable}
|
||||
editable={props.editable}
|
||||
key="grid_friend_summon"
|
||||
position={6}
|
||||
unitType={2}
|
||||
|
|
@ -439,7 +429,7 @@ const SummonGrid = (props: Props) => {
|
|||
<li key={`grid_unit_${i}`}>
|
||||
<SummonUnit
|
||||
gridSummon={grid.summons.allSummons[i]}
|
||||
editable={party.editable}
|
||||
editable={props.editable}
|
||||
position={i}
|
||||
unitType={1}
|
||||
removeSummon={removeSummon}
|
||||
|
|
@ -457,7 +447,7 @@ const SummonGrid = (props: Props) => {
|
|||
const subAuraSummonElement = (
|
||||
<ExtraSummons
|
||||
grid={grid.summons.allSummons}
|
||||
editable={party.editable}
|
||||
editable={props.editable}
|
||||
exists={false}
|
||||
offset={numSummons}
|
||||
removeSummon={removeSummon}
|
||||
|
|
|
|||
|
|
@ -23,6 +23,7 @@ import './index.scss'
|
|||
// Props
|
||||
interface Props {
|
||||
new: boolean
|
||||
editable: boolean
|
||||
weapons?: GridWeapon[]
|
||||
createParty: (details: DetailsObject) => Promise<Party>
|
||||
pushHistory?: (path: string) => void
|
||||
|
|
@ -60,17 +61,6 @@ const WeaponGrid = (props: Props) => {
|
|||
[key: number]: number
|
||||
}>({})
|
||||
|
||||
// Set the editable flag only on first load
|
||||
useEffect(() => {
|
||||
// If user is logged in and matches
|
||||
if (
|
||||
(accountData && party.user && accountData.userId === party.user.id) ||
|
||||
props.new
|
||||
)
|
||||
appState.party.editable = true
|
||||
else appState.party.editable = false
|
||||
}, [props.new, accountData, party])
|
||||
|
||||
// Initialize an array of current uncap values for each weapon
|
||||
useEffect(() => {
|
||||
let initialPreviousUncapValues: { [key: number]: number } = {}
|
||||
|
|
@ -99,7 +89,7 @@ const WeaponGrid = (props: Props) => {
|
|||
})
|
||||
})
|
||||
} else {
|
||||
if (party.editable)
|
||||
if (props.editable)
|
||||
saveWeapon(party.id, weapon, position)
|
||||
.then((response) => {
|
||||
if (response) handleWeaponResponse(response.data)
|
||||
|
|
@ -337,7 +327,7 @@ const WeaponGrid = (props: Props) => {
|
|||
const mainhandElement = (
|
||||
<WeaponUnit
|
||||
gridWeapon={appState.grid.weapons.mainWeapon}
|
||||
editable={party.editable}
|
||||
editable={props.editable}
|
||||
key="grid_mainhand"
|
||||
position={-1}
|
||||
unitType={0}
|
||||
|
|
@ -352,7 +342,7 @@ const WeaponGrid = (props: Props) => {
|
|||
<li key={`grid_unit_${i}`}>
|
||||
<WeaponUnit
|
||||
gridWeapon={appState.grid.weapons.allWeapons[i]}
|
||||
editable={party.editable}
|
||||
editable={props.editable}
|
||||
position={i}
|
||||
unitType={1}
|
||||
removeWeapon={removeWeapon}
|
||||
|
|
@ -366,7 +356,7 @@ const WeaponGrid = (props: Props) => {
|
|||
const extraGridElement = (
|
||||
<ExtraWeapons
|
||||
grid={appState.grid.weapons.allWeapons}
|
||||
editable={party.editable}
|
||||
editable={props.editable}
|
||||
offset={numWeapons}
|
||||
removeWeapon={removeWeapon}
|
||||
updateObject={receiveWeaponFromSearch}
|
||||
|
|
|
|||
38
package-lock.json
generated
38
package-lock.json
generated
|
|
@ -26,6 +26,7 @@
|
|||
"i18next": "^21.6.13",
|
||||
"i18next-browser-languagedetector": "^6.1.3",
|
||||
"i18next-http-backend": "^1.3.2",
|
||||
"local-storage": "^2.0.0",
|
||||
"lodash.clonedeep": "^4.5.0",
|
||||
"lodash.debounce": "^4.0.8",
|
||||
"meyer-reset-scss": "^2.0.4",
|
||||
|
|
@ -45,6 +46,7 @@
|
|||
"sanitize-html": "^2.8.1",
|
||||
"sass": "^1.49.0",
|
||||
"usehooks-ts": "^2.9.1",
|
||||
"uuid": "^9.0.0",
|
||||
"valtio": "^1.3.0",
|
||||
"youtube-api-v3-wrapper": "^2.3.0"
|
||||
},
|
||||
|
|
@ -59,6 +61,7 @@
|
|||
"@types/react-linkify": "^1.0.1",
|
||||
"@types/react-scroll": "^1.8.3",
|
||||
"@types/sanitize-html": "^2.8.0",
|
||||
"@types/uuid": "^9.0.0",
|
||||
"eslint": "8.7.0",
|
||||
"eslint-config-next": "12.0.8",
|
||||
"eslint-plugin-valtio": "^0.4.1",
|
||||
|
|
@ -3154,6 +3157,12 @@
|
|||
"resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
|
||||
"integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
|
||||
},
|
||||
"node_modules/@types/uuid": {
|
||||
"version": "9.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-9.0.0.tgz",
|
||||
"integrity": "sha512-kr90f+ERiQtKWMz5rP32ltJ/BtULDI5RVO0uavn1HQUOwjx0R1h0rnDYNL0CepF1zL5bSY6FISAfd9tOdDhU5Q==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@typescript-eslint/parser": {
|
||||
"version": "5.47.1",
|
||||
"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.47.1.tgz",
|
||||
|
|
@ -5647,6 +5656,11 @@
|
|||
"json5": "lib/cli.js"
|
||||
}
|
||||
},
|
||||
"node_modules/local-storage": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/local-storage/-/local-storage-2.0.0.tgz",
|
||||
"integrity": "sha512-/0sRoeijw7yr/igbVVygDuq6dlYCmtsuTmmpnweVlVtl/s10pf5BCq8LWBxW/AMyFJ3MhMUuggMZiYlx6qr9tw=="
|
||||
},
|
||||
"node_modules/lodash.clonedeep": {
|
||||
"version": "4.5.0",
|
||||
"resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
|
||||
|
|
@ -7309,6 +7323,14 @@
|
|||
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
|
||||
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="
|
||||
},
|
||||
"node_modules/uuid": {
|
||||
"version": "9.0.0",
|
||||
"resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.0.tgz",
|
||||
"integrity": "sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==",
|
||||
"bin": {
|
||||
"uuid": "dist/bin/uuid"
|
||||
}
|
||||
},
|
||||
"node_modules/v8-compile-cache": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz",
|
||||
|
|
@ -9576,6 +9598,12 @@
|
|||
"resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
|
||||
"integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
|
||||
},
|
||||
"@types/uuid": {
|
||||
"version": "9.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-9.0.0.tgz",
|
||||
"integrity": "sha512-kr90f+ERiQtKWMz5rP32ltJ/BtULDI5RVO0uavn1HQUOwjx0R1h0rnDYNL0CepF1zL5bSY6FISAfd9tOdDhU5Q==",
|
||||
"dev": true
|
||||
},
|
||||
"@typescript-eslint/parser": {
|
||||
"version": "5.47.1",
|
||||
"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.47.1.tgz",
|
||||
|
|
@ -11376,6 +11404,11 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"local-storage": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/local-storage/-/local-storage-2.0.0.tgz",
|
||||
"integrity": "sha512-/0sRoeijw7yr/igbVVygDuq6dlYCmtsuTmmpnweVlVtl/s10pf5BCq8LWBxW/AMyFJ3MhMUuggMZiYlx6qr9tw=="
|
||||
},
|
||||
"lodash.clonedeep": {
|
||||
"version": "4.5.0",
|
||||
"resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
|
||||
|
|
@ -12507,6 +12540,11 @@
|
|||
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
|
||||
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="
|
||||
},
|
||||
"uuid": {
|
||||
"version": "9.0.0",
|
||||
"resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.0.tgz",
|
||||
"integrity": "sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg=="
|
||||
},
|
||||
"v8-compile-cache": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz",
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@
|
|||
"i18next": "^21.6.13",
|
||||
"i18next-browser-languagedetector": "^6.1.3",
|
||||
"i18next-http-backend": "^1.3.2",
|
||||
"local-storage": "^2.0.0",
|
||||
"lodash.clonedeep": "^4.5.0",
|
||||
"lodash.debounce": "^4.0.8",
|
||||
"meyer-reset-scss": "^2.0.4",
|
||||
|
|
@ -50,6 +51,7 @@
|
|||
"sanitize-html": "^2.8.1",
|
||||
"sass": "^1.49.0",
|
||||
"usehooks-ts": "^2.9.1",
|
||||
"uuid": "^9.0.0",
|
||||
"valtio": "^1.3.0",
|
||||
"youtube-api-v3-wrapper": "^2.3.0"
|
||||
},
|
||||
|
|
@ -64,6 +66,7 @@
|
|||
"@types/react-linkify": "^1.0.1",
|
||||
"@types/react-scroll": "^1.8.3",
|
||||
"@types/sanitize-html": "^2.8.0",
|
||||
"@types/uuid": "^9.0.0",
|
||||
"eslint": "8.7.0",
|
||||
"eslint-config-next": "12.0.8",
|
||||
"eslint-plugin-valtio": "^0.4.1",
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import api from '~utils/api'
|
|||
import extractFilters from '~utils/extractFilters'
|
||||
import fetchLatestVersion from '~utils/fetchLatestVersion'
|
||||
import organizeRaids from '~utils/organizeRaids'
|
||||
import setUserToken from '~utils/setUserToken'
|
||||
import { setHeaders } from '~utils/userToken'
|
||||
import useDidMountEffect from '~utils/useDidMountEffect'
|
||||
import { appState } from '~utils/appState'
|
||||
import { elements, allElement } from '~data/elements'
|
||||
|
|
@ -329,7 +329,7 @@ export const getServerSidePaths = async () => {
|
|||
// prettier-ignore
|
||||
export const getServerSideProps = async ({ req, res, locale, query }: { req: NextApiRequest, res: NextApiResponse, locale: string, query: { [index: string]: string } }) => {
|
||||
// Set headers for server-side requests
|
||||
setUserToken(req, res)
|
||||
setHeaders(req, res)
|
||||
|
||||
// Fetch latest version
|
||||
const version = await fetchLatestVersion()
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import type { AppProps } from 'next/app'
|
|||
import Layout from '~components/Layout'
|
||||
|
||||
import { accountState } from '~utils/accountState'
|
||||
import setUserToken from '~utils/setUserToken'
|
||||
import { setHeaders } from '~utils/userToken'
|
||||
|
||||
import '../styles/globals.scss'
|
||||
import { ToastProvider, Viewport } from '@radix-ui/react-toast'
|
||||
|
|
@ -23,9 +23,8 @@ function MyApp({ Component, pageProps }: AppProps) {
|
|||
}
|
||||
|
||||
useEffect(() => {
|
||||
setUserToken()
|
||||
|
||||
if (accountCookie) {
|
||||
setHeaders()
|
||||
if (cookieData.account && cookieData.account.token) {
|
||||
console.log(`Logged in as user "${cookieData.account.username}"`)
|
||||
|
||||
accountState.account.authorized = true
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import { useTranslation } from 'next-i18next'
|
|||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
|
||||
|
||||
import { AboutTabs } from '~utils/enums'
|
||||
import setUserToken from '~utils/setUserToken'
|
||||
import { setHeaders } from '~utils/userToken'
|
||||
|
||||
import AboutPage from '~components/AboutPage'
|
||||
import UpdatesPage from '~components/UpdatesPage'
|
||||
|
|
@ -160,7 +160,7 @@ export const getServerSidePaths = async () => {
|
|||
// prettier-ignore
|
||||
export const getServerSideProps = async ({ req, res, locale, query }: { req: NextApiRequest, res: NextApiResponse, locale: string, query: { [index: string]: string } }) => {
|
||||
// Set headers for server-side requests
|
||||
setUserToken(req, res)
|
||||
setHeaders(req, res)
|
||||
|
||||
// Fetch and organize raids
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import React, { useEffect, useState } from 'react'
|
||||
import { useRouter } from 'next/router'
|
||||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
|
||||
import { v4 as uuidv4 } from 'uuid'
|
||||
import clonedeep from 'lodash.clonedeep'
|
||||
|
||||
import ErrorSection from '~components/ErrorSection'
|
||||
|
|
@ -10,7 +11,7 @@ import NewHead from '~components/NewHead'
|
|||
import api from '~utils/api'
|
||||
import fetchLatestVersion from '~utils/fetchLatestVersion'
|
||||
import organizeRaids from '~utils/organizeRaids'
|
||||
import setUserToken from '~utils/setUserToken'
|
||||
import { accountCookie, setHeaders } from '~utils/userToken'
|
||||
import { appState, initialAppState } from '~utils/appState'
|
||||
import { groupWeaponKeys } from '~utils/groupWeaponKeys'
|
||||
|
||||
|
|
@ -18,6 +19,7 @@ import type { AxiosError } from 'axios'
|
|||
import type { NextApiRequest, NextApiResponse } from 'next'
|
||||
import type { PageContextObj, ResponseStatus } from '~types'
|
||||
import { GridType } from '~utils/enums'
|
||||
import { setCookie } from 'cookies-next'
|
||||
|
||||
interface Props {
|
||||
context?: PageContextObj
|
||||
|
|
@ -119,8 +121,24 @@ export const getServerSidePaths = async () => {
|
|||
|
||||
// prettier-ignore
|
||||
export const getServerSideProps = async ({ req, res, locale, query }: { req: NextApiRequest, res: NextApiResponse, locale: string, query: { [index: string]: string } }) => {
|
||||
// Set headers for server-side requests
|
||||
setUserToken(req, res)
|
||||
// Set headers for API calls
|
||||
setHeaders(req, res)
|
||||
|
||||
// If there is no account entry in cookies, create a UUID and store it
|
||||
if (!accountCookie(req, res)) {
|
||||
const uuid = uuidv4()
|
||||
const expiresAt = new Date()
|
||||
expiresAt.setDate(expiresAt.getDate() + 60)
|
||||
|
||||
const cookieObj = {
|
||||
userId: uuid,
|
||||
username: undefined,
|
||||
token: undefined,
|
||||
}
|
||||
|
||||
const options = req && res ? { req, res } : {}
|
||||
setCookie('account', cookieObj, { path: '/', expires: expiresAt, ...options })
|
||||
}
|
||||
|
||||
// Fetch latest version
|
||||
const version = await fetchLatestVersion()
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import api from '~utils/api'
|
|||
import elementEmoji from '~utils/elementEmoji'
|
||||
import fetchLatestVersion from '~utils/fetchLatestVersion'
|
||||
import organizeRaids from '~utils/organizeRaids'
|
||||
import setUserToken from '~utils/setUserToken'
|
||||
import { setHeaders } from '~utils/userToken'
|
||||
import { appState } from '~utils/appState'
|
||||
import { groupWeaponKeys } from '~utils/groupWeaponKeys'
|
||||
|
||||
|
|
@ -108,7 +108,7 @@ export const getServerSidePaths = async () => {
|
|||
// prettier-ignore
|
||||
export const getServerSideProps = async ({ req, res, locale, query }: { req: NextApiRequest, res: NextApiResponse, locale: string, query: { [index: string]: string } }) => {
|
||||
// Set headers for server-side requests
|
||||
setUserToken(req, res)
|
||||
setHeaders(req, res)
|
||||
|
||||
// Fetch latest version
|
||||
const version = await fetchLatestVersion()
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
|
|||
import clonedeep from 'lodash.clonedeep'
|
||||
|
||||
import api from '~utils/api'
|
||||
import setUserToken from '~utils/setUserToken'
|
||||
import { setHeaders } from '~utils/userToken'
|
||||
import extractFilters from '~utils/extractFilters'
|
||||
import fetchLatestVersion from '~utils/fetchLatestVersion'
|
||||
import organizeRaids from '~utils/organizeRaids'
|
||||
|
|
@ -363,7 +363,7 @@ export const getServerSidePaths = async () => {
|
|||
// prettier-ignore
|
||||
export const getServerSideProps = async ({ req, res, locale, query }: { req: NextApiRequest, res: NextApiResponse, locale: string, query: { [index: string]: string } }) => {
|
||||
// Set headers for server-side requests
|
||||
setUserToken(req, res)
|
||||
setHeaders(req, res)
|
||||
|
||||
// Fetch latest version
|
||||
const version = await fetchLatestVersion()
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
|
|||
import clonedeep from 'lodash.clonedeep'
|
||||
|
||||
import api from '~utils/api'
|
||||
import setUserToken from '~utils/setUserToken'
|
||||
import { setHeaders } from '~utils/userToken'
|
||||
import extractFilters from '~utils/extractFilters'
|
||||
import fetchLatestVersion from '~utils/fetchLatestVersion'
|
||||
import organizeRaids from '~utils/organizeRaids'
|
||||
|
|
@ -363,7 +363,7 @@ export const getServerSidePaths = async () => {
|
|||
// prettier-ignore
|
||||
export const getServerSideProps = async ({ req, res, locale, query }: { req: NextApiRequest, res: NextApiResponse, locale: string, query: { [index: string]: string } }) => {
|
||||
// Set headers for server-side requests
|
||||
setUserToken(req, res)
|
||||
setHeaders(req, res)
|
||||
|
||||
// Fetch latest version
|
||||
const version = await fetchLatestVersion()
|
||||
|
|
|
|||
1
types/Party.d.ts
vendored
1
types/Party.d.ts
vendored
|
|
@ -29,6 +29,7 @@ interface Party {
|
|||
weapons: Array<GridWeapon>
|
||||
summons: Array<GridSummon>
|
||||
user: User
|
||||
local_id?: string
|
||||
remix: boolean
|
||||
remixes: Party[]
|
||||
created_at: string
|
||||
|
|
|
|||
|
|
@ -1,19 +0,0 @@
|
|||
import axios from 'axios'
|
||||
import { getCookie } from 'cookies-next'
|
||||
import type { NextApiRequest, NextApiResponse } from 'next'
|
||||
|
||||
export default (
|
||||
req: NextApiRequest | undefined = undefined,
|
||||
res: NextApiResponse | undefined = undefined
|
||||
) => {
|
||||
// Set up cookies
|
||||
const options = req && res ? { req, res } : {}
|
||||
const cookie = getCookie('account', options)
|
||||
if (cookie) {
|
||||
axios.defaults.headers.common['Authorization'] = `Bearer ${
|
||||
JSON.parse(cookie as string).token
|
||||
}`
|
||||
} else {
|
||||
delete axios.defaults.headers.common['Authorization']
|
||||
}
|
||||
}
|
||||
40
utils/userToken.tsx
Normal file
40
utils/userToken.tsx
Normal file
|
|
@ -0,0 +1,40 @@
|
|||
import axios from 'axios'
|
||||
import ls, { get, set } from 'local-storage'
|
||||
import { getCookie } from 'cookies-next'
|
||||
import type { NextApiRequest, NextApiResponse } from 'next'
|
||||
|
||||
export const accountCookie = (
|
||||
req: NextApiRequest | undefined = undefined,
|
||||
res: NextApiResponse | undefined = undefined
|
||||
) => {
|
||||
const options = req && res ? { req, res } : {}
|
||||
const cookie = getCookie('account', options)
|
||||
return cookie ? cookie : undefined
|
||||
}
|
||||
|
||||
export const setHeaders = (
|
||||
req: NextApiRequest | undefined = undefined,
|
||||
res: NextApiResponse | undefined = undefined
|
||||
) => {
|
||||
const cookie = accountCookie(req, res)
|
||||
if (cookie) {
|
||||
const parsed = JSON.parse(cookie as string)
|
||||
if (parsed.token)
|
||||
axios.defaults.headers.common['Authorization'] = `Bearer ${parsed.token}`
|
||||
} else {
|
||||
delete axios.defaults.headers.common['Authorization']
|
||||
}
|
||||
}
|
||||
|
||||
export const setEditKey = (id: string, user?: User) => {
|
||||
if (!user) {
|
||||
const edit_key = get<string>(id)
|
||||
axios.defaults.headers.common['X-Edit-Key'] = edit_key
|
||||
} else {
|
||||
unsetEditKey()
|
||||
}
|
||||
}
|
||||
|
||||
export const unsetEditKey = () => {
|
||||
delete axios.defaults.headers.common['X-Edit-Key']
|
||||
}
|
||||
Loading…
Reference in a new issue