From ddfbbb80f3b7ecf80370f62ff2741f3cfaca7564 Mon Sep 17 00:00:00 2001
From: a2nr <a2nr@mekatronika.ac.id>
Date: Sat, 1 Aug 2026 22:39:20 +0000
Subject: [PATCH] =?UTF-8?q?feat(playground):=20FileTree=20filter=20per=20b?=
 =?UTF-8?q?ahasa=20=E2=80=94=20C=20dan=20Python=20dipisah?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- FileTree menerima prop language ('c' | 'python', default 'c')
- hanya merender file dengan ekstensi yang cocok (.c atau .py)
- tombol + buat file dengan ekstensi bahasa aktif
- header menampilkan nama bahasa (C/Python), bukan generik 'File'
---
 .../src/routes/playground/FileTree.svelte     | 21 ++++++++++++++-----
 1 file changed, 16 insertions(+), 5 deletions(-)

diff --git a/frontend/src/routes/playground/FileTree.svelte b/frontend/src/routes/playground/FileTree.svelte
index cc0138c..43bc918 100644
--- a/frontend/src/routes/playground/FileTree.svelte
+++ b/frontend/src/routes/playground/FileTree.svelte
@@ -2,10 +2,17 @@
 	import { playgroundStore } from '$stores/playground';
 
 	interface Props {
+		language?: 'c' | 'python';
 		onselect?: (id: string) => void;
 	}
 
-	let { onselect }: Props = $props();
+	let { language = 'c', onselect }: Props = $props();
+
+	const fileExt = $derived(language === 'python' ? '.py' : '.c');
+	const langLabel = $derived(language === 'python' ? 'Python' : 'C');
+	const filteredFiles = $derived(
+		$playgroundStore.files.filter((f) => f.name.toLowerCase().endsWith(fileExt))
+	);
 
 	let renamingId = $state<string | null>(null);
 	let renameValue = $state('');
@@ -49,17 +56,21 @@
 
 <div class="file-tree">
 	<div class="ft-header">
-		<span class="ft-title">File</span>
-		<button class="ft-new-btn" onclick={() => playgroundStore.addFile('main.c')} title="Buat file baru">
+		<span class="ft-title">{langLabel} Files</span>
+		<button
+			class="ft-new-btn"
+			onclick={() => playgroundStore.addFile(language === 'python' ? 'main.py' : 'main.c')}
+			title={`Buat file ${fileExt} baru`}
+		>
 			+
 		</button>
 	</div>
 
-	{#if $playgroundStore.files.length === 0}
+	{#if filteredFiles.length === 0}
 		<div class="ft-empty">Belum ada file. Klik + untuk membuat.</div>
 	{:else}
 		<div class="ft-list">
-			{#each $playgroundStore.files as file (file.id)}
+			{#each filteredFiles as file (file.id)}
 				<div
 					class="ft-item"
 					class:active={file.id === $playgroundStore.activeFileId}