fixed bugs: #1 and #2

Author: KutayGuler

src/lib/PieChart.svelte

@@ -11,7 +11,9 @@
 		return Math.floor((degrees / 360) * 100);
 	}
 
-	for (let i = 0; i < 9; i++) {
+	const sliceCount = data.length < 9 ? data.length : 9;
+
+	for (let i = 0; i < sliceCount; i++) {
 		if (i == 4) {
 			let value = data.slice(9).reduce((acc, [_, v]) => {
 				if (v <= 0) return acc;

src/lib/userSection.svelte

@@ -38,15 +38,19 @@
 			</a>
 			{#key [currentPie, numberType]}
 				<PieChart data={pieData[currentPie]} {numberType}>
-					<select class="select rounded-3xl" bind:value={currentPie}>
-						{#each Object.keys(pieData) as value}
-							<option {value}>{pieNames[value]}</option>
-						{/each}
-					</select>
-					<select class="select rounded-3xl" bind:value={numberType}>
-						<option value="percentage">Percentage</option>
-						<option value="literal">Literal</option>
-					</select>
+					{#if pieData[currentPie].length > 0}
+						<select class="select rounded-3xl" bind:value={currentPie}>
+							{#each Object.keys(pieData) as value}
+								<option {value}>{pieNames[value]}</option>
+							{/each}
+						</select>
+						<select class="select rounded-3xl" bind:value={numberType}>
+							<option value="percentage">Percentage</option>
+							<option value="literal">Literal</option>
+						</select>
+					{:else}
+						<div>No visualizations available.</div>
+					{/if}
 				</PieChart>
 			{/key}
 		</div>

src/routes/+page.svelte

@@ -12,6 +12,7 @@
 	let authorData = [];
 	let pieData = {};
 	let type: RetrievalType = 'submission';
+	let requestCompleted = false;
 
 	$: console.log(returnData);
 	$: console.log(authorData);
@@ -27,6 +28,8 @@
 				input.value = null;
 			}
 		}
+
+		requestCompleted = false;
 	}
 
 	function clearResults() {
@@ -97,6 +100,7 @@
 
 		populateForm();
 		loading = true;
+		requestCompleted = false;
 
 		let authorName = url.searchParams.get('author');
 		let type: RetrievalType = (url.searchParams.get('type') as RetrievalType) || 'submission';
@@ -121,6 +125,7 @@
 		}
 
 		loading = false;
+		requestCompleted = true;
 	}
 
 	async function fetchPullPush(retrievalType: RetrievalType, value: string) {
@@ -132,16 +137,6 @@
 			);
 			const json = await response.json();
 			_returnData = json.data;
-			if (_returnData.length === 0) {
-				return {
-					toast: {
-						message:
-							'No results found for your search. Please try again with different parameters.',
-						background: 'variant-filled-error',
-						autohide: false
-					}
-				};
-			}
 			return _returnData;
 		} catch {
 			return {
@@ -469,5 +464,13 @@
 			</div>
 		{/if}
 		<IntersectionObserver element={itemCountDiv} on:intersect={paginate} />
+	{:else if requestCompleted}
+		<div class="w-full flex justify-center">
+			<div
+				class="flex justify-center self-center alert card variant-ghost-warning max-w-5xl w-full rounded-3xl"
+			>
+				No results found for your search.
+			</div>
+		</div>
 	{/if}
 {/if}