fix: move creation loading indicator to create session form

Move the loading overlay from the active sessions section to the create
session section so it dims the form itself during creation, providing
better visual feedback to the user.
This commit is contained in:
Fusion
2026-05-23 08:08:24 +02:00
parent 8c5e1b931e
commit 18646e3d1b
2 changed files with 16 additions and 18 deletions
+10 -18
View File
@@ -388,23 +388,7 @@ export const SessionsPage = () => {
)}
{/* Active Sessions */}
<div className={`active-sessions-section ${createStatus === "creating" || loadingSessionId ? "dimmed" : ""}`}>
{createStatus === "creating" && (
<div className="loading-overlay">
<div className="loading-content">
<Icon name="loading" size="lg" />
<p>{createProgress || "Creating session..."}</p>
</div>
</div>
)}
{loadingSessionId && (
<div className="loading-overlay">
<div className="loading-content">
<Icon name="loading" size="lg" />
<p>{loadingAction || "Processing..."}</p>
</div>
</div>
)}
<div className="active-sessions-section">
<h2>
Active Sessions
{activeSessions.length > 0 && (
@@ -638,7 +622,15 @@ export const SessionsPage = () => {
)}
{/* Create Session */}
<div className="create-session-section">
<div className={`create-session-section ${createStatus === "creating" ? "dimmed" : ""}`}>
{createStatus === "creating" && (
<div className="loading-overlay">
<div className="loading-content">
<Icon name="loading" size="lg" />
<p>{createProgress || "Creating session..."}</p>
</div>
</div>
)}
<h2>Create New Session</h2>
<form onSubmit={handleCreate} className="card stack create-session-form">
<div className="form-row">
+6
View File
@@ -2825,9 +2825,15 @@ a.nav-item,
}
.create-session-section {
position: relative;
margin-bottom: var(--space-6);
}
.create-session-section.dimmed {
opacity: 0.5;
pointer-events: none;
}
.create-session-form {
max-width: 600px;
}