Imrpove chat with gifs, videos, music player, redesigns and improved filesharing errors

server/src/config/variables.ts

@@ -0,0 +1,72 @@
+import fs from 'fs';
+import path from 'path';
+
+export interface ServerVariablesConfig {
+  klipyApiKey: string;
+}
+
+const DATA_DIR = path.join(process.cwd(), 'data');
+const VARIABLES_FILE = path.join(DATA_DIR, 'variables.json');
+
+function normalizeKlipyApiKey(value: unknown): string {
+  return typeof value === 'string' ? value.trim() : '';
+}
+
+function readRawVariables(): { rawContents: string; parsed: Record<string, unknown> } {
+  if (!fs.existsSync(VARIABLES_FILE)) {
+    return { rawContents: '', parsed: {} };
+  }
+
+  const rawContents = fs.readFileSync(VARIABLES_FILE, 'utf8');
+
+  if (!rawContents.trim()) {
+    return { rawContents, parsed: {} };
+  }
+
+  try {
+    const parsed = JSON.parse(rawContents) as unknown;
+
+    if (parsed && typeof parsed === 'object' && !Array.isArray(parsed)) {
+      return { rawContents, parsed: parsed as Record<string, unknown> };
+    }
+  } catch (error) {
+    console.warn('[Config] Failed to parse variables.json. Recreating it with defaults.', error);
+  }
+
+  return { rawContents, parsed: {} };
+}
+
+export function getVariablesConfigPath(): string {
+  return VARIABLES_FILE;
+}
+
+export function ensureVariablesConfig(): ServerVariablesConfig {
+  if (!fs.existsSync(DATA_DIR)) {
+    fs.mkdirSync(DATA_DIR, { recursive: true });
+  }
+
+  const { rawContents, parsed } = readRawVariables();
+  const normalized = {
+    ...parsed,
+    klipyApiKey: normalizeKlipyApiKey(parsed.klipyApiKey)
+  };
+  const nextContents = JSON.stringify(normalized, null, 2) + '\n';
+
+  if (!fs.existsSync(VARIABLES_FILE) || rawContents !== nextContents) {
+    fs.writeFileSync(VARIABLES_FILE, nextContents, 'utf8');
+  }
+
+  return { klipyApiKey: normalized.klipyApiKey };
+}
+
+export function getVariablesConfig(): ServerVariablesConfig {
+  return ensureVariablesConfig();
+}
+
+export function getKlipyApiKey(): string {
+  return getVariablesConfig().klipyApiKey;
+}
+
+export function hasKlipyApiKey(): boolean {
+  return getKlipyApiKey().length > 0;
+}

server/src/db/database.ts

