Merge pull request 'b999_chrome_file_upload' (#47) from b999_chrome_file_upload into development

Reviewed-on: #47

Dockerfile.prod

@@ -1,7 +1,5 @@
 # --- Build stage ---
 FROM node:22 AS build
-ENV NODE_ENV=production
-ENV ORIGIN=https://tatort.innovation-hub-niedersachsen.de
 WORKDIR /app
 COPY package*.json ./
 RUN npm ci
@@ -11,7 +9,13 @@ RUN npm run build
 
 # --- Production stage ---
 FROM node:22-alpine3.20
-COPY --from=build /app .
+WORKDIR /app
+ENV NODE_ENV=production
+ENV ORIGIN=https://tatort.innovation-hub-niedersachsen.de
+COPY --from=build /app/build ./build
+COPY --from=build /app/package*.json ./
+COPY --from=build /app/config.json ./config.json
+RUN npm ci --omit=dev
 ENV HOST=0.0.0.0
 EXPOSE 3000
-CMD ["sh", "-c", "ORIGIN=https://tatort.innovation-hub-niedersachsen.de node build/index.js"]
+CMD ["node", "build/index.js"]

config.json

@@ -1,10 +1,10 @@
 {
 	"minio": {
-		"endPoint": "sws3.innovation-hub-niedersachsen.de",
+		"endPoint": "api-s3.innovation-hub-niedersachsen.de",
 		"port": 443,
 		"useSSL": true,
-		"accessKey": "wjpKrmaqXra99rX3D61H",
+		"accessKey": "AbCdEfGhIjKlMnOpQrSt",
-		"secretKey": "fTPi0u0FR6Lv9Y9IKydWv6WM0EA5XrsK008HCt9u"
+		"secretKey": "UvWxYz1234567890AbCdEfGhIjKlMnOpQrStUvWx"
 	},
 	"jwt": {
 		"secret": "@S2!q@@wXz$dCQ8JoVsHLpzaJ6JCfB",
@@ -14,4 +14,4 @@
 		"admin": { "password": "A-InnoHUB_2025!", "admin": true },
 		"user": { "password": "U-InnoHUB_2025!", "admin": false }
 	}
-}
+}

config_dev.json

@@ -1,10 +1,10 @@
 {
 	"minio": {
-		"endPoint": "sws3.innovation-hub-niedersachsen.de",
+		"endPoint": "api-s3.innovation-hub-niedersachsen.de",
 		"port": 443,
 		"useSSL": true,
-		"accessKey": "wjpKrmaqXra99rX3D61H",
+		"accessKey": "AbCdEfGhIjKlMnOpQrSt",
-		"secretKey": "fTPi0u0FR6Lv9Y9IKydWv6WM0EA5XrsK008HCt9u"
+		"secretKey": "UvWxYz1234567890AbCdEfGhIjKlMnOpQrStUvWx"
 	},
 	"jwt": {
 		"secret": "@S2!q@@wXz$dCQ8JoVsHLpzaJ6JCfB",
@@ -14,4 +14,4 @@
 		"admin": { "password": "A-InnoHUB_2025!", "admin": true },
 		"user": { "password": "U-InnoHUB_2025!", "admin": false }
 	}
-}
+}

config_prod.json

@@ -1,10 +1,10 @@
 {
 	"minio": {
-		"endPoint": "sws3.innovation-hub-niedersachsen.de",
+		"endPoint": "api-s3.innovation-hub-niedersachsen.de",
 		"port": 443,
 		"useSSL": true,
-		"accessKey": "wjpKrmaqXra99rX3D61H",
+		"accessKey": "GxKhfnfkNvlDU7qzsz0D",
-		"secretKey": "fTPi0u0FR6Lv9Y9IKydWv6WM0EA5XrsK008HCt9u"
+		"secretKey": "cqSM5rIRr4MPtqzu2sNKgmB9k2OghPbyxwAWogeM"
 	},
 	"jwt": {
 		"secret": "@S2!q@@wXz$dCQ8JoVsHLpzaJ6JCfB",
@@ -14,4 +14,4 @@
 		"admin": { "password": "A-InnoHUB_2025!", "admin": true },
 		"user": { "password": "U-InnoHUB_2025!", "admin": false }
 	}
-}
+}

src/lib/components/NameItemEditor.svelte

@@ -15,7 +15,7 @@
 	export let currentName: string;
 	export let vorgangToken: string | null;
 	export let onSave: (n: string, o: string, t?: string) => unknown = () => {};
-	export let onDelete: (n: string) => unknown | null = () => {};
+	export let onDelete: ((n: string) => unknown) | null = () => {};
 
 	let localName = currentName;
 	let isEditing = false;

src/lib/config.ts

@@ -1,3 +1,3 @@
 import { readFileSync } from 'fs';
 
-export default JSON.parse(readFileSync('./config_prod.json').toString());
+export default JSON.parse(readFileSync('./config.json').toString());

src/lib/server/vorgangService.ts

