From abc614ecfd0d22c6d0f50fce6250ec7c165504f7 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <andras.bacsai@gmail.com>
Date: Tue, 13 Dec 2022 12:54:57 +0100
Subject: [PATCH] wip: trpc

---
 apps/client/src/lib/store.ts                  |  2 +-
 apps/client/src/routes/+layout.svelte         |  2 +-
 apps/client/src/routes/+layout.ts             |  6 +++---
 apps/client/src/routes/+page.svelte           | 21 +++++++++----------
 apps/client/src/routes/+page.ts               |  4 ++--
 .../routes/applications/[id]/+layout.svelte   | 17 +++++++--------
 .../src/routes/applications/[id]/+layout.ts   |  4 ++--
 .../[id]/_components/Buttons/Delete.svelte    |  4 ++--
 .../[id]/_components/Buttons/Deploy.svelte    |  4 ++--
 .../_components/Buttons/ForceDeploy.svelte    |  4 ++--
 .../[id]/_components/Buttons/Restart.svelte   |  6 +++---
 .../[id]/_components/Buttons/Stop.svelte      |  6 +++---
 .../src/routes/applications/[id]/utils.ts     |  4 ++--
 apps/client/src/routes/login/+page.svelte     |  4 ++--
 apps/client/src/routes/register/+page.svelte  |  4 ++--
 15 files changed, 44 insertions(+), 48 deletions(-)

diff --git a/apps/client/src/lib/store.ts b/apps/client/src/lib/store.ts
index c6dbde873..8e3687dca 100644
--- a/apps/client/src/lib/store.ts
+++ b/apps/client/src/lib/store.ts
@@ -8,7 +8,7 @@ import cuid from 'cuid';
 
 export const serverBaseUrl = dev ? `http://${browser && window.location.hostname}:2022` : '';
 export let token: string = Cookies.get('token') || '';
