vincent/gerbeur
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v3: added emoji picker, various bug and layout fixes

Browse Source
This commit is contained in:
khannurien
2026-03-22 20:24:29 +00:00
parent a104113e05
commit c5051e3485
24 changed files with 384 additions and 177 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
api/main.ts
View File

@@ -16,6 +16,8 @@ import invitesRouter from "./routes/invites.ts";
import { BASE_URL, HOSTNAME, PORT } from "./config.ts";
import { errorMiddleware } from "./middleware/error.ts";
import routeStaticFilesFrom from "./lib/static.ts";
import { DUMPS_DIR, UPLOADS_DIR } from "./utils/upload.ts";
import { UUID_RE } from "./lib/slugify.ts";
const app = new Application();
@@ -80,7 +82,21 @@ app.addEventListener(
(e) => console.log(`Uncaught error: ${e.message}`),
);
// Migrate dump files from uploads root to uploads/dumps subfolder
async function migrateDumpFiles() {
await Deno.mkdir(DUMPS_DIR, { recursive: true });
for await (const entry of Deno.readDir(UPLOADS_DIR)) {
if (entry.isFile && UUID_RE.test(entry.name)) {
await Deno.rename(
`${UPLOADS_DIR}/${entry.name}`,
`${DUMPS_DIR}/${entry.name}`,
).catch(() => {});
}
}
}
if (import.meta.main) {
await migrateDumpFiles();
await app.listen({ hostname: HOSTNAME, port: PORT });
}

31
api/model/db.ts
View File