@@ -238,11 +238,11 @@ export const vorgangPINValidation = function (vorgangToken: string, vorgangPIN:
 /**
  * Change VorgangName or VorgangPIN
  * @param vorgangToken
- * @param newName
+ * @param newValue
  * @returns {int} number of affected lines
  */
 export const updateVorgangAttrByToken = function (vorgangToken: string,
-											newName: string,
+											newValue: string,
 											column: string) {
 	const renameSQLStmt = `UPDATE cases set ${column} = ? WHERE token = ?`;
 	const statement = db.prepare(renameSQLStmt);
@@ -250,7 +250,7 @@ export const updateVorgangAttrByToken = function (vorgangToken: string,
 	let info;
 	
 	try {
-		info = statement.run(newName, vorgangToken);
+		info = statement.run(newValue, vorgangToken);
 	} catch (err) {
 		console.log(`error: ${err}`)
 		return 0;

src/routes/(angemeldet)/+layout.server.ts

@@ -1,8 +1,6 @@
 import { type ServerLoadEvent } from '@sveltejs/kit';
 import type { PageServerLoad } from '../anmeldung/$types';
 
-import { ROUTE_NAMES } from '..';
-
 export const load: PageServerLoad = (event: ServerLoadEvent) => {
 	if (event.locals.user) {
 		return {

src/routes/(angemeldet)/upload/+page.server.ts

@@ -1,10 +1,8 @@
 import { Readable } from 'stream';
 import { BUCKET, client } from '$lib/minio';
 import { fail, error } from '@sveltejs/kit';
-import { v4 as uuidv4 } from 'uuid';
 
-import { db } from '$lib/server/dbService';
+import { getVorgangByName } from '$lib/server/vorgangService';
-import { getVorgangByName, vorgangNameExists } from '$lib/server/vorgangService';
 
 const isRequiredFieldValid = (value: unknown) => {
 	if (value == null) return false;

src/routes/(token-based)/list/[vorgang]/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { fade } from 'svelte/transition';
 	import shortenFileSize from '$lib/helper/shortenFileSize';
 	import timeElapsed from '$lib/helper/timeElapsed';
 	import { deserialize } from '$app/forms';
@@ -41,10 +42,14 @@
 	let formErrors: Record<string, any> | null = $state(null);
 	let etag: string | null = $state(null);
 	let files: FileList | null = $state(null);
+	let fileInput = $state(null);
 
 	// Model Variablen für Upload
 	let openUL = $state(false);
 	let inProgressUL = $state(form === null);
+	
+	// Variablen für Copy-Funktion
+    let copied = $state(false);
 
 	async function buttonClick(event: MouseEvent) {
 		if (!(await validateForm())) {
@@ -98,6 +103,7 @@
 		openUL = false;
 		name = '';
 		files = null;
+		fileInput.value = "";
 		await invalidateAll();
 		crimesList = data.crimesList;
 	}
@@ -128,17 +134,17 @@
 
 		// big endian!
 		let file = files[0];
-		let file_header = file.slice(0, 4);
+		const fileHeader = file.slice(0, 4);
-		console.log(file_header);
+		const buffer = await fileHeader.arrayBuffer();
-		let header_bytes = await file_header.bytes();
+		console.log(fileHeader);
-		let file_header_hex = '0x' + header_bytes.toHex().toString();
+		let headerBytes = new Uint8Array(buffer);
+		let fileHeaderHex = '0x' + headerBytes.toHex().toString();
 
-		if (GLD_MAGIC == swap_endian(file_header_hex)) {
+		if (GLD_MAGIC == swap_endian(fileHeaderHex)) {
 			return true;
 		} else {
 			return false;
 		}
-		return true;
 	}
 
 	async function getUrl() {
@@ -248,9 +254,8 @@
 		}
 	}
 
-	function constructMailToLink() {
+	async function copyAndOpenMail() {
 		const subject = 'Link zum Tatvorgang';
-
 		const link = data.url.origin + data.url.pathname;
 		const body = `Hallo,
 
@@ -262,17 +267,56 @@ Der Zugangs-PIN wird zur Sicherheit über einen zweiten Kommunikationskanal übe
 Mit freundlichen Grüßen,
 `;
 
-		const mailtoLink = `mailto:?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(body)}`;
+    try {
+        await navigator.clipboard.writeText(body);
+        
+        copied = true;
 
-		return mailtoLink;
+        // Kurz warten, dann Mail öffnen
-	}
+        setTimeout(() => {
+            const mailtoLink = `mailto:?subject=${encodeURIComponent(subject)}`;
+            window.location.href = mailtoLink;
+        }, 1000);
+        
+        setTimeout(() => copied = false, 2000);
+    } catch (err) {
+        console.error('Clipboard-Fehler:', err);
+        error = 'Konnte Text nicht kopieren. Bitte manuell markieren und kopieren.';
+        }
+    }
 
 	function closeModal() {
 		open = false;
 		isError = false;
 	}
+
+	// drag and drop functionality
+		let isDragging = $state(false);
+
+		async function handleDrop(event) {
+			event.preventDefault();
+			isDragging = false;
+
+			if (event.dataTransfer?.files?.length) {
+				files = event.dataTransfer.files;
+			}
+			if (!(await check_valid_glb_file())) {
+				formErrors = { file: 'Keine gültige .GLD-Datei' }
+				// reset form fields etc.
+				files = null;
+				fileInput.value = '';
+			} else {
+				formErrors = { ...formErrors, file: ''}
+			};
+		}
+
 </script>
 
+<svelte:window
+	on:dragover|preventDefault
+	on:drop|preventDefault
+/>
+
 {#if data.vorgang && crimesList}
 	<div class="-z-10 bg-white">
 		<div class="flex flex-col items-center justify-center w-full">
@@ -288,9 +332,10 @@ Mit freundlichen Grüßen,
 				onDelete={null}
 				/>
 				</div>
-				<a class="pt-2 pb-6" href={constructMailToLink()}
+                <Button variant="secondary" on:click={copyAndOpenMail} disabled={isEmptyList}>Link kopieren und Mail verfassen</Button>
-					><Button disabled={isEmptyList}>Share Link</Button></a
+                {#if copied}
-				>
+                <p transition:fade>✔ Kopiert! Per Ctrl+V einfügen.</p>
+                {/if}
 			{/if}
 		</div>
 		<div class="mx-auto flex justify-center max-w-7xl h-full">
@@ -398,7 +443,13 @@ Mit freundlichen Grüßen,
 							</span>
 						</label>
 						<div
-							class="mt-2 flex justify-center rounded-lg border border-dashed border-gray-900/25 px-6 py-10"
+							class="mt-2 flex justify-center rounded-lg border border-dashed px-6 py-10
+								{isDragging
+								? 'border-blue-500 bg-blue-50'
+								: 'border-gray-900/25'}"
+							on:dragover|preventDefault={() => (isDragging = true)}
+							on:dragleave={() => (isDragging = false)}
+							on:drop={handleDrop}
 						>
 							<div class="text-center">
 								<FileRect />
@@ -408,7 +459,7 @@ Mit freundlichen Grüßen,
 										class="relative cursor-pointer rounded-md bg-white font-semibold text-indigo-600 focus-within:outline-none focus-within:ring-2 focus-within:ring-indigo-600 focus-within:ring-offset-2 hover:text-indigo-500"
 									>
 										<span>Wähle eine Datei aus</span>
-										<input id="file" bind:files name="file" type="file" class="sr-only" />
+										<input id="file" bind:this={fileInput} bind:files name="file" type="file" class="sr-only" />
 									</label>
 									<p class="pl-1">oder ziehe sie ins Feld</p>
 								</div>

src/routes/api/users/[user]/+server.ts

@@ -1,4 +1,3 @@
-import { json } from '@sveltejs/kit';
 import { deleteUser } from '$lib/server/userService';
 
 export async function DELETE({ params }) {

tests/components/NameItemEditor.test.ts

@@ -87,7 +87,7 @@ describe('NameItemEditor - Funktionalität', () => {
 		expect(onSave).not.toHaveBeenCalled();
 	});
 
-	it('ruft onSave korrekt auf bei gültigem Namen: Tatort/Crime (ohne Vorgang)', async () => {
+	it('ruft onSave korrekt auf bei gültigem Namen: Tatort/Crime', async () => {
 		render(NameItemEditor, { props: baseProps });
 		await fireEvent.click(screen.getByTestId('edit-button'));
 
@@ -117,7 +117,7 @@ describe('NameItemEditor - Funktionalität', () => {
 		expect(screen.getByTestId('edit-button')).toBeInTheDocument();
 	});
 
-	it('triggert Save bei Enter-Taste: Tatort/Crime (ohne Vorgang)', async () => {
+	it('triggert Save bei Enter-Taste: Tatort/Crime', async () => {
 		render(NameItemEditor, { props: baseProps });
 		await fireEvent.click(screen.getByTestId('edit-button'));
 

tests/views/TatortList.view.test.ts

@@ -100,4 +100,16 @@ describe('Seite: Vorgangsansicht', () => {
 			expect(linkElement).toHaveAttribute('href', expectedURL);
 		});
 	});
+
+	describe('PIN Anzeige & Button', () => {
+		it('Teste korrekte Anzeige von PIN Komponente', () => {
+			const testData = { ...baseData};
+			render(TatortListPage, { props: { data: testData } });
+			const vorgObj = baseData.vorgangList[0]
+
+			// PIN is being displayed within ´NameItemEditor´
+			let label = screen.queryByText(vorgObj.vorgangPIN);
+			expect(label).toBeInTheDocument();
+		});
+	});
 });

tests/views/VorgangList.view.test.ts

@@ -171,4 +171,14 @@ describe('Hinzufügen Buton', () => {
 		const result = await actions.default(event);
 		expect(result).toEqual({ token: testVorgangToken });
 	});
+});
+
+describe('Vorgang-Operationen', () => {
+	it('Teste korrekte Anzeige von Vorgang-Input Komponente', () => {
+		const testData = { ...baseData};
+		const { getAllByTestId } = render(VorgangListPage, { props: { data: testData } });
+
+		let buttons = getAllByTestId('edit-button')
+		expect(buttons.length).toBeGreaterThan(1);
+	});
 });