michael/stackpulse
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 6 Wiki Activity

Update

Browse Source
This commit is contained in:
root
2025-09-26 09:28:34 +00:00
parent ca148247cb
commit 3489ea55a2
3 changed files with 135 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/Stacks.jsx
+55 -32
View File
@@ -68,45 +68,68 @@ export default function Stacks() {
}
};
const handleRedeployAll = async () => {
setStacks(prev => prev.map(stack => ({ ...stack, redeploying: true })));
try {
await axios.put("/api/stacks/redeploy-all");
// Statusupdates kommen über Socket.IO
} catch (err) {
console.error("❌ Fehler beim Redeploy ALL:", err);
setStacks(prev => prev.map(stack => ({ ...stack, redeploying: false })));
}
};
if (loading) return <p className="text-gray-400">Lade Stacks...</p>;
if (error) return <p className="text-red-400">{error}</p>;
return (
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 p-6">
{stacks.map(stack => {
const isRedeploying = stack.redeploying;
<div className="p-6">
<div className="flex justify-end mb-4">
<button
onClick={handleRedeployAll}
className="px-5 py-2 rounded-lg font-medium transition bg-purple-500 hover:bg-purple-600"
>
Redeploy All
</button>
</div>
return (
<div
key={stack.Id}
className={`flex justify-between items-center p-5 rounded-xl shadow-lg transition
${isRedeploying ? "bg-gray-700 cursor-not-allowed" : "bg-gray-800 hover:bg-gray-700"}`}
>
<div className="flex items-center space-x-4">
<div className={`w-12 h-12 flex items-center justify-center rounded-full
${stack.updateStatus === "✅" ? "bg-green-500" :
stack.updateStatus === "⚠️" ? "bg-yellow-500" :
"bg-red-500"}`}
/>
<div>
<p className="text-lg font-semibold text-white">{stack.Name}</p>
<p className="text-sm text-gray-400">ID: {stack.Id}</p>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
{stacks.map(stack => {
const isRedeploying = stack.redeploying;
<button
onClick={() => handleRedeploy(stack.Id)}
disabled={isRedeploying}
className={`px-5 py-2 rounded-lg font-medium transition
${isRedeploying ? "bg-orange-500 cursor-not-allowed" :
"bg-blue-500 hover:bg-blue-600"}`}
return (
<div
key={stack.Id}
className={`flex justify-between items-center p-5 rounded-xl shadow-lg transition
${isRedeploying ? "bg-gray-700 cursor-not-allowed" : "bg-gray-800 hover:bg-gray-700"}`}
>
{isRedeploying ? "Redeploying" : "Redeploy"}
</button>
</div>
);
})}
{stacks.length === 0 && <p className="text-gray-400">Keine Stacks gefunden.</p>}
<div className="flex items-center space-x-4">
<div className={`w-12 h-12 flex items-center justify-center rounded-full
${stack.updateStatus === "✅" ? "bg-green-500" :
stack.updateStatus === "⚠️" ? "bg-yellow-500" :
"bg-red-500"}`}
/>
<div>
<p className="text-lg font-semibold text-white">{stack.Name}</p>
<p className="text-sm text-gray-400">ID: {stack.Id}</p>
</div>
</div>
<button
onClick={() => handleRedeploy(stack.Id)}
disabled={isRedeploying}
className={`px-5 py-2 rounded-lg font-medium transition
${isRedeploying ? "bg-orange-500 cursor-not-allowed" :
"bg-blue-500 hover:bg-blue-600"}`}
>
{isRedeploying ? "Redeploying" : "Redeploy"}
</button>
</div>
);
})}
{stacks.length === 0 && <p className="text-gray-400">Keine Stacks gefunden.</p>}
</div>
</div>
);
}