Update app.py

app.py

@@ -16,38 +16,41 @@ import dotenv
 # Load environment variables
 dotenv.load_dotenv()
 
-# Metadata
-CURRENT_TIME = '2025-05-23 12:57:22'
-CURRENT_USER = 'ErRickow'
+# Metadata# Metadata
+CURRENT_TIME = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+CURRENT_USER = os.getenv("USER", "ErRickow")
 
 # Default API Keys (fallback if user doesn't provide their own)
-DEFAULT_XAI_KEY = os.getenv('XAI_API_KEY')
-DEFAULT_GEMINI_KEY = os.getenv('GEMINI_API_KEY')
+DEFAULT_XAI_KEY = os.getenv(
+    "XAI_API_KEY",
+    "xai-vfjhklL384Z4HKdItsZomqpFlXubTZJAFnISQUpV7dE8lRnWwYBVPSCxSTlu08wDbAcv720bx2dDiQ9x",
+)
+DEFAULT_GEMINI_KEY = os.getenv("GEMINI_API_KEY")
 
 # API settings
-OLLAMA_API = os.environ.get('OLLAMA_API', 'http://localhost:11434')
-XAI_BASE_URL = 'https://api.x.ai/v1'
+OLLAMA_API = os.environ.get("OLLAMA_API", "http://localhost:11434")
+XAI_BASE_URL = "https://api.x.ai/v1"
 
 # Model lists
 OLLAMA_MODELS = [
-	'llama2',
-	'codellama',
-	'mistral',
-	'neural-chat',
-	'starling-lm',
-	'dolphin-phi',
-	'phi',
-	'orca-mini',
+    "llama2",
+    "codellama",
+    "mistral",
+    "neural-chat",
+    "starling-lm",
+    "dolphin-phi",
+    "phi",
+    "orca-mini",
 ]
 
 XAI_MODELS = [
-	'grok-2-latest',
-	'grok-1',
+    "grok-2-latest",
+    "grok-1",
 ]
 
 GEMINI_MODELS = [
-	'gemini-1.5-mini',
-	'gemini-pro-vision',
+    "gemini-1.5-mini",
+    "gemini-pro-vision",
 ]
 
 # Help texts
@@ -112,296 +115,276 @@ Note:
 
 
 class AIProvider:
-	OLLAMA = 'ollama'
-	GEMINI = 'gemini'
-	XAI = 'xai'
+    OLLAMA = "ollama"
+    GEMINI = "gemini"
+    XAI = "xai"
 
 
 class RepoAnalyzer:
-	def __init__(self):
-		self.current_repo = None
-		self.repo_content = {}
-		self.chat_history = []
-
-	async def stream_xai_response(
-		self, prompt: str, api_key: str = None, model: str = 'grok-2-latest'
-	) -> AsyncGenerator[str, None]:
-		"""Stream response dari X.AI (Grok) API"""
-		try:
-			# Use default key if none provided
-			actual_key = api_key if api_key else DEFAULT_XAI_KEY
-
-			if not actual_key:
-				yield '⚠️ API Key X.AI diperlukan. Gunakan key Anda sendiri atau tunggu reset limit default key.'
-				return
-
-			client = AsyncOpenAI(api_key=actual_key, base_url=XAI_BASE_URL)
-
-			# Prepare messages with repository context if available
-			messages = [
-				{
-					'role': 'system',
-					'content': 'Anda adalah asisten AI yang membantu menganalisis repository code. Berikan respons dalam Bahasa Indonesia.',
-				}
-			]
-
-			if self.current_repo:
-				context = f'Repository: {self.current_repo}\n\n'
-				repo_files = '\n'.join(list(self.repo_content.keys()))
-				context += f'Files in repository:\n{repo_files}\n\n'
-				messages.append({'role': 'system', 'content': context})
-
-			messages.append({'role': 'user', 'content': prompt})
-
-			stream = await client.chat.completions.create(
-				model=model, messages=messages, stream=True
-			)
-
-			full_response = ''
-			async for chunk in stream:
-				if chunk.choices[0].delta.content:
-					content = chunk.choices[0].delta.content
-					full_response += content
-					yield content
-
-			self.chat_history.append({'role': 'user', 'content': prompt})
-			self.chat_history.append({'role': 'assistant', 'content': full_response})
-
-		except Exception as e:
-			error_msg = f'⚠️ Error dalam X.AI API: {str(e)}'
-			print(error_msg)
-			yield error_msg
-
-	async def stream_gemini_response(
-		self, prompt: str, api_key: str
-	) -> AsyncGenerator[str, None]:
-		"""Stream response dari Gemini API"""
-		try:
-			if not api_key:
-				yield '⚠️ API Key Gemini diperlukan. Klik icon bantuan (?) di samping input API Key untuk panduan mendapatkan key.'
-				return
-
-			genai.configure(api_key=api_key)
-			model = genai.GenerativeModel('gemini-pro')
-
-			# Tambahkan konteks repository jika ada
-			if self.current_repo:
-				context = f'Repository: {self.current_repo}\n\n'
-				repo_files = '\n'.join(list(self.repo_content.keys()))
-				context += f'Files in repository:\n{repo_files}\n\n'
-				prompt = context + prompt
-
-			response = model.generate_content(
-				prompt,
-				generation_config={'temperature': 0.7, 'top_p': 0.8, 'top_k': 40},
-				stream=True,
-			)
-
-			full_response = ''
-			async for chunk in response:
-				if chunk.text:
-					full_response += chunk.text
-					yield chunk.text
-
-			self.chat_history.append({'role': 'user', 'content': prompt})
-			self.chat_history.append({'role': 'assistant', 'content': full_response})
-
-		except Exception as e:
-			error_msg = f'⚠️ Error dalam Gemini API: {str(e)}\n\nPastikan API Key valid dan memiliki kuota yang cukup.'
-			print(error_msg)
-			yield error_msg
-
-	def clone_repository(
-		self, repo_url: str, github_token: str, branch: str = None
-	) -> tuple[bool, str]:
-		"""Clone repository GitHub dengan autentikasi"""
-		if not repo_url:
-			return False, '⚠️ URL repository diperlukan'
-
-		repo_name = repo_url.split('/')[-1].replace('.git', '')
-
-		if os.path.exists(repo_name):
-			subprocess.run(['rm', '-rf', repo_name], check=True)
-
-		try:
-			owner_repo = '/'.join(repo_url.split('/')[-2:])
-
-			# Cek apakah repository private
-			headers = {'Authorization': f'token {github_token}'} if github_token else {}
-			repo_check = requests.get(
-				f'https://api.github.com/repos/{owner_repo}', headers=headers
-			)
-
-			if repo_check.status_code == 404:
-				return False, '⚠️ Repository tidak ditemukan. Periksa URL repository.'
-			elif repo_check.status_code == 401:
-				return (
-					False,
-					'⚠️ Token GitHub tidak valid. Klik icon bantuan (?) untuk panduan mendapatkan token.',
-				)
-			elif repo_check.status_code == 403 and repo_check.json().get(
-				'private', False
-			):
-				return (
-					False,
-					"⚠️ Ini adalah repository private. Token GitHub dengan akses 'repo' diperlukan.",
-				)
-
-			auth_url = (
-				f'https://{github_token}@github.com/{owner_repo}'
-				if github_token
-				else f'https://github.com/{owner_repo}'
-			)
-
-			cmd = ['git', 'clone']
-			if branch:
-				cmd.extend(['--branch', branch])
-			cmd.append(auth_url)
-
-			process = subprocess.run(
-				cmd,
-				capture_output=True,
-				text=True,
-				env=dict(os.environ, GIT_ASKPASS='echo', GIT_TERMINAL_PROMPT='0'),
-			)
-
-			if process.returncode == 0:
-				self.current_repo = repo_name
-				# Scan dan simpan konten repository
-				file_count = 0
-				for file_path in Path(repo_name).rglob('*'):
-					if file_path.is_file() and '.git' not in str(file_path):
-						success, content = self.read_file_safely(str(file_path))
-						if success:
-							self.repo_content[str(file_path)] = content
-							file_count += 1
-
-				return (
-					True,
-					f'✅ Repository berhasil di-clone!\n\nNama: {repo_name}\nJumlah file: {file_count}\n\nAnda sekarang bisa mengajukan pertanyaan tentang repository ini.',
-				)
-			else:
-				return False, f'⚠️ Gagal clone repository:\n{process.stderr}'
-
-		except Exception as e:
-			return False, f'⚠️ Error: {str(e)}'
-
-	def read_file_safely(self, file_path: str) -> tuple[bool, str]:
-		"""Baca file dengan aman menggunakan berbagai encoding"""
-		encodings = ['utf-8', 'latin-1', 'cp1252']
-		for encoding in encodings:
-			try:
-				with open(file_path, 'r', encoding=encoding) as f:
-					content = f.read()
-					return True, content
-			except Exception as e:
-				continue
-		return False, 'Tidak dapat membaca file dengan encoding yang didukung'
+    def __init__(self):
+        self.current_repo = None
+        self.repo_content = {}
+        self.chat_history = []
+
+    async def stream_xai_response(
+        self, prompt: str, api_key: str = None, model: str = "grok-2-latest"
+    ) -> AsyncGenerator[str, None]:
+        """Stream response dari X.AI (Grok) API"""
+        try:
+            # Use default key if none provided
+            actual_key = api_key if api_key else DEFAULT_XAI_KEY
+
+            if not actual_key:
+                yield "⚠️ API Key X.AI diperlukan. Gunakan key Anda sendiri atau tunggu reset limit default key."
+                return
+
+            client = AsyncOpenAI(api_key=actual_key, base_url=XAI_BASE_URL)
+
+            # Prepare messages with repository context if available
+            messages = [
+                {
+                    "role": "system",
+                    "content": "Anda adalah asisten AI yang membantu menganalisis repository code. Berikan respons dalam Bahasa Indonesia.",
+                }
+            ]
+
+            if self.current_repo:
+                context = f"Repository: {self.current_repo}\n\n"
+                repo_files = "\n".join(list(self.repo_content.keys()))
+                context += f"Files in repository:\n{repo_files}\n\n"
+                messages.append({"role": "system", "content": context})
+
+            messages.append({"role": "user", "content": prompt})
+
+            stream = await client.chat.completions.create(
+                model=model, messages=messages, stream=True
+            )
+
+            full_response = ""
+            async for chunk in stream:
+                if chunk.choices[0].delta.content:
+                    content = chunk.choices[0].delta.content
+                    full_response += content
+                    yield content
+
+            self.chat_history.append({"role": "user", "content": prompt})
+            self.chat_history.append({"role": "assistant", "content": full_response})
+
+        except Exception as e:
+            error_msg = f"⚠️ Error dalam X.AI API: {str(e)}"
+            print(error_msg)
+            yield error_msg
+
+    async def stream_gemini_response(
+        self, prompt: str, api_key: str
+    ) -> AsyncGenerator[str, None]:
+        """Stream response dari Gemini API"""
+        try:
+            if not api_key:
+                yield "⚠️ API Key Gemini diperlukan. Klik icon bantuan (?) di samping input API Key untuk panduan mendapatkan key."
+                return
+
+            genai.configure(api_key=api_key)
+            model = genai.GenerativeModel("gemini-pro")
+
+            # Tambahkan konteks repository jika ada
+            if self.current_repo:
+                context = f"Repository: {self.current_repo}\n\n"
+                repo_files = "\n".join(list(self.repo_content.keys()))
+                context += f"Files in repository:\n{repo_files}\n\n"
+                prompt = context + prompt
+
+            response = model.generate_content(
+                prompt,
+                generation_config={"temperature": 0.7, "top_p": 0.8, "top_k": 40},
+                stream=True,
+            )
+
+            full_response = ""
+            async for chunk in response:
+                if chunk.text:
+                    full_response += chunk.text
+                    yield chunk.text
+
+            self.chat_history.append({"role": "user", "content": prompt})
+            self.chat_history.append({"role": "assistant", "content": full_response})
+
+        except Exception as e:
+            error_msg = f"⚠️ Error dalam Gemini API: {str(e)}\n\nPastikan API Key valid dan memiliki kuota yang cukup."
+            print(error_msg)
+            yield error_msg
+
+    def clone_repository(
+        self, repo_url: str, github_token: str, branch: str = None
+    ) -> tuple[bool, str]:
+        """Clone repository GitHub dengan autentikasi"""
+        if not repo_url:
+            return False, "⚠️ URL repository diperlukan"
+
+        repo_name = repo_url.split("/")[-1].replace(".git", "")
+
+        if os.path.exists(repo_name):
+            subprocess.run(["rm", "-rf", repo_name], check=True)
+
+        try:
+            owner_repo = "/".join(repo_url.split("/")[-2:])
+
+            # Cek apakah repository private
+            headers = {"Authorization": f"token {github_token}"} if github_token else {}
+            repo_check = requests.get(
+                f"https://api.github.com/repos/{owner_repo}", headers=headers
+            )
+
+            if repo_check.status_code == 404:
+                return False, "⚠️ Repository tidak ditemukan. Periksa URL repository."
+            elif repo_check.status_code == 401:
+                return (
+                    False,
+                    "⚠️ Token GitHub tidak valid. Klik icon bantuan (?) untuk panduan mendapatkan token.",
+                )
+            elif repo_check.status_code == 403 and repo_check.json().get(
+                "private", False
+            ):
+                return (
+                    False,
+                    "⚠️ Ini adalah repository private. Token GitHub dengan akses 'repo' diperlukan.",
+                )
+
+            auth_url = (
+                f"https://{github_token}@github.com/{owner_repo}"
+                if github_token
+                else f"https://github.com/{owner_repo}"
+            )
+
+            cmd = ["git", "clone"]
+            if branch:
+                cmd.extend(["--branch", branch])
+            cmd.append(auth_url)
+
+            process = subprocess.run(
+                cmd,
+                capture_output=True,
+                text=True,
+                env=dict(os.environ, GIT_ASKPASS="echo", GIT_TERMINAL_PROMPT="0"),
+            )
+
+            if process.returncode == 0:
+                self.current_repo = repo_name
+                # Scan dan simpan konten repository
+                file_count = 0
+                for file_path in Path(repo_name).rglob("*"):
+                    if file_path.is_file() and ".git" not in str(file_path):
+                        success, content = self.read_file_safely(str(file_path))
+                        if success:
+                            self.repo_content[str(file_path)] = content
+                            file_count += 1
+
+                return (
+                    True,
+                    f"✅ Repository berhasil di-clone!\n\nNama: {repo_name}\nJumlah file: {file_count}\n\nAnda sekarang bisa mengajukan pertanyaan tentang repository ini.",
+                )
+            else:
+                return False, f"⚠️ Gagal clone repository:\n{process.stderr}"
+
+        except Exception as e:
+            return False, f"⚠️ Error: {str(e)}"
+
+    def read_file_safely(self, file_path: str) -> tuple[bool, str]:
+        """Baca file dengan aman menggunakan berbagai encoding"""
+        encodings = ["utf-8", "latin-1", "cp1252"]
+        for encoding in encodings:
+            try:
+                with open(file_path, "r", encoding=encoding) as f:
+                    content = f.read()
+                    return True, content
+            except Exception as e:
+                continue
+        return False, "Tidak dapat membaca file dengan encoding yang didukung"
 
 
 analyzer = RepoAnalyzer()
 
 