@@ -8,41 +8,10 @@ import {
type RichContent,
type User,
} from "./interfaces.ts";
import { makeSlug } from "../lib/slugify.ts";
export const db = new DatabaseSync("api/sql/gerbeur.db");
db.exec("PRAGMA foreign_keys = ON;");
// Add columns to existing tables if missing (idempotent migrations)
for (
const [table, col, def] of [
["dumps", "updated_at", "TEXT"],
["users", "updated_at", "TEXT"],
["playlists", "updated_at", "TEXT"],
["comments", "updated_at", "TEXT"],
["dumps", "slug", "TEXT"],
["playlists", "slug", "TEXT"],
] as [string, string, string][]
) {
const cols = db.prepare(`PRAGMA table_info(${table})`).all() as {
name: string;
}[];
if (!cols.some((c) => c.name === col)) {
db.exec(`ALTER TABLE ${table} ADD COLUMN ${col} ${def};`);
}
}
// Backfill slugs for any records created before this migration
for (const table of ["dumps", "playlists"] as const) {
const rows = db.prepare(
`SELECT id, title FROM ${table} WHERE slug IS NULL;`,
).all() as { id: string; title: string }[];
const update = db.prepare(`UPDATE ${table} SET slug = ? WHERE id = ?;`);
for (const row of rows) {
update.run(makeSlug(row.title, row.id), row.id);
}
}
// Purge expired unused invites on startup
db.prepare(
`DELETE FROM invites WHERE used_at IS NULL AND created_at < datetime('now', '-7 days');`,

1
api/model/interfaces.ts
View File

@@ -363,6 +363,7 @@ export interface OnlineUser {
userId: string;
username: string;
hasAvatar: boolean;
avatarVersion?: number;
}
export interface WelcomeMessage {

67
api/routes/avatars.ts
View File

@@ -3,35 +3,12 @@ import { authMiddleware } from "../middleware/auth.ts";
import { getUserById, updateUserAvatar } from "../services/user-service.ts";
import { updateClientAvatar } from "../services/ws-service.ts";
import { APIErrorCode, APIException } from "../model/interfaces.ts";
const AVATARS_DIR = "api/uploads/avatars";
const MAX_AVATAR_SIZE = 5 * 1024 * 1024; // 5 MB
const ALLOWED_AVATAR_MIMES = new Set([
"image/jpeg",
"image/png",
"image/gif",
"image/webp",
]);
// Magic bytes for image validation
const MAGIC: Array<{ mime: string; bytes: number[]; offset?: number }> = [
{ mime: "image/jpeg", bytes: [0xFF, 0xD8, 0xFF] },
{ mime: "image/png", bytes: [0x89, 0x50, 0x4E, 0x47] },
{ mime: "image/gif", bytes: [0x47, 0x49, 0x46, 0x38] },
{ mime: "image/webp", bytes: [0x52, 0x49, 0x46, 0x46], offset: 0 }, // RIFF
];
function checkMagicBytes(data: Uint8Array, mime: string): boolean {
if (mime === "image/webp") {
// RIFF....WEBP
return data[0] === 0x52 && data[1] === 0x49 && data[2] === 0x46 &&
data[3] === 0x46 && data[8] === 0x57 && data[9] === 0x45 &&
data[10] === 0x42 && data[11] === 0x50;
}
const entry = MAGIC.find((m) => m.mime === mime);
if (!entry) return false;
return entry.bytes.every((b, i) => data[i] === b);
}
import {
AVATARS_DIR,
detectImageMime,
MAX_IMAGE_SIZE,
serveUploadedFile,
} from "../utils/upload.ts";
const router = new Router();
@@ -53,15 +30,7 @@ router.post("/api/avatars/me", authMiddleware, async (ctx) => {
throw new APIException(APIErrorCode.BAD_REQUEST, 400, "Missing file field");
}
if (!ALLOWED_AVATAR_MIMES.has(file.type)) {
throw new APIException(
APIErrorCode.BAD_REQUEST,
400,
"Only JPEG, PNG, GIF, WebP images are allowed",
);
}
if (file.size > MAX_AVATAR_SIZE) {
if (file.size > MAX_IMAGE_SIZE) {
throw new APIException(
APIErrorCode.BAD_REQUEST,
400,
@@ -71,18 +40,19 @@ router.post("/api/avatars/me", authMiddleware, async (ctx) => {
const data = new Uint8Array(await file.arrayBuffer());
if (!checkMagicBytes(data, file.type)) {
const mime = detectImageMime(data);
if (!mime) {
throw new APIException(
APIErrorCode.BAD_REQUEST,
400,
"File content does not match declared type",
"File content is not a recognised image (JPEG, PNG, GIF, WebP)",
);
}
await Deno.mkdir(AVATARS_DIR, { recursive: true });
await Deno.writeFile(`${AVATARS_DIR}/${authPayload.userId}`, data);
updateUserAvatar(authPayload.userId, file.type);
updateClientAvatar(authPayload.userId, file.type);
updateUserAvatar(authPayload.userId, mime);
updateClientAvatar(authPayload.userId, mime);
const user = getUserById(authPayload.userId);
ctx.response.status = 200;
@@ -105,18 +75,7 @@ router.get("/api/avatars/:userId", async (ctx) => {
return;
}
let data: Uint8Array;
try {
data = await Deno.readFile(`${AVATARS_DIR}/${userId}`);
} catch {
ctx.response.status = 404;
return;
}
ctx.response.headers.set("Content-Type", user.avatarMime);
ctx.response.headers.set("Content-Disposition", "inline");
ctx.response.headers.set("Cache-Control", "public, max-age=3600");
ctx.response.body = data;
await serveUploadedFile(ctx, `${AVATARS_DIR}/${userId}`, user.avatarMime);
});
export default router;

3
api/routes/files.ts
View File

@@ -1,6 +1,7 @@
import { Router } from "@oak/oak";
import { APIErrorCode, APIException } from "../model/interfaces.ts";
import { getDump } from "../services/dump-service.ts";
import { DUMPS_DIR } from "../utils/upload.ts";
const router = new Router({ prefix: "/api/files" });
@@ -22,7 +23,7 @@ router.get("/:dumpId", async (ctx) => {
);
}
const path = `api/uploads/${dumpId}`;
const path = `${DUMPS_DIR}/${dumpId}`;
let data: Uint8Array;
try {

75
api/routes/playlists.ts
View File

@@ -13,36 +13,19 @@ import {
createPlaylist,
deletePlaylist,
getPlaylist,
getPlaylistImageMime,
getPlaylistImageInfo,
getPlaylistMembershipsForDump,
removeDumpFromPlaylist,
reorderPlaylist,
setPlaylistImage,
updatePlaylist,
} from "../services/playlist-service.ts";
const PLAYLIST_IMAGES_DIR = "api/uploads/playlist-images";
const MAX_IMAGE_SIZE = 5 * 1024 * 1024;
const ALLOWED_IMAGE_MIMES = new Set([
"image/jpeg",
"image/png",
"image/gif",
"image/webp",
]);
function checkImageMagicBytes(data: Uint8Array, mime: string): boolean {
if (mime === "image/webp") {
return data[0] === 0x52 && data[1] === 0x49 && data[2] === 0x46 &&
data[3] === 0x46 && data[8] === 0x57 && data[9] === 0x45 &&
data[10] === 0x42 && data[11] === 0x50;
}
const magic: Record<string, number[]> = {
"image/jpeg": [0xFF, 0xD8, 0xFF],
"image/png": [0x89, 0x50, 0x4E, 0x47],
"image/gif": [0x47, 0x49, 0x46, 0x38],
};
return (magic[mime] ?? []).every((b, i) => data[i] === b);
}
import {
detectImageMime,
MAX_IMAGE_SIZE,
PLAYLIST_IMAGES_DIR,
serveUploadedFile,
} from "../utils/upload.ts";
const router = new Router<AuthState>({ prefix: "/api/playlists" });
@@ -143,14 +126,6 @@ router.post("/:playlistId/image", authMiddleware, async (ctx) => {
throw new APIException(APIErrorCode.BAD_REQUEST, 400, "Missing file field");
}
if (!ALLOWED_IMAGE_MIMES.has(file.type)) {
throw new APIException(
APIErrorCode.BAD_REQUEST,
400,
"Only JPEG, PNG, GIF, WebP images are allowed",
);
}
if (file.size > MAX_IMAGE_SIZE) {
throw new APIException(
APIErrorCode.BAD_REQUEST,
@@ -160,46 +135,38 @@ router.post("/:playlistId/image", authMiddleware, async (ctx) => {
}
const data = new Uint8Array(await file.arrayBuffer());
if (!checkImageMagicBytes(data, file.type)) {
const mime = detectImageMime(data);
if (!mime) {
throw new APIException(
APIErrorCode.BAD_REQUEST,
400,
"File content does not match declared type",
"File content is not a recognised image (JPEG, PNG, GIF, WebP)",
);
}
await Deno.mkdir(PLAYLIST_IMAGES_DIR, { recursive: true });
await Deno.writeFile(`${PLAYLIST_IMAGES_DIR}/${ctx.params.playlistId}`, data);
// Resolve slug → UUID via service (validates ownership too), then write file
const playlist = setPlaylistImage(
ctx.params.playlistId,
file.type,
mime,
ctx.state.user.userId,
);
await Deno.mkdir(PLAYLIST_IMAGES_DIR, { recursive: true });
await Deno.writeFile(`${PLAYLIST_IMAGES_DIR}/${playlist.id}`, data);
ctx.response.body = { success: true, data: playlist };
});
// GET /api/playlists/:playlistId/image — serve playlist image
router.get("/:playlistId/image", async (ctx) => {
const imageMime = getPlaylistImageMime(ctx.params.playlistId);
if (!imageMime) {
const info = getPlaylistImageInfo(ctx.params.playlistId);
if (!info) {
ctx.response.status = 404;
return;
}
let data: Uint8Array;
try {
data = await Deno.readFile(
`${PLAYLIST_IMAGES_DIR}/${ctx.params.playlistId}`,
);
} catch {
ctx.response.status = 404;
return;
}
ctx.response.headers.set("Content-Type", imageMime);
ctx.response.headers.set("Content-Disposition", "inline");
ctx.response.headers.set("Cache-Control", "public, max-age=3600");
ctx.response.body = data;
await serveUploadedFile(
ctx,
`${PLAYLIST_IMAGES_DIR}/${info.id}`,
info.imageMime,
);
});
// PUT /api/playlists/:playlistId/order — reorder

12
api/services/dump-service.ts
View File

@@ -17,8 +17,8 @@ import {
notifyUserFollowersNewDump,
} from "./notification-service.ts";
import { makeSlug, UUID_RE } from "../lib/slugify.ts";
import { DUMPS_DIR } from "../utils/upload.ts";
const UPLOADS_DIR = "api/uploads";
const MAX_FILE_SIZE = 50 * 1024 * 1024; // 50 MB
const ALLOWED_MIME_PREFIXES = ["text/", "image/", "video/", "audio/"];
@@ -138,11 +138,11 @@ export async function createFileDump(
const createdAt = new Date();
const slug = makeSlug(file.name, dumpId);
await Deno.mkdir(UPLOADS_DIR, { recursive: true });
await Deno.mkdir(DUMPS_DIR, { recursive: true });
const data = new Uint8Array(await file.arrayBuffer());
try {
await Deno.writeFile(`${UPLOADS_DIR}/${dumpId}`, data);
await Deno.writeFile(`${DUMPS_DIR}/${dumpId}`, data);
db.prepare(
`INSERT INTO dumps (id, kind, title, slug, comment, user_id, created_at, file_name, file_mime, file_size, is_private)
@@ -162,7 +162,7 @@ export async function createFileDump(
);
} catch (err) {
// Roll back the file if DB insert fails
await Deno.remove(`${UPLOADS_DIR}/${dumpId}`).catch(() => {});
await Deno.remove(`${DUMPS_DIR}/${dumpId}`).catch(() => {});
throw err;
}
@@ -374,7 +374,7 @@ export async function replaceFileDump(
}
const data = new Uint8Array(await file.arrayBuffer());
await Deno.writeFile(`${UPLOADS_DIR}/${dumpId}`, data);
await Deno.writeFile(`${DUMPS_DIR}/${dumpId}`, data);
const now = new Date();
const newSlug = makeSlug(file.name, dumpId);
@@ -513,7 +513,7 @@ export async function deleteDump(dumpId: string): Promise<void> {
}
if (dump.kind === "file") {
await Deno.remove(`${UPLOADS_DIR}/${dumpId}`).catch(() => {});
await Deno.remove(`${DUMPS_DIR}/${dumpId}`).catch(() => {});
}
broadcastDumpDeleted(dumpId);

14
api/services/playlist-service.ts
View File

@@ -356,13 +356,13 @@ export function getPlaylistMembershipsForDump(
});
}
export function getPlaylistImageMime(playlistId: string): string | undefined {
const row = db.prepare(`SELECT image_mime FROM playlists WHERE id = ?;`).get(
playlistId,
) as
| { image_mime: string | null }
| undefined;
return row?.image_mime ?? undefined;
export function getPlaylistImageInfo(
idOrSlug: string,
): { id: string; imageMime: string } | undefined {
const playlist = getPlaylistById(idOrSlug);
return playlist.imageMime
? { id: playlist.id, imageMime: playlist.imageMime }
: undefined;
}
function getCurrentDumpIds(playlistId: string): string[] {

2
api/services/user-service.ts
View File

@@ -10,7 +10,7 @@ import { db, isUserRow, userApiToRow, userRowToApi } from "../model/db.ts";
import { hashPassword } from "../lib/jwt.ts";
const USER_SELECT =
`SELECT u.id, u.username, u.password_hash, u.is_admin, u.created_at, u.avatar_mime, u.invited_by,
`SELECT u.id, u.username, u.password_hash, u.is_admin, u.created_at, u.updated_at, u.avatar_mime, u.invited_by,
i.username as invited_by_username
FROM users u
LEFT JOIN users i ON i.id = u.invited_by`;

4
api/services/ws-service.ts
View File

@@ -10,6 +10,7 @@ export interface WsClient {
userId?: string;
username?: string;
avatarMime?: string;
avatarVersion?: number;
}
const clients = new Set<WsClient>();
@@ -23,9 +24,11 @@ export function unregister(client: WsClient): void {
}
export function updateClientAvatar(userId: string, avatarMime: string): void {
const version = Date.now();
for (const client of clients) {
if (client.userId === userId) {
client.avatarMime = avatarMime;
client.avatarVersion = version;
}
}
broadcastPresence();
@@ -39,6 +42,7 @@ export function getOnlineUsers(): OnlineUser[] {
userId: client.userId,
username: client.username!,
hasAvatar: !!client.avatarMime,
avatarVersion: client.avatarVersion,
});
}
}

57
api/utils/upload.ts Normal file
View File

@@ -0,0 +1,57 @@
import type { Context } from "@oak/oak";
export const UPLOADS_DIR = "api/uploads";
export const DUMPS_DIR = `${UPLOADS_DIR}/dumps`;
export const AVATARS_DIR = `${UPLOADS_DIR}/avatars`;
export const PLAYLIST_IMAGES_DIR = `${UPLOADS_DIR}/playlist-images`;
export const MAX_IMAGE_SIZE = 5 * 1024 * 1024; // 5 MB
export const ALLOWED_IMAGE_MIMES = new Set([
"image/jpeg",
"image/png",
"image/gif",
"image/webp",
]);
/** Detect image MIME type from magic bytes, ignoring the browser-declared type. */
export function detectImageMime(data: Uint8Array): string | null {
if (data[0] === 0xFF && data[1] === 0xD8 && data[2] === 0xFF) {
return "image/jpeg";
}
if (
data[0] === 0x89 && data[1] === 0x50 && data[2] === 0x4E && data[3] === 0x47
) return "image/png";
if (
data[0] === 0x47 && data[1] === 0x49 && data[2] === 0x46 && data[3] === 0x38
) return "image/gif";
// RIFF....WEBP
if (
data[0] === 0x52 && data[1] === 0x49 && data[2] === 0x46 &&
data[3] === 0x46 &&
data[8] === 0x57 && data[9] === 0x45 && data[10] === 0x42 &&
data[11] === 0x50
) return "image/webp";
return null;
}
export async function serveUploadedFile(
ctx: Context,
filePath: string,
mime: string,
cacheMaxAge = 3600,
): Promise<boolean> {
let data: Uint8Array;
try {
data = await Deno.readFile(filePath);
} catch {
ctx.response.status = 404;
return false;
}
ctx.response.headers.set("Content-Type", mime);
ctx.response.headers.set("Content-Disposition", "inline");
ctx.response.headers.set("Cache-Control", `public, max-age=${cacheMaxAge}`);
ctx.response.headers.set("Cross-Origin-Resource-Policy", "cross-origin");
ctx.response.body = data;
return true;
}