mirror of
https://github.com/SillyTavern/SillyTavern.git
synced 2025-02-02 12:26:59 +01:00
Implement change display name
This commit is contained in:
parent
01a4aa51f7
commit
c92df1168d
@ -52,9 +52,9 @@
|
||||
<div id="passwordEntryBlock" style="display:none;"
|
||||
class="flex-container flexFlowColumn alignItemsCenter">
|
||||
<input id="userPassword" class="text_pole" type="password" placeholder="Password" autocomplete="current-password">
|
||||
<a id="recoverPassword" href="#" onclick="return false;">Forgot password?</a>
|
||||
<div class="flex-container">
|
||||
<div id="loginButton" class="menu_button">Login</div>
|
||||
<div id="recoverPassword" class="menu_button">Recover</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="passwordRecoveryBlock" style="display:none;"
|
||||
|
@ -16,8 +16,8 @@
|
||||
</div>
|
||||
<div class="flex1 flex-container flexFlowColumn flexNoGap justifyLeft">
|
||||
<div class="flex-container flexGap10 alignItemsCenter">
|
||||
<i class="hasPassword fa-solid fa-lock"></i>
|
||||
<i class="noPassword fa-solid fa-lock-open"></i>
|
||||
<i class="hasPassword fa-solid fa-lock" title="This account is password protected."></i>
|
||||
<i class="noPassword fa-solid fa-lock-open" title="This account is not password protected."></i>
|
||||
<h3 class="userName margin0"></h3>
|
||||
<small class="userHandle"> </small>
|
||||
</div>
|
||||
@ -38,7 +38,7 @@
|
||||
</div>
|
||||
<div class="flex-container flexFlowColumn">
|
||||
<div class="flex-container">
|
||||
<div class="userEditButton menu_button disabled">
|
||||
<div class="userChangeNameButton menu_button" title="Change user display name.">
|
||||
<i class="fa-fw fa-solid fa-pencil"></i>
|
||||
</div>
|
||||
<div class="userEnableButton menu_button" title="Enable user account.">
|
||||
|
5
public/scripts/templates/changeName.html
Normal file
5
public/scripts/templates/changeName.html
Normal file
@ -0,0 +1,5 @@
|
||||
<div class="flex-container">
|
||||
<h3>
|
||||
Enter a new display name:
|
||||
</h3>
|
||||
</div>
|
@ -35,8 +35,8 @@
|
||||
</div>
|
||||
<div>
|
||||
<span data-i18n="Password:">Password:</span>
|
||||
<i class="hasPassword fa-fw fa-solid fa-lock"></i>
|
||||
<i class="noPassword fa-fw fa-solid fa-lock-open"></i>
|
||||
<i class="hasPassword fa-fw fa-solid fa-lock" title="This account is password protected."></i>
|
||||
<i class="noPassword fa-fw fa-solid fa-lock-open" title="This account is not password protected."></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -74,7 +74,7 @@
|
||||
<i class="fa-fw fa-solid fa-cog warning"></i>
|
||||
<span data-i18n="Reset Settings">Reset Settings</span>
|
||||
</div>
|
||||
<div class="userResetAllButton menu_button menu_button_icon" title="Wipe all user data and reset your account to factory settings.">
|
||||
<div class="userResetAllButton menu_button menu_button_icon disabled" title="Wipe all user data and reset your account to factory settings.">
|
||||
<i class="fa-fw fa-solid fa-skull warning"></i>
|
||||
<span data-i18n="Reset Everything">Reset Everything</span>
|
||||
</div>
|
||||
|
@ -54,6 +54,10 @@ async function getCurrentUser() {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Get a list of all users.
|
||||
* @returns {Promise<import('../../src/users.js').UserViewModel[]>} Users
|
||||
*/
|
||||
async function getUsers() {
|
||||
try {
|
||||
const response = await fetch('/api/users/get', {
|
||||
@ -394,6 +398,43 @@ async function resetSettings(handle, callback) {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Change a user's display name.
|
||||
* @param {string} handle User handle
|
||||
* @param {string} name Current name
|
||||
* @param {function} callback Success callback
|
||||
*/
|
||||
async function changeName(handle, name, callback) {
|
||||
try {
|
||||
const template = $(renderTemplate('changeName'));
|
||||
const result = await callGenericPopup(template, POPUP_TYPE.INPUT, name, { okButton: 'Change', cancelButton: 'Cancel', wide: false, large: false });
|
||||
|
||||
if (!result) {
|
||||
throw new Error('Change name cancelled');
|
||||
}
|
||||
|
||||
name = String(result);
|
||||
|
||||
const response = await fetch('/api/users/change-name', {
|
||||
method: 'POST',
|
||||
headers: getRequestHeaders(),
|
||||
body: JSON.stringify({ handle, name }),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
const data = await response.json();
|
||||
toastr.error(data.error || 'Unknown error', 'Failed to change name');
|
||||
throw new Error('Failed to change name');
|
||||
}
|
||||
|
||||
toastr.success('Name changed successfully', 'Name Changed');
|
||||
callback();
|
||||
|
||||
} catch (error) {
|
||||
console.error('Error changing name:', error);
|
||||
}
|
||||
}
|
||||
|
||||
async function openUserProfile() {
|
||||
await getCurrentUser();
|
||||
const template = $(renderTemplate('userProfile'));
|
||||
@ -404,6 +445,10 @@ async function openUserProfile() {
|
||||
template.find('.userCreated').text(new Date(currentUser.created).toLocaleString());
|
||||
template.find('.hasPassword').toggle(currentUser.password);
|
||||
template.find('.noPassword').toggle(!currentUser.password);
|
||||
template.find('.userChangeNameButton').on('click', async () => changeName(currentUser.handle, currentUser.name, async () => {
|
||||
await getCurrentUser();
|
||||
template.find('.userName').text(currentUser.name);
|
||||
}));
|
||||
template.find('.userChangePasswordButton').on('click', () => changePassword(currentUser.handle, async () => {
|
||||
await getCurrentUser();
|
||||
template.find('.hasPassword').toggle(currentUser.password);
|
||||
@ -417,7 +462,14 @@ async function openUserProfile() {
|
||||
});
|
||||
template.find('.userResetSettingsButton').on('click', () => resetSettings(currentUser.handle, () => location.reload()));
|
||||
|
||||
callGenericPopup(template, POPUP_TYPE.TEXT, '', { okButton: 'Close', wide: false, large: false, allowVerticalScrolling: true, allowHorizontalScrolling: false });
|
||||
const popupOptions = {
|
||||
okButton: 'Close',
|
||||
wide: false,
|
||||
large: false,
|
||||
allowVerticalScrolling: true,
|
||||
allowHorizontalScrolling: false,
|
||||
};
|
||||
callGenericPopup(template, POPUP_TYPE.TEXT, '', popupOptions);
|
||||
}
|
||||
|
||||
async function openAdminPanel() {
|
||||
@ -440,6 +492,7 @@ async function openAdminPanel() {
|
||||
userBlock.find('.userDemoteButton').toggle(user.admin).on('click', () => demoteUser(user.handle, renderUsers));
|
||||
userBlock.find('.userChangePasswordButton').on('click', () => changePassword(user.handle, renderUsers));
|
||||
userBlock.find('.userDelete').on('click', () => deleteUser(user.handle, renderUsers));
|
||||
userBlock.find('.userChangeNameButton').on('click', async () => changeName(user.handle, user.name, renderUsers));
|
||||
userBlock.find('.userBackupButton').on('click', function () {
|
||||
$(this).addClass('disabled').off('click');
|
||||
backupUserData(user.handle, renderUsers);
|
||||
|
@ -135,6 +135,36 @@ router.post('/reset-settings', jsonParser, async (request, response) => {
|
||||
}
|
||||
});
|
||||
|
||||
router.post('/change-name', jsonParser, async (request, response) => {
|
||||
try {
|
||||
if (!request.body.name || !request.body.handle) {
|
||||
console.log('Change name failed: Missing required fields');
|
||||
return response.status(400).json({ error: 'Missing required fields' });
|
||||
}
|
||||
|
||||
if (request.body.handle !== request.user.profile.handle && !request.user.profile.admin) {
|
||||
console.log('Change name failed: Unauthorized');
|
||||
return response.status(403).json({ error: 'Unauthorized' });
|
||||
}
|
||||
|
||||
/** @type {import('../users').User} */
|
||||
const user = await storage.getItem(toKey(request.body.handle));
|
||||
|
||||
if (!user) {
|
||||
console.log('Change name failed: User not found');
|
||||
return response.status(404).json({ error: 'User not found' });
|
||||
}
|
||||
|
||||
user.name = request.body.name;
|
||||
await storage.setItem(toKey(request.body.handle), user);
|
||||
|
||||
return response.sendStatus(204);
|
||||
} catch (error) {
|
||||
console.error('Change name failed', error);
|
||||
return response.sendStatus(500);
|
||||
}
|
||||
});
|
||||
|
||||
module.exports = {
|
||||
router,
|
||||
};
|
||||
|
@ -49,6 +49,7 @@ const STORAGE_KEYS = {
|
||||
* @property {string} avatar - The user's avatar image
|
||||
* @property {boolean} admin - Whether the user is an admin (can manage other users)
|
||||
* @property {boolean} password - Whether the user is password protected
|
||||
* @property {boolean} [enabled] - Whether the user is enabled
|
||||
* @property {number} [created] - The timestamp when the user was created
|
||||
*/
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user