-async def handle_chat(
-	message,
-	history,
-	provider_choice,
-	model_name,
-	xai_key,
-	gemini_key,
-	selected_files,
-	analyzer=analyzer,
-):
-	"""Menangani interaksi chat dengan model AI"""
-	if not analyzer.current_repo:
-		new_message = {
-			'role': 'assistant',
-			'content': '⚠️ Mohon clone repository terlebih dahulu sebelum mengajukan pertanyaan.',
-		}
-		history = history or []
-		history.append({'role': 'user', 'content': message})
-		history.append(new_message)
-		yield history
-		return
-
-	history = history or []
-
-	# Format user message
-	user_message = f'<div class="user-message">{message}</div>'
-	history.append({'role': 'user', 'content': user_message})
-
-	# Initialize assistant message
-	assistant_message = '<div class="assistant-message">'
-	history.append({'role': 'assistant', 'content': assistant_message})
-
-	try:
-		# Add context about selected files to the prompt
-		file_context = ''
-		if selected_files:
-			file_context = '\n\nFile yang dipilih:\n'
-			for file in selected_files:
-				content = analyzer.repo_content.get(file, '')
-				if content:
-					file_context += f'\n{file}:\n```\n{content}\n```\n'
-
-		enhanced_message = f'{message}\n{file_context}'
-
-		full_response = ''
-		if provider_choice == AIProvider.XAI:
-			async for chunk in analyzer.stream_xai_response(
-				enhanced_message, xai_key, model_name
-			):
-				full_response += chunk
-				# Format the response with code blocks
-				formatted_response = format_response(full_response)
-				history[-1]['content'] = (
-					f'<div class="assistant-message">{formatted_response}</div>'
-				)
-				await asyncio.sleep(0.05)
-				yield history
-
-		elif provider_choice == AIProvider.GEMINI:
-			async for chunk in analyzer.stream_gemini_response(
-				enhanced_message, gemini_key or DEFAULT_GEMINI_KEY
-			):
-				full_response += chunk
-				formatted_response = format_response(full_response)
-				history[-1]['content'] = (
-					f'<div class="assistant-message">{formatted_response}</div>'
-				)
-				await asyncio.sleep(0.05)
-				yield history
-
-		else:  # OLLAMA
-			response = analyze_with_ollama(model_name, enhanced_message)
-			words = response.split()
-			for i in range(len(words)):
-				full_response = ' '.join(words[: i + 1])
-				formatted_response = format_response(full_response)
-				history[-1]['content'] = (
-					f'<div class="assistant-message">{formatted_response}</div>'
-				)
-				await asyncio.sleep(0.05)
-				yield history
-
-	except Exception as e:
-		error_msg = f'⚠️ Error: {str(e)}'
-		history[-1]['content'] = f'<div class="assistant-message">{error_msg}</div>'
-		yield history
-
+async def handle_chat(message, history, provider_choice, model_name, xai_key, gemini_key, selected_files, analyzer=analyzer):
+    """Menangani interaksi chat dengan model AI"""
+    if not analyzer.current_repo:
+        new_message = {
+            "role": "assistant",
+            "content": "⚠️ Mohon clone repository terlebih dahulu sebelum mengajukan pertanyaan."
+        }
+        history = history or []
+        history.append({"role": "user", "content": message})
+        history.append(new_message)
+        yield history
+        return
+
+    history = history or []
+    
+    # Format user message
+    user_message = f'<div class="user-message">{message}</div>'
+    history.append({"role": "user", "content": user_message})
+    
+    # Initialize assistant message
+    assistant_message = '<div class="assistant-message">'
+    history.append({"role": "assistant", "content": assistant_message})
+
+    try:
+        # Add context about selected files to the prompt
+        file_context = ""
+        if selected_files:
+            file_context = "\n\nFile yang dipilih:\n"
+            for file in selected_files:
+                content = analyzer.repo_content.get(file, "")
+                if content:
+                    file_context += f"\n{file}:\n```\n{content}\n```\n"
+
+        enhanced_message = f"{message}\n{file_context}"
+
+        full_response = ""
+        if provider_choice == AIProvider.XAI:
+            async for chunk in analyzer.stream_xai_response(enhanced_message, xai_key, model_name):
+                full_response += chunk
+                # Format the response with code blocks
+                formatted_response = format_response(full_response)
+                history[-1]["content"] = f'<div class="assistant-message">{formatted_response}</div>'
+                await asyncio.sleep(0.05)
+                yield history
+
+        elif provider_choice == AIProvider.GEMINI:
+            async for chunk in analyzer.stream_gemini_response(enhanced_message, gemini_key or DEFAULT_GEMINI_KEY):
+                full_response += chunk
+                formatted_response = format_response(full_response)
+                history[-1]["content"] = f'<div class="assistant-message">{formatted_response}</div>'
+                await asyncio.sleep(0.05)
+                yield history
+
+        else:  # OLLAMA
+            response = analyze_with_ollama(model_name, enhanced_message)
+            words = response.split()
+            for i in range(len(words)):
+                full_response = " ".join(words[:i + 1])
+                formatted_response = format_response(full_response)
+                history[-1]["content"] = f'<div class="assistant-message">{formatted_response}</div>'
+                await asyncio.sleep(0.05)
+                yield history
+
+    except Exception as e:
+        error_msg = f"⚠️ Error: {str(e)}"
+        history[-1]["content"] = f'<div class="assistant-message">{error_msg}</div>'
+        yield history
 
 def format_response(text):
