HotPlate/discord-rpg-concept
1
0
Fork 0
forked from syntaxbullet/aurorabot
Code Pull Requests Activity

feat: Allow direct icon upload when updating an item in the item form.

Browse Source
This commit is contained in:
syntaxbullet
2026-02-06 13:37:19 +01:00
parent 0b56486ab2
commit b18b5fab62
1 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
web/src/components/item-form.tsx
View File

@@ -32,7 +32,7 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Separator } from "@/components/ui/separator"; import { Separator } from "@/components/ui/separator";
import { ImageUploader } from "@/components/image-uploader"; import { ImageUploader } from "@/components/image-uploader";
import { EffectEditor } from "@/components/effect-editor"; import { EffectEditor } from "@/components/effect-editor";
import { useCreateItem, useUpdateItem, type ItemWithUsage, type CreateItemData } from "@/hooks/use-items"; import { useCreateItem, useUpdateItem, useUploadItemIcon, type ItemWithUsage, type CreateItemData } from "@/hooks/use-items";
import { Loader2, Coins, FileText, Image, Zap } from "lucide-react"; import { Loader2, Coins, FileText, Image, Zap } from "lucide-react";
// Form schema // Form schema
@@ -72,6 +72,7 @@ export function ItemForm({ initialData, onSuccess, onCancel }: ItemFormProps) {
const isEditMode = !!initialData; const isEditMode = !!initialData;
const { createItem, loading: createLoading } = useCreateItem(); const { createItem, loading: createLoading } = useCreateItem();
const { updateItem, loading: updateLoading } = useUpdateItem(); const { updateItem, loading: updateLoading } = useUpdateItem();
const { uploadIcon, loading: uploadIconLoading } = useUploadItemIcon();
const [imageFile, setImageFile] = useState<File | null>(null); const [imageFile, setImageFile] = useState<File | null>(null);
const [existingImageUrl, setExistingImageUrl] = useState<string | null>(null); const [existingImageUrl, setExistingImageUrl] = useState<string | null>(null);
@@ -123,7 +124,12 @@ export function ItemForm({ initialData, onSuccess, onCancel }: ItemFormProps) {
if (isEditMode && initialData) { if (isEditMode && initialData) {
const result = await updateItem(initialData.id, itemData); const result = await updateItem(initialData.id, itemData);
// If update was successful and we have a new image, upload it
if (result) { if (result) {
if (imageFile) {
await uploadIcon(initialData.id, imageFile);
}
onSuccess(); onSuccess();
} }
} else { } else {
@@ -134,7 +140,7 @@ export function ItemForm({ initialData, onSuccess, onCancel }: ItemFormProps) {
} }
}; };
const isLoading = createLoading || updateLoading; const isLoading = createLoading || updateLoading || uploadIconLoading;
return ( return (
<Form {...form}> <Form {...form}>
@@ -288,13 +294,7 @@ export function ItemForm({ initialData, onSuccess, onCancel }: ItemFormProps) {
<ImageUploader <ImageUploader
existingUrl={existingImageUrl} existingUrl={existingImageUrl}
onFileSelect={setImageFile} onFileSelect={setImageFile}
disabled={isEditMode}
/> />
{isEditMode && (
<p className="text-xs text-muted-foreground mt-2">
To update the image, use the icon upload in the items table after saving.
</p>
)}
</CardContent> </CardContent>
</Card> </Card>