From 502e31ee6965c20245c78f803208245ea34bf3ce Mon Sep 17 00:00:00 2001
From: SauceyRed <saucey@saucey.red>
Date: Sat, 31 May 2025 02:39:34 +0200
Subject: [PATCH] fix: apiBase not being used correctly, format document
 indentation

---
 layouts/auth.vue | 206 ++++++++++++++++++++++++++---------------------
 1 file changed, 116 insertions(+), 90 deletions(-)

diff --git a/layouts/auth.vue b/layouts/auth.vue
index 16e9552..b3e234e 100644
--- a/layouts/auth.vue
+++ b/layouts/auth.vue
@@ -1,59 +1,63 @@
 <template>
-  <div id="root-container" style="margin-top: 5dvh;">
-    <div id="main-container">
-      <div v-if="!instanceUrl">
-        <div v-if="instanceError" style="color: red;">
-          {{ instanceError }}
-        </div>
-        <form @submit="selectInstance">
-          <div>
-            <label for="instance-url">Instance URL</label>
-            <br>
-            <input type="url" name="instance-url" id="instance-url" required v-model="instanceUrlInput">
-          </div>
-          <div>
-            <button type="submit">Next</button>
-          </div>
-        </form>
-      </div>
-      <div v-else id="auth-form-container">
-        <slot />
-      </div>
-      <div v-if="auth.accessToken.value">
-        You're logged in!
-        <form @submit="logout">
-          <div>
-            <label for="logout-password">Password</label>
-            <br>
-            <input type="password" name="logout-password" id="logout-password" v-model="form.password" required>
-          </div>
-          <div>
-            <button type="submit">Log out</button>
-          </div>
-        </form>
-        <div>
-          <button @click="refresh">Refresh</button>
-        </div>
-        <div>
-          <button @click="showUser">Show user</button>
-        </div>
-        <div>
-          <button @click="getUser">Get me</button>
-        </div>
-      </div>
-    </div>
-  </div>
+	<div id="root-container" style="margin-top: 5dvh;">
+		<div id="main-container">
+			<div id="instance-error-container" v-if="!instanceUrl">
+				<div v-if="instanceError" style="color: red;">
+					{{ instanceError }}
+				</div>
+				<form @submit="selectInstance">
+					<div>
+						<label for="instance-url">Instance URL</label>
+						<br>
+						<input type="url" name="instance-url" id="instance-url" required v-model="instanceUrlInput">
+					</div>
+					<div>
+						<button type="submit">Next</button>
+					</div>
+				</form>
+			</div>
+			<div v-else id="auth-form-container">
+				<slot />
+			</div>
+			<div v-if="instanceUrl">
+				Instance URL is set to {{ instanceUrl }}
+			</div>
+			<div v-if="auth.accessToken.value">
+				You're logged in!
+				<form @submit="logout">
+					<div>
+						<label for="logout-password">Password</label>
+						<br>
+						<input type="password" name="logout-password" id="logout-password" v-model="form.password"
+							required>
+					</div>
+					<div>
+						<button type="submit">Log out</button>
+					</div>
+				</form>
+				<div>
+					<button @click="refresh">Refresh</button>
+				</div>
+				<div>
+					<button @click="showUser">Show user</button>
+				</div>
+				<div>
+					<button @click="getUser">Get me</button>
+				</div>
+			</div>
+		</div>
+	</div>
 </template>
 
 <script lang="ts" setup>
 import { FetchError } from 'ofetch';
 
-const apiVersion = useRuntimeConfig().public.apiVersion;
 const instanceUrl = ref<string | null | undefined>(null);
 const instanceUrlInput = ref<string>();
 const instanceError = ref<string>();
 const requestUrl = useRequestURL();
 const apiBase = useCookie("api_base");
+const gorbTxtError = ref<string>("");
 
 const auth = useAuth();
 
@@ -65,6 +69,8 @@ if (status.value == "success" && gorbTxt.value) {
 		apiBase.value = parsed.ApiBaseUrl;
 		console.log("set apiBase to:", parsed.ApiBaseUrl);
 	}
