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

Merge pull request #9 from jedmund/new

Browse source 
Fix behavior for new grids
This commit is contained in:
Justin Edmund 2022-02-23 14:53:43 -08:00 committed by GitHub
commit 520a4dd3f5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 134 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
components/CharacterGrid/index.tsx
View file

@ -7,10 +7,9 @@ import { AxiosResponse } from 'axios'
import debounce from 'lodash.debounce' import debounce from 'lodash.debounce'
import CharacterUnit from '~components/CharacterUnit' import CharacterUnit from '~components/CharacterUnit'
import SearchModal from '~components/SearchModal'
import api from '~utils/api' import api from '~utils/api'
import state from '~utils/state' import { appState } from '~utils/appState'
import './index.scss' import './index.scss'
@ -34,7 +33,7 @@ const CharacterGrid = (props: Props) => {
} : {} } : {}
// Set up state for view management // Set up state for view management
const { party, grid } = useSnapshot(state) const { party, grid } = useSnapshot(appState)
const [slug, setSlug] = useState() const [slug, setSlug] = useState()
const [found, setFound] = useState(false) const [found, setFound] = useState(false)
@ -47,15 +46,15 @@ const CharacterGrid = (props: Props) => {
useEffect(() => { useEffect(() => {
const shortcode = (props.slug) ? props.slug : slug const shortcode = (props.slug) ? props.slug : slug
if (shortcode) fetchGrid(shortcode) if (shortcode) fetchGrid(shortcode)
else state.party.editable = true else appState.party.editable = true
}, [slug, props.slug]) }, [slug, props.slug])
// Initialize an array of current uncap values for each characters // Initialize an array of current uncap values for each characters
useEffect(() => { useEffect(() => {
let initialPreviousUncapValues: {[key: number]: number} = {} let initialPreviousUncapValues: {[key: number]: number} = {}
Object.values(state.grid.characters).map(o => initialPreviousUncapValues[o.position] = o.uncap_level) Object.values(appState.grid.characters).map(o => initialPreviousUncapValues[o.position] = o.uncap_level)
setPreviousUncapValues(initialPreviousUncapValues) setPreviousUncapValues(initialPreviousUncapValues)
}, [state.grid.characters]) }, [appState.grid.characters])
// Methods: Fetching an object from the server // Methods: Fetching an object from the server
async function fetchGrid(shortcode: string) { async function fetchGrid(shortcode: string) {
@ -77,7 +76,7 @@ const CharacterGrid = (props: Props) => {
} }
// Store the important party and state-keeping values // Store the important party and state-keeping values
state.party.id = party.id appState.party.id = party.id
setFound(true) setFound(true)
setLoading(false) setLoading(false)
@ -100,7 +99,7 @@ const CharacterGrid = (props: Props) => {
function populateCharacters(list: [GridCharacter]) { function populateCharacters(list: [GridCharacter]) {
list.forEach((object: GridCharacter) => { list.forEach((object: GridCharacter) => {
if (object.position != null) if (object.position != null)
state.grid.characters[object.position] = object appState.grid.characters[object.position] = object
}) })
} }
@ -112,7 +111,7 @@ const CharacterGrid = (props: Props) => {
props.createParty() props.createParty()
.then(response => { .then(response => {
const party = response.data.party const party = response.data.party
state.party.id = party.id appState.party.id = party.id
setSlug(party.shortcode) setSlug(party.shortcode)
if (props.pushHistory) props.pushHistory(`/p/${party.shortcode}`) if (props.pushHistory) props.pushHistory(`/p/${party.shortcode}`)
@ -139,7 +138,7 @@ const CharacterGrid = (props: Props) => {
} }
function storeGridCharacter(gridCharacter: GridCharacter) { function storeGridCharacter(gridCharacter: GridCharacter) {
state.grid.characters[gridCharacter.position] = gridCharacter appState.grid.characters[gridCharacter.position] = gridCharacter
} }
// Methods: Helpers // Methods: Helpers
@ -201,7 +200,7 @@ const CharacterGrid = (props: Props) => {
) )
const updateUncapLevel = (position: number, uncapLevel: number) => { const updateUncapLevel = (position: number, uncapLevel: number) => {
state.grid.characters[position].uncap_level = uncapLevel appState.grid.characters[position].uncap_level = uncapLevel
} }
function storePreviousUncapValue(position: number) { function storePreviousUncapValue(position: number) {

7
components/Party/index.tsx
View file

@ -9,7 +9,7 @@ import SummonGrid from '~components/SummonGrid'
import CharacterGrid from '~components/CharacterGrid' import CharacterGrid from '~components/CharacterGrid'
import api from '~utils/api' import api from '~utils/api'
import state from '~utils/state' import { appState } from '~utils/appState'
import { GridType, TeamElement } from '~utils/enums' import { GridType, TeamElement } from '~utils/enums'
import './index.scss' import './index.scss'
@ -30,7 +30,7 @@ const Party = (props: Props) => {
} : {} } : {}
// Set up states // Set up states
const { party } = useSnapshot(state) const { party } = useSnapshot(appState)
const [currentTab, setCurrentTab] = useState<GridType>(GridType.Weapon) const [currentTab, setCurrentTab] = useState<GridType>(GridType.Weapon)
// Methods: Creating a new party // Methods: Creating a new party
@ -47,8 +47,9 @@ const Party = (props: Props) => {
// Methods: Updating the party's extra flag // Methods: Updating the party's extra flag
function checkboxChanged(event: React.ChangeEvent<HTMLInputElement>) { function checkboxChanged(event: React.ChangeEvent<HTMLInputElement>) {
appState.party.extra = event.target.checked
if (party.id) { if (party.id) {
state.party.extra = event.target.checked
api.endpoints.parties.update(party.id, { api.endpoints.parties.update(party.id, {
'party': { 'is_extra': event.target.checked } 'party': { 'is_extra': event.target.checked }
}, headers) }, headers)

4
components/PartySegmentedControl/index.tsx
View file

@ -1,7 +1,7 @@
import React, { useContext } from 'react' import React, { useContext } from 'react'
import './index.scss' import './index.scss'
import state from '~utils/state' import { appState } from '~utils/appState'
import SegmentedControl from '~components/SegmentedControl' import SegmentedControl from '~components/SegmentedControl'
import Segment from '~components/Segment' import Segment from '~components/Segment'
@ -17,7 +17,7 @@ interface Props {
} }
const PartySegmentedControl = (props: Props) => { const PartySegmentedControl = (props: Props) => {
const { party } = useSnapshot(state) const { party } = useSnapshot(appState)
function getElement() { function getElement() {
switch(party.element) { switch(party.element) {

4
components/SearchModal/index.tsx
View file

@ -1,7 +1,7 @@
import React, { useEffect, useState } from 'react' import React, { useEffect, useState } from 'react'
import { useSnapshot } from 'valtio' import { useSnapshot } from 'valtio'
import state from '~utils/state' import { appState } from '~utils/appState'
import api from '~utils/api' import api from '~utils/api'
import * as Dialog from '@radix-ui/react-dialog' import * as Dialog from '@radix-ui/react-dialog'
@ -22,7 +22,7 @@ interface Props {
} }
const SearchModal = (props: Props) => { const SearchModal = (props: Props) => {
let { grid } = useSnapshot(state) let { grid } = useSnapshot(appState)
let searchInput = React.createRef<HTMLInputElement>() let searchInput = React.createRef<HTMLInputElement>()

52
components/SummonGrid/index.tsx
View file

@ -10,7 +10,7 @@ import SummonUnit from '~components/SummonUnit'
import ExtraSummons from '~components/ExtraSummons' import ExtraSummons from '~components/ExtraSummons'
import api from '~utils/api' import api from '~utils/api'
import state from '~utils/state' import { appState } from '~utils/appState'
import './index.scss' import './index.scss'
@ -34,7 +34,7 @@ const SummonGrid = (props: Props) => {
} : {} } : {}
// Set up state for view management // Set up state for view management
const { party, grid } = useSnapshot(state) const { party, grid } = useSnapshot(appState)
const [slug, setSlug] = useState() const [slug, setSlug] = useState()
const [found, setFound] = useState(false) const [found, setFound] = useState(false)
@ -47,23 +47,23 @@ const SummonGrid = (props: Props) => {
useEffect(() => { useEffect(() => {
const shortcode = (props.slug) ? props.slug : slug const shortcode = (props.slug) ? props.slug : slug
if (shortcode) fetchGrid(shortcode) if (shortcode) fetchGrid(shortcode)
else state.party.editable = true else appState.party.editable = true
}, [slug, props.slug]) }, [slug, props.slug])
// Initialize an array of current uncap values for each summon // Initialize an array of current uncap values for each summon
useEffect(() => { useEffect(() => {
let initialPreviousUncapValues: {[key: number]: number} = {} let initialPreviousUncapValues: {[key: number]: number} = {}
if (state.grid.summons.mainSummon) if (appState.grid.summons.mainSummon)
initialPreviousUncapValues[-1] = state.grid.summons.mainSummon.uncap_level initialPreviousUncapValues[-1] = appState.grid.summons.mainSummon.uncap_level
if (state.grid.summons.friendSummon) if (appState.grid.summons.friendSummon)
initialPreviousUncapValues[6] = state.grid.summons.friendSummon.uncap_level initialPreviousUncapValues[6] = appState.grid.summons.friendSummon.uncap_level
Object.values(state.grid.summons.allSummons).map(o => initialPreviousUncapValues[o.position] = o.uncap_level) Object.values(appState.grid.summons.allSummons).map(o => initialPreviousUncapValues[o.position] = o.uncap_level)
setPreviousUncapValues(initialPreviousUncapValues) setPreviousUncapValues(initialPreviousUncapValues)
}, [state.grid.summons.mainSummon, state.grid.summons.friendSummon, state.grid.summons.allSummons]) }, [appState.grid.summons.mainSummon, appState.grid.summons.friendSummon, appState.grid.summons.allSummons])
// Methods: Fetching an object from the server // Methods: Fetching an object from the server
@ -82,11 +82,11 @@ const SummonGrid = (props: Props) => {
const loggedInUser = (cookies.user) ? cookies.user.user_id : '' const loggedInUser = (cookies.user) ? cookies.user.user_id : ''
if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser) { if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser) {
state.party.editable = true appState.party.editable = true
} }
// Store the important party and state-keeping values // Store the important party and state-keeping values
state.party.id = party.id appState.party.id = party.id
setFound(true) setFound(true)
setLoading(false) setLoading(false)
@ -109,11 +109,11 @@ const SummonGrid = (props: Props) => {
function populateSummons(list: [GridSummon]) { function populateSummons(list: [GridSummon]) {
list.forEach((gridObject: GridSummon) => { list.forEach((gridObject: GridSummon) => {
if (gridObject.main) if (gridObject.main)
state.grid.summons.mainSummon = gridObject appState.grid.summons.mainSummon = gridObject
else if (gridObject.friend) else if (gridObject.friend)
state.grid.summons.friendSummon = gridObject appState.grid.summons.friendSummon = gridObject
else if (!gridObject.main && !gridObject.friend && gridObject.position != null) else if (!gridObject.main && !gridObject.friend && gridObject.position != null)
state.grid.summons.allSummons[gridObject.position] = gridObject appState.grid.summons.allSummons[gridObject.position] = gridObject
}) })
} }
@ -125,7 +125,7 @@ const SummonGrid = (props: Props) => {
props.createParty() props.createParty()
.then(response => { .then(response => {
const party = response.data.party const party = response.data.party
state.party.id = party.id appState.party.id = party.id
setSlug(party.shortcode) setSlug(party.shortcode)
if (props.pushHistory) props.pushHistory(`/p/${party.shortcode}`) if (props.pushHistory) props.pushHistory(`/p/${party.shortcode}`)
@ -158,11 +158,11 @@ const SummonGrid = (props: Props) => {
function storeGridSummon(gridSummon: GridSummon) { function storeGridSummon(gridSummon: GridSummon) {
if (gridSummon.position == -1) if (gridSummon.position == -1)
state.grid.summons.mainSummon = gridSummon appState.grid.summons.mainSummon = gridSummon
else if (gridSummon.position == 6) else if (gridSummon.position == 6)
state.grid.summons.friendSummon = gridSummon appState.grid.summons.friendSummon = gridSummon
else else
state.grid.summons.allSummons[gridSummon.position] = gridSummon appState.grid.summons.allSummons[gridSummon.position] = gridSummon
} }
// Methods: Updating uncap level // Methods: Updating uncap level
@ -207,21 +207,21 @@ const SummonGrid = (props: Props) => {
) )
const updateUncapLevel = (position: number, uncapLevel: number) => { const updateUncapLevel = (position: number, uncapLevel: number) => {
if (state.grid.summons.mainSummon && position == -1) if (appState.grid.summons.mainSummon && position == -1)
state.grid.summons.mainSummon.uncap_level = uncapLevel appState.grid.summons.mainSummon.uncap_level = uncapLevel
else if (state.grid.summons.friendSummon && position == 6) else if (appState.grid.summons.friendSummon && position == 6)
state.grid.summons.friendSummon.uncap_level = uncapLevel appState.grid.summons.friendSummon.uncap_level = uncapLevel
else else
state.grid.summons.allSummons[position].uncap_level = uncapLevel appState.grid.summons.allSummons[position].uncap_level = uncapLevel
} }
function storePreviousUncapValue(position: number) { function storePreviousUncapValue(position: number) {
// Save the current value in case of an unexpected result // Save the current value in case of an unexpected result
let newPreviousValues = {...previousUncapValues} let newPreviousValues = {...previousUncapValues}
if (state.grid.summons.mainSummon && position == -1) newPreviousValues[position] = state.grid.summons.mainSummon.uncap_level if (appState.grid.summons.mainSummon && position == -1) newPreviousValues[position] = appState.grid.summons.mainSummon.uncap_level
else if (state.grid.summons.friendSummon && position == 6) newPreviousValues[position] = state.grid.summons.friendSummon.uncap_level else if (appState.grid.summons.friendSummon && position == 6) newPreviousValues[position] = appState.grid.summons.friendSummon.uncap_level
else newPreviousValues[position] = state.grid.summons.allSummons[position].uncap_level else newPreviousValues[position] = appState.grid.summons.allSummons[position].uncap_level
setPreviousUncapValues(newPreviousValues) setPreviousUncapValues(newPreviousValues)
} }

10
components/TopHeader/index.tsx
View file

@ -1,13 +1,16 @@
import React, { useContext, useEffect, useState } from 'react' import React, { useContext, useEffect, useState } from 'react'
import { useCookies } from 'react-cookie' import { useCookies } from 'react-cookie'
import { useRouter } from 'next/router' import { useRouter } from 'next/router'
import clonedeep from 'lodash.clonedeep'
import AppContext from '~context/AppContext' import AppContext from '~context/AppContext'
import { appState, initialAppState } from '~utils/appState'
import Header from '~components/Header' import Header from '~components/Header'
import Button from '~components/Button' import Button from '~components/Button'
import HeaderMenu from '~components/HeaderMenu' import HeaderMenu from '~components/HeaderMenu'
const TopHeader = () => { const TopHeader = () => {
const { editable, setEditable, authenticated, setAuthenticated } = useContext(AppContext) const { editable, setEditable, authenticated, setAuthenticated } = useContext(AppContext)
@ -39,7 +42,14 @@ const TopHeader = () => {
} }
function newParty() { function newParty() {
// Push the root URL
router.push('/') router.push('/')
// Clean state
const resetState = clonedeep(initialAppState)
Object.keys(resetState).forEach((key) => {
appState[key] = resetState[key]
})
} }
function logout() { function logout() {

48
components/WeaponGrid/index.tsx
View file

@ -10,7 +10,7 @@ import WeaponUnit from '~components/WeaponUnit'
import ExtraWeapons from '~components/ExtraWeapons' import ExtraWeapons from '~components/ExtraWeapons'
import api from '~utils/api' import api from '~utils/api'
import state from '~utils/state' import { appState } from '~utils/appState'
import './index.scss' import './index.scss'
@ -34,7 +34,7 @@ const WeaponGrid = (props: Props) => {
} : {} } : {}
// Set up state for view management // Set up state for view management
const { party, grid } = useSnapshot(state) const { party, grid } = useSnapshot(appState)
const [slug, setSlug] = useState() const [slug, setSlug] = useState()
const [found, setFound] = useState(false) const [found, setFound] = useState(false)
@ -47,20 +47,20 @@ const WeaponGrid = (props: Props) => {
useEffect(() => { useEffect(() => {
const shortcode = (props.slug) ? props.slug : slug const shortcode = (props.slug) ? props.slug : slug
if (shortcode) fetchGrid(shortcode) if (shortcode) fetchGrid(shortcode)
else state.party.editable = true else appState.party.editable = true
}, [slug, props.slug]) }, [slug, props.slug])
// Initialize an array of current uncap values for each weapon // Initialize an array of current uncap values for each weapon
useEffect(() => { useEffect(() => {
let initialPreviousUncapValues: {[key: number]: number} = {} let initialPreviousUncapValues: {[key: number]: number} = {}
if (state.grid.weapons.mainWeapon) if (appState.grid.weapons.mainWeapon)
initialPreviousUncapValues[-1] = state.grid.weapons.mainWeapon.uncap_level initialPreviousUncapValues[-1] = appState.grid.weapons.mainWeapon.uncap_level
Object.values(state.grid.weapons.allWeapons).map(o => initialPreviousUncapValues[o.position] = o.uncap_level) Object.values(appState.grid.weapons.allWeapons).map(o => initialPreviousUncapValues[o.position] = o.uncap_level)
setPreviousUncapValues(initialPreviousUncapValues) setPreviousUncapValues(initialPreviousUncapValues)
}, [state.grid.weapons.mainWeapon, state.grid.weapons.allWeapons]) }, [appState.grid.weapons.mainWeapon, appState.grid.weapons.allWeapons])
// Methods: Fetching an object from the server // Methods: Fetching an object from the server
async function fetchGrid(shortcode: string) { async function fetchGrid(shortcode: string) {
@ -78,12 +78,12 @@ const WeaponGrid = (props: Props) => {
const loggedInUser = (cookies.user) ? cookies.user.user_id : '' const loggedInUser = (cookies.user) ? cookies.user.user_id : ''
if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser) { if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser) {
state.party.editable = true appState.party.editable = true
} }
// Store the important party and state-keeping values // Store the important party and state-keeping values
state.party.id = party.id appState.party.id = party.id
state.party.extra = party.is_extra appState.party.extra = party.is_extra
setFound(true) setFound(true)
setLoading(false) setLoading(false)
@ -106,10 +106,10 @@ const WeaponGrid = (props: Props) => {
function populateWeapons(list: [GridWeapon]) { function populateWeapons(list: [GridWeapon]) {
list.forEach((gridObject: GridWeapon) => { list.forEach((gridObject: GridWeapon) => {
if (gridObject.mainhand) { if (gridObject.mainhand) {
state.grid.weapons.mainWeapon = gridObject appState.grid.weapons.mainWeapon = gridObject
state.party.element = gridObject.object.element appState.party.element = gridObject.object.element
} else if (!gridObject.mainhand && gridObject.position != null) { } else if (!gridObject.mainhand && gridObject.position != null) {
state.grid.weapons.allWeapons[gridObject.position] = gridObject appState.grid.weapons.allWeapons[gridObject.position] = gridObject
} }
}) })
} }
@ -118,13 +118,13 @@ const WeaponGrid = (props: Props) => {
function receiveWeaponFromSearch(object: Character | Weapon | Summon, position: number) { function receiveWeaponFromSearch(object: Character | Weapon | Summon, position: number) {
const weapon = object as Weapon const weapon = object as Weapon
if (position == 1) if (position == 1)
state.party.element = weapon.element appState.party.element = weapon.element
if (!party.id) { if (!party.id) {
props.createParty(party.extra) props.createParty(party.extra)
.then(response => { .then(response => {
const party = response.data.party const party = response.data.party
state.party.id = party.id appState.party.id = party.id
setSlug(party.shortcode) setSlug(party.shortcode)
if (props.pushHistory) props.pushHistory(`/p/${party.shortcode}`) if (props.pushHistory) props.pushHistory(`/p/${party.shortcode}`)
@ -156,11 +156,11 @@ const WeaponGrid = (props: Props) => {
function storeGridWeapon(gridWeapon: GridWeapon) { function storeGridWeapon(gridWeapon: GridWeapon) {
if (gridWeapon.position == -1) { if (gridWeapon.position == -1) {
state.grid.weapons.mainWeapon = gridWeapon appState.grid.weapons.mainWeapon = gridWeapon
state.party.element = gridWeapon.object.element appState.party.element = gridWeapon.object.element
} else { } else {
// Store the grid unit at the correct position // Store the grid unit at the correct position
state.grid.weapons.allWeapons[gridWeapon.position] = gridWeapon appState.grid.weapons.allWeapons[gridWeapon.position] = gridWeapon
} }
} }
@ -206,17 +206,17 @@ const WeaponGrid = (props: Props) => {
) )
const updateUncapLevel = (position: number, uncapLevel: number) => { const updateUncapLevel = (position: number, uncapLevel: number) => {
if (state.grid.weapons.mainWeapon && position == -1) if (appState.grid.weapons.mainWeapon && position == -1)
state.grid.weapons.mainWeapon.uncap_level = uncapLevel appState.grid.weapons.mainWeapon.uncap_level = uncapLevel
else else
state.grid.weapons.allWeapons[position].uncap_level = uncapLevel appState.grid.weapons.allWeapons[position].uncap_level = uncapLevel
} }
function storePreviousUncapValue(position: number) { function storePreviousUncapValue(position: number) {
// Save the current value in case of an unexpected result // Save the current value in case of an unexpected result
let newPreviousValues = {...previousUncapValues} let newPreviousValues = {...previousUncapValues}
newPreviousValues[position] = (state.grid.weapons.mainWeapon && position == -1) ? newPreviousValues[position] = (appState.grid.weapons.mainWeapon && position == -1) ?
state.grid.weapons.mainWeapon.uncap_level : state.grid.weapons.allWeapons[position].uncap_level appState.grid.weapons.mainWeapon.uncap_level : appState.grid.weapons.allWeapons[position].uncap_level
setPreviousUncapValues(newPreviousValues) setPreviousUncapValues(newPreviousValues)
} }
@ -252,7 +252,7 @@ const WeaponGrid = (props: Props) => {
const extraGridElement = ( const extraGridElement = (
<ExtraWeapons <ExtraWeapons
grid={state.grid.weapons.allWeapons} grid={appState.grid.weapons.allWeapons}
editable={party.editable} editable={party.editable}
offset={numWeapons} offset={numWeapons}
updateObject={receiveWeaponFromSearch} updateObject={receiveWeaponFromSearch}

30
package-lock.json generated
View file

@ -16,6 +16,7 @@
"@types/axios": "^0.14.0", "@types/axios": "^0.14.0",
"axios": "^0.25.0", "axios": "^0.25.0",
"classnames": "^2.3.1", "classnames": "^2.3.1",
"lodash.clonedeep": "^4.5.0",
"lodash.debounce": "^4.0.8", "lodash.debounce": "^4.0.8",
"meyer-reset-scss": "^2.0.4", "meyer-reset-scss": "^2.0.4",
"next": "12.0.8", "next": "12.0.8",
@ -27,6 +28,7 @@
"valtio": "^1.3.0" "valtio": "^1.3.0"
}, },
"devDependencies": { "devDependencies": {
"@types/lodash.clonedeep": "^4.5.6",
"@types/lodash.debounce": "^4.0.6", "@types/lodash.debounce": "^4.0.6",
"@types/node": "17.0.11", "@types/node": "17.0.11",
"@types/react": "17.0.38", "@types/react": "17.0.38",
@ -3039,6 +3041,15 @@
"integrity": "sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw==", "integrity": "sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw==",
"dev": true "dev": true
}, },
"node_modules/@types/lodash.clonedeep": {
"version": "4.5.6",
"resolved": "https://registry.npmjs.org/@types/lodash.clonedeep/-/lodash.clonedeep-4.5.6.tgz",
"integrity": "sha512-cE1jYr2dEg1wBImvXlNtp0xDoS79rfEdGozQVgliDZj1uERH4k+rmEMTudP9b4VQ8O6nRb5gPqft0QzEQGMQgA==",
"dev": true,
"dependencies": {
"@types/lodash": "*"
}
},
"node_modules/@types/lodash.debounce": { "node_modules/@types/lodash.debounce": {
"version": "4.0.6", "version": "4.0.6",
"resolved": "https://registry.npmjs.org/@types/lodash.debounce/-/lodash.debounce-4.0.6.tgz", "resolved": "https://registry.npmjs.org/@types/lodash.debounce/-/lodash.debounce-4.0.6.tgz",
@ -5303,6 +5314,11 @@
"node": ">=4" "node": ">=4"
} }
}, },
"node_modules/lodash.clonedeep": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
"integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
},
"node_modules/lodash.debounce": { "node_modules/lodash.debounce": {
"version": "4.0.8", "version": "4.0.8",
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@ -8875,6 +8891,15 @@
"integrity": "sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw==", "integrity": "sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw==",
"dev": true "dev": true
}, },
"@types/lodash.clonedeep": {
"version": "4.5.6",
"resolved": "https://registry.npmjs.org/@types/lodash.clonedeep/-/lodash.clonedeep-4.5.6.tgz",
"integrity": "sha512-cE1jYr2dEg1wBImvXlNtp0xDoS79rfEdGozQVgliDZj1uERH4k+rmEMTudP9b4VQ8O6nRb5gPqft0QzEQGMQgA==",
"dev": true,
"requires": {
"@types/lodash": "*"
}
},
"@types/lodash.debounce": { "@types/lodash.debounce": {
"version": "4.0.6", "version": "4.0.6",
"resolved": "https://registry.npmjs.org/@types/lodash.debounce/-/lodash.debounce-4.0.6.tgz", "resolved": "https://registry.npmjs.org/@types/lodash.debounce/-/lodash.debounce-4.0.6.tgz",
@ -10553,6 +10578,11 @@
"path-exists": "^3.0.0" "path-exists": "^3.0.0"
} }
}, },
"lodash.clonedeep": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
"integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
},
"lodash.debounce": { "lodash.debounce": {
"version": "4.0.8", "version": "4.0.8",
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",

2
package.json
View file

@ -21,6 +21,7 @@
"@types/axios": "^0.14.0", "@types/axios": "^0.14.0",
"axios": "^0.25.0", "axios": "^0.25.0",
"classnames": "^2.3.1", "classnames": "^2.3.1",
"lodash.clonedeep": "^4.5.0",
"lodash.debounce": "^4.0.8", "lodash.debounce": "^4.0.8",
"meyer-reset-scss": "^2.0.4", "meyer-reset-scss": "^2.0.4",
"next": "12.0.8", "next": "12.0.8",
@ -32,6 +33,7 @@
"valtio": "^1.3.0" "valtio": "^1.3.0"
}, },
"devDependencies": { "devDependencies": {
"@types/lodash.clonedeep": "^4.5.6",
"@types/lodash.debounce": "^4.0.6", "@types/lodash.debounce": "^4.0.6",
"@types/node": "17.0.11", "@types/node": "17.0.11",
"@types/react": "17.0.38", "@types/react": "17.0.38",

19
utils/accountState.tsx Normal file
View file

@ -0,0 +1,19 @@
import { proxy } from "valtio";
interface AccountState {
[key: string]: any
account: {
authorized: boolean,
language: 'en' | 'jp'
}
}
export const initialAccountState: AccountState = {
account: {
authorized: false,
language: 'en'
}
}
export const accountState = proxy(initialAccountState)

14
utils/state.tsx → utils/appState.tsx
View file

@ -1,9 +1,8 @@
import { proxy } from "valtio"; import { proxy } from "valtio";
interface State { interface AppState {
app: { [key: string]: any
authenticated: boolean
},
party: { party: {
id: string | undefined, id: string | undefined,
editable: boolean, editable: boolean,
@ -27,10 +26,7 @@ interface State {
} }
} }
const state: State = { export const initialAppState: AppState = {
app: {
authenticated: false
},
party: { party: {
id: undefined, id: undefined,
editable: false, editable: false,
@ -54,4 +50,4 @@ const state: State = {
} }
} }
export default proxy(state) export const appState = proxy(initialAppState)