From 18d857ab1cc2fc403ae0bf0a0c49caaa494e0fc3 Mon Sep 17 00:00:00 2001
From: Mishig Davaadorj <dmishig@gmail.com>
Date: Fri, 22 Sep 2023 15:36:53 +0200
Subject: [PATCH] [Widget Too Big] Should be if-else statement

---
 .../shared/WidgetWrapper/WidgetWrapper.svelte | 61 ++++++++++---------
 1 file changed, 31 insertions(+), 30 deletions(-)

diff --git a/js/src/lib/components/InferenceWidget/shared/WidgetWrapper/WidgetWrapper.svelte b/js/src/lib/components/InferenceWidget/shared/WidgetWrapper/WidgetWrapper.svelte
index 185006f24..7e88129e2 100644
--- a/js/src/lib/components/InferenceWidget/shared/WidgetWrapper/WidgetWrapper.svelte
+++ b/js/src/lib/components/InferenceWidget/shared/WidgetWrapper/WidgetWrapper.svelte
@@ -77,38 +77,39 @@
 			>
 			instead.
 		</p>
-	{/if}
-	{#if isMaximized}
-		<button class="absolute top-6 right-12" on:click={onClickMaximizeBtn}>
-			<IconCross classNames="text-xl text-gray-500 hover:text-black" />
-		</button>
-	{/if}
-	<WidgetHeader {noTitle} pipeline={model.pipeline_tag}>
-		{#if !!inputGroups.length}
-			<div class="ml-auto flex gap-x-1">
-				<!-- Show samples selector when there are more than one sample -->
-				{#if inputGroups.length > 1}
-					<WidgetInputSamplesGroup
-						bind:selectedInputGroup
+	{:else}
+		{#if isMaximized}
+			<button class="absolute top-6 right-12" on:click={onClickMaximizeBtn}>
+				<IconCross classNames="text-xl text-gray-500 hover:text-black" />
+			</button>
+		{/if}
+		<WidgetHeader {noTitle} pipeline={model.pipeline_tag}>
+			{#if !!inputGroups.length}
+				<div class="ml-auto flex gap-x-1">
+					<!-- Show samples selector when there are more than one sample -->
+					{#if inputGroups.length > 1}
+						<WidgetInputSamplesGroup
+							bind:selectedInputGroup
+							{isLoading}
+							inputGroups={inputGroups.map(({ group }) => group)}
+						/>
+					{/if}
+					<WidgetInputSamples
+						classNames={!selectedInputSamples ? "opacity-50 pointer-events-none" : ""}
 						{isLoading}
-						inputGroups={inputGroups.map(({ group }) => group)}
+						inputSamples={selectedInputSamples?.inputSamples ?? []}
+						{applyInputSample}
+						{previewInputSample}
 					/>
-				{/if}
-				<WidgetInputSamples
-					classNames={!selectedInputSamples ? "opacity-50 pointer-events-none" : ""}
-					{isLoading}
-					inputSamples={selectedInputSamples?.inputSamples ?? []}
-					{applyInputSample}
-					{previewInputSample}
-				/>
-			</div>
+				</div>
+			{/if}
+		</WidgetHeader>
+		<slot name="top" />
+		<WidgetInfo {model} {computeTime} {error} {modelLoadInfo} />
+		{#if modelLoading.isLoading}
+			<WidgetModelLoading estimatedTime={modelLoading.estimatedTime} />
 		{/if}
-	</WidgetHeader>
-	<slot name="top" />
-	<WidgetInfo {model} {computeTime} {error} {modelLoadInfo} />
-	{#if modelLoading.isLoading}
-		<WidgetModelLoading estimatedTime={modelLoading.estimatedTime} />
+		<slot name="bottom" />
+		<WidgetFooter {onClickMaximizeBtn} {outputJson} />
 	{/if}
-	<slot name="bottom" />
-	<WidgetFooter {onClickMaximizeBtn} {outputJson} />
 </div>