From 7c2ec5aa1a6023baeb4b6f13b0ffbec0311537ce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=9Cmit=20Tun=C3=A7?= <umitreva@gmail.com>
Date: Mon, 30 Mar 2026 07:53:02 +0300
Subject: [PATCH] feat: initialize main application dashboard with service
 management and project configuration UI

---
 src/renderer/src/App.tsx | 71 ++++++++++++++++++++++++++++++++++------
 1 file changed, 61 insertions(+), 10 deletions(-)

diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx
index 73f41ab..9b4ce32 100644
--- a/src/renderer/src/App.tsx
+++ b/src/renderer/src/App.tsx
@@ -137,6 +137,17 @@ function App(): JSX.Element {
     const [projectNginxConfig, setProjectNginxConfig] = useState('')
     const [selectedProjectHost, setSelectedProjectHost] = useState('')
 
+    const parseNginxError = (message: string) => {
+        const match = message.match(/in (.*):(\d+)/)
+        if (!match) return null
+        const filePath = match[1].replace(/\\/g, '/')
+        const line = parseInt(match[2])
+        const fileName = filePath.split('/').pop() || ''
+        const isProjectConfig = filePath.includes('/generated_configs/projects/')
+        const host = isProjectConfig ? fileName.replace('.conf', '') : null
+        return { filePath, line, host }
+    }
+
     const fetchStatus = async () => {
         if (window.api && window.api.getServiceStatus) {
             const currentStatus = await window.api.getServiceStatus()
@@ -479,14 +490,38 @@ function App(): JSX.Element {
     const handleTestNginxConfig = async () => {
         if (window.api && window.api.invoke) {
             const result = await window.api.invoke('nginx:config:test')
+            const errorInfo = !result.success ? parseNginxError(result.message) : null
+            const formattedMessage = result.message
+                .replace(/\[emerg\]/g, '<span style="color: #ff5252; font-weight: bold;">[emerg]</span>')
+                .replace(/\[warn\]/g, '<span style="color: #ffb142; font-weight: bold;">[warn]</span>')
+                .replace(/failed/g, '<span style="color: #ff5252;">failed</span>')
+                .replace(/successful/g, '<span style="color: #33d9b2;">successful</span>')
+
             Swal.fire({
-                title: result.success ? 'Başarılı' : 'Hata',
-                text: result.message,
+                title: result.success ? 'Başarılı' : 'Yapılandırma Hatası',
+                html: `
+                    <div class="nginx-error-container">
+                        ${formattedMessage}
+                    </div>
+                    ${errorInfo?.host ? `
+                        <div style="margin-top: 15px; text-align: center;">
+                            <p style="font-size: 0.9rem; color: #ffb142;">
+                                <b>Sorunlu Proje:</b> ${errorInfo.host} (Satır: ${errorInfo.line})
+                            </p>
+                        </div>
+                    ` : ''}
+                `,
                 icon: result.success ? 'success' : 'error',
+                showCancelButton: !result.success && !!errorInfo?.host,
+                confirmButtonText: !result.success && errorInfo?.host ? 'Düzeltmeye Git' : 'Tamam',
+                cancelButtonText: 'Kapat',
                 background: '#1e1e1e',
                 color: '#fff',
-                customClass: {
-                    htmlContainer: 'nginx-error-container'
+                width: '600px'
+            }).then((alertResult) => {
+                if (alertResult.isConfirmed && !result.success && errorInfo?.host) {
+                    setIsNginxConfigOpen(false) // Close global if open
+                    handleOpenProjectNginxConfig(errorInfo.host)
                 }
             })
         }
@@ -1484,16 +1519,32 @@ function App(): JSX.Element {
                                     // We need to test the global config because this project is part of it
                                     // But we should ideally save the project config first (to the temp or real file)
                                     // For now, testing global config is the most reliable
-                                    const result = await window.api.invoke('nginx:config:test')
+                                    const result = await window.api.invoke('project:nginx:test', selectedProjectHost, projectNginxConfig)
+                                    const errorInfo = !result.success ? parseNginxError(result.message) : null
+                                    const formattedMessage = result.message
+                                        .replace(/\[emerg\]/g, '<span style="color: #ff5252; font-weight: bold;">[emerg]</span>')
+                                        .replace(/\[warn\]/g, '<span style="color: #ffb142; font-weight: bold;">[warn]</span>')
+                                        .replace(/failed/g, '<span style="color: #ff5252;">failed</span>')
+                                        .replace(/successful/g, '<span style="color: #33d9b2;">successful</span>')
+
                                     Swal.fire({
-                                        title: result.success ? 'Başarılı' : 'Hata',
-                                        text: result.message,
+                                        title: result.success ? 'Başarılı' : 'Yapılandırma Hatası',
+                                        html: `
+                                            <div class="nginx-error-container">
+                                                ${formattedMessage}
+                                            </div>
+                                            ${!result.success && errorInfo ? `
+                                                <div style="margin-top: 15px; text-align: center;">
+                                                    <p style="font-size: 0.9rem; color: #ffb142;">
+                                                        <b>Hata Satırı:</b> ${errorInfo.line}
+                                                    </p>
+                                                </div>
+                                            ` : ''}
+                                        `,
                                         icon: result.success ? 'success' : 'error',
                                         background: '#1e1e1e',
                                         color: '#fff',
-                                        customClass: {
-                                            htmlContainer: 'nginx-error-container'
-                                        }
+                                        width: '600px'
                                     })
                                 }
                             }}