mono/packages/ui/docs/posts.md
2026-02-08 15:09:32 +01:00

74 lines
3.3 KiB
Markdown

# Plan: Support Multiple Images/Videos per Post
## Overview
Currently, the application treats every image or video as an independent entity (a `picture` or linked `video`). We want to introduce a higher-level concept of a **Post** which can contain one or more media items (images or videos).
This allows:
- Grouping related photos (e.g., a photo dump, or variations).
- A unified description and comment section for the group.
- Preserving individual interactions (likes/comments) on specific images within the post if desired (as per requirements).
## Database Schema Changes
We will introduce a new `posts` table and link existing `pictures` to it.
### 1. New Table: `posts`
This table will hold the content for the "container".
| Column | Type | Notes |
|Ref|---|---|
| `id` | `uuid` | Primary Key, default `gen_random_uuid()` |
| `user_id` | `uuid` | FK to `auth.users` (or profiles) |
| `title` | `text` | Main title of the post |
| `description` | `text` | Description/Caption for the whole post |
| `created_at` | `timestamptz` | default `now()` |
| `updated_at` | `timestamptz` | |
| `metadata` | `jsonb` | Flexible field for extra data |
### 2. Update Table: `pictures`
We link media items to the post.
- Add column `post_id`: `uuid`, FK to `posts(id)`.
- Add column `position`: `integer`, default 0. To order images within a post.
> **Note**: Videos are stored in the `pictures` table with `type='mux-video'`, so this change covers both images and videos. The separate `videos` table in Supabase appears unused by the current frontend.
### 3. Update Table: `comments` and `likes`
Currently, `comments` and `likes` reference `picture_id`.
- **Requirement**: "we might have also comments, and descriptions for the parent 'post'".
- **Approach**:
- Add `post_id` to `comments` and `likes` tables (nullable).
- Or create `post_comments` / `post_likes` tables if cleaner.
- *Decision*: We will start with a simple structure where `posts` have their own `description` (already in table). For comments, we might need a unified comment system later or link comments to posts. For now, let's focus on `posts` containing `pictures`.
## Migration Strategy (SQL)
According to user feedback, **no backfill is required**. Old pictures will simply not be displayed in the new "Post" feed which will rely on the `posts` table.
1. **Create `posts` table.**
2. **Alter `pictures` table**: Add `post_id` column.
## UI/UX Updates
### Feed (`PhotoGrid.tsx`)
- Query `posts` instead of `pictures`.
- Fetch the first linked picture for the thumbnail.
### Post Detail (`Post.tsx`)
- Route `/post/:id` will now accept a **Post ID**.
- Fetch Post metadata.
- Fetch associated Media Items (`select * from pictures where post_id = :id order by position`).
### Creation Wizard
- Allow granular updates: "Select Multiple Files".
- Create Post -> Upload all files -> Create Picture records linked to Post.
## Step-by-Step Implementation
1. **Supabase Migration**: Create tables, run backfill script.
2. **Codebase - Types**: Update `types.ts` (re-run codegen).
3. **Codebase - API**: Update any fetch functions to use `posts`.
4. **UI - Feed**: Switch `PhotoGrid` to use `posts`.
5. **UI - Detail**: Rewrite `Post.tsx` to handle `Post` + `Media[]`.
6. **UI - Create**: Update upload logic.