feat: initialize main application dashboard with service management and project configuration UI
This commit is contained in:
+61
-10
@@ -137,6 +137,17 @@ function App(): JSX.Element {
|
|||||||
const [projectNginxConfig, setProjectNginxConfig] = useState('')
|
const [projectNginxConfig, setProjectNginxConfig] = useState('')
|
||||||
const [selectedProjectHost, setSelectedProjectHost] = 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 () => {
|
const fetchStatus = async () => {
|
||||||
if (window.api && window.api.getServiceStatus) {
|
if (window.api && window.api.getServiceStatus) {
|
||||||
const currentStatus = await window.api.getServiceStatus()
|
const currentStatus = await window.api.getServiceStatus()
|
||||||
@@ -479,14 +490,38 @@ function App(): JSX.Element {
|
|||||||
const handleTestNginxConfig = async () => {
|
const handleTestNginxConfig = async () => {
|
||||||
if (window.api && window.api.invoke) {
|
if (window.api && window.api.invoke) {
|
||||||
const result = await window.api.invoke('nginx:config:test')
|
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({
|
Swal.fire({
|
||||||
title: result.success ? 'Başarılı' : 'Hata',
|
title: result.success ? 'Başarılı' : 'Yapılandırma Hatası',
|
||||||
text: result.message,
|
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',
|
icon: result.success ? 'success' : 'error',
|
||||||
|
showCancelButton: !result.success && !!errorInfo?.host,
|
||||||
|
confirmButtonText: !result.success && errorInfo?.host ? 'Düzeltmeye Git' : 'Tamam',
|
||||||
|
cancelButtonText: 'Kapat',
|
||||||
background: '#1e1e1e',
|
background: '#1e1e1e',
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
customClass: {
|
width: '600px'
|
||||||
htmlContainer: 'nginx-error-container'
|
}).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
|
// 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)
|
// But we should ideally save the project config first (to the temp or real file)
|
||||||
// For now, testing global config is the most reliable
|
// 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({
|
Swal.fire({
|
||||||
title: result.success ? 'Başarılı' : 'Hata',
|
title: result.success ? 'Başarılı' : 'Yapılandırma Hatası',
|
||||||
text: result.message,
|
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',
|
icon: result.success ? 'success' : 'error',
|
||||||
background: '#1e1e1e',
|
background: '#1e1e1e',
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
customClass: {
|
width: '600px'
|
||||||
htmlContainer: 'nginx-error-container'
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
|
|||||||
Reference in New Issue
Block a user