diff --git a/app/src/routes/system/filesystem/+page.svelte b/app/src/routes/system/filesystem/+page.svelte
index 15089b0..e21bde9 100644
--- a/app/src/routes/system/filesystem/+page.svelte
+++ b/app/src/routes/system/filesystem/+page.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
-	import FileSystem from './FileSystem.svelte';
+  import FileSystem from './FileSystem.svelte'
 </script>
 
 <div class="mx-0 my-1 flex flex-col space-y-4 sm:mx-8 sm:my-8">
-	<FileSystem />
+  <FileSystem />
 </div>
diff --git a/app/src/routes/system/filesystem/+page.ts b/app/src/routes/system/filesystem/+page.ts
index d6444c1..f976c4e 100644
--- a/app/src/routes/system/filesystem/+page.ts
+++ b/app/src/routes/system/filesystem/+page.ts
@@ -1,5 +1,5 @@
-import type { PageLoad } from './$types';
+import type { PageLoad } from './$types'
 
 export const load = (async () => {
-	return { title: 'File System' };
-}) satisfies PageLoad;
+  return { title: 'File System' }
+}) satisfies PageLoad
diff --git a/app/src/routes/system/filesystem/File.svelte b/app/src/routes/system/filesystem/File.svelte
index f6ec26c..9b5965e 100644
--- a/app/src/routes/system/filesystem/File.svelte
+++ b/app/src/routes/system/filesystem/File.svelte
@@ -1,19 +1,11 @@
 <script>
-	import { FileIcon } from '$lib/components/icons';
-    import { createEventDispatcher } from 'svelte';
-    
-    /** @type {{name: any}} */
-    let { name } = $props();
-    
-    const dispatch = createEventDispatcher();
+  import { FileIcon } from '$lib/components/icons'
 
-    const updateSelected = async () => {
-        dispatch('selected', { name });
-    }
+  let { name, selected } = $props()
 </script>
 
 <!-- svelte-ignore a11y_interactive_supports_focus -->
 <!-- svelte-ignore a11y_click_events_have_key_events -->
-<span role="button" class="flex pl-4 gap-2 items-center" onclick={updateSelected}>
-    <FileIcon/>{name}
+<span role="button" class="flex pl-4 gap-2 items-center" onclick={selected}>
+  <FileIcon />{name}
 </span>