Normalize outfit data as we load it into wardrobe-2020
Rather than letting the fact that the server API models outfits a bit differently (underscore keys, integer IDs for things), I'd rather convert it to the familiar field names and expected types!
This commit is contained in:
parent
1830689a19
commit
d32c6459b0
4 changed files with 31 additions and 17 deletions
|
@ -55,10 +55,7 @@ function useOutfitSaving(outfitState, dispatchToOutfit) {
|
|||
|
||||
const saveOutfitMutation = useSaveOutfitMutation({
|
||||
onSuccess: (outfit) => {
|
||||
if (
|
||||
String(outfit.id) === String(outfitState.id) &&
|
||||
outfit.name !== outfitState.name
|
||||
) {
|
||||
if (outfit.id === outfitState.id && outfit.name !== outfitState.name) {
|
||||
dispatchToOutfit({
|
||||
type: "rename",
|
||||
outfitName: outfit.name,
|
||||
|
|
|
@ -30,8 +30,8 @@ function useOutfitState() {
|
|||
status: outfitStatus,
|
||||
} = useSavedOutfit(urlOutfitState.id, { enabled: urlOutfitState.id != null });
|
||||
|
||||
const creator = outfitData?.user;
|
||||
const updatedAt = outfitData?.updated_at;
|
||||
const creator = outfitData?.creator;
|
||||
const updatedAt = outfitData?.updatedAt;
|
||||
|
||||
// We memoize this to make `outfitStateWithoutExtras` an even more reliable
|
||||
// stable object!
|
||||
|
@ -430,15 +430,13 @@ function getOutfitStateFromOutfitData(outfit) {
|
|||
}
|
||||
|
||||
return {
|
||||
id: String(outfit.id),
|
||||
id: outfit.id,
|
||||
name: outfit.name,
|
||||
speciesId: String(outfit.species_id),
|
||||
colorId: String(outfit.color_id),
|
||||
speciesId: outfit.speciesId,
|
||||
colorId: outfit.colorId,
|
||||
pose: outfit.pose,
|
||||
wornItemIds: new Set((outfit.item_ids?.worn || []).map((id) => String(id))),
|
||||
closetedItemIds: new Set(
|
||||
(outfit.item_ids?.closeted || []).map((id) => String(id)),
|
||||
),
|
||||
wornItemIds: new Set(outfit.wornItemIds),
|
||||
closetedItemIds: new Set(outfit.closetedItemIds),
|
||||
};
|
||||
}
|
||||
|
||||
|
|
|
@ -18,7 +18,11 @@ function useCurrentUser() {
|
|||
function readCurrentUserId() {
|
||||
try {
|
||||
const element = document.querySelector("meta[name=dti-current-user-id]");
|
||||
return JSON.parse(element.getAttribute("content"));
|
||||
const value = element.getAttribute("content");
|
||||
if (value === "null") {
|
||||
return null;
|
||||
}
|
||||
return value;
|
||||
} catch (error) {
|
||||
console.error(
|
||||
`[readCurrentUserId] Couldn't read user ID, using null instead`,
|
||||
|
|
|
@ -15,7 +15,7 @@ export function useSaveOutfitMutation(options) {
|
|||
...options,
|
||||
mutationFn: saveOutfit,
|
||||
onSuccess: (outfit) => {
|
||||
queryClient.setQueryData(["outfits", String(outfit.id)], outfit);
|
||||
queryClient.setQueryData(["outfits", outfit.id], outfit);
|
||||
options.onSuccess(outfit);
|
||||
},
|
||||
});
|
||||
|
@ -28,7 +28,7 @@ async function loadSavedOutfit(id) {
|
|||
throw new Error(`loading outfit failed: ${res.status} ${res.statusText}`);
|
||||
}
|
||||
|
||||
return res.json();
|
||||
return res.json().then(normalizeOutfit);
|
||||
}
|
||||
|
||||
async function saveOutfit({
|
||||
|
@ -77,7 +77,22 @@ async function saveOutfit({
|
|||
throw new Error(`saving outfit failed: ${res.status} ${res.statusText}`);
|
||||
}
|
||||
|
||||
return res.json();
|
||||
return res.json().then(normalizeOutfit);
|
||||
}
|
||||
|
||||
function normalizeOutfit(outfit) {
|
||||
return {
|
||||
id: String(outfit.id),
|
||||
name: outfit.name,
|
||||
speciesId: String(outfit.species_id),
|
||||
colorId: String(outfit.color_id),
|
||||
pose: outfit.pose,
|
||||
wornItemIds: (outfit.item_ids?.worn || []).map((id) => String(id)),
|
||||
closetedItemIds: (outfit.item_ids?.closeted || []).map((id) => String(id)),
|
||||
creator: outfit.user ? { id: String(outfit.user.id) } : null,
|
||||
createdAt: outfit.created_at,
|
||||
updatedAt: outfit.updated_at,
|
||||
};
|
||||
}
|
||||
|
||||
function getCSRFToken() {
|
||||
|
|
Loading…
Reference in a new issue