the home of serif.blue
feat: add recheck button
+190
-76
+190
-76
bluesky-community-verifications.user.js
+190
-76
bluesky-community-verifications.user.js
···
41
41
// Store all verifiers for a profile
42
42
let profileVerifiers = [];
43
43
44
+
// Store current profile DID
45
+
let currentProfileDid = null;
46
+
44
47
// Function to check if a trusted user has verified the current profile
45
-
const checkTrustedUserVerifications = async (currentProfileDid) => {
48
+
const checkTrustedUserVerifications = async (profileDid) => {
49
+
currentProfileDid = profileDid; // Store for recheck functionality
46
50
const trustedUsers = getTrustedUsers();
47
51
profileVerifiers = []; // Reset the verifiers list
48
52
···
51
55
return false;
52
56
}
53
57
54
-
console.log(
55
-
`Checking if any trusted users have verified ${currentProfileDid}`,
56
-
);
58
+
console.log(`Checking if any trusted users have verified ${profileDid}`);
57
59
58
60
// Use Promise.all to fetch all verification data in parallel
59
61
const verificationPromises = trustedUsers.map(async (trustedUser) => {
···
66
68
// Check if this trusted user has verified the current profile
67
69
if (data.records && data.records.length > 0) {
68
70
for (const record of data.records) {
69
-
if (record.value && record.value.subject === currentProfileDid) {
71
+
if (record.value && record.value.subject === profileDid) {
70
72
console.log(
71
-
`${currentProfileDid} is verified by trusted user ${trustedUser}`,
73
+
`${profileDid} is verified by trusted user ${trustedUser}`,
72
74
);
73
75
74
76
// Add to verifiers list
···
100
102
return true;
101
103
}
102
104
103
-
console.log(`${currentProfileDid} is not verified by any trusted users`);
105
+
console.log(`${profileDid} is not verified by any trusted users`);
106
+
107
+
// Add recheck button even when no verifications are found
108
+
createPillButtons();
109
+
104
110
return false;
105
111
};
106
112
113
+
// Function to create a pill with recheck and settings buttons
114
+
const createPillButtons = () => {
115
+
// Remove existing buttons if any
116
+
const existingPill = document.getElementById(
117
+
"trusted-users-pill-container",
118
+
);
119
+
if (existingPill) {
120
+
existingPill.remove();
121
+
}
122
+
123
+
// Create pill container
124
+
const pillContainer = document.createElement("div");
125
+
pillContainer.id = "trusted-users-pill-container";
126
+
pillContainer.style.cssText = `
127
+
position: fixed;
128
+
bottom: 20px;
129
+
right: 20px;
130
+
z-index: 10000;
131
+
display: flex;
132
+
border-radius: 20px;
133
+
overflow: hidden;
134
+
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
135
+
`;
136
+
137
+
// Create recheck button (left half of pill)
138
+
const recheckButton = document.createElement("button");
139
+
recheckButton.id = "trusted-users-recheck-button";
140
+
recheckButton.innerHTML = "↻ Recheck";
141
+
recheckButton.style.cssText = `
142
+
padding: 10px 15px;
143
+
background-color: #2D578D;
144
+
color: white;
145
+
border: none;
146
+
cursor: pointer;
147
+
font-weight: bold;
148
+
border-top-left-radius: 20px;
149
+
border-bottom-left-radius: 20px;
150
+
`;
151
+
152
+
// Add click event to recheck
153
+
recheckButton.addEventListener("click", async () => {
154
+
if (currentProfileDid) {
155
+
// Remove any existing badges when rechecking
156
+
const existingBadge = document.getElementById(
157
+
"user-trusted-verification-badge",
158
+
);
159
+
if (existingBadge) {
160
+
existingBadge.remove();
161
+
}
162
+
163
+
// Show loading state
164
+
recheckButton.innerHTML = "⟳ Checking...";
165
+
recheckButton.disabled = true;
166
+
167
+
// Recheck verifications
168
+
await checkTrustedUserVerifications(currentProfileDid);
169
+
170
+
// Reset button
171
+
recheckButton.innerHTML = "↻ Recheck";
172
+
recheckButton.disabled = false;
173
+
}
174
+
});
175
+
176
+
// Create vertical divider
177
+
const divider = document.createElement("div");
178
+
divider.style.cssText = `
179
+
width: 1px;
180
+
background-color: rgba(255, 255, 255, 0.3);
181
+
`;
182
+
183
+
// Create settings button (right half of pill)
184
+
const settingsButton = document.createElement("button");
185
+
settingsButton.id = "bsky-trusted-settings-button";
186
+
settingsButton.textContent = "Settings";
187
+
settingsButton.style.cssText = `
188
+
padding: 10px 15px;
189
+
background-color: #2D578D;
190
+
color: white;
191
+
border: none;
192
+
cursor: pointer;
193
+
font-weight: bold;
194
+
border-top-right-radius: 20px;
195
+
border-bottom-right-radius: 20px;
196
+
`;
197
+
198
+
// Add elements to pill
199
+
pillContainer.appendChild(recheckButton);
200
+
pillContainer.appendChild(divider);
201
+
pillContainer.appendChild(settingsButton);
202
+
203
+
// Add pill to page
204
+
document.body.appendChild(pillContainer);
205
+
206
+
// Add event listener to settings button
207
+
settingsButton.addEventListener("click", () => {
208
+
if (settingsModal) {
209
+
settingsModal.style.display = "flex";
210
+
updateTrustedUsersList();
211
+
} else {
212
+
createSettingsModal();
213
+
}
214
+
});
215
+
};
216
+
217
+
// Legacy function kept for compatibility but redirects to the new implementation
218
+
const addRecheckButton = () => {
219
+
createPillButtons();
220
+
};
221
+
107
222
// Function to display verification badge on the profile
108
223
const displayVerificationBadge = (verifierHandles) => {
109
224
// Find the profile header or name element to add the badge to
···
149
264
nameElement.appendChild(badge);
150
265
}
151
266
}
267
+
268
+
// Also add pill buttons when verification is found
269
+
createPillButtons();
152
270
};
153
271
154
272
// Function to show a popup with all verifiers
···
220
338
});
221
339
};
222
340
223
-
// Create settings UI - only once
224
-
let settingsButton = null;
341
+
// Create settings modal
225
342
let settingsModal = null;
226
343
227
-
// Function to create the settings UI if it doesn't exist yet
228
-
const createSettingsUI = () => {
229
-
// Check if UI already exists
230
-
if (document.getElementById("bsky-trusted-settings-button")) {
344
+
// Function to update the list of trusted users in the UI
345
+
const updateTrustedUsersList = () => {
346
+
const trustedUsersList = document.getElementById("trustedUsersList");
347
+
if (!trustedUsersList) return;
348
+
349
+
const users = getTrustedUsers();
350
+
trustedUsersList.innerHTML = "";
351
+
352
+
if (users.length === 0) {
353
+
trustedUsersList.innerHTML = "<p>No trusted users added yet.</p>";
231
354
return;
232
355
}
233
356
234
-
// Create settings button
235
-
settingsButton = document.createElement("button");
236
-
settingsButton.id = "bsky-trusted-settings-button";
237
-
settingsButton.textContent = "Trusted Users Settings";
238
-
settingsButton.style.cssText = `
239
-
position: fixed;
240
-
bottom: 20px;
241
-
right: 20px;
242
-
z-index: 10000;
243
-
padding: 10px 15px;
244
-
background-color: #2D578D;
245
-
color: white;
246
-
border: none;
247
-
border-radius: 20px;
248
-
cursor: pointer;
249
-
font-weight: bold;
250
-
`;
357
+
for (const user of users) {
358
+
const userItem = document.createElement("div");
359
+
userItem.style.cssText = `
360
+
display: flex;
361
+
justify-content: space-between;
362
+
align-items: center;
363
+
padding: 8px 0;
364
+
border-bottom: 1px solid #eee;
365
+
`;
366
+
367
+
userItem.innerHTML = `
368
+
<span>${user}</span>
369
+
<button class="remove-user" data-handle="${user}" style="background-color: #CE3838; color: white; border: none; border-radius: 4px; padding: 5px 10px; cursor: pointer;">Remove</button>
370
+
`;
371
+
372
+
trustedUsersList.appendChild(userItem);
373
+
}
374
+
375
+
// Add event listeners to remove buttons
376
+
const removeButtons = document.querySelectorAll(".remove-user");
377
+
for (const btn of removeButtons) {
378
+
btn.addEventListener("click", (e) => {
379
+
const handle = e.target.getAttribute("data-handle");
380
+
removeTrustedUser(handle);
381
+
updateTrustedUsersList();
382
+
});
383
+
}
384
+
};
251
385
386
+
// Function to create the settings modal
387
+
const createSettingsModal = () => {
252
388
// Create modal container
253
389
settingsModal = document.createElement("div");
254
390
settingsModal.id = "bsky-trusted-settings-modal";
···
318
454
modalContent.appendChild(closeButton);
319
455
settingsModal.appendChild(modalContent);
320
456
321
-
// Add elements to the document
322
-
document.body.appendChild(settingsButton);
457
+
// Add to document
323
458
document.body.appendChild(settingsModal);
324
459
325
-
// Function to update the list of trusted users in the UI
326
-
const updateTrustedUsersList = () => {
327
-
const users = getTrustedUsers();
328
-
trustedUsersList.innerHTML = "";
329
-
330
-
if (users.length === 0) {
331
-
trustedUsersList.innerHTML = "<p>No trusted users added yet.</p>";
332
-
return;
333
-
}
334
-
335
-
for (const user of users) {
336
-
const userItem = document.createElement("div");
337
-
userItem.style.cssText = `
338
-
display: flex;
339
-
justify-content: space-between;
340
-
align-items: center;
341
-
padding: 8px 0;
342
-
border-bottom: 1px solid #eee;
343
-
`;
344
-
345
-
userItem.innerHTML = `
346
-
<span>${user}</span>
347
-
<button class="remove-user" data-handle="${user}" style="background-color: #CE3838; color: white; border: none; border-radius: 4px; padding: 5px 10px; cursor: pointer;">Remove</button>
348
-
`;
349
-
350
-
trustedUsersList.appendChild(userItem);
351
-
}
352
-
353
-
// Add event listeners to remove buttons
354
-
const removeButtons = document.querySelectorAll(".remove-user");
355
-
for (const btn of removeButtons) {
356
-
btn.addEventListener("click", (e) => {
357
-
const handle = e.target.getAttribute("data-handle");
358
-
removeTrustedUser(handle);
359
-
updateTrustedUsersList();
360
-
});
361
-
}
362
-
};
363
-
364
460
// Event listeners
365
-
settingsButton.addEventListener("click", () => {
366
-
settingsModal.style.display = "flex";
367
-
updateTrustedUsersList();
368
-
});
369
-
370
461
closeButton.addEventListener("click", () => {
371
462
settingsModal.style.display = "none";
372
463
});
373
464
465
+
// Add trusted user button event
374
466
document
375
467
.getElementById("addTrustedUserBtn")
376
468
.addEventListener("click", () => {
···
389
481
settingsModal.style.display = "none";
390
482
}
391
483
});
484
+
485
+
// Initialize the list
486
+
updateTrustedUsersList();
487
+
};
488
+
489
+
// Function to create the settings UI if it doesn't exist yet
490
+
const createSettingsUI = () => {
491
+
// Create pill with buttons
492
+
createPillButtons();
493
+
494
+
// Create the settings modal if it doesn't exist yet
495
+
if (!settingsModal) {
496
+
createSettingsModal();
497
+
}
392
498
};
393
499
394
500
// Function to check the current profile
···
468
574
);
469
575
if (existingBadge) {
470
576
existingBadge.remove();
577
+
}
578
+
579
+
// Remove the pill container when URL changes
580
+
const existingPill = document.getElementById(
581
+
"trusted-users-pill-container",
582
+
);
583
+
if (existingPill) {
584
+
existingPill.remove();
471
585
}
472
586
473
587
// Check if we're on a profile page now