feat: initialize game frontend with Vue, routing, and session management

- Add index.html as the entry point for the application.
- Create App.vue to serve as the main application component with RouterView.
- Implement global styles in main.css using Tailwind CSS.
- Set up TypeScript definitions for Vue components in env.d.ts.
- Configure Vue Router with routes for home, public, login, and not found views.
- Extend RouteMeta interface to include authentication-related metadata.
- Create a Pinia store for session management with status tracking.
- Implement TRPC client for API communication with session token handling.
- Develop views for Login, Main, Not Found, and Public with basic structure.
- Configure TypeScript for Node with tsconfig.node.json.
- Set up Vite configuration for the project with Vue and Tailwind CSS plugins.
This commit is contained in:
2026-01-15 17:57:41 +00:00
parent 44ec80c93b
commit 15625f2c28
18 changed files with 768 additions and 48 deletions
+65
View File
@@ -0,0 +1,65 @@
import { createRouter, createWebHistory, type RouteRecordRaw } from 'vue-router';
import MainView from '../views/MainView.vue';
import PublicView from '../views/PublicView.vue';
import LoginView from '../views/LoginView.vue';
import NotFoundView from '../views/NotFoundView.vue';
import { useSessionStore } from '../stores/session';
const routes = [
{
path: '/',
name: 'home',
component: MainView,
meta: {
requiresAuth: true,
requiresGeneral: true,
},
},
{
path: '/public',
name: 'public',
component: PublicView,
},
{
path: '/login',
name: 'login',
component: LoginView,
meta: {
publicOnly: true,
},
},
{
path: '/:pathMatch(.*)*',
name: 'not-found',
component: NotFoundView,
},
] satisfies RouteRecordRaw[];
const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL),
routes,
});
router.beforeEach((to) => {
const session = useSessionStore();
if (!session.isReady) {
return true;
}
if (to.meta.publicOnly && session.isAuthed) {
return { name: 'home' };
}
if (to.meta.requiresAuth && !session.isAuthed) {
return { name: 'public' };
}
if (to.meta.requiresGeneral && !session.hasGeneral) {
return { name: 'public' };
}
return true;
});
export default router;
+9
View File
@@ -0,0 +1,9 @@
import 'vue-router';
declare module 'vue-router' {
interface RouteMeta {
requiresAuth?: boolean;
requiresGeneral?: boolean;
publicOnly?: boolean;
}
}