79 lines
2.2 KiB
TypeScript
79 lines
2.2 KiB
TypeScript
import { useEditorStore, type ToolType } from "@/pages/editor/store/editorStore";
|
|
import { useSingleUpload } from "@/pages/uploader/hooks/useUploaderData";
|
|
import {
|
|
ImageUpload,
|
|
VideoInput,
|
|
LinkInput,
|
|
SelectInstruction,
|
|
RectangleInstruction,
|
|
TextInstruction,
|
|
LineInstruction,
|
|
ArrowInstruction,
|
|
StickerInstruction,
|
|
GridInstruction,
|
|
} from "./instructions";
|
|
|
|
type ToolInstructionsProps = {
|
|
tool: ToolType;
|
|
};
|
|
|
|
const ToolInstructions = ({ tool }: ToolInstructionsProps) => {
|
|
const { addObject, setSelectedObjectId, setTool } = useEditorStore();
|
|
const { mutateAsync: uploadFile } = useSingleUpload();
|
|
|
|
const handleImageUpload = async (e: React.ChangeEvent<HTMLInputElement>) => {
|
|
const file = e.target.files?.[0];
|
|
if (!file) return;
|
|
try {
|
|
const result = await uploadFile(file);
|
|
const imageUrl = result?.data?.url;
|
|
if (!imageUrl) return;
|
|
const img = new Image();
|
|
img.onload = () => {
|
|
const newImage = {
|
|
id: `image-${Date.now()}`,
|
|
type: "image" as ToolType,
|
|
x: 100,
|
|
y: 100,
|
|
width: img.width,
|
|
height: img.height,
|
|
imageUrl,
|
|
};
|
|
addObject(newImage);
|
|
setSelectedObjectId(newImage.id);
|
|
setTool("select");
|
|
};
|
|
img.src = imageUrl;
|
|
} catch {
|
|
// TODO: show error toast
|
|
}
|
|
};
|
|
|
|
if (tool === "image") {
|
|
return <ImageUpload onImageUpload={handleImageUpload} />;
|
|
}
|
|
|
|
if (tool === "video") {
|
|
return <VideoInput />;
|
|
}
|
|
|
|
if (tool === "link") {
|
|
return <LinkInput />;
|
|
}
|
|
|
|
const simpleInstructions: Partial<Record<ToolType, React.ReactElement>> = {
|
|
select: <SelectInstruction />,
|
|
rectangle: <RectangleInstruction />,
|
|
text: <TextInstruction />,
|
|
line: <LineInstruction />,
|
|
arrow: <ArrowInstruction />,
|
|
sticker: <StickerInstruction />,
|
|
grid: <GridInstruction />,
|
|
};
|
|
|
|
return simpleInstructions[tool] ?? null;
|
|
};
|
|
|
|
export default ToolInstructions;
|
|
|