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:
Emi Matchu 2023-11-02 17:12:59 -07:00
parent 1830689a19
commit d32c6459b0
4 changed files with 31 additions and 17 deletions

View file

@ -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,

View file

@ -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),
};
}

View file

@ -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`,

View file

@ -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() {