fix initial mask

frontend/src/lib/Buttons/AboutButton.svelte

@@ -1,7 +1,11 @@
 <script lang="ts">
 	import { onMount } from 'svelte';
 	import ShareWithCommunity from './ShareWithCommunity.svelte';
+
+	export let isLoading = false;
+
 	let open = true;
+
 	onMount(() => {
 		autoOpen();
 		window.addEventListener('resize', autoOpen);
@@ -33,7 +37,7 @@
 				>
 				About
 			</button>
-			<ShareWithCommunity classList={''} />
+			<ShareWithCommunity {isLoading} />
 		</div>
 	</details>
 </div>

frontend/src/lib/Buttons/ShareWithCommunity.svelte

@@ -5,7 +5,7 @@
 	import { canvasEl, selectedRoomID } from '$lib/store';
 	import { nanoid } from 'nanoid';
 
-	export let classList = '';
+	export let isLoading = false;
 
 	let isUploading: boolean = false;
 	async function handleClick() {
@@ -63,9 +63,12 @@ ${canvasImage}
 </script>
 
 <!-- svelte-ignore a11y-click-events-have-key-events -->
-<div
-	class="{classList} text-xs font-mono flex items-center justify-center bg-black gap-x-1 rounded-xl cursor-pointer px-2 py-1 whitespace-nowrap"
+<button
+	class="{isLoading || isUploading
+		? 'cursor-wait'
+		: 'cursor-pointer'} text-xs font-mono flex items-center justify-center bg-black gap-x-1 rounded-xl px-2 py-1 whitespace-nowrap"
 	on:click={handleClick}
+	disabled={isUploading || isLoading}
 	title="Share with community"
 >
 	{#if isUploading}
@@ -74,4 +77,4 @@ ${canvasImage}
 		<IconCommunity />
 	{/if}
 	<p class="text-white font-semibold">Share to community</p>
-</div>
+</button>

frontend/src/lib/Menu.svelte

@@ -19,6 +19,7 @@
 />
 <div class="flex flex-col md:flex-row items-center justify-between px-4 md:px-12 gap-3 md:gap-0">
 	<AboutButton
+		{isLoading}
 		on:click={() => {
 			$toggleAbout = !$toggleAbout;
 		}}

frontend/src/lib/PaintCanvas.svelte

@@ -150,7 +150,9 @@
 		id: string;
 	};
 	async function renderImages(promptImgList: PromptImgObject[]) {
+		if (promptImgList.length === 0) return;
 		$isRenderingCanvas = true;
+
 		await Promise.allSettled(
 			promptImgList.map(
 				({ imgURL, position, id, room }) =>