tdpeuter/open-webui
tdpeuter/open-webui
1
Fork 0
forked from open-webui/open-webui
Code Issues Pull requests 1 Projects 1 Releases 2 Packages 1 Activity Actions

refac: move generateInitialsImage function to utils

Browse source
This commit is contained in:
Danny Liu 2024-04-04 12:09:07 -07:00
parent 4195af4942
commit 0c43897f3d
3 changed files with 25 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/lib/components/chat/Settings/Account.svelte
View file

@ -6,7 +6,7 @@
import { updateUserProfile } from '$lib/apis/auths';
import UpdatePassword from './Account/UpdatePassword.svelte';
import { getGravatarUrl } from '$lib/apis/utils';
import { generateInitialsImage } from '$lib/utils';
import { copyToClipboard } from '$lib/utils';
const i18n = getContext('i18n');
@ -19,28 +19,6 @@
let JWTTokenCopied = false;
let profileImageInputElement: HTMLInputElement;
const generateInitialsImage = (name) => {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
canvas.width = 100;
canvas.height = 100;
ctx.fillStyle = '#F39C12';
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.fillStyle = '#FFFFFF';
ctx.font = '40px Helvetica';
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
const initials = name
.split(' ')
.map((word) => word[0])
.join('');
ctx.fillText(initials.toUpperCase(), canvas.width / 2, canvas.height / 2);
return canvas.toDataURL();
};
const submitHandler = async () => {
const isInitialsImage: boolean =
profileImageUrl === generateInitialsImage($user.name) || profileImageUrl === '';

22
src/lib/utils/index.ts
View file

@ -96,6 +96,28 @@ export const getGravatarURL = (email) => {
return `https://www.gravatar.com/avatar/${hash}`;
};
export const generateInitialsImage = (name) => {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
canvas.width = 100;
canvas.height = 100;
ctx.fillStyle = '#F39C12';
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.fillStyle = '#FFFFFF';
ctx.font = '40px Helvetica';
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
const initials = name
.split(' ')
.map((word) => word[0])
.join('');
ctx.fillText(initials.toUpperCase(), canvas.width / 2, canvas.height / 2);
return canvas.toDataURL();
};
export const copyToClipboard = (text) => {
if (!navigator.clipboard) {
const textArea = document.createElement('textarea');

3
src/routes/auth/+page.svelte
View file

@ -5,6 +5,7 @@
import { WEBUI_NAME, config, user } from '$lib/stores';
import { onMount, getContext } from 'svelte';
import { toast } from 'svelte-sonner';
import { generateInitialsImage } from '$lib/utils';
const i18n = getContext('i18n');
@ -35,7 +36,7 @@
};
const signUpHandler = async () => {
const sessionUser = await userSignUp(name, email, password).catch((error) => {
const sessionUser = await userSignUp(name, email, password, generateInitialsImage(name)).catch((error) => {
toast.error(error);
return null;
});