This repository has no description
fix status n9otification
author
damedotblog
date
(Apr 22, 2025, 12:35 PM -0400)
commit
8e2b1ab7
8e2b1ab73c6db044bf5a646a600358208d9f0636
parent
3052584d
3052584d3f3960323e895169f6100c3a477d9709
+36
-9
+22
-5
src/components/Verifier/Verifier.css
+22
-5
src/components/Verifier/Verifier.css
···
187
187
border-radius: 6px;
188
188
margin-top: 15px;
189
189
text-align: center;
190
+
border: 1px solid transparent; /* Base border */
191
+
transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
190
192
}
191
193
.verifier-status-box-success {
192
-
background-color: var(--success-bg, #d4edda); /* Add theme variables */
194
+
background-color: var(--success-bg, #d4edda);
193
195
color: var(--success-text, #155724);
194
-
border: 1px solid var(--success-border, #c3e6cb);
196
+
border-color: var(--success-border, #c3e6cb);
195
197
}
196
198
.verifier-status-box-error {
197
-
background-color: var(--error-bg, #f8d7da); /* Add theme variables */
199
+
background-color: var(--error-bg, #f8d7da);
198
200
color: var(--error-text, #721c24);
199
-
border: 1px solid var(--error-border, #f5c6cb);
201
+
border-color: var(--error-border, #f5c6cb);
200
202
}
201
-
.verifier-status-box .intent-link {
203
+
.verifier-status-box .verifier-intent-link { /* Renamed class */
202
204
color: var(--success-text, #155724);
203
205
font-weight: bold;
204
206
text-decoration: underline;
207
+
}
208
+
209
+
/* Dark Mode Status Box Styles */
210
+
.dark-mode .verifier-status-box-success {
211
+
background-color: var(--success-bg-dark, #1a3a24); /* Example dark variable */
212
+
color: var(--success-text-dark, #a3e9a4);
213
+
border-color: var(--success-border-dark, #2a5a34);
214
+
}
215
+
.dark-mode .verifier-status-box-error {
216
+
background-color: var(--error-bg-dark, #4d1f24); /* Example dark variable */
217
+
color: var(--error-text-dark, #f5c6cb);
218
+
border-color: var(--error-border-dark, #721c24);
219
+
}
220
+
.dark-mode .verifier-status-box .verifier-intent-link {
221
+
color: var(--success-text-dark, #a3e9a4);
205
222
}
206
223
207
224
/* Verification Lists */
+14
-4
src/components/Verifier/Verifier.js
+14
-4
src/components/Verifier/Verifier.js
···
131
131
const { session, loading: isAuthLoading, error: authError, logout: signOut } = useAuth();
132
132
const [targetHandle, setTargetHandle] = useState('');
133
133
const [statusMessage, setStatusMessage] = useState('');
134
+
const [revokeStatusMessage, setRevokeStatusMessage] = useState('');
134
135
const [isVerifying, setIsVerifying] = useState(false);
135
136
const [isRevoking, setIsRevoking] = useState(false);
136
137
const [agent, setAgent] = useState(null);
···
574
575
if (!targetHandle) return;
575
576
setIsVerifying(true);
576
577
setStatusMessage(`Verifying ${targetHandle}...`);
578
+
setRevokeStatusMessage('');
577
579
setShowSuggestions(false);
578
580
try {
579
581
const profileRes = await agent.api.app.bsky.actor.getProfile({ actor: targetHandle });
···
611
613
const handleRevoke = async (verification) => {
612
614
if (!agent || !session) return;
613
615
setIsRevoking(true);
614
-
setStatusMessage(`Revoking verification for ${verification.handle}...`);
616
+
setRevokeStatusMessage(`Revoking verification for ${verification.handle}...`);
617
+
setStatusMessage('');
615
618
try {
616
619
const parts = verification.uri.split('/');
617
620
const rkey = parts[parts.length - 1];
···
620
623
collection: 'app.bsky.graph.verification',
621
624
rkey: rkey
622
625
});
623
-
setStatusMessage(`Successfully revoked verification for ${verification.handle}`);
626
+
setRevokeStatusMessage(`Successfully revoked verification for ${verification.handle}`);
624
627
fetchVerifications();
625
628
} catch (error) {
626
629
console.error('Revocation failed:', error);
627
-
setStatusMessage(`Revocation failed: ${error.message || 'Unknown error'}`);
630
+
setRevokeStatusMessage(`Revocation failed: ${error.message || 'Unknown error'}`);
628
631
} finally {
629
632
setIsRevoking(false);
630
633
}
···
775
778
<h2>Accounts You've Verified</h2>
776
779
<button onClick={fetchVerifications} disabled={isAnyOperationInProgress} className="verifier-action-button verifier-refresh-button">Refresh List</button>
777
780
</div>
781
+
782
+
{revokeStatusMessage && (
783
+
<div className={`verifier-status-box ${revokeStatusMessage.includes('failed') ? 'verifier-status-box-error' : 'verifier-status-box-success'}`}>
784
+
<p>{revokeStatusMessage}</p>
785
+
</div>
786
+
)}
787
+
778
788
{isLoadingVerifications ? (<p>Loading...</p>) : verifications.length === 0 ? (<p>You haven't verified any accounts.</p>) : (
779
789
<ul className="verifier-list">
780
790
{verifications.map((verification) => (
···
791
801
</div>
792
802
<div className="verifier-list-item-actions">
793
803
<button onClick={() => handleRevoke(verification)} disabled={isRevoking || isLoadingVerifications} className="verifier-revoke-button">
794
-
{isRevoking ? 'Revoking...' : 'Revoke'}
804
+
{(isRevoking && statusMessage.includes(verification.handle)) ? 'Revoking...' : 'Revoke'}
795
805
</button>
796
806
</div>
797
807
</li>