feat: Add file type validation and sanitize markdown input in adventure components

frontend/src/lib/components/AdventureModal.svelte

@@ -14,6 +14,57 @@
 
 	let categories: Category[] = [];
 
+	const allowedFileTypes = [
+		'.pdf',
+		'.doc',
+		'.docx',
+		'.xls',
+		'.xlsx',
+		'.ppt',
+		'.pptx',
+		'.txt',
+		'.png',
+		'.jpg',
+		'.jpeg',
+		'.gif',
+		'.webp',
+		'.mp4',
+		'.mov',
+		'.avi',
+		'.mkv',
+		'.mp3',
+		'.wav',
+		'.flac',
+		'.ogg',
+		'.m4a',
+		'.wma',
+		'.aac',
+		'.opus',
+		'.zip',
+		'.rar',
+		'.7z',
+		'.tar',
+		'.gz',
+		'.bz2',
+		'.xz',
+		'.zst',
+		'.lz4',
+		'.lzma',
+		'.lzo',
+		'.z',
+		'.tar.gz',
+		'.tar.bz2',
+		'.tar.xz',
+		'.tar.zst',
+		'.tar.lz4',
+		'.tar.lzma',
+		'.tar.lzo',
+		'.tar.z',
+		'gpx',
+		'md',
+		'pdf'
+	];
+
 	export let initialLatLng: { lat: number; lng: number } | null = null; // Used to pass the location from the map selection to the modal
 
 	let fileInput: HTMLInputElement;
@@ -783,7 +834,7 @@
 								type="file"
 								id="fileInput"
 								class="file-input file-input-bordered w-full max-w-xs"
-								accept="image/*,video/*,audio/*,application/pdf,.gpx"
+								accept={allowedFileTypes.join(',')}
 								on:change={handleFileChange}
 							/>
 

frontend/src/lib/components/MarkdownEditor.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { marked } from 'marked'; // Import the markdown parser
 	import { t } from 'svelte-i18n';
+	import DOMPurify from 'dompurify'; // Import DOMPurify to sanitize HTML
 
 	export let text: string | null | undefined = ''; // Markdown text
 	export let editor_height: string = 'h-64'; // Editor height
@@ -8,7 +9,7 @@
 
 	// Function to parse markdown to HTML
 	const renderMarkdown = (markdown: string) => {
-		return marked(markdown);
+		return marked(markdown) as string;
 	};
 
 	// References for scroll syncing
@@ -61,7 +62,7 @@
 			class="prose overflow-auto h-96 max-w-full w-full p-4 border border-base-300 rounded-lg bg-base-300"
 			bind:this={previewRef}
 		>
-			{@html renderMarkdown(text || '')}
+			{@html DOMPurify.sanitize(renderMarkdown(text || ''))}
 		</article>
 	{/if}
 </div>