trafficlunar/blockmatic
1
0
Fork 0
mirror of https://github.com/trafficlunar/blockmatic.git synced 2026-06-28 14:44:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add loading indicator

Browse source
This commit is contained in:
trafficlunar 2024-12-22 21:17:43 +00:00
parent a93073caf9
commit 41ab349e43
8 changed files with 70 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/components/dialogs/OpenImage.tsx
View file

@ -9,8 +9,10 @@ import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { ImageContext } from "@/context/Image";
import { LoadingContext } from "@/context/Loading";
function OpenImage({ close }: DialogProps) {
const { setLoading } = useContext(LoadingContext);
const { setImage: setContextImage, setImageDimensions: setContextImageDimensions } = useContext(ImageContext);
const { acceptedFiles, getRootProps, getInputProps } = useDropzone({
@ -50,9 +52,14 @@ function OpenImage({ close }: DialogProps) {
const onSubmit = () => {
if (image) {
setContextImage(image);
setContextImageDimensions(imageDimensions);
close();
setLoading(true);
// Wait for loading indicator to appear
setTimeout(() => {
setContextImage(image);
setContextImageDimensions(imageDimensions);
close();
}, 100);
}
};

8
src/components/dialogs/SaveLitematic.tsx
View file

@ -2,6 +2,7 @@ import { useContext, useState } from "react";
import * as nbt from "nbtify";
import { CanvasContext } from "@/context/Canvas";
import { LoadingContext } from "@/context/Loading";
import { DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog";
import { Button } from "@/components/ui/button";
@ -12,10 +13,15 @@ const blockData: BlockData = _blockData;
function SaveLitematic({ close }: DialogProps) {
const { canvasSize, blocks } = useContext(CanvasContext);
const { setLoading } = useContext(LoadingContext);
const [fileName, setFileName] = useState("blockmatic");
const onSubmit = async () => {
setLoading(true);
// Wait for loading indicator to appear
await new Promise((resolve) => setTimeout(resolve, 100));
// todo: check if file name input is empty/valid
const width = canvasSize.maxX - canvasSize.minX;
const height = canvasSize.maxY - canvasSize.minY;
@ -130,6 +136,8 @@ function SaveLitematic({ close }: DialogProps) {
const blob = new Blob([compressed], { type: "application/x-gzip" });
const url = URL.createObjectURL(blob);
setLoading(false);
const a = document.createElement("a");
a.href = url;
a.download = `${fileName}.litematic`;