From 52bbfa5592bc1a841e49cb1b1e4461f5e28b661f Mon Sep 17 00:00:00 2001
From: Ovidiu U <nonreal@gmail.com>
Date: Fri, 10 Apr 2026 18:00:59 +0100
Subject: [PATCH] feat: add useAuth composable with user tier detection

---
 resources/js/App.vue                |  8 ++++++
 resources/js/composables/useAuth.js | 44 +++++++++++++++++++++++++++++
 2 files changed, 52 insertions(+)
 create mode 100644 resources/js/composables/useAuth.js

diff --git a/resources/js/App.vue b/resources/js/App.vue
index 6a702d4..f63c971 100644
--- a/resources/js/App.vue
+++ b/resources/js/App.vue
@@ -3,5 +3,13 @@
 </template>
 
 <script setup>
+import { onMounted } from 'vue'
 import { RouterView } from 'vue-router'
+import { useAuth } from './composables/useAuth.js'
+
+const { fetchUser } = useAuth()
+
+onMounted(async () => {
+    await fetchUser()
+})
 </script>
diff --git a/resources/js/composables/useAuth.js b/resources/js/composables/useAuth.js
new file mode 100644
index 0000000..e8849f9
--- /dev/null
+++ b/resources/js/composables/useAuth.js
@@ -0,0 +1,44 @@
+import { ref, computed } from 'vue'
+import api from '../axios.js'
+
+const user = ref(null)
+const loading = ref(false)
+const fetched = ref(false)
+
+export function useAuth() {
+    const isAuthenticated = computed(() => user.value !== null)
+
+    const userTier = computed(() => {
+        if (!user.value) {
+            return 'guest'
+        }
+        return user.value.tier ?? 'free'
+    })
+
+    const isPaidTier = computed(() => {
+        return ['basic', 'plus', 'pro'].includes(userTier.value)
+    })
+
+    async function fetchUser() {
+        if (fetched.value) {
+            return
+        }
+        loading.value = true
+        try {
+            const response = await api.get('/auth/me')
+            user.value = response.data
+        } catch {
+            user.value = null
+        } finally {
+            loading.value = false
+            fetched.value = true
+        }
+    }
+
+    function clearUser() {
+        user.value = null
+        fetched.value = false
+    }
+
+    return { user, loading, isAuthenticated, userTier, isPaidTier, fetchUser, clearUser }
+}