Update GitPanel

This commit is contained in:
simos
2025-07-08 15:14:12 +00:00
parent 1bdc75e37b
commit bca97a5284

View File

@@ -506,7 +506,23 @@ function GitPanel({ selectedProject, isMobile }) {
</button> </button>
</div> </div>
{/* Tab Navigation */} {/* Git Repository Not Found Message */}
{gitStatus?.error ? (
<div className="flex-1 flex flex-col items-center justify-center text-gray-500 dark:text-gray-400 px-6 py-12">
<GitBranch className="w-20 h-20 mb-6 opacity-30" />
<h3 className="text-xl font-medium mb-3 text-center">{gitStatus.error}</h3>
{gitStatus.details && (
<p className="text-sm text-center leading-relaxed mb-6 max-w-md">{gitStatus.details}</p>
)}
<div className="p-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800 max-w-md">
<p className="text-sm text-blue-700 dark:text-blue-300 text-center">
<strong>Tip:</strong> Run <code className="bg-blue-100 dark:bg-blue-900 px-2 py-1 rounded font-mono text-xs">git init</code> in your project directory to initialize git source control.
</p>
</div>
</div>
) : (
<>
{/* Tab Navigation - Only show when git is available */}
<div className="flex border-b border-gray-200 dark:border-gray-700"> <div className="flex border-b border-gray-200 dark:border-gray-700">
<button <button
onClick={() => setActiveView('changes')} onClick={() => setActiveView('changes')}
@@ -627,6 +643,7 @@ function GitPanel({ selectedProject, isMobile }) {
)} )}
{/* Status Legend Toggle */} {/* Status Legend Toggle */}
{!gitStatus?.error && (
<div className="border-b border-gray-200 dark:border-gray-700"> <div className="border-b border-gray-200 dark:border-gray-700">
<button <button
onClick={() => setShowLegend(!showLegend)} onClick={() => setShowLegend(!showLegend)}
@@ -668,27 +685,17 @@ function GitPanel({ selectedProject, isMobile }) {
</div> </div>
)} )}
</div> </div>
)}
</>
)}
{/* File List - Changes View */} {/* File List - Changes View - Only show when git is available */}
{activeView === 'changes' && ( {activeView === 'changes' && !gitStatus?.error && (
<div className={`flex-1 overflow-y-auto ${isMobile ? 'pb-20' : ''}`}> <div className={`flex-1 overflow-y-auto ${isMobile ? 'pb-20' : ''}`}>
{isLoading ? ( {isLoading ? (
<div className="flex items-center justify-center h-32"> <div className="flex items-center justify-center h-32">
<RefreshCw className="w-6 h-6 animate-spin text-gray-400" /> <RefreshCw className="w-6 h-6 animate-spin text-gray-400" />
</div> </div>
) : gitStatus?.error ? (
<div className="flex flex-col items-center justify-center h-48 text-gray-500 dark:text-gray-400 px-6">
<GitBranch className="w-16 h-16 mb-4 opacity-30" />
<p className="text-lg font-medium mb-2 text-center">{gitStatus.error}</p>
{gitStatus.details && (
<p className="text-sm text-center leading-relaxed">{gitStatus.details}</p>
)}
<div className="mt-4 p-3 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800">
<p className="text-xs text-blue-700 dark:text-blue-300 text-center">
<strong>Tip:</strong> Run <code className="bg-blue-100 dark:bg-blue-900 px-1 rounded">git init</code> in your project directory to initialize git source control.
</p>
</div>
</div>
) : !gitStatus || (!gitStatus.modified?.length && !gitStatus.added?.length && !gitStatus.deleted?.length && !gitStatus.untracked?.length) ? ( ) : !gitStatus || (!gitStatus.modified?.length && !gitStatus.added?.length && !gitStatus.deleted?.length && !gitStatus.untracked?.length) ? (
<div className="flex flex-col items-center justify-center h-32 text-gray-500 dark:text-gray-400"> <div className="flex flex-col items-center justify-center h-32 text-gray-500 dark:text-gray-400">
<GitCommit className="w-12 h-12 mb-2 opacity-50" /> <GitCommit className="w-12 h-12 mb-2 opacity-50" />
@@ -705,8 +712,8 @@ function GitPanel({ selectedProject, isMobile }) {
</div> </div>
)} )}
{/* History View */} {/* History View - Only show when git is available */}
{activeView === 'history' && ( {activeView === 'history' && !gitStatus?.error && (
<div className={`flex-1 overflow-y-auto ${isMobile ? 'pb-20' : ''}`}> <div className={`flex-1 overflow-y-auto ${isMobile ? 'pb-20' : ''}`}>
{isLoading ? ( {isLoading ? (
<div className="flex items-center justify-center h-32"> <div className="flex items-center justify-center h-32">