Move utils to root

frontend/src/pages/auth/LoginPage.tsx

@@ -8,7 +8,7 @@ import { useRef } from "react";
 import type { TextField } from "mdui/components/text-field";
 import { useAppState } from "../chat/ui/state";
 import { MaterialTextField } from "../chat/ui/components/core/TextField";
-import { initialize, isSupported, startElectronReceiver, subscribe } from "../chat/utils/push-notifications";
+import { initialize, isSupported, startElectronReceiver, subscribe } from "../chat/push-notifications";
 import { isElectron } from "../chat/electron/electron";
 import { useNavigate } from "react-router-dom";
 import "./auth.scss";

frontend/src/pages/chat/core/websocket.ts

@@ -7,7 +7,7 @@
 
 import { API_WS_BASE_URL } from "./config";
 import type { WebSocketMessage } from "./types";
-import { delay } from "../utils/utils";
+import { delay } from "../../../utils/utils";
 
 /**
  * Creates a new WebSocket connection to the chat server

frontend/src/pages/chat/push-notifications.ts

@@ -1,7 +1,7 @@
-import { API_BASE_URL } from "../core/config";
-import { isElectron } from "../electron/electron";
-import { websocket } from "../core/websocket";
-import type { NewMessageWebSocketMessage, WebSocketMessage } from "../core/types";
+import { API_BASE_URL } from "./core/config";
+import { isElectron } from "./electron/electron";
+import { websocket } from "./core/websocket";
+import type { NewMessageWebSocketMessage, WebSocketMessage } from "./core/types";
 import serviceWorker from "../../../service-worker?worker&url";
 
 export interface PushSubscriptionData {

frontend/src/pages/chat/ui/components/chat/ChatMessages.tsx

@@ -6,7 +6,7 @@ import { UserProfileDialog } from "./UserProfileDialog";
 import { MessageContextMenu, type ContextMenuState } from "./MessageContextMenu";
 import { fetchUserProfile } from "../../../../../api/profileApi";
 import { useEffect, useState, type ReactNode } from "react";
-import { delay } from "../../../utils/utils";
+import { delay } from "../../../../../utils/utils";
 import { MaterialDialog } from "../core/Dialog";
 import { request } from "../../../core/websocket";
 import type { AddReactionRequest, AddDmReactionRequest } from "../../../core/types";

frontend/src/pages/chat/ui/components/chat/Message.tsx

@@ -1,4 +1,4 @@
-import { formatTime, id } from "../../../utils/utils";
+import { formatTime, id } from "../../../../../utils/utils";
 import type { Attachment, Message as MessageType } from "../../../core/types";
 import defaultAvatar from "../../../../../images/default-avatar.png";
 import Quote from "../core/Quote";
@@ -6,11 +6,11 @@ import { parse } from "marked";
 import DOMPurify from "dompurify";
 import { useEffect, useState, useRef } from "react";
 import { getCurrentKeys } from "../../../../../api/authApi";
-import { ecdhSharedSecret, deriveWrappingKey } from "../../../utils/crypto/asymmetric";
-import { importAesGcmKey, aesGcmDecrypt } from "../../../utils/crypto/symmetric";
+import { ecdhSharedSecret, deriveWrappingKey } from "../../../../../utils/crypto/asymmetric";
+import { importAesGcmKey, aesGcmDecrypt } from "../../../../../utils/crypto/symmetric";
 import { getAuthHeaders } from "../../../../../api/authApi";
 import { useAppState } from "../../state";
-import { ub64 } from "../../../utils/utils";
+import { ub64 } from "../../../../../utils/utils";
 import { useImmer } from "use-immer";
 import { createPortal } from "react-dom";
 import { MessageReactions } from "./MessageReactions";

frontend/src/pages/chat/ui/components/chat/UserProfileDialog.tsx

@@ -1,7 +1,7 @@
 import type { DialogProps } from "../../../core/types";
 import type { UserProfile } from "../../../core/types";
 import { MaterialDialog } from "../core/Dialog";
-import { formatTime } from "../../../utils/utils";
+import { formatTime } from "../../../../../utils/utils";
 import defaultAvatar from "../../../../../images/default-avatar.png";
 
 interface UserProfileDialogProps extends DialogProps {

frontend/src/pages/chat/ui/components/core/Dialog.tsx

@@ -1,7 +1,7 @@
 import type { Dialog as MduiDialog } from "mdui/components/dialog";
 import { useEffect, type Ref } from "react"
 import { createPortal } from "react-dom";
-import { id } from "../../../utils/utils";
+import { id } from "../../../../../utils/utils";
 import useCombinedRefs from "../../hooks/useCombinedRefs";
 
 export interface BaseDialogProps {

frontend/src/pages/chat/ui/components/settings/SettingsDialog.tsx

@@ -2,7 +2,7 @@ import { useState, useEffect } from "react";
 import { PRODUCT_NAME, API_BASE_URL } from "../../../core/config";
 import type { DialogProps } from "../../../core/types";
 import { MaterialDialog } from "../core/Dialog";
-import { initialize, isSupported, startElectronReceiver, stopElectronReceiver, subscribe, unsubscribe } from "../../../utils/push-notifications";
+import { initialize, isSupported, startElectronReceiver, stopElectronReceiver, subscribe, unsubscribe } from "../../../push-notifications";
 import { isElectron } from "../../../electron/electron";
 import { useAppState } from "../../state";
 import type { Switch } from "mdui/components/switch";

frontend/src/pages/chat/ui/hooks/useProfile.ts

@@ -1,7 +1,7 @@
 import { useState, useCallback, useEffect } from "react";
 import { useAppState } from "../state";
 import { loadProfile, updateProfile, uploadProfilePicture, type ProfileData } from "../../../../api/profileApi";
-import { showSuccess, showError } from "../../utils/notification";
+import { showSuccess, showError } from "../../../../utils/notification";
 
 export default function useProfile() {
     const { user } = useAppState();

frontend/src/pages/chat/ui/screen/LoginScreen.tsx

@@ -9,7 +9,7 @@ import type { TextField } from "mdui/components/text-field";
 import { useAppState } from "../state";
 import { useNavigate } from "react-router-dom";
 import { MaterialTextField } from "../components/core/TextField";
-import { initialize, isSupported, startElectronReceiver, subscribe } from "../../utils/push-notifications";
+import { initialize, isSupported, startElectronReceiver, subscribe } from "../../push-notifications";
 import { isElectron } from "../../electron/electron";
 
 export default function LoginScreen() {

frontend/src/pages/chat/ui/state.ts

@@ -7,7 +7,7 @@ import { DMPanel, type DMPanelData } from "./panels/DMPanel";
 import { getAuthHeaders } from "../../../api/authApi";
 import { restoreKeys } from "../../../api/authApi";
 import { API_BASE_URL } from "../core/config";
-import { initialize, subscribe, startElectronReceiver, isSupported } from "../utils/push-notifications";
+import { initialize, subscribe, startElectronReceiver, isSupported } from "../push-notifications";
 import { isElectron } from "../electron/electron";
 
 export type ChatTabs = "chats" | "channels" | "contacts" | "dms"

frontend/src/pages/chat/utils/crypto/asymmetric.ts

@@ -1,23 +0,0 @@
-import nacl from "tweetnacl";
-import { hkdfExtractAndExpand } from "./kdf";
-
-export interface X25519KeyPair {
-	publicKey: Uint8Array;
-	privateKey: Uint8Array;
-}
-
-export type KeyPair = X25519KeyPair;
-
-export function generateX25519KeyPair(): X25519KeyPair {
-	const kp = nacl.box.keyPair();
-	return { publicKey: kp.publicKey, privateKey: kp.secretKey };
-}
-
-export function ecdhSharedSecret(myPrivateKey: Uint8Array, theirPublicKey: Uint8Array): Uint8Array {
-	// nacl.box.before returns shared key (Curve25519, XSalsa20-Poly1305 context). We use it as IKM into HKDF.
-	return nacl.box.before(theirPublicKey, myPrivateKey);
-}
-
-export async function deriveWrappingKey(sharedSecret: Uint8Array, salt: Uint8Array, info: Uint8Array): Promise<Uint8Array> {
-	return hkdfExtractAndExpand(sharedSecret.buffer as ArrayBuffer, salt, info, 32);
-}

frontend/src/pages/chat/utils/crypto/backup.ts

@@ -1,68 +0,0 @@
-import { aesGcmDecrypt, aesGcmEncrypt } from "./symmetric";
-import { importPassword, deriveKEK, randomBytes } from "./kdf";
-
-export interface PrivateKeyBundle {
-	version: 1;
-	privateKey: Uint8Array; // X25519 private key
-}
-
-export interface EncryptedBackupBlob {
-	salt: Uint8Array; // for PBKDF2 derivation of KEK
-	iv: Uint8Array; // AES-GCM IV
-	ciphertext: Uint8Array; // encrypted serialized PrivateKeyBundle
-}
-
-export function serializeBundle(bundle: PrivateKeyBundle): Uint8Array {
-	const header = new Uint8Array([bundle.version]);
-	const len = new Uint8Array(new Uint32Array([bundle.privateKey.length]).buffer);
-	const out = new Uint8Array(1 + 4 + bundle.privateKey.length);
-	out.set(header, 0);
-	out.set(len, 1);
-	out.set(bundle.privateKey, 5);
-	return out;
-}
-
-export function deserializeBundle(data: Uint8Array): PrivateKeyBundle {
-	const version = data[0] as 1;
-	const len = new Uint32Array(data.slice(1, 5).buffer)[0];
-	const pk = data.slice(5, 5 + len);
-	return { version, privateKey: pk };
-}
-
-export async function encryptBackupWithPassword(password: string, bundle: PrivateKeyBundle): Promise<EncryptedBackupBlob> {
-	const salt = randomBytes(16);
-	const pw = await importPassword(password);
-	const kek = await deriveKEK(pw, salt);
-	const serialized = serializeBundle(bundle);
-	const { iv, ciphertext } = await aesGcmEncrypt(kek, serialized);
-	return { salt, iv, ciphertext };
-}
-
-export async function decryptBackupWithPassword(password: string, blob: EncryptedBackupBlob): Promise<PrivateKeyBundle> {
-	const pw = await importPassword(password);
-	const kek = await deriveKEK(pw, blob.salt);
-	const plaintext = await aesGcmDecrypt(kek, blob.iv, blob.ciphertext);
-	return deserializeBundle(plaintext);
-}
-
-export function encodeBlob(blob: EncryptedBackupBlob): string {
-	function b64(a: Uint8Array) { return btoa(String.fromCharCode(...a)); }
-	return JSON.stringify({
-		salt: b64(blob.salt),
-		iv: b64(blob.iv),
-		ciphertext: b64(blob.ciphertext)
-	});
-}
-
-export function decodeBlob(json: string): EncryptedBackupBlob {
-	function ub64(s: string) {
-		const bin = atob(s);
-		const arr = new Uint8Array(bin.length);
-		for (let i = 0; i < bin.length; i++) arr[i] = bin.charCodeAt(i);
-		return arr;
-	}
-	const obj = JSON.parse(json);
-	return { salt: ub64(obj.salt), iv: ub64(obj.iv), ciphertext: ub64(obj.ciphertext) };
-}
-
-

frontend/src/pages/chat/utils/crypto/kdf.ts

@@ -1,31 +0,0 @@
-export async function importPassword(password: string): Promise<CryptoKey> {
-	const enc = new TextEncoder();
-	return crypto.subtle.importKey("raw", enc.encode(password), "PBKDF2", false, ["deriveKey", "deriveBits"]);
-}
-
-export async function deriveKEK(passwordKey: CryptoKey, salt: Uint8Array | ArrayBuffer, iterations = 210_000): Promise<CryptoKey> {
-	const saltBuffer = salt instanceof Uint8Array ? salt.buffer as ArrayBuffer : salt;
-	return crypto.subtle.deriveKey(
-		{ name: "PBKDF2", salt: saltBuffer, iterations, hash: "SHA-256" },
-		passwordKey,
-		{ name: "AES-GCM", length: 256 },
-		false,
-		["encrypt", "decrypt"]
-	);
-}
-
-export async function hkdfExtractAndExpand(inputKeyMaterial: Uint8Array | ArrayBuffer, salt: Uint8Array | ArrayBuffer, info: Uint8Array | ArrayBuffer, length = 32): Promise<Uint8Array> {
-	const inputBuffer = inputKeyMaterial instanceof Uint8Array ? inputKeyMaterial.buffer as ArrayBuffer : inputKeyMaterial;
-	const saltBuffer = salt instanceof Uint8Array ? salt.buffer as ArrayBuffer : salt;
-	const infoBuffer = info instanceof Uint8Array ? info.buffer as ArrayBuffer : info;
-	
-	const ikmKey = await crypto.subtle.importKey("raw", inputBuffer, { name: "HKDF" }, false, ["deriveBits"]);
-	const bits = await crypto.subtle.deriveBits({ name: "HKDF", hash: "SHA-256", salt: saltBuffer, info: infoBuffer }, ikmKey, length * 8);
-	return new Uint8Array(bits);
-}
-
-export function randomBytes(length: number): Uint8Array {
-	const out = new Uint8Array(length);
-	crypto.getRandomValues(out);
-	return out;
-}

frontend/src/pages/chat/utils/crypto/symmetric.ts

@@ -1,31 +0,0 @@
-export interface AesGcmCiphertext {
-	iv: Uint8Array;
-	ciphertext: Uint8Array;
-}
-
-export async function aesGcmEncrypt(key: CryptoKey, plaintext: Uint8Array | ArrayBuffer): Promise<AesGcmCiphertext> {
-	const iv = crypto.getRandomValues(new Uint8Array(12));
-	const plaintextBuffer = plaintext instanceof Uint8Array ? plaintext.buffer as ArrayBuffer : plaintext;
-	const ct = await crypto.subtle.encrypt({ name: "AES-GCM", iv }, key, plaintextBuffer);
-	return { iv, ciphertext: new Uint8Array(ct) };
-}
-
-export async function aesGcmDecrypt(key: CryptoKey, iv: Uint8Array | ArrayBuffer, ciphertext: Uint8Array | ArrayBuffer): Promise<Uint8Array> {
-	// Normalize IV to ArrayBuffer (12 bytes for AES-GCM)
-	const ivBuf: ArrayBuffer = iv instanceof Uint8Array
-		? (iv.buffer as ArrayBuffer).slice(iv.byteOffset, iv.byteOffset + iv.byteLength)
-		: (iv as ArrayBuffer);
-
-	// Normalize ciphertext to a contiguous ArrayBuffer slice
-	const ctBuf: ArrayBuffer = ciphertext instanceof Uint8Array
-		? (ciphertext.buffer as ArrayBuffer).slice(ciphertext.byteOffset, ciphertext.byteOffset + ciphertext.byteLength)
-		: (ciphertext as ArrayBuffer);
-
-	const pt = await crypto.subtle.decrypt({ name: "AES-GCM", iv: ivBuf }, key, ctBuf);
-	return new Uint8Array(pt as ArrayBuffer);
-}
-
-export async function importAesGcmKey(rawKey: Uint8Array | ArrayBuffer): Promise<CryptoKey> {
-	const keyBuffer = rawKey instanceof Uint8Array ? rawKey.buffer as ArrayBuffer : rawKey;
-	return crypto.subtle.importKey("raw", keyBuffer, { name: "AES-GCM" }, false, ["encrypt", "decrypt"]);
-}

frontend/src/pages/chat/utils/material.ts

@@ -1,27 +0,0 @@
-/**
- * @fileoverview MDUI component imports and configuration
- * @description Imports all required MDUI components and sets up the theme
- * @author Cursor
- * @version 1.0.0
- */
-
-import 'mdui/components/tabs';
-import 'mdui/components/tab';
-import 'mdui/components/tab-panel';
-import 'mdui/components/list';
-import 'mdui/components/list-item';
-import 'mdui/components/bottom-app-bar';
-import 'mdui/components/button-icon';
-import 'mdui/components/fab';
-import 'mdui/components/dialog';
-import 'mdui/components/button';
-import 'mdui/components/text-field';
-import 'mdui/components/button-icon';
-import 'mdui/components/top-app-bar';
-import 'mdui/components/top-app-bar-title';
-import 'mdui/components/switch';
-import 'mdui/components/chip';
-
-import { setColorScheme } from 'mdui/functions/setColorScheme.js';
-
-setColorScheme("#91cef4");

