https://github.com/semihbugrasezer/flow-to-supabase
Browser userscript that detects new images in Google Labs Flow and auto-uploads them to Supabase Storage via a Vercel API (compression, metadata, deduplication).
https://github.com/semihbugrasezer/flow-to-supabase
api browser-automation flow google-labs serverless storage supabase userscript vercel
Last synced: 17 days ago
JSON representation
Browser userscript that detects new images in Google Labs Flow and auto-uploads them to Supabase Storage via a Vercel API (compression, metadata, deduplication).
- Host: GitHub
- URL: https://github.com/semihbugrasezer/flow-to-supabase
- Owner: semihbugrasezer
- Created: 2025-12-27T01:44:21.000Z (27 days ago)
- Default Branch: main
- Last Pushed: 2025-12-27T14:30:09.000Z (27 days ago)
- Last Synced: 2025-12-29T10:05:23.361Z (25 days ago)
- Topics: api, browser-automation, flow, google-labs, serverless, storage, supabase, userscript, vercel
- Language: JavaScript
- Homepage: https://flow-image-downloader.vercel.app
- Size: 60.5 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Flow Image Auto Uploader
Automatically uploads new images from Flow to Supabase Storage. A browser userscript detects new images while Flow is open, and a Vercel API performs compression, metadata generation, and deduplication.
## Architecture
- **Userscript**: Runs in the browser and collects new image URLs from the Flow page.
- **Vercel API**: Downloads images, compresses them, writes metadata, and uploads to Supabase.
- **Supabase Storage**: Stores the JPEG and a JSON metadata file per image.
## About Flow
Flow is a Google Labs product for generating media. More details: https://labs.google/flow/about.
## Requirements
- Supabase project with a storage bucket (example: `flow-image`)
- Vercel project hosting this repo
- Tampermonkey or Violentmonkey installed in the browser
## Vercel Environment Variables
Set these in Vercel (Production and Preview):
```
NEXT_PUBLIC_SUPABASE_URL=https://YOUR_PROJECT.supabase.co
NEXT_PUBLIC_SUPABASE_KEY=YOUR_ANON_OR_PUBLISHABLE_KEY
SUPABASE_SERVICE_ROLE_KEY=YOUR_SERVICE_ROLE_KEY
BUCKET_NAME=flow-image
ALLOWED_ORIGIN=*
SYNC_SECRET=YOUR_SYNC_TOKEN
SYNC_TABLE=flow_images
SYNC_FOLDER=
SYNC_MAX_OBJECTS=100000
```
## Supabase Storage Policies
Allow anon uploads and reads for your bucket:
```sql
CREATE POLICY "Allow anon uploads"
ON storage.objects
FOR INSERT
TO anon
WITH CHECK (bucket_id = 'flow-image');
CREATE POLICY "Allow anon reads"
ON storage.objects
FOR SELECT
TO anon
USING (bucket_id = 'flow-image');
```
## Userscript Installation
1. Install Tampermonkey or Violentmonkey.
2. Create a new userscript.
3. Paste the contents of `flow-auto-uploader.user.js`.
4. Save and ensure the script is enabled.
5. Open a Flow project page. Uploads happen automatically.
## API Endpoint
```
POST /api/upload-flow-images
```
Example request body:
```json
{
"images": [
"https://storage.googleapis.com/ai-sandbox-videofx/image/EXAMPLE"
],
"compressQuality": 85,
"maxWidth": 1920,
"maxHeight": 1920
}
```
## Deduplication
The API hashes the source URL and uses a deterministic file name, so identical URLs are not uploaded twice. The userscript also keeps a local cache of uploaded URLs to avoid repeat uploads during a browsing session.
## Optional Bookmarklet
If you need manual triggering, use the bookmarklet generator:
```
/bookmarklet-generator
```
## Storage → DB Sync (Template)
```
POST /api/sync-storage-to-db
```
Headers:
```
Authorization: Bearer YOUR_SYNC_TOKEN
```
Optional query params:
```
token=YOUR_SYNC_TOKEN
dryRun=1
```
Notes:
- The endpoint lists objects in `BUCKET_NAME`, filters `.jpg`, and inserts missing rows into `SYNC_TABLE`.
- Protect it with `SYNC_SECRET` and call it from a trusted backend or an external cron that can send the token.
Example (GitHub Actions cron):
```
curl -sS -X POST "https://YOUR_VERCEL_DOMAIN/api/sync-storage-to-db?token=${SYNC_SECRET}"
```