change case loading in server side mode, made case list functional

This commit is contained in:
2025-06-19 16:01:07 +02:00
parent a2ac88af50
commit c5dd8b9424
8 changed files with 110 additions and 168 deletions

View File

@@ -9,3 +9,4 @@ export const client = new Client(config.minio);
export const BUCKET = 'tatort'; export const BUCKET = 'tatort';
export const TOKENFILENAME = '__perm__'; export const TOKENFILENAME = '__perm__';
export const CONFIGFILENAME = 'config.json';

View File

@@ -1,6 +1,5 @@
import { BUCKET, client } from '$lib/minio'; import { BUCKET, client } from '$lib/minio';
export const checkIfExactDirectoryExists = (dir: string): Promise<boolean> => { export const checkIfExactDirectoryExists = (dir: string): Promise<boolean> => {
return new Promise<boolean>((resolve, reject) => { return new Promise<boolean>((resolve, reject) => {
const prefix = dir.endsWith('/') ? dir : `${dir}/`; const prefix = dir.endsWith('/') ? dir : `${dir}/`;
@@ -18,4 +17,11 @@ export const checkIfExactDirectoryExists = (dir: string): Promise<boolean> => {
stream.on('end', () => resolve(false)); stream.on('end', () => resolve(false));
}); });
} };
export const getContentofTextObject = async (bucket: string, objPath: string) => {
const res = await client.getObject(bucket, objPath);
const text = await new Response(res).text();
return text;
};

View File

@@ -1,73 +1,49 @@
import { fail } from '@sveltejs/kit'; import { fail } from '@sveltejs/kit';
import { BUCKET, client, TOKENFILENAME } from '$lib/minio'; import { BUCKET, client, CONFIGFILENAME, TOKENFILENAME } from '$lib/minio';
import { checkIfExactDirectoryExists } from './s3ClientService'; import { checkIfExactDirectoryExists, getContentofTextObject } from './s3ClientService';
export const getVorgangByCaseId = async (caseId: string, token: string) => { /**
const isValidCase = await checkIfVorgangExists(caseId); * Get Vorgang and list of tatorte
const isValidToken = await hasValidToken(caseId, token); * @param caseId
* @returns
*/
export const getVorgangByCaseId = async (caseId: string) => {
const prefix = `${caseId}/`;
// const prefix = params.vorgang ? `${params.vorgang}/` : ''; const stream = client.listObjectsV2(BUCKET, prefix, false, '');
// const stream = client.listObjectsV2(BUCKET, caseId, false, ''); const list = [];
// let files: any[] = []; for await (const chunk of stream) {
const splittedNameParts = chunk.name.split('/');
const prefix = splittedNameParts[0];
const name = splittedNameParts[1];
if (name === CONFIGFILENAME || name === TOKENFILENAME) continue;
list.push({ ...chunk, name: name, prefix: prefix, show_button: true });
}
return list;
};
return new Promise((resolve, reject) => { export const getListOfVorgänge = async () => {
const stream = client.listObjectsV2(BUCKET, caseId, false, ''); const stream = client.listObjectsV2(BUCKET, '', false, '');
const result = [];
stream.on('data', (item) => { const list = [];
result.push(item); for await (const chunk of stream) {
}); const objPath = `${chunk.prefix}${TOKENFILENAME}`;
stream.on('end', () => { const token = await getContentofTextObject(BUCKET, objPath);
resolve(result);
});
stream.on('error', (err) => { const cleanedChunkPrefix = chunk.prefix.replace(/\/$/, '');
reject(err); list.push({ name: cleanedChunkPrefix, token: token });
}); }
}); return list;
// const readableStream = new ReadableStream({
// start(controller) {
// stream.on('data', (data) => {
// if (caseId === '') {
// if (data.prefix)
// controller.enqueue(`${JSON.stringify({ ...data, name: data.prefix.slice(0, -1) })}\n`);
// return;
// }
// const name = data?.name?.slice(caseId.length);
// if (name === 'config.json') return;
// // zugangscode datei
// if (name === '__perm__') return;
// controller.enqueue(`${JSON.stringify({ ...data, name, caseId })}\n`);
// });
// stream.on('end', () => {
// controller.close();
// });
// },
// cancel() {
// stream.destroy();
// }
// });
// return files;
// return new Response(result, {
// headers: {
// 'content-type': 'text/event-stream'
// }
// });
}; };
/** /**
* Checks if Vorgang exists and token is valid. * Checks if Vorgang exists
* @param request * @param request
* @returns redirect to /list/caseId or error * @returns fail or true
*/ */
const checkIfVorgangExists = async (caseId) => { export const checkIfVorgangExists = async (caseId: string) => {
if (!caseId) { if (!caseId) {
return fail(400, { return fail(400, {
success: false, success: false,
@@ -85,31 +61,23 @@ const checkIfVorgangExists = async (caseId) => {
} }
return true; return true;
// const isTokenValid = await hasValidToken(caseId, caseToken);
// if (!isTokenValid) {
// return fail(400, {
// success: false,
// caseId,
// error: { message: 'Der Token ist ungültig.' }
// });
// }
// redirect(303, `/list/${caseId}?token=${caseToken}`);
}; };
const hasValidToken = async (caseId: string, caseToken: string) => { export const hasValidToken = async (caseId: string, caseToken: string) => {
const objPath = `${caseId}/${TOKENFILENAME}`; const objPath = `${caseId}/${TOKENFILENAME}`;
try { try {
if (!caseToken) return false; if (!caseToken) {
return fail(400, {
success: false,
caseId,
error: { message: 'Bitte Zugangscode eingeben!' }
});
}
const res = await client.getObject(BUCKET, objPath); const token = await getContentofTextObject(BUCKET, objPath);
const token = await new Response(res).text(); if (!token || token !== caseToken) {
if (!token) {
return fail(400, { return fail(400, {
success: false, success: false,
caseId, caseId,
@@ -117,7 +85,7 @@ const hasValidToken = async (caseId: string, caseToken: string) => {
}); });
} }
return token === caseToken ? true : false; return true;
} catch (error) { } catch (error) {
if (error.name == 'S3Error') { if (error.name == 'S3Error') {
console.log(error); console.log(error);

View File

@@ -0,0 +1,10 @@
import { getListOfVorgänge } from '$lib/server/vorgangService';
import type { PageServerLoad } from '../../(token-based)/view/$types';
export const load: PageServerLoad = async () => {
const caseList = await getListOfVorgänge();
return {
caseList
};
};

View File

@@ -1,34 +1,11 @@
<script lang="ts"> <script lang="ts">
import { onMount } from 'svelte';
import Trash from '$lib/icons/Trash.svelte'; import Trash from '$lib/icons/Trash.svelte';
import Folder from '$lib/icons/Folder.svelte'; import Folder from '$lib/icons/Folder.svelte';
import type { PageData } from '../$types';
/** export let data: PageData;
* @type any[]
*/
let list: any[] = [];
//$: list;
onMount(async () => { const caseList = data.caseList;
const response = await fetch('/api/list');
const stream = await response.body;
if (!stream) return;
const reader = stream.getReader();
while (true) {
const { done, value } = await reader.read();
if (done) return;
const objs = new TextDecoder()
.decode(value)
.split('\n')
.filter((i) => i.length > 0)
.map((i) => JSON.parse(i));
list = list.concat(objs);
}
});
async function delete_item(ev: Event) { async function delete_item(ev: Event) {
let delete_item = window.confirm('Bist du sicher?'); let delete_item = window.confirm('Bist du sicher?');
@@ -67,9 +44,9 @@
</div> </div>
<div class="mx-auto flex justify-center max-w-7xl h-full"> <div class="mx-auto flex justify-center max-w-7xl h-full">
<ul role="list" class="divide-y divide-gray-100"> <ul role="list" class="divide-y divide-gray-100">
{#each list as item} {#each caseList as item}
<li> <li>
<a href="/list/{item.name}" class="flex justify-between gap-x-6 py-5"> <a href="/list/{item.name}?token={item.token}" class="flex justify-between gap-x-6 py-5">
<div class="flex gap-x-4"> <div class="flex gap-x-4">
<!-- Ordner --> <!-- Ordner -->
<Folder /> <Folder />

View File

@@ -1,18 +1,28 @@
import { checkIfVorgangExists } from '$lib/server/vorgangService';
import { hasValidToken } from '$lib/server/vorgangService'; import { hasValidToken } from '$lib/server/vorgangService';
import { redirect } from '@sveltejs/kit'; import { getVorgangByCaseId } from '$lib/server/vorgangService';
import type { PageServerLoad } from '../../view/$types'; import type { PageServerLoad } from '../../view/$types';
export const load: PageServerLoad = ({params, url}) => { export const load: PageServerLoad = async ({ params, url }) => {
const caseID = params.vorgang; const caseId = params.vorgang;
const token = url.searchParams.get('token'); const caseToken = url.searchParams.get('token');
let isTokenValid const isVorgangValid = await checkIfVorgangExists(caseId);
if (isVorgangValid !== true) {
if (typeof token === 'string' && caseID) { return {
isTokenValid = hasValidToken(caseID, token); error: 'Vorgang wurde nicht gefunden.'
};
}
const isTokenValid = await hasValidToken(caseId, caseToken);
if (isTokenValid !== true) {
return {
error: 'Zugriffscode ist ungültig.'
};
} }
if(!isTokenValid) { const crimesList = await getVorgangByCaseId(caseId);
redirect(303, '/anmeldung');
} return {
crimesList
};
}; };

View File

@@ -1,5 +1,4 @@
<script lang="ts"> <script lang="ts">
import { onMount } from 'svelte';
import shortenFileSize from '$lib/helper/shortenFileSize'; import shortenFileSize from '$lib/helper/shortenFileSize';
import { page } from '$app/stores'; import { page } from '$app/stores';
@@ -27,8 +26,7 @@
// add other properties as needed // add other properties as needed
} }
let list: ListItem[] = []; const crimesList: ListItem[] = data.crimesList;
$: list;
let open = false; let open = false;
$: open; $: open;
@@ -40,38 +38,12 @@
let rename_input; let rename_input;
$: rename_input; $: rename_input;
onMount(async () => {
const response = await fetch('/api/list/' + $page.params.vorgang);
const stream = response.body;
if (!stream) return;
const reader = stream.getReader();
while (true) {
const { done, value } = await reader.read();
if (done) return;
const objs = new TextDecoder()
.decode(value)
.split('\n')
.filter((i) => i.length > 0)
.map((i) => JSON.parse(i));
list = list.concat(objs);
list = list.map((item) => {
item.show_button = true;
return item;
});
}
});
function uploadSuccessful() { function uploadSuccessful() {
open = false; open = false;
} }
function defocus_element(i: number) { function defocus_element(i: number) {
let item = list[i]; let item = crimesList[i];
let text_field_id = `label__${item.name}`; let text_field_id = `label__${item.name}`;
let text_field = document.getElementById(text_field_id); let text_field = document.getElementById(text_field_id);
@@ -81,12 +53,12 @@
} }
// reshow button // reshow button
list[i].show_button = true; crimesList[i].show_button = true;
return; return;
} }
async function handle_input(ev: KeyboardEvent, i: number) { async function handle_input(ev: KeyboardEvent, i: number) {
let item = list[i]; let item = crimesList[i];
if (ev.key == 'Escape') { if (ev.key == 'Escape') {
let text_field_id = `label__${item.name}`; let text_field_id = `label__${item.name}`;
@@ -163,7 +135,7 @@
</div> </div>
<div class="mx-auto flex justify-center max-w-7xl h-full"> <div class="mx-auto flex justify-center max-w-7xl h-full">
<ul class="divide-y divide-gray-100"> <ul class="divide-y divide-gray-100">
{#each list as item, i} {#each crimesList as item, i}
<li> <li>
<a <a
href="/view/{$page.params.vorgang}/{item.name}" href="/view/{$page.params.vorgang}/{item.name}"
@@ -191,20 +163,6 @@
}}>{item.name}</span }}>{item.name}</span
> >
<!--<input
class="text-sm font-semibold leading-6 text-gray-900 inline-block min-w-1"
type="text"
name=""
on:keydown|stopPropagation={// event needed to identify ID
// TO-DO: check if event is needed or if index is sufficient
async (ev) => {
handle_input(ev, i);
}}
bind:value={item.name}
id="label__{item.name}"
/>-->
<!-- disabled={item.show_button} -->
<!-- https://iconduck.com/icons/192863/edit-rename -->
{#if item.show_button} {#if item.show_button}
<button <button
@@ -306,6 +264,12 @@
</Modal> </Modal>
</div> </div>
{#if data.error}
<div class="max-w-xl mx-auto bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative mt-4">
<strong class="font-bold">Fehler: </strong>
<span class="block sm:inline">{data.error}</span>
</div>
{/if}
<style> <style>
ul { ul {
min-width: 24rem; min-width: 24rem;

View File

@@ -1,5 +1,6 @@
import { loginUser, logoutUser } from '$lib/server/authService'; import { loginUser, logoutUser } from '$lib/server/authService';
import { getVorgangByCaseId } from '$lib/server/vorgangService.js'; import { checkIfVorgangExists, hasValidToken } from '$lib/server/vorgangService.js';
import { redirect } from '@sveltejs/kit';
export const actions = { export const actions = {
login: ({ request, cookies }) => loginUser({ request, cookies }), login: ({ request, cookies }) => loginUser({ request, cookies }),
@@ -8,8 +9,13 @@ export const actions = {
const data = await request.formData(); const data = await request.formData();
const caseId = data.get('case-id'); const caseId = data.get('case-id');
const caseToken = data.get('case-token'); const caseToken = data.get('case-token');
const result = await getVorgangByCaseId(caseId, caseToken);
console.log(result); const isVorgangValid = await checkIfVorgangExists(caseId);
if (isVorgangValid !== true) return isVorgangValid;
const isTokenValid = await hasValidToken(caseId, caseToken);
if ( isTokenValid !== true) return isTokenValid;
throw redirect(303, `/list/${caseId}?token=${caseToken}`);
} }
} as const; } as const;