fixed user problem

Author: caglaryalcin

src/components/auth/auth-gate.tsx

@@ -3,6 +3,7 @@ import { $, component$, Slot, useSignal, useStore, useVisibleTask$ } from "@buil
 import { brand } from "~/brand";
 import BrandLogo from "~/components/furniture/brand-logo";
 import { translate, useI18n, type TranslationKey } from "~/i18n";
+import { sanitizeUsername } from "~/lib/account";
 import {
   getStoredUser,
   saveStoredUser,
@@ -31,7 +32,7 @@ export default component$(() => {
   });
 
   const submit = $(async () => {
-    const username = form.username.trim();
+    const username = sanitizeUsername(form.username);
     const password = form.password;
     const name = form.name.trim() || username;
 
@@ -57,9 +58,12 @@ export default component$(() => {
     }).catch(() => null);
 
     if (!response?.ok) {
-      form.error = mode.value === "register"
-        ? translate(language.value, "auth.registerError")
-        : translate(language.value, "auth.loginError");
+      const result = await response?.json().catch(() => null);
+      form.error = mode.value === "register" && result?.error === "INVALID_INPUT"
+        ? translate(language.value, "auth.usernameError")
+        : mode.value === "register"
+          ? translate(language.value, "auth.registerError")
+          : translate(language.value, "auth.loginError");
       return;
     }
 

src/lib/account.ts

@@ -0,0 +1,9 @@
+export const sanitizeUsername = (username: string | null | undefined) =>
+  (username || "")
+    .trim()
+    .replace(/[ıİ]/g, (character) => (character === "ı" ? "i" : "I"))
+    .normalize("NFKD")
+    .replace(/[\u0300-\u036f]/g, "")
+    .toLowerCase()
+    .replace(/[^a-z0-9_-]/g, "")
+    .slice(0, 32);

src/lib/server/settings-store.ts

@@ -3,6 +3,7 @@ import { pbkdf2, randomBytes, timingSafeEqual } from 'node:crypto';
 import { dirname, resolve } from 'node:path';
 import { promisify } from 'node:util';
 
+import { sanitizeUsername } from '~/lib/account';
 import type { LockstepUser } from '~/lib/user-session';
 
 export type SettingsStore = Record<string, unknown>;
@@ -60,13 +61,6 @@ const makeInitials = (name: string) => {
     .slice(0, 2);
 };
 
-export const sanitizeUsername = (username: string | null | undefined) =>
-  (username || '')
-    .trim()
-    .toLowerCase()
-    .replace(/[^a-z0-9_-]/g, '')
-    .slice(0, 32);
-
 const makeUserProfile = (
   username: string,
   name: string,

src/routes/api/auth/index.ts

@@ -1,9 +1,9 @@
 import type { RequestHandler } from '@builder.io/qwik-city';
 
+import { sanitizeUsername } from '~/lib/account';
 import {
   authenticateUser,
   registerUser,
-  sanitizeUsername,
   updateUserAccount,
 } from '~/lib/server/settings-store';
 
@@ -44,9 +44,21 @@ export const onPost: RequestHandler = async ({ cookie, headers, json, request })
 
     setUserCookie(cookie, user.id);
     json(200, { user });
-  } catch {
-    json(action === 'register' ? 409 : 401, {
-      error: action === 'register' ? 'USER_EXISTS' : 'INVALID_CREDENTIALS',
+  } catch (error) {
+    const message = error instanceof Error ? error.message : '';
+    const registerStatus = message === 'User already exists'
+      ? 409
+      : message === 'Invalid credentials'
+        ? 400
+        : 500;
+    const registerError = message === 'User already exists'
+      ? 'USER_EXISTS'
+      : message === 'Invalid credentials'
+        ? 'INVALID_INPUT'
+        : 'REGISTER_FAILED';
+
+    json(action === 'register' ? registerStatus : 401, {
+      error: action === 'register' ? registerError : 'INVALID_CREDENTIALS',
     });
   }
 };

src/routes/profile/index.tsx

@@ -5,6 +5,7 @@ import { brand } from "~/brand";
 import Icon from "~/components/core/icon";
 import { useLocalStorage } from "~/hooks/useLocalStorage";
 import { translate, useI18n } from "~/i18n";
+import { sanitizeUsername } from "~/lib/account";
 import {
   getSettingsHeaders,
   getStoredUser,
@@ -89,12 +90,18 @@ export default component$(() => {
   const updateAccount = $(async () => {
     accountForm.error = "";
     accountForm.success = "";
+    const username = sanitizeUsername(accountForm.username);
 
     if (!accountForm.currentPassword || accountForm.currentPassword.length < 6) {
       accountForm.error = translate(language.value, "userProfile.currentPasswordError");
       return;
     }
 
+    if (username.length < 3) {
+      accountForm.error = translate(language.value, "auth.usernameError");
+      return;
+    }
+
     if (accountForm.newPassword && accountForm.newPassword.length < 6) {
       accountForm.error = translate(language.value, "auth.passwordError");
       return;
@@ -108,7 +115,7 @@ export default component$(() => {
         currentPassword: accountForm.currentPassword,
         name: accountForm.name,
         newPassword: accountForm.newPassword || undefined,
-        username: accountForm.username,
+        username,
       }),
     }).catch(() => null);