From 8c86f5ddcec0a13d638c0239d05517b2dbaaa637 Mon Sep 17 00:00:00 2001
From: Blitblank <pmcgeee03@gmail.com>
Date: Tue, 17 Mar 2026 22:31:13 -0500
Subject: [PATCH] literally every time

---
 client/src/api/AuthApi.ts         | 49 ++++++++++++++++++++++++++++++
 client/src/api/axios.ts           | 24 +++++++++++++++
 client/src/pages/LoginForm.vue    | 47 +++++++++++++++++++++++++++++
 client/src/pages/RegisterForm.vue | 50 +++++++++++++++++++++++++++++++
 4 files changed, 170 insertions(+)
 create mode 100644 client/src/api/AuthApi.ts
 create mode 100644 client/src/api/axios.ts
 create mode 100644 client/src/pages/LoginForm.vue
 create mode 100644 client/src/pages/RegisterForm.vue

diff --git a/client/src/api/AuthApi.ts b/client/src/api/AuthApi.ts
new file mode 100644
index 0000000..8ed5b4c
--- /dev/null
+++ b/client/src/api/AuthApi.ts
@@ -0,0 +1,49 @@
+
+// service to interact with the api/auth endpoints 
+// handles user registration, user logins, tokens, password reset, etc.
+
+import api from "./axios.ts"
+import type { User } from "../models/User.ts";
+
+const API_URL: string = "/auth";
+
+export const register = async (user: { username: string; email: string; password: string }) => {
+
+	try {
+		const response = await api.post(`${API_URL}/register`, user);
+
+		// TODO: if valid
+
+		return true;
+
+		// else return false
+
+	} catch (err) {
+		return false;
+	}
+
+}
+
+export const login = async (user: { username: string; password: string }) => {
+
+	try {
+		const response = await api.post(`${API_URL}/login`, user);
+		const token = response.data.token;
+
+		localStorage.setItem("token", token);
+
+		return true;
+
+	} catch (err) {
+		return false;
+	}
+
+}
+
+export const logout = () => {
+	localStorage.removeItem("token");
+}
+
+export const getToken = () => {
+	return localStorage.getItem("token");
+}
diff --git a/client/src/api/axios.ts b/client/src/api/axios.ts
new file mode 100644
index 0000000..496a119
--- /dev/null
+++ b/client/src/api/axios.ts
@@ -0,0 +1,24 @@
+
+// http service hub
+// handles interceptors and such
+
+import axios from "axios";
+
+const baseUrl: string = import.meta.env.DEV ? import.meta.env.VITE_DEV_API_URL : "https://app.vxbard.net/api"
+const api = axios.create({
+	baseURL: baseUrl
+});
+
+api.interceptors.request.use(config => {
+
+    const token = localStorage.getItem("token");
+
+    if (token) {
+        config.headers.Authorization = `Bearer ${token}`;
+    }
+
+    return config;
+
+});
+
+export default api;
diff --git a/client/src/pages/LoginForm.vue b/client/src/pages/LoginForm.vue
new file mode 100644
index 0000000..ce652f3
--- /dev/null
+++ b/client/src/pages/LoginForm.vue
@@ -0,0 +1,47 @@
+
+<script setup lang="ts">
+
+import { onMounted, reactive } from "vue";
+import { useRoute, useRouter } from "vue-router";
+
+import * as authApi from "../api/AuthApi";
+
+const router = useRouter();
+
+const user = reactive({
+    username: "",
+    password: ""
+});
+
+onMounted(() => {
+
+});
+
+async function login(): Promise<void> {
+
+    const success: boolean = await authApi.login(user);
+
+    if(success) {
+        router.push("/users"); // redirect
+    } else {
+        // prompt try again
+    }
+
+}
+
+</script>
+
+<template>
+
+    <div>
+        <h2>Login</h2>
+
+        <form @submit.prevent="login">
+            <input v-model="user.username" placeholder="username" />
+            <input v-model="user.password" type="password" placeholder="password" />
+            
+            <button type="submit">Submit</button>
+        </form>
+    </div>
+
+</template>
\ No newline at end of file
diff --git a/client/src/pages/RegisterForm.vue b/client/src/pages/RegisterForm.vue
new file mode 100644
index 0000000..179e7fb
--- /dev/null
+++ b/client/src/pages/RegisterForm.vue
@@ -0,0 +1,50 @@
+
+<script setup lang="ts">
+
+import { onMounted, reactive } from "vue";
+import { useRoute, useRouter } from "vue-router";
+
+import * as authApi from "../api/AuthApi";
+
+const router = useRouter();
+
+const user = reactive({
+    username: "",
+    email: "",
+    password: ""
+});
+
+onMounted(() => {
+
+});
+
+async function register(): Promise<void> {
+
+    const success: boolean = await authApi.register(user);
+
+    if(success) {
+        router.push("/login"); // redirect
+    } else {
+        // prompt try again
+    }
+
+}
+
+
+</script>
+
+<template>
+
+    <div>
+        <h2>Register</h2>
+
+        <form @submit.prevent="register">
+            <input v-model="user.username" placeholder="username" />
+            <input v-model="user.email" placeholder="email" />
+            <input v-model="user.password" placeholder="password" />
+            
+            <button type="submit">Submit</button>
+        </form>
+    </div>
+
+</template>
\ No newline at end of file