@jant/core 0.3.5 → 0.3.7

package/src/routes/pages/post.tsx

@@ -5,17 +5,25 @@ import { getSiteName } from "../../lib/config.js";
 
 import { Hono } from "hono";
 import { useLingui } from "@lingui/react/macro";
-import type { Bindings, Post } from "../../types.js";
+import type { Bindings, Post, MediaAttachment } from "../../types.js";
 import type { AppVariables } from "../../app.js";
 import { BaseLayout } from "../../theme/layouts/index.js";
+import { MediaGallery } from "../../theme/components/index.js";
 import * as sqid from "../../lib/sqid.js";
 import * as time from "../../lib/time.js";
+import { getMediaUrl, getImageUrl } from "../../lib/image.js";
 
 type Env = { Bindings: Bindings; Variables: AppVariables };
 
 export const postRoutes = new Hono<Env>();
 
-function PostContent({ post }: { post: Post }) {
+function PostContent({
+  post,
+  mediaAttachments,
+}: {
+  post: Post;
+  mediaAttachments: MediaAttachment[];
+}) {
   const { t } = useLingui();
 
   return (
@@ -30,6 +38,10 @@ function PostContent({ post }: { post: Post }) {
           dangerouslySetInnerHTML={{ __html: post.contentHtml || "" }}
         />
 
+        {mediaAttachments.length > 0 && (
+          <MediaGallery attachments={mediaAttachments} />
+        )}
+
         <footer class="mt-6 pt-4 border-t text-sm text-muted-foreground">
           <time
             class="dt-published"
@@ -82,12 +94,33 @@ postRoutes.get("/:id", async (c) => {
     return c.notFound();
   }
 
+  // Load media attachments
+  const rawMedia = await c.var.services.media.getByPostId(post.id);
+  const r2PublicUrl = c.env.R2_PUBLIC_URL;
+  const imageTransformUrl = c.env.IMAGE_TRANSFORM_URL;
+
+  const mediaAttachments: MediaAttachment[] = rawMedia.map((m) => ({
+    id: m.id,
+    url: getMediaUrl(m.id, m.r2Key, r2PublicUrl),
+    previewUrl: getImageUrl(
+      getMediaUrl(m.id, m.r2Key, r2PublicUrl),
+      imageTransformUrl,
+      { width: 400, quality: 80, format: "auto", fit: "cover" },
+    ),
+    alt: m.alt,
+    blurhash: m.blurhash,
+    width: m.width,
+    height: m.height,
+    position: m.position,
+    mimeType: m.mimeType,
+  }));
+
   const siteName = await getSiteName(c);
   const title = post.title || siteName;
 
   return c.html(
     <BaseLayout title={title} description={post.content?.slice(0, 160)} c={c}>
-      <PostContent post={post} />
+      <PostContent post={post} mediaAttachments={mediaAttachments} />
     </BaseLayout>,
   );
 });

package/src/services/__tests__/collection.test.ts

@@ -223,4 +223,106 @@ describe("CollectionService", () => {
       expect(posts).toEqual([]);
     });
   });
+
+  describe("syncPostCollections", () => {
+    it("adds collections to a post with no existing collections", async () => {
+      const col1 = await collectionService.create({ title: "Col 1" });
+      const col2 = await collectionService.create({ title: "Col 2" });
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      await collectionService.syncPostCollections(post.id, [col1.id, col2.id]);
+
+      const collections = await collectionService.getCollectionsForPost(
+        post.id,
+      );
+      expect(collections).toHaveLength(2);
+      expect(collections.map((c) => c.id).sort()).toEqual(
+        [col1.id, col2.id].sort(),
+      );
+    });
+
+    it("removes collections no longer in the list", async () => {
+      const col1 = await collectionService.create({ title: "Col 1" });
+      const col2 = await collectionService.create({ title: "Col 2" });
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      await collectionService.addPost(col1.id, post.id);
+      await collectionService.addPost(col2.id, post.id);
+
+      // Sync with only col1 — col2 should be removed
+      await collectionService.syncPostCollections(post.id, [col1.id]);
+
+      const collections = await collectionService.getCollectionsForPost(
+        post.id,
+      );
+      expect(collections).toHaveLength(1);
+      expect(collections[0]?.id).toBe(col1.id);
+    });
+
+    it("handles mixed adds and removes", async () => {
+      const col1 = await collectionService.create({ title: "Col 1" });
+      const col2 = await collectionService.create({ title: "Col 2" });
+      const col3 = await collectionService.create({ title: "Col 3" });
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      // Start with col1 and col2
+      await collectionService.addPost(col1.id, post.id);
+      await collectionService.addPost(col2.id, post.id);
+
+      // Sync to col2 and col3 (remove col1, keep col2, add col3)
+      await collectionService.syncPostCollections(post.id, [col2.id, col3.id]);
+
+      const collections = await collectionService.getCollectionsForPost(
+        post.id,
+      );
+      expect(collections).toHaveLength(2);
+      expect(collections.map((c) => c.id).sort()).toEqual(
+        [col2.id, col3.id].sort(),
+      );
+    });
+
+    it("removes all collections when synced with empty array", async () => {
+      const col1 = await collectionService.create({ title: "Col 1" });
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      await collectionService.addPost(col1.id, post.id);
+
+      await collectionService.syncPostCollections(post.id, []);
+
+      const collections = await collectionService.getCollectionsForPost(
+        post.id,
+      );
+      expect(collections).toHaveLength(0);
+    });
+
+    it("is a no-op when already in sync", async () => {
+      const col1 = await collectionService.create({ title: "Col 1" });
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      await collectionService.addPost(col1.id, post.id);
+
+      await collectionService.syncPostCollections(post.id, [col1.id]);
+
+      const collections = await collectionService.getCollectionsForPost(
+        post.id,
+      );
+      expect(collections).toHaveLength(1);
+      expect(collections[0]?.id).toBe(col1.id);
+    });
+  });
 });