@@ -32,11 +32,12 @@ export async function initDatabase(): Promise<void> {
   applicationDataSource = new DataSource({
     type: 'sqljs',
     database,
-    entities: [AuthUserEntity, ServerEntity, JoinRequestEntity],
-    migrations: [
-      path.join(__dirname, '..', 'migrations', '*.js'),
-      path.join(__dirname, '..', 'migrations', '*.ts')
+    entities: [
+      AuthUserEntity,
+      ServerEntity,
+      JoinRequestEntity
     ],
+    migrations: [path.join(__dirname, '..', 'migrations', '*.js'), path.join(__dirname, '..', 'migrations', '*.ts')],
     synchronize: false,
     logging: false,
     autoSave: true,

server/src/index.ts

@@ -11,6 +11,11 @@ dotenv.config({ path: path.resolve(__dirname, '..', '..', '.env') });
 import { initDatabase } from './db';
 import { deleteStaleJoinRequests } from './cqrs';
 import { createApp } from './app';
+import {
+  ensureVariablesConfig,
+  getVariablesConfigPath,
+  hasKlipyApiKey
+} from './config/variables';
 import { setupWebSocket } from './websocket';
 
 const USE_SSL = (process.env.SSL ?? 'false').toLowerCase() === 'true';
@@ -38,6 +43,13 @@ function buildServer(app: ReturnType<typeof createApp>) {
 }
 
 async function bootstrap(): Promise<void> {
+  ensureVariablesConfig();
+  console.log('[Config] Variables loaded from:', getVariablesConfigPath());
+
+  if (!hasKlipyApiKey()) {
+    console.log('[KLIPY] API key not configured. GIF search is disabled.');
+  }
+
   await initDatabase();
 
   const app = createApp();

server/src/routes/index.ts

@@ -1,5 +1,6 @@
 import { Express } from 'express';
 import healthRouter from './health';
+import klipyRouter from './klipy';
 import proxyRouter from './proxy';
 import usersRouter from './users';
 import serversRouter from './servers';
@@ -7,6 +8,7 @@ import joinRequestsRouter from './join-requests';
 
 export function registerRoutes(app: Express): void {
   app.use('/api', healthRouter);
+  app.use('/api', klipyRouter);
   app.use('/api', proxyRouter);
   app.use('/api/users', usersRouter);
   app.use('/api/servers', serversRouter);

server/src/routes/klipy.ts

@@ -0,0 +1,221 @@
+/* eslint-disable complexity, @typescript-eslint/no-explicit-any */
+import { Router } from 'express';
+import { getKlipyApiKey, hasKlipyApiKey } from '../config/variables';
+
+const router = Router();
+const KLIPY_API_BASE_URL = 'https://api.klipy.com/api/v1';
+const REQUEST_TIMEOUT_MS = 8000;
+const DEFAULT_PAGE = 1;
+const DEFAULT_PER_PAGE = 24;
+const MAX_PER_PAGE = 50;
+
+interface NormalizedMediaMeta {
+  url: string;
+  width?: number;
+  height?: number;
+}
+
+interface NormalizedKlipyGif {
+  id: string;
+  slug: string;
+  title?: string;
+  url: string;
+  previewUrl: string;
+  width: number;
+  height: number;
+}
+
+function pickFirst<T>(...values: (T | null | undefined)[]): T | undefined {
+  for (const value of values) {
+    if (value != null)
+      return value;
+  }
+
+  return undefined;
+}
+
+function sanitizeString(value: unknown): string | undefined {
+  if (typeof value !== 'string')
+    return undefined;
+
+  const trimmed = value.trim();
+
+  return trimmed || undefined;
+}
+
+function toPositiveNumber(value: unknown): number | undefined {
+  const parsed = Number(value);
+
+  return Number.isFinite(parsed) && parsed > 0 ? parsed : undefined;
+}
+
+function clampPositiveInt(value: unknown, fallback: number, max = Number.MAX_SAFE_INTEGER): number {
+  const parsed = Number(value);
+
+  if (!Number.isFinite(parsed) || parsed < 1)
+    return fallback;
+
+  return Math.min(Math.floor(parsed), max);
+}
+
+function normalizeMediaMeta(candidate: unknown): NormalizedMediaMeta | null {
+  if (!candidate)
+    return null;
+
+  if (typeof candidate === 'string') {
+    return { url: candidate };
+  }
+
+  if (typeof candidate === 'object' && candidate !== null) {
+    const url = sanitizeString((candidate as { url?: unknown }).url);
+
+    if (!url)
+      return null;
+
+    return {
+      url,
+      width: toPositiveNumber((candidate as { width?: unknown }).width),
+      height: toPositiveNumber((candidate as { height?: unknown }).height)
+    };
+  }
+
+  return null;
+}
+
+function pickGifMeta(sizeVariant: unknown): NormalizedMediaMeta | null {
+  const candidate = sizeVariant as {
+    gif?: unknown;
+    webp?: unknown;
+  } | undefined;
+
+  return normalizeMediaMeta(candidate?.gif) ?? normalizeMediaMeta(candidate?.webp);
+}
+
+function normalizeGifItem(item: any): NormalizedKlipyGif | null {
+  if (!item || typeof item !== 'object' || item.type === 'ad')
+    return null;
+
+  const lowVariant = pickFirst(item.file?.md, item.file?.sm, item.file?.xs, item.file?.hd);
+  const highVariant = pickFirst(item.file?.hd, item.file?.md, item.file?.sm, item.file?.xs);
+  const lowMeta = pickGifMeta(lowVariant);
+  const highMeta = pickGifMeta(highVariant);
+  const selectedMeta = highMeta ?? lowMeta;
+  const slug = sanitizeString(item.slug) ?? sanitizeString(item.id);
+
+  if (!slug || !selectedMeta?.url)
+    return null;
+
+  return {
+    id: slug,
+    slug,
+    title: sanitizeString(item.title),
+    url: selectedMeta.url,
+    previewUrl: lowMeta?.url ?? selectedMeta.url,
+    width: selectedMeta.width ?? lowMeta?.width ?? 0,
+    height: selectedMeta.height ?? lowMeta?.height ?? 0
+  };
+}
+
+function extractErrorMessage(payload: unknown): string | null {
+  if (!payload)
+    return null;
+
+  if (typeof payload === 'string')
+    return payload.slice(0, 240);
+
+  if (typeof payload === 'object' && payload !== null) {
+    const data = payload as { error?: unknown; message?: unknown };
+
+    if (typeof data.error === 'string')
+      return data.error;
+
+    if (typeof data.message === 'string')
+      return data.message;
+  }
+
+  return null;
+}
+
+router.get('/klipy/config', (_req, res) => {
+  res.json({ enabled: hasKlipyApiKey() });
+});
+
+router.get('/klipy/gifs', async (req, res) => {
+  if (!hasKlipyApiKey()) {
+    return res.status(503).json({ error: 'KLIPY is not configured on this server.' });
+  }
+
+  try {
+    const query = sanitizeString(req.query.q) ?? '';
+    const page = clampPositiveInt(req.query.page, DEFAULT_PAGE);
+    const perPage = clampPositiveInt(req.query.per_page, DEFAULT_PER_PAGE, MAX_PER_PAGE);
+    const customerId = sanitizeString(req.query.customer_id);
+    const locale = sanitizeString(req.query.locale);
+    const params = new URLSearchParams({
+      page: String(page),
+      per_page: String(perPage)
+    });
+
+    if (query)
+      params.set('q', query);
+
+    if (customerId)
+      params.set('customer_id', customerId);
+
+    if (locale)
+      params.set('locale', locale);
+
+    const endpoint = query ? 'search' : 'trending';
+    const controller = new AbortController();
+    const timeout = setTimeout(() => controller.abort(), REQUEST_TIMEOUT_MS);
+    const response = await fetch(
+      `${KLIPY_API_BASE_URL}/${encodeURIComponent(getKlipyApiKey())}/gifs/${endpoint}?${params.toString()}`,
+      {
+        headers: { accept: 'application/json' },
+        signal: controller.signal
+      }
+    );
+
+    clearTimeout(timeout);
+
+    const text = await response.text();
+
+    let payload: unknown = null;
+
+    if (text) {
+      try {
+        payload = JSON.parse(text) as unknown;
+      } catch {
+        payload = text;
+      }
+    }
+
+    if (!response.ok) {
+      return res.status(response.status).json({
+        error: extractErrorMessage(payload) || 'Failed to fetch GIFs from KLIPY.'
+      });
+    }
+
+    const rawItems = Array.isArray((payload as any)?.data?.data)
+      ? (payload as any).data.data
+      : [];
+    const results = rawItems
+      .map((item: unknown) => normalizeGifItem(item))
+      .filter((item: NormalizedKlipyGif | null): item is NormalizedKlipyGif => !!item);
+
+    res.json({
+      enabled: true,
+      results,
+      hasNext: (payload as any)?.data?.has_next === true
+    });
+  } catch (error) {
+    if ((error as { name?: string })?.name === 'AbortError') {
+      return res.status(504).json({ error: 'KLIPY request timed out.' });
+    }
+
+    console.error('KLIPY GIF route error:', error);
+    res.status(502).json({ error: 'Failed to fetch GIFs from KLIPY.' });
+  }
+});
+
+export default router;

server/src/routes/servers.ts

@@ -66,13 +66,14 @@ router.post('/', async (req, res) => {
 
 router.put('/:id', async (req, res) => {
   const { id } = req.params;
-  const { ownerId, ...updates } = req.body;
+  const { currentOwnerId, ...updates } = req.body;
   const existing = await getServerById(id);
+  const authenticatedOwnerId = currentOwnerId ?? req.body.ownerId;
 
   if (!existing)
     return res.status(404).json({ error: 'Server not found' });
 
-  if (existing.ownerId !== ownerId)
+  if (existing.ownerId !== authenticatedOwnerId)
     return res.status(403).json({ error: 'Not authorized' });
 
   const server: ServerPayload = { ...existing, ...updates, lastSeen: Date.now() };