Pass down GridWeapon instead of Weapon
Previously, we stripped the Weapon out of the GridWeapon for simplicity. However, now that we need to display and manipulate data on the GridWeapon (unique data), we need to pass that down instead.
This commit is contained in:
parent
3b252f99ed
commit
7a50c4bce5
6 changed files with 65 additions and 49 deletions
|
|
@ -13,12 +13,13 @@ export enum GridType {
|
|||
|
||||
// Props
|
||||
interface Props {
|
||||
grid: GridArray<Weapon>
|
||||
grid: GridArray<GridWeapon>
|
||||
editable: boolean
|
||||
exists: boolean
|
||||
found?: boolean
|
||||
offset: number
|
||||
onClick: (position: number) => void
|
||||
updateUncap: (id: string, uncap: number) => void
|
||||
}
|
||||
|
||||
const ExtraWeapons = (props: Props) => {
|
||||
|
|
@ -34,10 +35,10 @@ const ExtraWeapons = (props: Props) => {
|
|||
<li key={`grid_unit_${i}`} >
|
||||
<WeaponUnit
|
||||
editable={props.editable}
|
||||
onClick={() => { props.onClick(props.offset + i)}}
|
||||
position={props.offset + i}
|
||||
unitType={1}
|
||||
weapon={props.grid[props.offset + i]}
|
||||
gridWeapon={props.grid[props.offset + i]}
|
||||
onClick={() => { props.onClick(props.offset + i)}}
|
||||
/>
|
||||
</li>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -23,11 +23,11 @@ import './index.scss'
|
|||
|
||||
interface Props {
|
||||
partyId?: string
|
||||
mainWeapon?: Weapon
|
||||
mainWeapon?: GridWeapon
|
||||
mainSummon?: Summon
|
||||
friendSummon?: Summon
|
||||
characters?: GridArray<Character>
|
||||
weapons?: GridArray<Weapon>
|
||||
weapons?: GridArray<GridWeapon>
|
||||
summons?: GridArray<Summon>
|
||||
extra: boolean
|
||||
editable: boolean
|
||||
|
|
@ -46,10 +46,10 @@ const Party = (props: Props) => {
|
|||
|
||||
// Grid data
|
||||
const [characters, setCharacters] = useState<GridArray<Character>>({})
|
||||
const [weapons, setWeapons] = useState<GridArray<Weapon>>({})
|
||||
const [weapons, setWeapons] = useState<GridArray<GridWeapon>>({})
|
||||
const [summons, setSummons] = useState<GridArray<Summon>>({})
|
||||
|
||||
const [mainWeapon, setMainWeapon] = useState<Weapon>()
|
||||
const [mainWeapon, setMainWeapon] = useState<GridWeapon>()
|
||||
const [mainSummon, setMainSummon] = useState<Summon>()
|
||||
const [friendSummon, setFriendSummon] = useState<Summon>()
|
||||
|
||||
|
|
@ -178,8 +178,8 @@ const Party = (props: Props) => {
|
|||
case GridType.Weapon:
|
||||
const weapon = item as Weapon
|
||||
saveWeapon(weapon, position, partyId)
|
||||
.then(() => {
|
||||
storeWeapon(weapon, position)
|
||||
.then((response) => {
|
||||
storeWeapon(response.data.grid_weapon)
|
||||
})
|
||||
break
|
||||
case GridType.Summon:
|
||||
|
|
@ -193,24 +193,32 @@ const Party = (props: Props) => {
|
|||
}
|
||||
|
||||
// Weapons
|
||||
function storeWeapon(weapon: Weapon, position: number) {
|
||||
if (position == -1) {
|
||||
function storeWeapon(weapon: GridWeapon) {
|
||||
if (weapon.position == -1) {
|
||||
setMainWeapon(weapon)
|
||||
} else {
|
||||
// Store the grid unit weapon at the correct position
|
||||
let newWeapons = Object.assign({}, weapons)
|
||||
newWeapons[position] = weapon
|
||||
newWeapons[weapon.position!] = weapon
|
||||
setWeapons(newWeapons)
|
||||
}
|
||||
}
|
||||
|
||||
async function saveWeapon(weapon: Weapon, position: number, party: string) {
|
||||
await api.endpoints.weapons.create({
|
||||
let uncapLevel = 3
|
||||
|
||||
if (weapon.uncap.ulb)
|
||||
uncapLevel = 5
|
||||
else if (weapon.uncap.flb)
|
||||
uncapLevel = 4
|
||||
|
||||
return await api.endpoints.weapons.create({
|
||||
'weapon': {
|
||||
'party_id': party,
|
||||
'weapon_id': weapon.id,
|
||||
'position': position,
|
||||
'mainhand': (position == -1)
|
||||
'mainhand': (position == -1),
|
||||
'uncap_level': uncapLevel
|
||||
}
|
||||
}, headers)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,30 +10,39 @@ interface Props {
|
|||
uncapLevel: number
|
||||
flb: boolean
|
||||
ulb?: boolean
|
||||
updateUncap: (uncap: number) => void
|
||||
}
|
||||
|
||||
const UncapIndicator = (props: Props) => {
|
||||
let numStars
|
||||
|
||||
const [uncap, setUncap] = useState(props.uncapLevel)
|
||||
|
||||
if (props.type === 'character') {
|
||||
if (props.flb) {
|
||||
numStars = 5
|
||||
const numStars = setNumStars()
|
||||
|
||||
function setNumStars() {
|
||||
let numStars
|
||||
|
||||
if (props.type === 'character') {
|
||||
if (props.flb) {
|
||||
numStars = 5
|
||||
} else {
|
||||
numStars = 4
|
||||
}
|
||||
} else {
|
||||
numStars = 4
|
||||
}
|
||||
} else {
|
||||
if (props.ulb) {
|
||||
numStars = 5
|
||||
} else if (props.flb) {
|
||||
numStars = 4
|
||||
} else {
|
||||
numStars = 3
|
||||
if (props.ulb) {
|
||||
numStars = 5
|
||||
} else if (props.flb) {
|
||||
numStars = 4
|
||||
} else {
|
||||
numStars = 3
|
||||
}
|
||||
}
|
||||
|
||||
return numStars
|
||||
}
|
||||
|
||||
function toggleStar(index: number, empty: boolean) {
|
||||
console.log("Toggling star!")
|
||||
|
||||
if (empty)
|
||||
setUncap(index + 1)
|
||||
else
|
||||
|
|
|
|||
|
|
@ -19,8 +19,8 @@ export enum GridType {
|
|||
interface Props {
|
||||
userId?: string
|
||||
partyId?: string
|
||||
mainhand?: Weapon | undefined
|
||||
grid: GridArray<Weapon>
|
||||
mainhand?: GridWeapon | undefined
|
||||
grid: GridArray<GridWeapon>
|
||||
extra: boolean
|
||||
editable: boolean
|
||||
exists: boolean
|
||||
|
|
@ -33,6 +33,7 @@ const WeaponGrid = (props: Props) => {
|
|||
const [searchPosition, setSearchPosition] = useState(0)
|
||||
|
||||
const numWeapons: number = 9
|
||||
const searchGrid: GridArray<Weapon> = Object.values(props.grid).map((o) => o.weapon)
|
||||
|
||||
const extraGrid = (
|
||||
<ExtraWeapons
|
||||
|
|
@ -67,12 +68,12 @@ const WeaponGrid = (props: Props) => {
|
|||
<div id="weapon_grids">
|
||||
<div id="WeaponGrid">
|
||||
<WeaponUnit
|
||||
onClick={() => { openSearchModal(-1) }}
|
||||
editable={props.editable}
|
||||
key="grid_mainhand"
|
||||
position={-1}
|
||||
unitType={0}
|
||||
weapon={props.mainhand}
|
||||
gridWeapon={props.mainhand}
|
||||
onClick={() => { openSearchModal(-1) }}
|
||||
/>
|
||||
|
||||
<ul id="grid_weapons">
|
||||
|
|
@ -81,11 +82,11 @@ const WeaponGrid = (props: Props) => {
|
|||
return (
|
||||
<li key={`grid_unit_${i}`} >
|
||||
<WeaponUnit
|
||||
onClick={() => { openSearchModal(i) }}
|
||||
editable={props.editable}
|
||||
position={i}
|
||||
unitType={1}
|
||||
weapon={props.grid[i]}
|
||||
gridWeapon={props.grid[i]}
|
||||
onClick={() => { openSearchModal(i) }}
|
||||
/>
|
||||
</li>
|
||||
)
|
||||
|
|
@ -102,7 +103,7 @@ const WeaponGrid = (props: Props) => {
|
|||
|
||||
{open ? (
|
||||
<SearchModal
|
||||
grid={props.grid}
|
||||
grid={searchGrid}
|
||||
close={closeModal}
|
||||
send={sendData}
|
||||
fromPosition={searchPosition}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import './index.scss'
|
|||
|
||||
interface Props {
|
||||
onClick: () => void
|
||||
weapon: Weapon | undefined
|
||||
gridWeapon: GridWeapon | undefined
|
||||
position: number
|
||||
editable: boolean
|
||||
unitType: 0 | 1
|
||||
|
|
@ -24,10 +24,10 @@ const WeaponUnit = (props: Props) => {
|
|||
'mainhand': props.unitType == 0,
|
||||
'grid': props.unitType == 1,
|
||||
'editable': props.editable,
|
||||
'filled': (props.weapon !== undefined)
|
||||
'filled': (props.gridWeapon !== undefined)
|
||||
})
|
||||
|
||||
const weapon = props.weapon
|
||||
const weapon = props.gridWeapon?.weapon
|
||||
|
||||
useEffect(() => {
|
||||
generateImageUrl()
|
||||
|
|
@ -35,8 +35,8 @@ const WeaponUnit = (props: Props) => {
|
|||
|
||||
function generateImageUrl() {
|
||||
let imgSrc = ""
|
||||
if (props.weapon) {
|
||||
const weapon = props.weapon!
|
||||
if (props.gridWeapon) {
|
||||
const weapon = props.gridWeapon.weapon!
|
||||
|
||||
if (props.unitType == 0)
|
||||
imgSrc = `${process.env.NEXT_PUBLIC_SIERO_IMG_URL}/weapon-main/${weapon.granblue_id}.jpg`
|
||||
|
|
@ -59,7 +59,7 @@ const WeaponUnit = (props: Props) => {
|
|||
type="weapon"
|
||||
ulb={weapon?.uncap.ulb || false}
|
||||
flb={weapon?.uncap.flb || false}
|
||||
uncapLevel={weapon?.uncap_level!}
|
||||
uncapLevel={props.gridWeapon?.uncap_level!}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -23,10 +23,10 @@ const PartyRoute: React.FC = () => {
|
|||
const [editable, setEditable] = useState(false)
|
||||
|
||||
const [characters, setCharacters] = useState<GridArray<Character>>({})
|
||||
const [weapons, setWeapons] = useState<GridArray<Weapon>>({})
|
||||
const [weapons, setWeapons] = useState<GridArray<GridWeapon>>({})
|
||||
const [summons, setSummons] = useState<GridArray<Summon>>({})
|
||||
|
||||
const [mainWeapon, setMainWeapon] = useState<Weapon>()
|
||||
const [mainWeapon, setMainWeapon] = useState<GridWeapon>()
|
||||
const [mainSummon, setMainSummon] = useState<Summon>()
|
||||
const [friendSummon, setFriendSummon] = useState<Summon>()
|
||||
|
||||
|
|
@ -84,16 +84,13 @@ const PartyRoute: React.FC = () => {
|
|||
}
|
||||
|
||||
function populateWeapons(list: [GridWeapon]) {
|
||||
let weapons: GridArray<Weapon> = {}
|
||||
let weapons: GridArray<GridWeapon> = {}
|
||||
|
||||
list.forEach((object: GridWeapon) => {
|
||||
const weapon = object.weapon
|
||||
weapon.uncap_level = object.uncapLevel
|
||||
|
||||
if (object.mainhand)
|
||||
setMainWeapon(weapon)
|
||||
setMainWeapon(object)
|
||||
else if (!object.mainhand && object.position != null)
|
||||
weapons[object.position] = weapon
|
||||
weapons[object.position] = object
|
||||
})
|
||||
|
||||
return weapons
|
||||
|
|
|
|||
Loading…
Reference in a new issue