package/src/services/__tests__/media.test.ts

@@ -1,16 +1,20 @@
+/* eslint-disable @typescript-eslint/no-non-null-assertion -- Test assertions use ! for readability */
 import { describe, it, expect, beforeEach } from "vitest";
 import { createTestDatabase } from "../../__tests__/helpers/db.js";
 import { createMediaService } from "../media.js";
+import { createPostService } from "../post.js";
 import type { Database } from "../../db/index.js";
 
 describe("MediaService", () => {
   let db: Database;
   let mediaService: ReturnType<typeof createMediaService>;
+  let postService: ReturnType<typeof createPostService>;
 
   beforeEach(() => {
     const testDb = createTestDatabase();
     db = testDb.db as unknown as Database;
     mediaService = createMediaService(db);
+    postService = createPostService(db);
   });
 
   const sampleMedia = {
@@ -37,6 +41,8 @@ describe("MediaService", () => {
       expect(media.height).toBe(1080);
       expect(media.postId).toBeNull();
       expect(media.alt).toBeNull();
+      expect(media.position).toBe(0);
+      expect(media.blurhash).toBeNull();
     });
 
     it("creates media with optional alt text", async () => {
@@ -48,6 +54,17 @@ describe("MediaService", () => {
       expect(media.alt).toBe("A beautiful sunset");
     });
 
+    it("creates media with position and blurhash", async () => {
+      const media = await mediaService.create({
+        ...sampleMedia,
+        position: 3,
+        blurhash: "LKO2?U%2Tw=w]~RBVZRi};RPxuwH",
+      });
+
+      expect(media.position).toBe(3);
+      expect(media.blurhash).toBe("LKO2?U%2Tw=w]~RBVZRi};RPxuwH");
+    });
+
     it("generates UUIDv7 IDs", async () => {
       const media1 = await mediaService.create(sampleMedia);
       const media2 = await mediaService.create({
@@ -76,6 +93,135 @@ describe("MediaService", () => {
     });
   });
 
+  describe("getByIds", () => {
+    it("returns media for valid IDs", async () => {
+      const m1 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/a.jpg",
+      });
+      const m2 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/b.jpg",
+      });
+
+      const results = await mediaService.getByIds([m1.id, m2.id]);
+      expect(results).toHaveLength(2);
+      expect(results.map((r) => r.id).sort()).toEqual([m1.id, m2.id].sort());
+    });
+
+    it("returns empty array for empty input", async () => {
+      const results = await mediaService.getByIds([]);
+      expect(results).toEqual([]);
+    });
+
+    it("ignores non-existent IDs", async () => {
+      const m1 = await mediaService.create(sampleMedia);
+
+      const results = await mediaService.getByIds([m1.id, "nonexistent"]);
+      expect(results).toHaveLength(1);
+      expect(results[0]!.id).toBe(m1.id);
+    });
+  });
+
+  describe("getByPostId", () => {
+    it("returns media ordered by position", async () => {
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      const m1 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/a.jpg",
+      });
+      const m2 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/b.jpg",
+      });
+
+      await mediaService.attachToPost(post.id, [m2.id, m1.id]);
+
+      const results = await mediaService.getByPostId(post.id);
+      expect(results).toHaveLength(2);
+      expect(results[0]!.id).toBe(m2.id);
+      expect(results[0]!.position).toBe(0);
+      expect(results[1]!.id).toBe(m1.id);
+      expect(results[1]!.position).toBe(1);
+    });
+
+    it("returns empty array for post with no media", async () => {
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      const results = await mediaService.getByPostId(post.id);
+      expect(results).toEqual([]);
+    });
+  });
+
+  describe("getByPostIds", () => {
+    it("returns Map grouped by postId", async () => {
+      const post1 = await postService.create({
+        type: "note",
+        content: "post 1",
+      });
+      const post2 = await postService.create({
+        type: "note",
+        content: "post 2",
+      });
+
+      const m1 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/a.jpg",
+      });
+      const m2 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/b.jpg",
+      });
+      const m3 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/c.jpg",
+      });
+
+      await mediaService.attachToPost(post1.id, [m1.id, m2.id]);
+      await mediaService.attachToPost(post2.id, [m3.id]);
+
+      const results = await mediaService.getByPostIds([post1.id, post2.id]);
+      expect(results.size).toBe(2);
+      expect(results.get(post1.id)).toHaveLength(2);
+      expect(results.get(post2.id)).toHaveLength(1);
+    });
+
+    it("returns empty Map for empty input", async () => {
+      const results = await mediaService.getByPostIds([]);
+      expect(results.size).toBe(0);
+    });
+
+    it("returns ordered by position within each post", async () => {
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      const m1 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/a.jpg",
+      });
+      const m2 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/b.jpg",
+      });
+
+      await mediaService.attachToPost(post.id, [m2.id, m1.id]);
+
+      const results = await mediaService.getByPostIds([post.id]);
+      const postMedia = results.get(post.id)!;
+      expect(postMedia[0]!.id).toBe(m2.id);
+      expect(postMedia[1]!.id).toBe(m1.id);
+    });
+  });
+
   describe("getByR2Key", () => {
     it("returns media by R2 key", async () => {
       await mediaService.create(sampleMedia);
@@ -115,6 +261,108 @@ describe("MediaService", () => {
     });
   });
 
+  describe("attachToPost", () => {
+    it("sets postId and position for each media", async () => {
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      const m1 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/a.jpg",
+      });
+      const m2 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/b.jpg",
+      });
+
+      await mediaService.attachToPost(post.id, [m1.id, m2.id]);
+
+      const attached = await mediaService.getByPostId(post.id);
+      expect(attached).toHaveLength(2);
+      expect(attached[0]!.id).toBe(m1.id);
+      expect(attached[0]!.position).toBe(0);
+      expect(attached[1]!.id).toBe(m2.id);
+      expect(attached[1]!.position).toBe(1);
+    });
+
+    it("replaces existing attachments", async () => {
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      const m1 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/a.jpg",
+      });
+      const m2 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/b.jpg",
+      });
+      const m3 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/c.jpg",
+      });
+
+      await mediaService.attachToPost(post.id, [m1.id, m2.id]);
+      await mediaService.attachToPost(post.id, [m3.id]);
+
+      const attached = await mediaService.getByPostId(post.id);
+      expect(attached).toHaveLength(1);
+      expect(attached[0]!.id).toBe(m3.id);
+      expect(attached[0]!.position).toBe(0);
+
+      // Verify old media is detached
+      const old1 = await mediaService.getById(m1.id);
+      expect(old1!.postId).toBeNull();
+      expect(old1!.position).toBe(0);
+    });
+
+    it("handles empty array by clearing all attachments", async () => {
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      const m1 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/a.jpg",
+      });
+
+      await mediaService.attachToPost(post.id, [m1.id]);
+      await mediaService.attachToPost(post.id, []);
+
+      const attached = await mediaService.getByPostId(post.id);
+      expect(attached).toHaveLength(0);
+    });
+  });
+
+  describe("detachFromPost", () => {
+    it("clears postId and resets position", async () => {
+      const post = await postService.create({
+        type: "note",
+        content: "test",
+      });
+
+      const m1 = await mediaService.create({
+        ...sampleMedia,
+        r2Key: "media/a.jpg",
+      });
+
+      await mediaService.attachToPost(post.id, [m1.id]);
+      await mediaService.detachFromPost(post.id);
+
+      const attached = await mediaService.getByPostId(post.id);
+      expect(attached).toHaveLength(0);
+
+      const detached = await mediaService.getById(m1.id);
+      expect(detached!.postId).toBeNull();
+      expect(detached!.position).toBe(0);
+    });
+  });
+
   describe("delete", () => {
     it("deletes a media record", async () => {
       const media = await mediaService.create(sampleMedia);

package/src/services/collection.ts

@@ -21,6 +21,7 @@ export interface CollectionService {
   removePost(collectionId: number, postId: number): Promise<void>;
   getPosts(collectionId: number): Promise<Post[]>;
   getCollectionsForPost(postId: number): Promise<Collection[]>;
+  syncPostCollections(postId: number, collectionIds: number[]): Promise<void>;
 }
 
 export interface CreateCollectionData {
@@ -197,5 +198,23 @@ export function createCollectionService(db: Database): CollectionService {
 
       return rows.map((r) => toCollection(r.collection));
     },
+
+    async syncPostCollections(postId, collectionIds) {
+      const current = await this.getCollectionsForPost(postId);
+      const currentIds = new Set(current.map((c) => c.id));
+      const desiredIds = new Set(collectionIds);
+
+      const toAdd = collectionIds.filter((id) => !currentIds.has(id));
+      const toRemove = current
+        .map((c) => c.id)
+        .filter((id) => !desiredIds.has(id));
+
+      for (const collectionId of toAdd) {
+        await this.addPost(collectionId, postId);
+      }
+      for (const collectionId of toRemove) {
+        await this.removePost(collectionId, postId);
+      }
+    },
   };
 }

package/src/services/media.ts

@@ -4,7 +4,7 @@
  * Handles media upload and management with R2 storage
  */
 
-import { eq, desc } from "drizzle-orm";
+import { eq, desc, inArray, asc } from "drizzle-orm";
 import { uuidv7 } from "uuidv7";
 import type { Database } from "../db/index.js";
 import { media } from "../db/schema.js";
@@ -13,10 +13,15 @@ import type { Media } from "../types.js";
 
 export interface MediaService {
   getById(id: string): Promise<Media | null>;
+  getByIds(ids: string[]): Promise<Media[]>;
+  getByPostId(postId: number): Promise<Media[]>;
+  getByPostIds(postIds: number[]): Promise<Map<number, Media[]>>;
   list(limit?: number): Promise<Media[]>;
   create(data: CreateMediaData): Promise<Media>;
   delete(id: string): Promise<boolean>;
   getByR2Key(r2Key: string): Promise<Media | null>;
+  attachToPost(postId: number, mediaIds: string[]): Promise<void>;
+  detachFromPost(postId: number): Promise<void>;
 }
 
 export interface CreateMediaData {
@@ -29,6 +34,8 @@ export interface CreateMediaData {
   width?: number;
   height?: number;
   alt?: string;
+  position?: number;
+  blurhash?: string;
 }
 
 export function createMediaService(db: Database): MediaService {
@@ -44,6 +51,8 @@ export function createMediaService(db: Database): MediaService {
       width: row.width,
       height: row.height,
       alt: row.alt,
+      position: row.position,
+      blurhash: row.blurhash,
       createdAt: row.createdAt,
     };
   }
@@ -58,6 +67,45 @@ export function createMediaService(db: Database): MediaService {
       return result[0] ? toMedia(result[0]) : null;
     },
 
+    async getByIds(ids) {
+      if (ids.length === 0) return [];
+      const rows = await db.select().from(media).where(inArray(media.id, ids));
+      return rows.map(toMedia);
+    },
+
+    async getByPostId(postId) {
+      const rows = await db
+        .select()
+        .from(media)
+        .where(eq(media.postId, postId))
+        .orderBy(asc(media.position));
+      return rows.map(toMedia);
+    },
+
+    async getByPostIds(postIds) {
+      const result = new Map<number, Media[]>();
+      if (postIds.length === 0) return result;
+
+      const rows = await db
+        .select()
+        .from(media)
+        .where(inArray(media.postId, postIds))
+        .orderBy(asc(media.position));
+
+      for (const row of rows) {
+        const m = toMedia(row);
+        if (m.postId === null) continue;
+        const list = result.get(m.postId);
+        if (list) {
+          list.push(m);
+        } else {
+          result.set(m.postId, [m]);
+        }
+      }
+
+      return result;
+    },
+
     async getByR2Key(r2Key) {
       const result = await db
         .select()
@@ -93,6 +141,8 @@ export function createMediaService(db: Database): MediaService {
           width: data.width ?? null,
           height: data.height ?? null,
           alt: data.alt ?? null,
+          position: data.position ?? 0,
+          blurhash: data.blurhash ?? null,
           createdAt: timestamp,
         })
         .returning();
@@ -101,6 +151,31 @@ export function createMediaService(db: Database): MediaService {
       return toMedia(result[0]!);
     },
 
+    async attachToPost(postId, mediaIds) {
+      // Clear existing attachments
+      await db
+        .update(media)
+        .set({ postId: null, position: 0 })
+        .where(eq(media.postId, postId));
+
+      // Set new attachments with position = array index
+      for (let i = 0; i < mediaIds.length; i++) {
+        const mediaId = mediaIds[i];
+        if (!mediaId) continue;
+        await db
+          .update(media)
+          .set({ postId, position: i })
+          .where(eq(media.id, mediaId));
+      }
+    },
+
+    async detachFromPost(postId) {
+      await db
+        .update(media)
+        .set({ postId: null, position: 0 })
+        .where(eq(media.postId, postId));
+    },
+
     async delete(id) {
       const result = await db.delete(media).where(eq(media.id, id)).returning();
       return result.length > 0;