frontend/src/pages/chat/utils/notification.ts

@@ -1,62 +0,0 @@
-/**
- * @fileoverview User notification system
- * @description Provides toast-style notifications for user feedback
- * @author Cursor
- * @version 1.0.0
- */
-
-/**
- * Notification type enumeration
- * @typedef {'success' | 'error'} NotificationType
- */
-export type NotificationType = 'success' | 'error';
-
-/**
- * Shows a notification with the specified message and type
- * @param {string} message - The message to display
- * @param {NotificationType} type - The type of notification (success or error)
- * @private
- */
-function showNotification(message: string, type: NotificationType): void {
-    const notification = document.createElement('div');
-    notification.textContent = message;
-    notification.style.cssText = `
-        position: fixed;
-        top: 20px;
-        right: 20px;
-        padding: 12px 16px;
-        border-radius: 4px;
-        color: white;
-        background: ${type === 'success' ? '#4caf50' : '#f44336'};
-        z-index: 10000;
-        font-family: inherit;
-        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
-        transition: opacity 0.3s ease;
-    `;
-    
-    document.body.appendChild(notification);
-    
-    // Fade out and remove
-    setTimeout(() => {
-        notification.style.opacity = '0';
-        setTimeout(() => {
-            notification.remove();
-        }, 300);
-    }, 3000);
-}
-
-/**
- * Shows a success notification
- * @param {string} message - The success message to display
- */
-export function showSuccess(message: string): void {
-    showNotification(message, 'success');
-}
-
-/**
- * Shows an error notification
- * @param {string} message - The error message to display
- */
-export function showError(message: string): void {
-    showNotification(message, 'error');
-}

