feat(storage): add content-images storage bucket for admin content editor #278
Conversation
…itor
- Create content-images bucket with public access
- Set file size limit to 10MB
- Support image formats: JPEG, PNG, WebP, GIF
- Add RLS policies for authenticated users
- Users can only upload/delete files in their own folder (user-{userId}/)
Related to ifLabX#250
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
@pixelsama is attempting to deploy a commit to the zhang's projects Team on Vercel. A member of the Team first needs to authorize it. |
dosubot
bot
added
the
size:M
Summary of ChangesHello @pixelsama, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request establishes the foundational storage infrastructure necessary to enable local image uploads directly within the admin content editor. By introducing a new Supabase Storage bucket, Highlights
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request introduces a new Supabase storage bucket content-images for the admin content editor, along with the necessary RLS policies. The migration script is well-structured and idempotent. I've provided a couple of suggestions to improve the robustness of the RLS policies and the maintainability of the bucket creation statement. Overall, this is a solid addition that lays the foundation for image uploads.
supabase/migrations/20250930172735_setup_content_images_storage.sql
Outdated
Show resolved
Hide resolved
Apply Gemini Code Assist review suggestions: - Use owner column instead of foldername for UPDATE/DELETE policies - Use EXCLUDED pseudo-table in ON CONFLICT clause for better maintainability Changes: - UPDATE policy: auth.uid() = owner (more secure and decoupled) - DELETE policy: auth.uid() = owner (more secure and decoupled) - ON CONFLICT: Use EXCLUDED.* to reference inserted values (DRY principle) Benefits: - Enhanced security by using Supabase's standard owner column - Decoupled security from file path structure - Improved code maintainability - Follows Supabase best practices Related to ifLabX#250 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Add core business logic for content image uploads:
Service Layer (lib/services/content-image-upload-service.ts):
- validateImageFile(): Validate file type (JPEG, PNG, WebP, GIF) and size (10MB max)
- generateContentImagePath(): Generate unique file paths (user-{userId}/{timestamp}-{uuid}.ext)
- uploadContentImage(): Upload images to content-images bucket
- deleteContentImage(): Delete images from storage
- listUserContentImages(): List user's uploaded images
- extractFilePathFromUrl(): Extract file path from Supabase URLs
Hook Layer (lib/hooks/use-content-image-upload.ts):
- useContentImageUpload(): React hook for state management
- State management: loading, error, progress tracking
- Operations: uploadImage, deleteImage, validateFile, resetState
- Type-safe interfaces for state and results
Technical Details:
- Bucket: content-images (created in PR ifLabX#278)
- Max file size: 10MB
- Supported formats: JPEG, JPG, PNG, WebP, GIF
- Path structure: user-{userId}/{timestamp}-{uuid}.{ext}
- Cache control: 3600s
- Follows existing pattern from use-avatar-upload.ts
Related to ifLabX#250
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
2 participants
Important
Fixes #<issue number>What & Why
What: Add Supabase Storage bucket infrastructure for local image uploads in the admin content editor
Why: Currently, the admin content editor's image component only supports external URLs (like Unsplash). This PR creates the foundational storage infrastructure to enable users to upload and manage their own local images directly within the platform, reducing dependency on external image hosting services.
Fixes #250
Pre-PR Checklist
Run these:
pnpm type-checkpnpm format:checkpnpm lintpnpm buildpnpm i18n:check(if applicable - N/A, no i18n changes)Type
Changes
Database Migration
content-imagesstorage bucket with public accessuser-{userId}/folderTechnical Details
File:
supabase/migrations/20250930172735_setup_content_images_storage.sqlBucket Configuration:
Path Structure:
user-{userId}/{timestamp}-{uuid}.{ext}Security: RLS policies ensure users can only manage files in their own directories while maintaining public read access for displaying images on content pages.
Implementation Plan
This is PR #1 of a 5-part implementation:
Testing Notes
avatarsbucket