create-mantiq 0.7.0 → 0.7.2

package/stubs/auth/web/vue/src/App.vue.stub

@@ -0,0 +1,74 @@
+<script setup lang="ts">
+import { ref, shallowRef, onMounted, onUnmounted, provide } from 'vue'
+
+const props = defineProps<{
+  pages: Record<string, any>
+  initialData?: Record<string, any>
+}>()
+
+declare global { interface Window { __MANTIQ_DATA__?: Record<string, any> } }
+const windowData = typeof window !== 'undefined' ? window.__MANTIQ_DATA__ ?? {} : {}
+const initial = props.initialData ?? windowData
+
+const currentPage = ref<string>(initial._page ?? 'Login')
+const pageData = ref<Record<string, any>>(initial)
+const PageComponent = shallowRef(props.pages[currentPage.value] ?? null)
+
+async function navigate(href: string) {
+  const res = await fetch(href, {
+    headers: { 'X-Mantiq': 'true', Accept: 'application/json' },
+  })
+
+  // Session expired — redirect to login
+  if (res.status === 401 || res.status === 419) {
+    currentPage.value = 'Login'
+    pageData.value = { _page: 'Login', _url: '/login' }
+    PageComponent.value = props.pages['Login'] ?? null
+    history.pushState(null, '', '/login')
+    return
+  }
+
+  const newData = await res.json()
+  currentPage.value = newData._page
+  pageData.value = newData
+  PageComponent.value = props.pages[newData._page] ?? null
+  history.pushState(null, '', newData._url)
+}
+
+provide('navigate', navigate)
+
+const spaRoutes = [
+  '/login', '/register', '/dashboard', '/users',
+  '/account/profile', '/account/security', '/account/preferences',
+]
+
+function handleClick(e: MouseEvent) {
+  const anchor = (e.target as HTMLElement).closest('a')
+  const href = anchor?.getAttribute('href')
+  if (!href?.startsWith('/') || anchor?.target || e.ctrlKey || e.metaKey) return
+  if (!spaRoutes.some(r => href === r || href.startsWith(r + '?'))) return
+  e.preventDefault()
+  navigate(href)
+}
+
+function handlePop() { navigate(location.pathname + location.search) }
+
+onMounted(() => {
+  document.addEventListener('click', handleClick)
+  window.addEventListener('popstate', handlePop)
+
+  // Initialize theme: localStorage > system preference > dark default
+  const theme = localStorage.getItem('theme') ||
+    (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')
+  document.documentElement.classList.toggle('dark', theme === 'dark')
+})
+
+onUnmounted(() => {
+  document.removeEventListener('click', handleClick)
+  window.removeEventListener('popstate', handlePop)
+})
+</script>
+
+<template>
+  <component :is="PageComponent" v-bind="pageData" :navigate="navigate" v-if="PageComponent" />
+</template>

package/stubs/auth/web/vue/src/pages.ts.stub

@@ -0,0 +1,17 @@
+import Login from './pages/Login.vue'
+import Register from './pages/Register.vue'
+import Dashboard from './pages/Dashboard.vue'
+import Users from './pages/Users.vue'
+import Profile from './pages/account/profile.vue'
+import Security from './pages/account/security.vue'
+import Preferences from './pages/account/preferences.vue'
+
+export const pages: Record<string, any> = {
+  Login,
+  Register,
+  Dashboard,
+  Users,
+  Profile,
+  Security,
+  Preferences,
+}