frontend/src/pages/chat/utils/utils.ts

@@ -1,46 +0,0 @@
-/**
- * @fileoverview Utility functions used throughout the application
- * @description Contains helper functions for common operations
- * @author Cursor
- * @version 1.0.0
- */
-
-/**
- * Formats a timestamp string to HH:MM format
- * @param {string} dateString - ISO timestamp string to format
- * @returns {string} Formatted time string in HH:MM format
- * @example
- * formatTime('2024-01-15T14:30:00Z'); // Returns "14:30"
- */
-export function formatTime(dateString: string): string {
-    const date = new Date(dateString);
-    let hours = date.getHours();
-    let minutes = date.getMinutes();
-    const hoursString = hours < 10 ? '0' + hours : hours;
-    const minutesString = minutes < 10 ? '0' + minutes : minutes;
-    return hoursString + ':' + minutesString;
-}
-
-/**
- * Creates a promise that resolves after a specified delay
- * @param {number} ms - Delay time in milliseconds
- * @returns {Promise<void>} Promise that resolves after the delay
- * @example
- * await delay(1000); // Wait for 1 second
- */
-export function delay(ms: number): Promise<void> {
-    return new Promise(resolve => setTimeout(resolve, ms));
-}
-
-
-export function b64(a: Uint8Array): string { return btoa(String.fromCharCode(...a)); }
-export function ub64(s: string): Uint8Array {
-	const bin = atob(s);
-	const arr = new Uint8Array(bin.length);
-	for (let i = 0; i < bin.length; i++) arr[i] = bin.charCodeAt(i);
-	return arr;
-}
-
-export function id<T extends Element = HTMLElement>(id: string): T {
-    return document.getElementById(id) as unknown as T
-}