+} else {
+	gorbTxtError.value = "Failed to find that instance.";
 }
 
 onMounted(async () => {
@@ -75,77 +81,97 @@ onMounted(async () => {
 });
 
 async function selectInstance(e: Event) {
-  e.preventDefault();
-  if (instanceUrlInput.value) {
-    const instanceUrlObj = new URL(`api/v${apiVersion}/stats`, instanceUrlInput.value.endsWith("/") ? instanceUrlInput.value : instanceUrlInput.value + "/");
-    try {
-      const res = await $fetch.raw(instanceUrlObj.href);
-      instanceError.value = "";
-	  
-      const origin = new URL(res.url).origin;
-      instanceUrl.value = origin;
-      useCookie("instance_url").value = origin;
-
-      if (!apiBase.value) apiBase.value = origin + `/api/v${apiVersion}`;
-    } catch (error: any) {
-      if (error instanceof FetchError) {
-        console.log("Status code:", error.response?.status);
-        if (error.response?.status == 404) {
-          instanceError.value = "An instance with that URL does not exist or is currently down.";
-        }
-      }
-      console.error("Error:", error);
-    }
-  }
+	e.preventDefault();
+	console.log("trying input instance");
+	if (instanceUrlInput.value) {
+		console.log("input has value");
+		const gorbTxtUrl = new URL(`/.well-known/gorb.txt`, instanceUrlInput.value);
+		try {
+			console.log("trying to get gorb.txt:", gorbTxtUrl);
+			const res = await $fetch.raw(gorbTxtUrl.href, { responseType: "text" });
+			const parsed = parseWellKnown(res._data as string);
+			console.log("parsed:", parsed);
+			if (parsed.ApiBaseUrl) {
+				apiBase.value = parsed.ApiBaseUrl;
+				console.log("set apiBase to:", parsed.ApiBaseUrl);
+				const origin = new URL(res.url).origin;
+				instanceUrl.value = origin;
+				useCookie("instance_url").value = origin;
+				console.log("set instance url to:", origin);
+				return;
+			}
+			instanceError.value = "That URL is not a valid instance.";
+			return;
+		} catch (error: any) {
+			if (error instanceof FetchError) {
+				console.log("Status code:", error.response?.status);
+				if ((error.cause as any).toString().includes("NetworkError")) {
+					instanceError.value = "Could not connect to that instance, it may not be set up correctly.";
+				}
+				if (error.response?.status == 404) {
+					instanceError.value = "An instance with that URL does not exist or is currently down.";
+				}
+			}
+			console.error("Error:", error);
+		}
+	}
 }
 
 const form = reactive({
-  password: ""
+	password: ""
 });
 
 async function logout(e: Event) {
-  e.preventDefault();
-  await auth.logout(form.password);
-  console.log("logout");
+	e.preventDefault();
+	await auth.logout(form.password);
+	console.log("logout");
 }
 
 async function refresh(e: Event) {
-  e.preventDefault();
-  await auth.refresh();
-  console.log("refreshed");
+	e.preventDefault();
+	await auth.refresh();
+	console.log("refreshed");
 }
 
 async function getUser(e: Event) {
-  e.preventDefault();
-  await auth.getUser();
-  console.log("user:", auth.user.value);
+	e.preventDefault();
+	await auth.getUser();
+	console.log("user:", auth.user.value);
 }
 
 async function showUser(e: Event) {
-  e.preventDefault();
-  console.log("user:", auth.user.value);
+	e.preventDefault();
+	console.log("user:", auth.user.value);
 }
 
 </script>
 
 <style>
-#root-container, #main-container  {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
+#root-container,
+#main-container {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
 }
 
 #auth-form-container,
 #auth-form-container form {
-  display: flex;
-  width: 50dvw;
-  flex-direction: column;
-  align-items: center;
-  gap: 1em;
+	display: flex;
+	width: 50dvw;
+	flex-direction: column;
+	align-items: center;
+	gap: 1em;
 }
 
 #auth-form-container form {
-  text-align: left;
-  margin-top: 10dvh;
+	text-align: left;
+	margin-top: 10dvh;
 }
+
+#instance-error-container {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+}
+
 </style>
\ No newline at end of file