fixed version selection default value and added proper avatar names to the dropdown preview

This commit is contained in:
Polaris 2024-08-26 15:03:50 -04:00
parent 90ae8fc48c
commit 4a7dae218b
7 changed files with 68 additions and 48 deletions

View File

@ -1,6 +1,6 @@
"use client";
import React, { FC, useState } from "react";
import React, { FC, useEffect, useState } from "react";
import { Check, ChevronsUpDown } from "lucide-react";
import { cn } from "@/lib/utils";
import { Button } from "@/components/ui/button";
@ -29,7 +29,7 @@ import {
PopoverContent,
PopoverTrigger,
} from "@/components/ui/popover";
import { updatePlayerGameVersionChuni } from "./actions";
import { getGameList, updatePlayerGameVersionChuni } from "./actions";
type ChunithmGameVersionSelectionProps = {
chunithmGameVersionNumber: {
@ -48,12 +48,25 @@ export function PlayerChangableChunithmGameVersionSelection({}: ChunithmGameVers
const [selectedGameVersion, setSelectedGameVersion] = useState<
string | undefined
>(Object.values(GameVersion)[0]);
>(undefined);
useEffect(() => {
async function fetchCurrentGameVersion() {
try {
const gameList = await getGameList();
const currentVersion = gameList[0]?.gameVersion;
setSelectedGameVersion(currentVersion);
form.setValue("gameVersion", currentVersion);
} catch (error) {
console.error("Error fetching current game version:", error);
}
}
fetchCurrentGameVersion();
}, []);
function onSubmit(data: z.infer<typeof FormSchema>) {
const newGameVersion = data.gameVersion ?? selectedGameVersion;
// console.log("Submitted Game Version:", newGameVersion);
updatePlayerGameVersionChuni(newGameVersion as GameVersion)
.then((result) => {
toast({

View File

@ -4,7 +4,6 @@ import { getAuth } from "@/auth/queries/getauth";
import { daphnis } from "@/lib/prisma";
import { randomUUID } from "crypto";
import { randomBytes } from "crypto";
import { redirect } from "next/navigation";
export async function generateShareToken(id: number): Promise<{
token?: string;

View File

@ -56,7 +56,6 @@ type AvatarSelectionProps = {
avatarParts: chunithm_avatar[];
};
};
export const AvatarCustomization: FC<AvatarSelectionProps> = ({
avatarHeadSelectionData,
avatarFaceSelectionData,
@ -79,7 +78,6 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
const [avatarFaceId, setAvatarFaceId] = useState<number | undefined>(
undefined,
);
const [avatarSkinId, setAvatarSkinId] = useState<number | undefined>(
undefined,
);
@ -99,32 +97,39 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
useEffect(() => {
const fetchAvatarParts = async () => {
try {
const data = await getCurrentAvatarParts();
setAvatarFaceId(data[0].avatarFace!);
setAvatarSkinId(data[0].avatarSkin!);
setAvatarHeadId(data[0].avatarHead!);
setAvatarWearId(data[0].avatarWear!);
setAvatarBackId(data[0].avatarBack!);
setAvatarItemId(data[0].avatarItem!);
const avatarData = await getCurrentAvatarParts();
const [currentAvatarParts] = avatarData;
if (currentAvatarParts) {
setAvatarFaceId(currentAvatarParts.avatarFace ?? undefined);
setAvatarSkinId(currentAvatarParts.avatarSkin ?? undefined);
setAvatarHeadId(currentAvatarParts.avatarHead ?? undefined);
setAvatarWearId(currentAvatarParts.avatarWear ?? undefined);
setAvatarBackId(currentAvatarParts.avatarBack ?? undefined);
setAvatarItemId(currentAvatarParts.avatarItem ?? undefined);
// Set initial form values based on fetched data
form.reset({
AvatarHeadAccessory: currentAvatarParts.avatarHead ?? undefined,
AvatarFaceAccessory: currentAvatarParts.avatarFace ?? undefined,
AvatarItemAccessory: currentAvatarParts.avatarItem ?? undefined,
AvatarBackAccessory: currentAvatarParts.avatarBack ?? undefined,
AvatarWearAccessory: currentAvatarParts.avatarWear ?? undefined,
});
}
} catch (error) {
console.error("Error fetching avatar parts:", error);
}
};
fetchAvatarParts();
}, []);
function onSubmit(data: z.infer<typeof FormSchema>) {
const defaultHeadId = avatarHeadId;
const defaultFaceId = avatarFaceId;
const defaultBackId = avatarBackId;
const defaultWearId = avatarWearId;
const defaultItemId = avatarItemId;
}, [form]);
const newHeadId = data.AvatarHeadAccessory ?? defaultHeadId;
const newFaceId = data.AvatarFaceAccessory ?? defaultFaceId;
const newBackId = data.AvatarBackAccessory ?? defaultBackId;
const newWearId = data.AvatarWearAccessory ?? defaultWearId;
const newItemId = data.AvatarItemAccessory ?? defaultItemId;
function onSubmit(data: z.infer<typeof FormSchema>) {
const newHeadId = data.AvatarHeadAccessory ?? avatarHeadId;
const newFaceId = data.AvatarFaceAccessory ?? avatarFaceId;
const newBackId = data.AvatarBackAccessory ?? avatarBackId;
const newWearId = data.AvatarWearAccessory ?? avatarWearId;
const newItemId = data.AvatarItemAccessory ?? avatarItemId;
updateAvatarParts(newHeadId, newFaceId, newBackId, newWearId, newItemId)
.then(() => {
@ -271,7 +276,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
variant="outline"
role="combobox"
className={cn(
"w-[300px] justify-between",
"w-[400px] justify-between",
!field.value && "text-muted-foreground",
)}
>
@ -285,7 +290,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[300px] p-0">
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandList>
<CommandEmpty>No avatar part found.</CommandEmpty>
@ -336,7 +341,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
variant="outline"
role="combobox"
className={cn(
"w-[300px] justify-between",
"w-[400px] justify-between",
!field.value && "text-muted-foreground",
)}
>
@ -350,7 +355,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[300px] p-0">
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandList>
<CommandEmpty>No avatar part found.</CommandEmpty>
@ -401,7 +406,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
variant="outline"
role="combobox"
className={cn(
"w-[300px] justify-between",
"w-[400px] justify-between",
!field.value && "text-muted-foreground",
)}
>
@ -415,7 +420,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[300px] p-0">
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandList>
<CommandEmpty>No avatar part found.</CommandEmpty>
@ -466,7 +471,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
variant="outline"
role="combobox"
className={cn(
"w-[300px] justify-between",
"w-[400px] justify-between",
!field.value && "text-muted-foreground",
)}
>
@ -480,7 +485,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[300px] p-0">
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandList>
<CommandEmpty>No avatar part found.</CommandEmpty>
@ -531,7 +536,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
variant="outline"
role="combobox"
className={cn(
"w-[300px] justify-between",
"w-[400px] justify-between",
!field.value && "text-muted-foreground",
)}
>
@ -545,7 +550,7 @@ export const AvatarCustomization: FC<AvatarSelectionProps> = ({
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[300px] p-0">
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandList>
<CommandEmpty>No avatar part found.</CommandEmpty>

View File

@ -50,7 +50,7 @@ export const MapIconCustomization: FC<SystemVoiceSelectionProps> = ({
}) => {
const FormSchema = z.object({
mapIconId: z.number({
required_error: "Please select an Avatar Head Item.",
required_error: "Please select an Map Icon.",
}),
});
@ -59,13 +59,13 @@ export const MapIconCustomization: FC<SystemVoiceSelectionProps> = ({
});
const [mapIconId, setMapIconId] = useState<number | undefined>(undefined);
useEffect(() => {
const fetchMapIcons = async () => {
try {
const data = await getCurrentMapIcon();
if (data.length > 0) {
setMapIconId(data[0].mapIconId!);
setMapIconId(data[0].mapIconId ?? undefined); // Handle null as undefined
form.setValue("mapIconId", data[0].mapIconId as number);
}
} catch (error) {
console.error("Error fetching avatar parts:", error);
@ -146,7 +146,7 @@ export const MapIconCustomization: FC<SystemVoiceSelectionProps> = ({
variant="outline"
role="combobox"
className={cn(
"w-[300px] justify-between",
"w-[400px] justify-between",
!field.value && "text-muted-foreground",
)}
>
@ -159,7 +159,7 @@ export const MapIconCustomization: FC<SystemVoiceSelectionProps> = ({
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[300px] p-0">
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandList>
<CommandEmpty>No name plate found.</CommandEmpty>

View File

@ -67,6 +67,7 @@ export const NameplateCustomization: FC<AvatarSelectionProps> = ({
const data = await getCurrentNameplate();
if (data.length > 0) {
setNameplateId(data[0].nameplateId!);
form.setValue("nameplateId", data[0].nameplateId as number);
}
} catch (error) {
console.error("Error fetching avatar parts:", error);
@ -141,7 +142,7 @@ export const NameplateCustomization: FC<AvatarSelectionProps> = ({
variant="outline"
role="combobox"
className={cn(
"w-[300px] justify-between",
"w-[400px] justify-between",
!field.value && "text-muted-foreground",
)}
>
@ -154,7 +155,7 @@ export const NameplateCustomization: FC<AvatarSelectionProps> = ({
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[300px] p-0">
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandList>
<CommandEmpty>No name plate found.</CommandEmpty>

View File

@ -75,6 +75,7 @@ export const SystemVoiceCustomization: FC<SystemVoiceSelectionProps> = ({
const data = await getCurrentSystemVoice();
if (data.length > 0) {
setSytemVoiceId(data[0].voiceId!);
form.setValue("PlayerSystemVoice", data[0].voiceId as number);
}
} catch (error) {
console.error("Error fetching system voices:", error);
@ -152,7 +153,7 @@ export const SystemVoiceCustomization: FC<SystemVoiceSelectionProps> = ({
variant="outline"
role="combobox"
className={cn(
"w-[300px] justify-between",
"w-[400px] justify-between",
!field.value && "text-muted-foreground",
)}
>
@ -165,7 +166,7 @@ export const SystemVoiceCustomization: FC<SystemVoiceSelectionProps> = ({
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[300px] p-0">
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandList>
<CommandEmpty>No system voice found.</CommandEmpty>

View File

@ -66,6 +66,7 @@ export const TrophyCustomization: FC<AvatarSelectionProps> = ({
const data = await getCurrentTrophies();
if (data.length > 0) {
setTrophyId(data[0].trophyId!);
form.setValue("trophies", data[0].trophyId as number);
}
} catch (error) {
console.error("Error fetching avatar parts:", error);
@ -118,7 +119,7 @@ export const TrophyCustomization: FC<AvatarSelectionProps> = ({
variant="outline"
role="combobox"
className={cn(
"w-[300px] justify-between",
"w-[400px] justify-between",
!field.value && "text-muted-foreground",
)}
>
@ -131,7 +132,7 @@ export const TrophyCustomization: FC<AvatarSelectionProps> = ({
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-[300px] p-0">
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandList>
<CommandEmpty>No avatar part found.</CommandEmpty>