-export const t = createTRPCProxyClient<AppRouter>({
+export const trpc = createTRPCProxyClient<AppRouter>({
 	transformer: superjson,
 	links: [
 		httpBatchLink({
diff --git a/apps/client/src/routes/+layout.svelte b/apps/client/src/routes/+layout.svelte
index 9ad3451da..cd5ab4cd1 100644
--- a/apps/client/src/routes/+layout.svelte
+++ b/apps/client/src/routes/+layout.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	export let data: LayoutData;
 	import type { LayoutData } from './$types';
-
+	export const ssr = false;
 	import '../app.postcss';
 	import { appSession } from '$lib/store';
 	import Tooltip from '$lib/components/Tooltip.svelte';
diff --git a/apps/client/src/routes/+layout.ts b/apps/client/src/routes/+layout.ts
index 9296de460..6a2608cac 100644
--- a/apps/client/src/routes/+layout.ts
+++ b/apps/client/src/routes/+layout.ts
@@ -1,5 +1,5 @@
 import { error } from '@sveltejs/kit';
-import { t } from '$lib/store';
+import { trpc } from '$lib/store';
 import type { LayoutLoad } from './$types';
 import { redirect } from '@sveltejs/kit';
 import Cookies from 'js-cookie';
@@ -10,14 +10,14 @@ export const load: LayoutLoad = async ({ url }) => {
 
 	try {
 		if (pathname === '/login' || pathname === '/register') {
-			const baseSettings = await t.settings.getBaseSettings.query();
+			const baseSettings = await trpc.settings.getBaseSettings.query();
 			return {
 				settings: {
 					...baseSettings
 				}
 			};
 		}
-		const settings = await t.settings.getInstanceSettings.query();
+		const settings = await trpc.settings.getInstanceSettings.query();
 		if (settings.data.token) {
 			Cookies.set('token', settings.data.token);
 		}
diff --git a/apps/client/src/routes/+page.svelte b/apps/client/src/routes/+page.svelte
index 71163b87e..f7ca836a6 100644
--- a/apps/client/src/routes/+page.svelte
+++ b/apps/client/src/routes/+page.svelte
@@ -6,8 +6,7 @@
 	import { onMount } from 'svelte';
 
 	import { asyncSleep, errorNotification, getRndInteger } from '$lib/common';
-	import { appSession, search, t } from '$lib/store';
-
+	import { appSession, search, trpc } from '$lib/store';
 	import ApplicationsIcons from '$lib/components/svg/applications/ApplicationIcons.svelte';
 	import DatabaseIcons from '$lib/components/svg/databases/DatabaseIcons.svelte';
 	import ServiceIcons from '$lib/components/svg/services/ServiceIcons.svelte';
@@ -156,7 +155,7 @@
 			let isRunning = false;
 			let isDegraded = false;
 			if (buildPack || simpleDockerfile) {
-				const response = await t.applications.status.query({ id });
+				const response = await trpc.applications.status.query({ id });
 				if (response.length === 0) {
 					isRunning = false;
 				} else if (response.length === 1) {
@@ -178,7 +177,7 @@
 					}
 				}
 			} else if (typeof dualCerts !== 'undefined') {
-				const response = await t.services.status.query({ id });
+				const response = await trpc.services.status.query({ id });
 				if (Object.keys(response).length === 0) {
 					isRunning = false;
 				} else {
@@ -198,7 +197,7 @@
 					}
 				}
 			} else {
-				const response = await t.databases.status.query({ id });
+				const response = await trpc.databases.status.query({ id });
 				isRunning = response.isRunning;
 			}
 
@@ -382,7 +381,7 @@
 				'Are you sure? This will delete all UNCONFIGURED applications and their data.'
 			);
 			if (sure) {
-				await t.applications.cleanup.query();
+				await trpc.applications.cleanup.query();
 				return window.location.reload();
 			}
 		} catch (error) {
@@ -395,7 +394,7 @@
 				'Are you sure? This will delete all UNCONFIGURED services and their data.'
 			);
 			if (sure) {
-				await t.services.cleanup.query();
+				await trpc.services.cleanup.query();
 				return window.location.reload();
 			}
 		} catch (error) {
@@ -408,7 +407,7 @@
 				'Are you sure? This will delete all UNCONFIGURED databases and their data.'
 			);
 			if (sure) {
-				await t.databases.cleanup.query();
+				await trpc.databases.cleanup.query();
 				return window.location.reload();
 			}
 		} catch (error) {
@@ -419,7 +418,7 @@
 		try {
 			const sure = confirm('Are you sure? This will delete this application!');
 			if (sure) {
-				await t.applications.delete.mutate({ id, force: true });
+				await trpc.applications.delete.mutate({ id, force: true });
 				return window.location.reload();
 			}
 		} catch (error) {
@@ -430,7 +429,7 @@
 		try {
 			const sure = confirm('Are you sure? This will delete this service!');
 			if (sure) {
-				await t.services.delete.mutate({ id });
+				await trpc.services.delete.mutate({ id });
 				// await del(`/services/${id}`, {});
 				return window.location.reload();
 			}
@@ -442,7 +441,7 @@
 		try {
 			const sure = confirm('Are you sure? This will delete this database!');
 			if (sure) {
-				await t.databases.delete.mutate({ id, force: true });
+				await trpc.databases.delete.mutate({ id, force: true });
 				return window.location.reload();
 			}
 		} catch (error) {
diff --git a/apps/client/src/routes/+page.ts b/apps/client/src/routes/+page.ts
index 00c21903a..4652e3d53 100644
--- a/apps/client/src/routes/+page.ts
+++ b/apps/client/src/routes/+page.ts
@@ -1,5 +1,5 @@
 import { error } from '@sveltejs/kit';
-import { t } from '$lib/store';
+import { trpc } from '$lib/store';
 import type { LayoutLoad } from './$types';
 import { redirect } from '@sveltejs/kit';
 import Cookies from 'js-cookie';
@@ -7,7 +7,7 @@ export const ssr = false;
 
 export const load: LayoutLoad = async ({ url }) => {
 	try {
-		return await t.dashboard.resources.query();
+		return await trpc.dashboard.resources.query();
 	} catch (err) {
 		throw error(500, {
 			message: 'An unexpected error occurred, please try again later.'
diff --git a/apps/client/src/routes/applications/[id]/+layout.svelte b/apps/client/src/routes/applications/[id]/+layout.svelte
index 5071e0979..7d06d091d 100644
--- a/apps/client/src/routes/applications/[id]/+layout.svelte
+++ b/apps/client/src/routes/applications/[id]/+layout.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { page } from '$app/stores';
-	import { appSession, status, t } from '$lib/store';
+	import { status, trpc } from '$lib/store';
 	import { onDestroy, onMount } from 'svelte';
 	import type { LayoutData } from './$types';
 	import * as Buttons from './_components/Buttons';
@@ -12,13 +12,11 @@
 	const id = $page.params.id;
 	const application = data.application.data;
 
-	let currentPage = 'main';
+	$: isConfigurationView = $page.url.pathname.startsWith(`/applications/${id}/configuration/`);
+
 	let stopping = false;
 	let statusInterval: NodeJS.Timeout;
 
-	if ($page.url.pathname.startsWith(`/applications/${id}/configuration/`)) {
-		currentPage = 'configuration';
-	}
 	onMount(async () => {
 		await getStatus();
 		statusInterval = setInterval(async () => {
@@ -36,8 +34,7 @@
 		if (($status.application.loading && stopping) || $status.application.restarting === true)
 			return;
 		$status.application.loading = true;
-		$status.application.statuses = await t.applications.status.query({ id });
-
+		$status.application.statuses = await trpc.applications.status.query({ id });
 		let numberOfApplications = 0;
 		if (application.dockerComposeConfiguration) {
 			numberOfApplications =
@@ -80,7 +77,7 @@
 				<div>Configurations</div>
 			</div>
 		</div>
-		{#if currentPage === 'configuration'}
+		{#if isConfigurationView}
 			<Buttons.Delete {id} name={application.name} />
 		{/if}
 	</nav>
@@ -100,9 +97,9 @@
 </div>
 <div
 	class="mx-auto max-w-screen-2xl px-0 lg:px-10 grid grid-cols-1"
-	class:lg:grid-cols-4={!$page.url.pathname.startsWith(`/applications/${id}/configuration/`)}
+	class:lg:grid-cols-4={!isConfigurationView}
 >
-	{#if !$page.url.pathname.startsWith(`/applications/${id}/configuration/`)}
+	{#if !isConfigurationView}
 		<nav class="header flex flex-col lg:pt-0 ">
 			<Menu {application} />
 		</nav>
diff --git a/apps/client/src/routes/applications/[id]/+layout.ts b/apps/client/src/routes/applications/[id]/+layout.ts
index 3f2176a38..e0baec1b9 100644
--- a/apps/client/src/routes/applications/[id]/+layout.ts
+++ b/apps/client/src/routes/applications/[id]/+layout.ts
@@ -1,5 +1,5 @@
 import { error } from '@sveltejs/kit';
-import { t } from '$lib/store';
+import { trpc } from '$lib/store';
 import type { LayoutLoad } from './$types';
 import { redirect } from '@sveltejs/kit';
 
@@ -27,7 +27,7 @@ export const load: LayoutLoad = async ({ params, url }) => {
 	const { pathname } = new URL(url);
 	const { id } = params;
 	try {
-		const application = await t.applications.getApplicationById.query({ id });
+		const application = await trpc.applications.getApplicationById.query({ id });
 		if (!application) {
 			throw redirect(307, '/applications');
 		}
diff --git a/apps/client/src/routes/applications/[id]/_components/Buttons/Delete.svelte b/apps/client/src/routes/applications/[id]/_components/Buttons/Delete.svelte
index 9763c0058..182419e03 100644
--- a/apps/client/src/routes/applications/[id]/_components/Buttons/Delete.svelte
+++ b/apps/client/src/routes/applications/[id]/_components/Buttons/Delete.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
 	import { errorNotification } from '$lib/common';
-	import { appSession, t } from '$lib/store';
+	import { appSession, trpc } from '$lib/store';
 
 	export let id: string;
 	export let name: string;
@@ -11,7 +11,7 @@
 		const sure = confirm(`Are you sure you want to delete ${name}?`);
 		if (sure) {
 			try {
-				await t.applications.delete.mutate({ id, force });
+				await trpc.applications.delete.mutate({ id, force });
 				return await goto('/');
 			} catch (error) {
 				return errorNotification(error);
diff --git a/apps/client/src/routes/applications/[id]/_components/Buttons/Deploy.svelte b/apps/client/src/routes/applications/[id]/_components/Buttons/Deploy.svelte
index 728ec47e7..0a934440f 100644
--- a/apps/client/src/routes/applications/[id]/_components/Buttons/Deploy.svelte
+++ b/apps/client/src/routes/applications/[id]/_components/Buttons/Deploy.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
 	import { errorNotification } from '$lib/common';
 	export let id: string;
-	import { t } from '$lib/store';
+	import { trpc } from '$lib/store';
 	async function handleSubmit() {
 		try {
-			await t.applications.deploy.mutate({
+			await trpc.applications.deploy.mutate({
 				id
 			});
 		} catch (error) {
diff --git a/apps/client/src/routes/applications/[id]/_components/Buttons/ForceDeploy.svelte b/apps/client/src/routes/applications/[id]/_components/Buttons/ForceDeploy.svelte
index 52ebe94ca..53a08a0e8 100644
--- a/apps/client/src/routes/applications/[id]/_components/Buttons/ForceDeploy.svelte
+++ b/apps/client/src/routes/applications/[id]/_components/Buttons/ForceDeploy.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
 	import { errorNotification } from '$lib/common';
 	export let id: string;
-	import { t } from '$lib/store';
+	import { trpc } from '$lib/store';
 	async function handleSubmit() {
 		try {
-			await t.applications.forceRedeploy.mutate({
+			await trpc.applications.forceRedeploy.mutate({
 				id
 			});
 		} catch (error) {
diff --git a/apps/client/src/routes/applications/[id]/_components/Buttons/Restart.svelte b/apps/client/src/routes/applications/[id]/_components/Buttons/Restart.svelte
index c2f583634..d9f416745 100644
--- a/apps/client/src/routes/applications/[id]/_components/Buttons/Restart.svelte
+++ b/apps/client/src/routes/applications/[id]/_components/Buttons/Restart.svelte
@@ -1,12 +1,12 @@
 <script lang="ts">
 	import { errorNotification } from '$lib/common';
 	export let id: string;
-	import { t } from '$lib/store';
+	import { trpc } from '$lib/store';
 
 	async function handleSubmit() {
 		try {
-			return await t.applications.restart.mutate({ id });
-		} catch(error) {
+			return await trpc.applications.restart.mutate({ id });
+		} catch (error) {
 			return errorNotification(error);
 		}
 	}
diff --git a/apps/client/src/routes/applications/[id]/_components/Buttons/Stop.svelte b/apps/client/src/routes/applications/[id]/_components/Buttons/Stop.svelte
index 777665141..e9925d08e 100644
--- a/apps/client/src/routes/applications/[id]/_components/Buttons/Stop.svelte
+++ b/apps/client/src/routes/applications/[id]/_components/Buttons/Stop.svelte
@@ -2,16 +2,16 @@
 	import { createEventDispatcher } from 'svelte';
 
 	import { errorNotification } from '$lib/common';
-	import { t } from '$lib/store';
+	import { trpc } from '$lib/store';
 
 	export let id: string;
 
 	const dispatch = createEventDispatcher();
-	
+
 	async function handleSubmit() {
 		try {
 			dispatch('stopping');
-			await t.applications.stop.mutate({ id });
+			await trpc.applications.stop.mutate({ id });
 			dispatch('stopped');
 		} catch (error) {
 			return errorNotification(error);
diff --git a/apps/client/src/routes/applications/[id]/utils.ts b/apps/client/src/routes/applications/[id]/utils.ts
index 5bff428b0..4464f932d 100644
--- a/apps/client/src/routes/applications/[id]/utils.ts
+++ b/apps/client/src/routes/applications/[id]/utils.ts
@@ -1,7 +1,7 @@
 import { goto } from '$app/navigation';
 import { errorNotification } from '$lib/common';
-import { t } from '$lib/store';
+import { trpc } from '$lib/store';
 
 export async function saveForm() {
-	return await t.applications.save.mutate();
+	return await trpc.applications.save.mutate();
 }
diff --git a/apps/client/src/routes/login/+page.svelte b/apps/client/src/routes/login/+page.svelte
index 9ee7a3054..07cbd17d6 100644
--- a/apps/client/src/routes/login/+page.svelte
+++ b/apps/client/src/routes/login/+page.svelte
@@ -3,7 +3,7 @@
 	import Cookies from 'js-cookie';
 	import { goto } from '$app/navigation';
 	import { errorNotification } from '$lib/common';
-	import { appSession, loginEmail, t } from '$lib/store';
+	import { appSession, loginEmail, trpc } from '$lib/store';
 	import { onMount } from 'svelte';
 	let loading = false;
 	let emailEl: HTMLInputElement;
@@ -18,7 +18,7 @@
 	async function handleSubmit() {
 		loading = true;
 		try {
-			const { token } = await t.auth.login.mutate({ email, password });
+			const { token } = await trpc.auth.login.mutate({ email, password });
 			Cookies.set('token', token, {
 				path: '/'
 			});
diff --git a/apps/client/src/routes/register/+page.svelte b/apps/client/src/routes/register/+page.svelte
index 2bf9931d8..37603dc1d 100644
--- a/apps/client/src/routes/register/+page.svelte
+++ b/apps/client/src/routes/register/+page.svelte
@@ -2,7 +2,7 @@
 	export let userCount: number;
 	import { goto } from '$app/navigation';
 	import { errorNotification } from '$lib/common';
-	import { appSession, loginEmail, t } from '$lib/store';
+	import { appSession, loginEmail, trpc } from '$lib/store';
 	import { onMount } from 'svelte';
 	import Cookies from 'js-cookie';
 	if (!$appSession.isRegistrationEnabled) {
@@ -29,7 +29,7 @@
 		}
 		loading = true;
 		try {
-			const payload = await t.auth.register.mutate({ email, password });
+			const payload = await trpc.auth.register.mutate({ email, password });
 			Cookies.set('token', payload.token, {
 				path: '/'
 			});