-	"""Format response text with code blocks"""
-	import re
-	import uuid
-
-	# Replace code blocks with styled versions
-	def replace_code_block(match):
-		language = match.group(1) or ''
-		code = match.group(2)
-		block_id = f'code-block-{uuid.uuid4().hex[:8]}'
-
-		return f'''
+    """Format response text with code blocks"""
+    import re
+    import uuid
+
+    # Replace code blocks with styled versions
+    def replace_code_block(match):
+        language = match.group(1) or ''
+        code = match.group(2)
+        block_id = f'code-block-{uuid.uuid4().hex[:8]}'
+        
+        return f'''
         <div class="code-block">
             <div class="code-header">
                 <span class="code-title">{language}</span>
@@ -411,22 +394,22 @@ def format_response(text):
         </div>
         '''
 
-	# Replace ```language\ncode``` blocks
-	text = re.sub(r'```(\w+)?\n(.*?)```', replace_code_block, text, flags=re.DOTALL)
-
-	# Replace inline code
-	text = re.sub(r'`([^`]+)`', r'<code>\1</code>', text)
-
-	return text
+    # Replace ```language\ncode``` blocks
+    text = re.sub(r'```(\w+)?\n(.*?)```', replace_code_block, text, flags=re.DOTALL)
+    
+    # Replace inline code
+    text = re.sub(r'`([^`]+)`', r'<code>\1</code>', text)
+    
+    return text
 
 
 def create_ui():
-	global analyzer
-	current_time = datetime.now().strftime('%Y-%m-%d %H:%M:%S')
+    global analyzer
+    current_time = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
 
-	with gr.Blocks(title='Open Repo AI', theme=gr.themes.Soft()) as app:
-		# CSS Styling
-		gr.Markdown("""
+    with gr.Blocks(title="Open Repo AI", theme=gr.themes.Soft()) as app:
+        # CSS Styling
+        gr.Markdown("""
         <style>
         /* General Styles */
         .container { max-width: 100% !important; padding: 1rem; }
@@ -607,40 +590,38 @@ def create_ui():
         </script>
         """)
 
-		# Header
-		with gr.Row(elem_classes='container'):
-			gr.Markdown(f"""
+        # Header
+        with gr.Row(elem_classes="container"):
+            gr.Markdown(f"""
             # AI Github Repository Chat
             
             <div class="header-info">
                 <span class="timestamp">Current Date and Time (UTC - YYYY-MM-DD HH:MM:SS formatted): {current_time}</span>
-                <span class="user-info">Current User's Login: {CURRENT_USER}</span>
             </div>
             """)
 
-		# Main Tabs
-		# Main Tabs Container
-		with gr.Tabs() as tabs:
-			# Configuration Tab
-			with gr.Tab('🛠️ Konfigurasi'):
-				provider = gr.Radio(
-					choices=[AIProvider.XAI, AIProvider.GEMINI, AIProvider.OLLAMA],
-					label='Penyedia AI',
-					value=AIProvider.XAI,
-				)
-
-				with gr.Group() as api_settings:
-					# X.AI API Key section
-					with gr.Row():
-						with gr.Column(scale=3):
-							xai_key = gr.Textbox(
-								label='X.AI (Grok) API Key',
-								type='password',
-								placeholder='Opsional - Klik (?) untuk info',
-								show_label=True,
-							)
-						with gr.Column(scale=1):
-							gr.Markdown("""
+        # Main Tabs Container
+        with gr.Tabs() as tabs:
+            # Configuration Tab
+            with gr.Tab("🛠️ Konfigurasi"):
+                provider = gr.Radio(
+                    choices=[AIProvider.XAI, AIProvider.GEMINI, AIProvider.OLLAMA],
+                    label="Penyedia AI",
+                    value=AIProvider.XAI
+                )
+
+                with gr.Group() as api_settings:
+                    # X.AI API Key section
+                    with gr.Row():
+                        with gr.Column(scale=3):
+                            xai_key = gr.Textbox(
+                                label="X.AI (Grok) API Key",
+                                type="password",
+                                placeholder="Opsional - Klik (?) untuk info",
+                                show_label=True
+                            )
+                        with gr.Column(scale=1):
+                            gr.Markdown("""
                             <details>
                                 <summary>❓ Cara Mendapatkan X.AI API Key</summary>
                                 <div class="help-content">
@@ -659,17 +640,17 @@ def create_ui():
                             </details>
                             """)
 
-					# Gemini API Key section
-					with gr.Row():
-						with gr.Column(scale=3):
-							gemini_key = gr.Textbox(
-								label='Gemini API Key',
-								type='password',
-								placeholder='Opsional - Klik (?) untuk info',
-								show_label=True,
-							)
-						with gr.Column(scale=1):
-							gr.Markdown("""
+                    # Gemini API Key section
+                    with gr.Row():
+                        with gr.Column(scale=3):
+                            gemini_key = gr.Textbox(
+                                label="Gemini API Key",
+                                type="password",
+                                placeholder="Opsional - Klik (?) untuk info",
+                                show_label=True
+                            )
+                        with gr.Column(scale=1):
+                            gr.Markdown("""
                             <details>
                                 <summary>❓ Cara Mendapatkan Gemini API Key</summary>
                                 <div class="help-content">
@@ -689,35 +670,35 @@ def create_ui():
                             </details>
                             """)
 
-				with gr.Row():
-					model_dropdown = gr.Dropdown(
-						label='Model AI',
-						choices=XAI_MODELS,
-						value='grok-2-latest',
-						interactive=True,
-					)
-
-			# Repository Analysis Tab
-			with gr.Tab('📊 Analisis Repository'):
-				with gr.Group():
-					# Repository URL input
-					with gr.Row():
-						repo_url = gr.Textbox(
-							label='URL Repository GitHub',
-							placeholder='https://github.com/username/repository',
-							elem_classes='mobile-full',
-						)
-
-					# GitHub Token section
-					with gr.Row():
-						with gr.Column(scale=2):
-							github_token = gr.Textbox(
-								label='Token GitHub',
-								type='password',
-								placeholder='Klik (?) untuk panduan',
-								elem_classes='mobile-full',
-							)
-							gr.Markdown("""
+                with gr.Row():
+                    model_dropdown = gr.Dropdown(
+                        label="Model AI",
+                        choices=XAI_MODELS,
+                        value="grok-2-latest",
+                        interactive=True
+                    )
+
+            # Repository Analysis Tab
+            with gr.Tab("📊 Analisis Repository"):
+                with gr.Group():
+                    # Repository URL input
+                    with gr.Row():
+                        repo_url = gr.Textbox(
+                            label="URL Repository GitHub",
+                            placeholder="https://github.com/username/repository",
+                            elem_classes="mobile-full"
+                        )
+
+                    # GitHub Token section
+                    with gr.Row():
+                        with gr.Column(scale=2):
+                            github_token = gr.Textbox(
+                                label="Token GitHub",
+                                type="password",
+                                placeholder="Klik (?) untuk panduan",
+                                elem_classes="mobile-full"
+                            )
+                            gr.Markdown("""
                             <details>
                                 <summary>❓ Cara Mendapatkan GitHub Token</summary>
                                 <div class="help-content">
@@ -737,221 +718,370 @@ def create_ui():
                                 </div>
                             </details>
                             """)
-						with gr.Column(scale=1):
-							branch = gr.Textbox(
-								label='Branch (opsional)',
-								placeholder='main',
-								elem_classes='mobile-full',
-							)
-
-					# Clone Button and Status
-					clone_button = gr.Button(
-						'🔄 Clone Repository',
-						variant='primary',
-						elem_classes='mobile-full',
-					)
-
-					clone_status = gr.Markdown(
-						value='', label='Status Repository', elem_classes='mobile-full'
-					)
-
-					# File Selection
-					with gr.Group():
-						gr.Markdown('### 📎 File yang Dipilih')
-						with gr.Row():
-							file_selector = gr.Dropdown(
-								label='Pilih File dari Repository',
-								choices=[],
-								multiselect=True,
-								value=[],
-								allow_custom_value=True,
-								max_choices=None,
-								elem_classes='mobile-full',
-							)
-
-						file_list = gr.HTML(
-							value="<div class='file-list'>Belum ada file yang dipilih</div>",
-							label='Daftar File Terpilih',
-						)
-
-			# Examples Tab
-			with gr.Tab('💡 Examples'):
-				with gr.Group():
-					gr.Markdown("""
-                    ### 🎯 Contoh Pertanyaan
+                        with gr.Column(scale=1):
+                            branch = gr.Textbox(
+                                label="Branch (opsional)",
+                                placeholder="main",
+                                elem_classes="mobile-full"
+                            )
+
+                    # Clone Button and Status
+                    clone_button = gr.Button(
+                        "🔄 Clone Repository",
+                        variant="primary",
+                        elem_classes="mobile-full"
+                    )
+                    
+                    clone_status = gr.Markdown(
+                        value="",
+                        label="Status Repository",
+                        elem_classes="mobile-full"
+                    )
+
+                    # File Selection
+                    with gr.Group():
+                        gr.Markdown("### 📎 File yang Dipilih")
+                        with gr.Row():
+                            file_selector = gr.Dropdown(
+                                label="Pilih File dari Repository",
+                                choices=[],
+                                multiselect=True,
+                                value=[],
+                                allow_custom_value=True,
+                                max_choices=None,
+                                elem_classes="mobile-full"
+                            )
+                        
+                        file_list = gr.HTML(
+                            value="<div class='file-list'>Belum ada file yang dipilih</div>",
+                            label="Daftar File Terpilih"
+                        )
+
+            # Examples Tab
+            with gr.Tab("💡 Examples"):
+                gr.Markdown("""
+                <style>
+                /* Styling untuk collapse */
+                .examples-container {
+                    padding: 20px;
+                    background: #fff;
+                    border-radius: 8px;
+                }
+                
+                .category-collapse {
+                    margin-bottom: 15px;
+                    border: 1px solid #e9ecef;
+                    border-radius: 8px;
+                    overflow: hidden;
+                }
+                
+                .category-header {
+                    padding: 15px;
+                    background: #f8f9fa;
+                    cursor: pointer;
+                    user-select: none;
+                    display: flex;
+                    align-items: center;
+                    justify-content: space-between;
+                    transition: background-color 0.2s;
+                }
+                
+                .category-header:hover {
+                    background: #e9ecef;
+                }
+                
+                .category-content {
+                    padding: 15px;
+                    display: none;
+                    border-top: 1px solid #e9ecef;
+                }
+                
+                .category-collapse.active .category-content {
+                    display: block;
+                    animation: slideDown 0.3s ease-out;
+                }
+                
+                .category-header::after {
+                    content: '▼';
+                    font-size: 12px;
+                    transition: transform 0.3s;
+                }
+                
+                .category-collapse.active .category-header::after {
+                    transform: rotate(180deg);
+                }
+                
+                .example-button {
+                    display: block;
+                    width: 100%;
+                    padding: 10px;
+                    margin: 5px 0;
+                    text-align: left;
+                    background: #fff;
+                    border: 1px solid #e9ecef;
+                    border-radius: 4px;
+                    cursor: pointer;
+                    transition: all 0.2s;
+                }
+                
+                .example-button:hover {
+                    background: #f8f9fa;
+                    border-color: #dee2e6;
+                }
+                
+                @keyframes slideDown {
+                    from {
+                        opacity: 0;
+                        transform: translateY(-10px);
+                    }
+                    to {
+                        opacity: 1;
+                        transform: translateY(0);
+                    }
+                }
+                </style>
+                
+                <div class="examples-container">
+                    <h3>🎯 Contoh Pertanyaan</h3>
                     <p>Klik pada kategori untuk melihat contoh pertanyaan yang bisa diajukan</p>
-                    """)
-
-					gr.Markdown("""
-                    <div class="examples-wrapper">
-                        <details class="example-section">
-                            <summary>🔍 Analisis Kode</summary>
-                            <div class="example-content">
-                                <ul>
-                                    <li><button class="example-btn" onclick="setQuestion('Jelaskan logika dan alur dari kode ini')">Jelaskan logika dari kode</button></li>
-                                    <li><button class="example-btn" onclick="setQuestion('Bagaimana cara mengoptimalkan performa kode ini?')">Optimasi performa</button></li>
-                                    <li><button class="example-btn" onclick="setQuestion('Apakah ada potential bugs yang perlu diperbaiki?')">Cek potential bugs</button></li>
-                                </ul>
-                            </div>
-                        </details>
-
-                        <details class="example-section">
-                            <summary>📚 Best Practices</summary>
-                            <div class="example-content">
-                                <ul>
-                                    <li><button class="example-btn" onclick="setQuestion('Apa saja best practices yang bisa diterapkan di kode ini?')">Saran best practices</button></li>
-                                    <li><button class="example-btn" onclick="setQuestion('Bagaimana cara meningkatkan maintainability kode ini?')">Improve maintainability</button></li>
-                                    <li><button class="example-btn" onclick="setQuestion('Berikan saran untuk meningkatkan code quality')">Improve code quality</button></li>
-                                </ul>
-                            </div>
-                        </details>
-
-                        <details class="example-section">
-                            <summary>🧪 Testing</summary>
-                            <div class="example-content">
-                                <ul>
-                                    <li><button class="example-btn" onclick="setQuestion('Buatkan unit test untuk fungsi ini')">Generate unit tests</button></li>
-                                    <li><button class="example-btn" onclick="setQuestion('Bagaimana cara test error handling yang baik?')">Test error handling</button></li>
-                                    <li><button class="example-btn" onclick="setQuestion('Berikan saran untuk meningkatkan test coverage')">Improve test coverage</button></li>
-                                </ul>
-                            </div>
-                        </details>
-
-                        <details class="example-section">
-                            <summary>📝 Dokumentasi</summary>
-                            <div class="example-content">
-                                <ul>
-                                    <li><button class="example-btn" onclick="setQuestion('Buatkan dokumentasi untuk fungsi-fungsi utama')">Generate documentation</button></li>
-                                    <li><button class="example-btn" onclick="setQuestion('Buat README.md untuk project ini')">Create README.md</button></li>
-                                    <li><button class="example-btn" onclick="setQuestion('Jelaskan cara penggunaan library/framework')">Usage guide</button></li>
-                                </ul>
-                            </div>
-                        </details>
+                    
+                    <div class="category-collapse">
+                        <div class="category-header">
+                            🔍 Analisis Kode
+                        </div>
+                        <div class="category-content">
+                            <button class="example-button" onclick="setQuestion('Jelaskan logika dan alur dari kode ini')">
+                                Jelaskan logika dari kode
+                            </button>
+                            <button class="example-button" onclick="setQuestion('Bagaimana cara mengoptimalkan performa kode ini?')">
+                                Optimasi performa
+                            </button>
+                            <button class="example-button" onclick="setQuestion('Apakah ada potential bugs yang perlu diperbaiki?')">
+                                Cek potential bugs
+                            </button>
+                        </div>
+                    </div>
+                    
+                    <div class="category-collapse">
+                        <div class="category-header">
+                            📚 Best Practices
+                        </div>
+                        <div class="category-content">
+                            <button class="example-button" onclick="setQuestion('Apa saja best practices yang bisa diterapkan di kode ini?')">
+                                Saran best practices
+                            </button>
+                            <button class="example-button" onclick="setQuestion('Bagaimana cara meningkatkan maintainability kode ini?')">
+                                Improve maintainability
+                            </button>
+                            <button class="example-button" onclick="setQuestion('Berikan saran untuk meningkatkan code quality')">
+                                Improve code quality
+                            </button>
+                        </div>
+                    </div>
+                    
+                    <div class="category-collapse">
+                        <div class="category-header">
+                            🧪 Testing
+                        </div>
+                        <div class="category-content">
+                            <button class="example-button" onclick="setQuestion('Buatkan unit test untuk fungsi ini')">
+                                Generate unit tests
+                            </button>
+                            <button class="example-button" onclick="setQuestion('Bagaimana cara test error handling yang baik?')">
+                                Test error handling
+                            </button>
+                            <button class="example-button" onclick="setQuestion('Berikan saran untuk meningkatkan test coverage')">
+                                Improve test coverage
+                            </button>
+                        </div>
                     </div>
-                    """)
-
-		# Chat Interface (outside tabs)
-		with gr.Group():
-			chat_history = gr.Chatbot(
-				label='📝 Riwayat Chat',
-				height=500,
-				show_label=True,
-				type='messages',
-				elem_classes='mobile-full',
-			)
-
-			with gr.Row():
-				chat_input = gr.Textbox(
-					label='💭 Tanyakan tentang Repository',
-					placeholder='Ketik pertanyaan Anda di sini...',
-					lines=3,
-					elem_classes='mobile-full',
-				)
-				send_button = gr.Button('📤 Kirim', variant='primary')
-				clear_button = gr.Button('🧹 Bersihkan', variant='secondary')
-
-		# Event Handlers
-		def handle_clone(repo_url, github_token, branch):
-			if not repo_url:
-				return (
-					'⚠️ URL repository diperlukan!',
-					gr.Dropdown(choices=[]),
-					"<div class='file-list'>Belum ada file yang dipilih</div>",
-				)
-
-			success, message = analyzer.clone_repository(repo_url, github_token, branch)
-
-			if success:
-				files = sorted(list(analyzer.repo_content.keys()))
-				return (
-					message,
-					gr.Dropdown(choices=files, value=[]),
-					"<div class='file-list'>Belum ada file yang dipilih</div>",
-				)
-
-			return (
-				message,
-				gr.Dropdown(choices=[]),
-				"<div class='file-list'>Belum ada file yang dipilih</div>",
-			)
-
-		def update_file_list(selected):
-			if not selected:
-				return "<div class='file-list'>Belum ada file yang dipilih</div>"
-
-			html = "<div class='file-list'>"
-			for file in selected:
-				html += f"<div class='file-item'><span>{file}</span></div>"
-			html += '</div>'
-			return html
-
-		def clear_chat_history():
-			return []
-
-		def update_model_list(provider_choice):
-			if provider_choice == AIProvider.XAI:
-				return gr.Dropdown(choices=XAI_MODELS, value='grok-2-latest')
-			elif provider_choice == AIProvider.GEMINI:
-				return gr.Dropdown(choices=GEMINI_MODELS, value='gemini-1.5-mini')
-			else:  # OLLAMA
-				return gr.Dropdown(choices=OLLAMA_MODELS, value='llama2')
-
-		# Connect Events
-		provider.change(
-			fn=update_model_list, inputs=[provider], outputs=[model_dropdown]
-		)
-
-		clone_button.click(
-			fn=handle_clone,
-			inputs=[repo_url, github_token, branch],
-			outputs=[clone_status, file_selector, file_list],
-		)
-
-		file_selector.change(
-			fn=update_file_list, inputs=[file_selector], outputs=[file_list]
-		)
-
-		# Chat events
-		clear_button.click(fn=clear_chat_history, outputs=[chat_history])
-
-		send_button.click(
-			fn=handle_chat,
-			inputs=[
-				chat_input,
-				chat_history,
-				provider,
-				model_dropdown,
-				xai_key,
-				gemini_key,
-				file_selector,
-			],
-			outputs=chat_history,
-			show_progress=True,
-		).then(fn=lambda: gr.update(value=''), outputs=chat_input)
-
-		chat_input.submit(
-			fn=handle_chat,
-			inputs=[
-				chat_input,
-				chat_history,
-				provider,
-				model_dropdown,
-				xai_key,
-				gemini_key,
-				file_selector,
-			],
-			outputs=chat_history,
-			show_progress=True,
-		).then(fn=lambda: gr.update(value=''), outputs=chat_input)
-
-		return app
-
-
-if __name__ == '__main__':
-	print("""
+                    
+                    <div class="category-collapse">
+                        <div class="category-header">
+                            📝 Dokumentasi
+                        </div>
+                        <div class="category-content">
+                            <button class="example-button" onclick="setQuestion('Buatkan dokumentasi untuk fungsi-fungsi utama')">
+                                Generate documentation
+                            </button>
+                            <button class="example-button" onclick="setQuestion('Buat README.md untuk project ini')">
+                                Create README.md
+                            </button>
+                            <button class="example-button" onclick="setQuestion('Jelaskan cara penggunaan library/framework')">
+                                Usage guide
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            
+                <script>
+                document.addEventListener('DOMContentLoaded', function() {
+                    // Handle collapse functionality
+                    const categories = document.querySelectorAll('.category-collapse');
+                    
+                    categories.forEach(category => {
+                        const header = category.querySelector('.category-header');
+                        
+                        header.addEventListener('click', () => {
+                            const isActive = category.classList.contains('active');
+                            
+                            // Close all categories
+                            categories.forEach(c => c.classList.remove('active'));
+                            
+                            // If clicked category wasn't active, open it
+                            if (!isActive) {
+                                category.classList.add('active');
+                            }
+                        });
+                    });
+                });
+            
+                // Function to set question in chat input
+                function setQuestion(text) {
+                    const chatInput = document.querySelector('textarea[data-testid="textbox"]');
+                    if (chatInput) {
+                        chatInput.value = text;
+                        chatInput.focus();
+                    }
+                }
+                </script>
+                """)
+
+        # Chat Interface (outside tabs)
+        # with gr.Group():
+        #     chat_history = gr.Chatbot(
+        #         label="📝 Riwayat Chat",
+        #         height=500,
+        #         show_label=True,
+        #         type="messages",
+        #         elem_classes="mobile-full"
+        #     )
+            
+        #     with gr.Row():
+        #         chat_input = gr.Textbox(
+        #             label="💭 Tanyakan tentang Repository",
+        #             placeholder="Ketik pertanyaan Anda di sini...",
+        #             lines=3,
+        #             elem_classes="mobile-full"
+        #         )
+        #         send_button = gr.Button("📤 Kirim", variant="primary")
+        #         clear_button = gr.Button("🧹 Bersihkan", variant="secondary")
+
+        # Event Handlers
+        def handle_clone(repo_url, github_token, branch):
+            if not repo_url:
+                return (
+                    "⚠️ URL repository diperlukan!",
+                    gr.Dropdown(choices=[]),
+                    "<div class='file-list'>Belum ada file yang dipilih</div>"
+                )
+            
+            success, message = analyzer.clone_repository(repo_url, github_token, branch)
+            
+            if success:
+                files = sorted(list(analyzer.repo_content.keys()))
+                return (
+                    message,
+                    gr.Dropdown(choices=files, value=[]),
+                    "<div class='file-list'>Belum ada file yang dipilih</div>"
+                )
+            
+            return (
+                message,
+                gr.Dropdown(choices=[]),
+                "<div class='file-list'>Belum ada file yang dipilih</div>"
+            )
+
+        def update_file_list(selected):
+            if not selected:
+                return "<div class='file-list'>Belum ada file yang dipilih</div>"
+            
+            html = "<div class='file-list'>"
+            for file in selected:
+                html += f"<div class='file-item'><span>{file}</span></div>"
+            html += "</div>"
+            return html
+
+        def clear_chat_history():
+            return []
+
+        def update_model_list(provider_choice):
+            if provider_choice == AIProvider.XAI:
+                return gr.Dropdown(choices=XAI_MODELS, value="grok-2-latest")
+            elif provider_choice == AIProvider.GEMINI:
+                return gr.Dropdown(choices=GEMINI_MODELS, value="gemini-1.5-mini")
+            else:  # OLLAMA
+                return gr.Dropdown(choices=OLLAMA_MODELS, value="llama2")
+
+        # Connect Events
+        provider.change(
+            fn=update_model_list,
+            inputs=[provider],
+            outputs=[model_dropdown]
+        )
+
+        clone_button.click(
+            fn=handle_clone,
+            inputs=[repo_url, github_token, branch],
+            outputs=[clone_status, file_selector, file_list]
+        )
+
+        file_selector.change(
+            fn=update_file_list,
+            inputs=[file_selector],
+            outputs=[file_list]
+        )
+
+        # Chat events
+        clear_button.click(
+            fn=clear_chat_history,
+            outputs=[chat_history]
+        )
+
+        send_button.click(
+            fn=handle_chat,
+            inputs=[
+                chat_input,
+                chat_history,
+                provider,
+                model_dropdown,
+                xai_key,
+                gemini_key,
+                file_selector
+            ],
+            outputs=chat_history,
+            show_progress=True
+        ).then(
+            fn=lambda: gr.update(value=""),
+            outputs=chat_input
+        )
+
+        chat_input.submit(
+            fn=handle_chat,
+            inputs=[
+                chat_input,
+                chat_history,
+                provider,
+                model_dropdown,
+                xai_key,
+                gemini_key,
+                file_selector
+            ],
+            outputs=chat_history,
+            show_progress=True
+        ).then(
+            fn=lambda: gr.update(value=""),
+            outputs=chat_input
+        )
+
+        return app
+
+
+if __name__ == "__main__":
+    print("""
     🚀 Starting Repository Chat Analysis
     ====================================
     """)
 
-	app = create_ui()
-	app.launch(share=True, server_name='0.0.0.0', server_port=7860, debug=True)
+    app = create_ui()
+    app.launch(share=True, server_name="0.0.0.0", server_port=7860, debug=True)