FJurmanovic/acc-server-manager-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update state management

Browse Source
This commit is contained in:
Fran Jurmanović
2025-02-08 18:34:06 +01:00
parent 01fc6e9feb
commit 3ad4b95656
10 changed files with 93 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/api/apiService.ts
View File

@@ -1,14 +1,13 @@
import { authStore } from '$stores/authStore'; import { authStore } from '$stores/authStore';
import { redirect } from '@sveltejs/kit'; import { redirect } from '@sveltejs/kit';
import { get } from 'svelte/store'; import type { RequestEvent } from '../routes/$types';
const BASE_URL = import.meta.env.VITE_API_BASE_URL || 'https://acc-api.jurmanovic.com/v1'; const BASE_URL = import.meta.env.VITE_API_BASE_URL || 'https://acc-api.jurmanovic.com/v1';
async function fetchAPI(endpoint: string, method: string = 'GET', body?: object) { async function fetchAPI(endpoint: string, method: string = 'GET', body?: object, hdr?: object) {
const { token } = get(authStore);
const headers = { const headers = {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
Authorization: `Basic ${token}` ...(hdr ?? {})
}; };
const response = await fetch(`${BASE_URL}${endpoint}`, { const response = await fetch(`${BASE_URL}${endpoint}`, {
@@ -34,4 +33,15 @@ async function fetchAPI(endpoint: string, method: string = 'GET', body?: object)
return response.text(); return response.text();
} }
export async function fetchAPIEvent(
event: object,
endpoint: string,
method: string = 'GET',
body?: object
) {
const token = event.cookies.get('token');
return fetchAPI(endpoint, method, body, { Authorization: `Basic ${token}` });
}
export default fetchAPI; export default fetchAPI;

17
src/api/authService.ts
View File

@@ -1,10 +1,11 @@
import fetchAPI from '$api/apiService'; import fetchAPI, { fetchAPIEvent } from '$api/apiService';
import { authStore } from '$stores/authStore'; import { authStore } from '$stores/authStore';
import type { RequestEvent } from '../routes/$types';
export const login = async (username: string, password: string) => { export const login = async (event: object, username: string, password: string) => {
const token = btoa(`${username}:${password}`); const token = btoa(`${username}:${password}`);
authStore.set({ token }); event.cookies.set('token', token, { path: '/' });
if (!(await checkAuth())) { if (!(await checkAuth(event))) {
{ {
authStore.set({ token: undefined, error: 'Invalid username or password.' }); authStore.set({ token: undefined, error: 'Invalid username or password.' });
return false; return false;
@@ -13,13 +14,13 @@ export const login = async (username: string, password: string) => {
return true; return true;
}; };
export const logout = () => { export const logout = (event) => {
authStore.set({ token: undefined }); event.cookies.delete('token', { path: '/' });
}; };
export const checkAuth = async () => { export const checkAuth = async (event: object) => {
try { try {
await fetchAPI('/api'); await fetchAPIEvent(event, '/api');
return true; return true;
} catch (err) { } catch (err) {
return false; return false;

22
src/api/lookupService.ts
View File

@@ -1,21 +1,21 @@
import fetchAPI from "$api/apiService"; import { fetchAPIEvent } from '$api/apiService';
export const getCarModels = async () => { export const getCarModels = async (event: object) => {
return fetchAPI("/lookup/car-models"); return fetchAPIEvent(event, '/lookup/car-models');
}; };
export const getCupCategories = async () => { export const getCupCategories = async (event: object) => {
return fetchAPI("/lookup/cup-categories"); return fetchAPIEvent(event, '/lookup/cup-categories');
}; };
export const getDriverCategories = async () => { export const getDriverCategories = async (event: object) => {
return fetchAPI("/lookup/driver-categories"); return fetchAPIEvent(event, '/lookup/driver-categories');
}; };
export const getSessionTypes = async () => { export const getSessionTypes = async (event: object) => {
return fetchAPI("/lookup/session-types"); return fetchAPIEvent(event, '/lookup/session-types');
}; };
export const getTracks = async () => { export const getTracks = async (event: object) => {
return fetchAPI("/lookup/tracks"); return fetchAPIEvent(event, '/lookup/tracks');
}; };

34
src/api/serverService.ts
View File

@@ -1,43 +1,45 @@
import fetchAPI from '$api/apiService'; import { fetchAPIEvent } from '$api/apiService';
export const getServers = async () => { export const getServers = async (event: object) => {
return fetchAPI('/server'); return fetchAPIEvent(event, '/server');
}; };
export const getConfigFiles = async (serverId = '') => { export const getConfigFiles = async (event: object, serverId = '') => {
return fetchAPI(`/server/${serverId}/config`); return fetchAPIEvent(event, `/server/${serverId}/config`);
}; };
export const getConfigFile = async (serverId = '', file = '') => { export const getConfigFile = async (event: object, serverId = '', file = '') => {
return fetchAPI(`/server/${serverId}/config/${file}`); return fetchAPIEvent(event, `/server/${serverId}/config/${file}`);
}; };
export const updateConfig = async ( export const updateConfig = async (
event: object,
serverId: string, serverId: string,
file: string, file: string,
newConfig?: object, newConfig?: object,
override = false, override = false,
restart = true restart = true
) => { ) => {
return fetchAPI( return fetchAPIEvent(
event,
`/server/${serverId}/config/${file}?override=${override}&restart=${restart}`, `/server/${serverId}/config/${file}?override=${override}&restart=${restart}`,
'PUT', 'PUT',
newConfig newConfig
); );
}; };
export const restartService = async (serverId: number) => { export const restartService = async (event: object, serverId: number) => {
return fetchAPI('/api/restart', 'POST', { serverId }); return fetchAPIEvent(event, '/api/restart', 'POST', { serverId });
}; };
export const startService = async (serverId: number) => { export const startService = async (event: object, serverId: number) => {
return fetchAPI('/api/start', 'POST', { serverId }); return fetchAPIEvent(event, '/api/start', 'POST', { serverId });
}; };
export const stopService = async (serverId: number) => { export const stopService = async (event: object, serverId: number) => {
return fetchAPI('/api/stop', 'POST', { serverId }); return fetchAPIEvent(event, '/api/stop', 'POST', { serverId });
}; };
export const getServiceStatus = async (serviceName: number) => { export const getServiceStatus = async (event: object, serviceName: number) => {
return fetchAPI(`/api/${serviceName}`); return fetchAPIEvent(event, `/api/${serviceName}`);
}; };

14
src/components/Sidebar.svelte
View File

@@ -1,11 +1,5 @@
<script> <script>
import { logout } from '$api/authService';
import { goto } from '$app/navigation'; import { goto } from '$app/navigation';
function handleLogout() {
logout();
goto('/login');
}
</script> </script>
<aside <aside
@@ -36,13 +30,13 @@
</a> </a>
</li> </li>
<li> <li>
<a <form method="POST" action="/logout">
href="#" <button
onclick={handleLogout}
class="group flex items-center rounded-lg p-2 text-gray-900 hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700" class="group flex items-center rounded-lg p-2 text-gray-900 hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700"
> >
<span class="ms-3">Logout</span> <span class="ms-3">Logout</span>
</a> </button>
</form>
</li> </li>
</ul> </ul>
</div> </div>

8
src/hooks.server.ts
View File

@@ -1,8 +0,0 @@
import { authStore } from '$stores/authStore';
import type { Handle } from '@sveltejs/kit';
export const init = () => {
// const token = sessionStorage.getItem('token') ?? undefined;
// console.log(token);
// authStore.set({ token });
};

12
src/routes/+page.server.ts
View File

@@ -1,8 +1,16 @@
import { checkAuth } from '$api/authService'; import { checkAuth } from '$api/authService';
import { redirect } from '@sveltejs/kit'; import { redirect } from '@sveltejs/kit';
import type { Actions } from './$types';
export const load = async () => { export const load = async (event) => {
const isAuth = await checkAuth(); const isAuth = await checkAuth(event);
if (isAuth) redirect(308, '/dashboard'); if (isAuth) redirect(308, '/dashboard');
redirect(308, '/login'); redirect(308, '/login');
}; };
export const actions = {
logout: async (event) => {
event.cookies.delete('token', { path: '/' });
redirect(303, '/login');
}
} satisfies Actions;

24
src/routes/dashboard/+page.server.ts
View File

@@ -2,24 +2,24 @@ import { checkAuth } from '$api/authService';
import { getServers, restartService, startService, stopService } from '$api/serverService'; import { getServers, restartService, startService, stopService } from '$api/serverService';
import { redirect, type Actions } from '@sveltejs/kit'; import { redirect, type Actions } from '@sveltejs/kit';
export const load = async () => { export const load = async (event) => {
const isAuth = await checkAuth(); const isAuth = await checkAuth(event);
if (!isAuth) return redirect(308, '/login'); if (!isAuth) return redirect(308, '/login');
const servers = await getServers(); const servers = await getServers(event);
return { servers }; return { servers };
}; };
export const actions = { export const actions = {
start: async ({ request }) => { start: async (event) => {
const id = (await request.formData()).get('id') as string; const id = (await event.request.formData()).get('id') as string;
await startService(+id); await startService(event, +id);
}, },
restart: async ({ request }) => { restart: async (event) => {
const id = (await request.formData()).get('id') as string; const id = (await event.request.formData()).get('id') as string;
await restartService(+id); await restartService(event, +id);
}, },
stop: async ({ request }) => { stop: async (event) => {
const id = (await request.formData()).get('id') as string; const id = (await event.request.formData()).get('id') as string;
await stopService(+id); await stopService(event, +id);
} }
} satisfies Actions; } satisfies Actions;

18
src/routes/dashboard/server/[id]/+page.server.ts
View File

@@ -1,24 +1,24 @@
import { updateConfig, getConfigFiles } from '$api/serverService'; import { updateConfig, getConfigFiles } from '$api/serverService';
import type { Actions } from './$types'; import type { Actions, RequestEvent } from './$types';
import { checkAuth } from '$api/authService'; import { checkAuth } from '$api/authService';
import { getTracks } from '$api/lookupService'; import { getTracks } from '$api/lookupService';
import { redirect } from '@sveltejs/kit'; import { redirect } from '@sveltejs/kit';
export const load = async ({ params }) => { export const load = async (event) => {
const isAuth = await checkAuth(); const isAuth = await checkAuth(event);
if (!isAuth) return redirect(308, '/login'); if (!isAuth) return redirect(308, '/login');
const config = await getConfigFiles(params.id); const config = await getConfigFiles(event, event.params.id);
const tracks = await getTracks(); const tracks = await getTracks(event);
return { return {
id: params.id, id: event.params.id,
config, config,
tracks tracks
}; };
}; };
export const actions = { export const actions = {
event: async ({ request }) => { event: async (event: RequestEvent) => {
const formData = await request.formData(); const formData = await event.request.formData();
const id = formData.get('id') as string; const id = formData.get('id') as string;
const object: any = {}; const object: any = {};
formData.forEach((value, key) => { formData.forEach((value, key) => {
@@ -32,7 +32,7 @@ export const actions = {
object[key] = value != '' && !Number.isNaN(+value) ? +value : value; object[key] = value != '' && !Number.isNaN(+value) ? +value : value;
} }
}); });
await updateConfig(id, 'event.json', object, true, true); await updateConfig(event, id, 'event.json', object, true, true);
redirect(303, '/dashboard'); redirect(303, '/dashboard');
} }
} satisfies Actions; } satisfies Actions;

6
src/routes/login/+page.server.ts
View File

@@ -4,15 +4,15 @@ import type { Actions } from './$types';
import { redirect } from '@sveltejs/kit'; import { redirect } from '@sveltejs/kit';
export const actions = { export const actions = {
login: async ({ request }) => { login: async (event) => {
const formData = await request.formData(); const formData = await event.request.formData();
const username = formData.get('username') as string; const username = formData.get('username') as string;
const password = formData.get('password') as string; const password = formData.get('password') as string;
if (!username || !password) { if (!username || !password) {
authStore.set({ error: 'Invalid username or password' }); authStore.set({ error: 'Invalid username or password' });
return; return;
} }
const isAuth = await login(username, password); const isAuth = await login(event, username, password);
if (isAuth) redirect(303, '/dashboard'); if (isAuth) redirect(303, '/dashboard');
} }
} satisfies Actions; } satisfies Actions;