From 80d71a64589838a3739d1ef90a8f7cd199d2f9fc Mon Sep 17 00:00:00 2001
From: Jamie Harding <jharding142@icloud.com>
Date: Wed, 26 Feb 2025 13:20:23 +0100
Subject: [PATCH] Add error for handling bad links/strats

---
 packages/webapp/src/routes/deploy/+layout.ts  | 42 +++++++++++++----
 .../webapp/src/routes/deploy/+page.svelte     | 46 +++++++++++--------
 2 files changed, 59 insertions(+), 29 deletions(-)

diff --git a/packages/webapp/src/routes/deploy/+layout.ts b/packages/webapp/src/routes/deploy/+layout.ts
index 4f2fd310b..771688d91 100644
--- a/packages/webapp/src/routes/deploy/+layout.ts
+++ b/packages/webapp/src/routes/deploy/+layout.ts
@@ -4,16 +4,38 @@ import type { LayoutLoad } from './$types';
 import { DotrainOrderGui } from '@rainlanguage/orderbook/js_api';
 
 export const load: LayoutLoad = async ({ url }) => {
-	// get the registry url from the url params
 	const registry = url.searchParams.get('registry');
+	try {
+		const registryDotrains = await fetchRegistryDotrains(registry || REGISTRY_URL);
+		if (!registryDotrains || registryDotrains.length === 0) {
+			throw new Error('No strategy registry found at URL');
+		}
+		const strategyDetails = await Promise.all(
+			registryDotrains.map(async (registryDotrain) => {
+				try {	
+					const details = await DotrainOrderGui.getStrategyDetails(registryDotrain.dotrain);
+					if (!details) {
+						throw new Error('This registry contains invalid Dotrain documents.');
+					}
+					return { ...registryDotrain, details };
+				} catch (error) {
+					throw new Error(error instanceof Error ? error.message : String(error));
+				}
+			})
+		);
 
-	const registryDotrains = await fetchRegistryDotrains(registry || REGISTRY_URL);
-	const strategyDetails = await Promise.all(
-		registryDotrains.map(async (registryDotrain) => {
-			const details = await DotrainOrderGui.getStrategyDetails(registryDotrain.dotrain);
-			return { ...registryDotrain, details };
-		})
-	);
-
-	return { registry: registry || REGISTRY_URL, registryDotrains, strategyDetails };
+		return { 
+			registry: registry || REGISTRY_URL, 
+			registryDotrains, 
+			strategyDetails,
+			error: null 
+		};
+	} catch (error: unknown) {
+		return { 
+			registry: registry || REGISTRY_URL, 
+			registryDotrains: [], 
+			strategyDetails: [],
+			error: error instanceof Error ? error.message : 'Unknown error occurred'
+		};
+	}
 };
diff --git a/packages/webapp/src/routes/deploy/+page.svelte b/packages/webapp/src/routes/deploy/+page.svelte
index bb35c3f3a..4c248a7fd 100644
--- a/packages/webapp/src/routes/deploy/+page.svelte
+++ b/packages/webapp/src/routes/deploy/+page.svelte
@@ -3,7 +3,7 @@
 	import { Button, Input, Toggle } from 'flowbite-svelte';
 	import { page } from '$app/stores';
 
-	const { strategyDetails } = $page.data;
+	const { strategyDetails, error } = $page.data;
 
 	let newRegistryUrl = '';
 	let advancedMode = false;
@@ -42,24 +42,32 @@
 <div class="flex w-full max-w-6xl flex-col gap-y-6">
 	<div class="text-4xl font-semibold text-gray-900 dark:text-white">Strategies</div>
 
-	<div class="flex flex-col rounded-3xl bg-primary-100 p-12 dark:bg-primary-900">
-		<h1 class="text-xl font-semibold text-gray-900 dark:text-white">
-			Raindex empowers you to take full control of your trading strategies. All the strategies here
-			are non-custodial, perpetual, and automated strategies built with our open-source, DeFi-native
-			language <a class="underline" target="_blank" href="https://rainlang.xyz">Rainlang</a>.
-		</h1>
-	</div>
+	{#if error}
+		<div class="flex gap-2 text-xl">
+			Error loading registry:<span class="text-red-500">{error}</span>
+		</div>
+	{:else}
+		<div class="bg-primary-100 dark:bg-primary-900 flex flex-col rounded-3xl p-12">
+			<h1 class="text-xl font-semibold text-gray-900 dark:text-white">
+				Raindex empowers you to take full control of your trading strategies. All the strategies
+				here are non-custodial, perpetual, and automated strategies built with our open-source,
+				DeFi-native language <a class="underline" target="_blank" href="https://rainlang.xyz"
+					>Rainlang</a
+				>.
+			</h1>
+		</div>
 
-	{#if strategyDetails.length > 0}
-		{#key strategyDetails}
-			<div class="mb-36 grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3">
-				{#each strategyDetails as strategyDetail}
-					<StrategyShortTile
-						strategyDetails={strategyDetail.details}
-						registryName={strategyDetail.name}
-					/>
-				{/each}
-			</div>
-		{/key}
+		{#if strategyDetails.length > 0}
+			{#key strategyDetails}
+				<div class="mb-36 grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3">
+					{#each strategyDetails as strategyDetail}
+						<StrategyShortTile
+							strategyDetails={strategyDetail.details}
+							registryName={strategyDetail.name}
+						/>
+					{/each}
+				</div>
+			{/key}
+		{/if}
 	{/if}
 </div>