♻️ Cleanup build issues on console

Author: kevinpiac

.idea/codeStyles/Project.xml

@@ -6,6 +6,7 @@
 	"semi": true,
 	"singleQuote": false,
 	"jsxBracketSameLine": true,
+	"plugins": ["prettier-plugin-organize-imports"],
 	"overrides": [ {
 		"files": "*.svelte",
 		"options": {

console/.prettierrc

@@ -40,6 +40,7 @@
     "monaco-editor": "^0.43.0",
     "postcss": "^8.4.29",
     "prettier": "^2.8.0",
+    "prettier-plugin-organize-imports": "^3.2.3",
     "prettier-plugin-svelte": "^2.10.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

console/package-lock.json

@@ -1,14 +1,8 @@
 <script lang="ts">
 	import type { LayoutData } from "./$types";
 	import "../app.css";
-	import LoadingFrame from "$lib/components/common/loading-frame/LoadingFrame.svelte";
 	import { SvelteToast } from "@zerodevx/svelte-toast";
-	export let data: LayoutData;
 </script>
 
-{#await data.lazy.context}
-	<LoadingFrame />
-{:then context}
-	<SvelteToast />
-	<slot />
-{/await}
+<SvelteToast />
+<slot />

console/package.json

@@ -5,6 +5,7 @@
 	import { page } from "$app/stores";
 	import MainTitleSkeleton from "$lib/components/common/skeleton/MainTitleSkeleton.svelte";
 	import { projectStore } from "$lib/stores/project";
+	import { projectOverviewRoute } from "$lib/routes/routes";
 
 	export let data: PageData;
 
@@ -23,7 +24,7 @@
 
 	const agentPromise = fetchAgentDetails($page.params.agentId).then((agent) => {
 		if (!agent) {
-			goto(agentOverviewRoute.path(project.id));
+			goto(projectOverviewRoute.path(project.id));
 		}
 
 		setCurrentAgent(agent);
@@ -60,7 +61,7 @@
 					</div>
 				{:then agent}
 					<span class="text-body-accent dark:text-body-accent-dark font-semibold text-2xl"
-						>{$agentStore.currentAgent.name}</span>
+						>{$agentStore.currentAgent?.name}</span>
 					<CopiableTag value={agent.id} />
 				{/await}
 			</div>

console/src/routes/+layout.server.ts

@@ -1,19 +1,10 @@
 <script lang="ts">
-	import { Icon, DocumentDuplicate, CursorArrowRays, BookOpen } from "svelte-hero-icons";
+	import { Icon, CursorArrowRays, BookOpen } from "svelte-hero-icons";
 	import DiscordIcon from "$lib/assets/img/discord-icon.svg";
-	import TopCover from "$lib/components/common/top-cover/TopCover.svelte";
 	import Typography from "$lib/components/common/typography/Typography.svelte";
 	import Card from "$lib/components/common/card/Card.svelte";
 	import Button from "$lib/components/common/button/Button.svelte";
-	import Input from "$lib/components/common/input/Input.svelte";
-	import type { PageData } from "./$types";
-	import { z as zod } from "zod";
-	import { superForm } from "sveltekit-superforms/client";
 	import Spacer from "$lib/components/common/spacer/Spacer.svelte";
-	import { fetchAgentDetails } from "$lib/usecases/agents/fetchAgentDetails";
-	import { page } from "$app/stores";
-	import MainTitleSkeleton from "$lib/components/common/skeleton/MainTitleSkeleton.svelte";
-	import Alert from "$lib/components/common/alert/Alert.svelte";
 	import Tabs from "$lib/components/common/tabs/Tabs.svelte";
 	import { projectStore } from "$lib/stores/project";
 	import {
@@ -22,38 +13,21 @@
 	} from "$lib/components/project/agents/code-snippets/onboarding.snippet";
 
 	import Monaco from "svelte-monaco";
-	export let data: PageData;
-
-	const { form, errors, validate } = superForm(data.form, {
-		validators: zod.object({
-			name: zod.string().min(3).max(20)
-		}),
-		validationMethod: "oninput"
-	});
-
-	const handleValidation = async (e: Event) => {
-		e.preventDefault();
-		const res = await validate();
-
-		if (!res.valid) {
-			errors.set(res.errors);
-			return;
-		}
-	};
-
 	import { PUBLIC_AI_AGENT_DOMAIN } from "$env/static/public";
-	import TabNav from "$lib/components/common/navigation/tab-nav/TabNav.svelte";
-	import { projectAuthMethodsRoute, projectMembersRoute } from "$lib/routes/routes";
 	import SDKSecretGenerator from "$lib/components/project/secret/SDKSecretGenerator.svelte";
+	import { agentStore } from "$lib/stores/agent";
 
 	const project = $projectStore.currentProject;
-
-	console.log("project", project);
+	const agent = $agentStore.currentAgent;
 
 	if (!project) {
 		throw new Error("Project not found");
 	}
 
+	if (!agent) {
+		throw new Error("Agent not found");
+	}
+
 	const tabItems: {
 		value: string;
 		id: string;
@@ -71,29 +45,25 @@
 		}
 	];
 
-	let currentStep: "open-frontend" | "authentication" | "send-message" = "open-frontend";
-
 	let selectedTab = "python";
 
 	$: snippetValue =
 		selectedTab === "python"
 			? onboardingPythonCode({
 					projectId: project.id,
 					projectSlug: project.slug,
-					agentId: "the-agent-id"
+					agentId: agent.id
 			  })
 			: onboardingTypescriptCode({
 					projectId: project.id,
 					projectSlug: project.slug,
-					// TODO: replace with the real agent id
-					agentId: "the-agent-id"
+					agentId: agent.id
 			  });
 
 	$: projectSlug = project.slug;
 
 	const openFrontend = () => {
 		window.open(`http://${projectSlug}.${PUBLIC_AI_AGENT_DOMAIN}/register`, "_blank");
-		currentStep = "authentication";
 	};
 </script>
 
@@ -111,13 +81,7 @@
 						<div
 							class="rounded-md overflow-hidden"
 							style="position: relative; padding-bottom: 62.5%; height: 0;">
-							<iframe
-								src="https://www.loom.com/embed/12882db32c6f44caae36dac02a7a8b9a?sid=fcd12081-8939-475a-91fb-fbcd805357a7"
-								frameborder="0"
-								webkitallowfullscreen
-								mozallowfullscreen
-								allowfullscreen
-								style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;" />
+							<!-- TUTORIAL / IFRAME GOES HERE -->
 						</div>
 					</div>
 				</section>

console/src/routes/+layout.svelte

@@ -26,6 +26,8 @@
 
 	const { form, errors, validate } = superForm(
 		{
+			// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+			// @ts-ignore
 			name: agent.name
 		},
 		{