@plutocms/supabase 0.16.0 → 0.18.0

package/.env.example

@@ -11,6 +11,6 @@ SUPABASE_KEY=
 # environment). With the service role key above AND a working mail driver,
 # invites go out through Pluto mail, not through Supabase's mailer. Set these
 # in the environment of the running server. See the `mail` skill of
-# @plutocms/pluto for every variable.
+# @plutocms/core for every variable.
 # NUXT_PLUTO_MAIL_RESEND_API_KEY=
 # NUXT_PLUTO_MAIL_FROM="Your Site <hello@your-domain.com>"

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # Changelog
 
+## [0.18.0](https://github.com/plutocms/supabase/compare/v0.17.0...v0.18.0) (2026-10-30)
+
+
+### ⚠ BREAKING CHANGES
+
+* the layer extends @plutocms/core >=0.38.0, not @plutocms/pluto. PLUTO_PLUTO_PATH is now PLUTO_CORE_PATH.
+
+### Features
+
+* extend @plutocms/core ([#143](https://github.com/plutocms/supabase/issues/143)) ([6cefcc4](https://github.com/plutocms/supabase/commit/6cefcc4e84c2d00046f11db8b30e9f4d4ac51e12))
+
+## [0.17.0](https://github.com/plutocms/supabase/compare/v0.16.0...v0.17.0) (2026-10-30)
+
+
+### Features
+
+* media previews, sort and rename in the Supabase driver ([#139](https://github.com/plutocms/supabase/issues/139)) ([8cdf071](https://github.com/plutocms/supabase/commit/8cdf0715c5a11db8e99423751708d2ab0feea455))
+
 ## [0.16.0](https://github.com/plutocms/supabase/compare/v0.15.5...v0.16.0) (2026-10-30)
 
 

package/FEATURES.md

@@ -15,7 +15,7 @@ policies shared by every project here.
   link, roles editor), invites through Pluto mail, and a guide for the Supabase sign-in emails.
   @.claude/skills/users-and-roles/SKILL.md
 - Content adapter: a Supabase/PostgREST-backed `PlutoContentAdapter`, plugging any layer's
-  declared content type into `@plutocms/pluto`'s generic content routes. It supports query
+  declared content type into `@plutocms/core`'s generic content routes. It supports query
   filters, puts the timestamps on items, and reads the public API of core with an anonymous client.
   @.claude/skills/content-adapter/SKILL.md
 - Auth driver: plugs Supabase sign-in into the admin shell that pluto core owns (navbar, sign-in

package/README.md

@@ -14,7 +14,7 @@ SUPABASE_URL=your-supabase-url
 SUPABASE_KEY=your-publishable-supabase-key
 ```
 
-2. Install the layer. It brings `@nuxtjs/supabase`, `@plutocms/pluto` and `@plutocms/utils`, so you do not add them:
+2. Install the layer. It brings `@nuxtjs/supabase`, `@plutocms/core` and `@plutocms/utils`, so you do not add them:
 
 ```bash
 npm i @plutocms/supabase
@@ -98,7 +98,7 @@ NUXT_PLUTO_MAIL_FROM="Your Site <hello@your-domain.com>"
 ```
 
 `Settings > Email` in the admin guides the setup (account, key, domain, test email). The
-`mail` skill of `@plutocms/pluto` lists every `NUXT_PLUTO_MAIL_*` variable. If the send fails,
+`mail` skill of `@plutocms/core` lists every `NUXT_PLUTO_MAIL_*` variable. If the send fails,
 the user and the roles stay, and the admin gets the invite link to send by hand.
 
 With the key, an admin can also copy the invite link (Users, then the row menu, or the invite

package/app/plugins/pluto-extension.ts

@@ -102,7 +102,7 @@ export default defineNuxtPlugin(() => {
   definePlutoExtension({
     id: 'supabase',
     // Core renders the navbar, the login page and the route guard from this
-    // driver. See the admin-shell skill in @plutocms/pluto.
+    // driver. See the admin-shell skill in @plutocms/core.
     authDriver: {
       id: 'supabase-auth',
       // The JWT claims carry the id (`sub`) and the user metadata.

package/db/migrations/010_media_preview.sql

@@ -0,0 +1,7 @@
+-- The preview image of a file that is not an image (a 3D model), made in the
+-- browser by the kind of the file. Always in the `media` bucket, even for an
+-- older file in another bucket. See the media skill of @plutocms/pluto.
+
+alter table public.media add column if not exists preview_path text null;
+alter table public.media add column if not exists preview_width integer null;
+alter table public.media add column if not exists preview_height integer null;

package/nuxt.config.ts

@@ -1,8 +1,8 @@
 import type { PlutoMigrationFile } from './shared/types/migrations'
 
-// Point these at a local checkout (e.g. `../pluto`, `../utils`) to test
+// Point these at a local checkout (e.g. `../pluto/packages/core`, `../utils`) to test
 // unpublished changes; unset, they resolve to the published npm packages.
-const plutoLayer = process.env.PLUTO_PLUTO_PATH || '@plutocms/pluto'
+const coreLayer = process.env.PLUTO_CORE_PATH || '@plutocms/core'
 const utilsLayer = process.env.PLUTO_UTILS_PATH || '@plutocms/utils'
 
 // The host of the Supabase project, at build time. `@nuxt/image` may only read
@@ -16,7 +16,7 @@ function supabaseHost(): string {
 }
 
 export default defineNuxtConfig({
-  extends: [[plutoLayer, { install: true }], utilsLayer],
+  extends: [[coreLayer, { install: true }], utilsLayer],
 
   modules: ['@nuxt/eslint', '@nuxtjs/supabase'],
 

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@plutocms/supabase",
   "type": "module",
-  "version": "0.16.0",
+  "version": "0.18.0",
   "trustedDependencies": [
     "@parcel/watcher",
-    "@plutocms/pluto",
+    "@plutocms/core",
     "@plutocms/utils",
     "esbuild",
     "supabase",
@@ -39,7 +39,7 @@
     "@nuxt/eslint": "^1.17.0",
     "@nuxt/ui": "^4.12.0",
     "@nuxtjs/supabase": "^2.1.0",
-    "@plutocms/pluto": ">=0.35.0 <1.0.0",
+    "@plutocms/core": ">=0.38.0 <1.0.0",
     "@plutocms/utils": ">=0.3.0 <1.0.0",
     "@supabase/supabase-js": "^2.117.3",
     "postgres": "^3.4.9",

package/server/plugins/media-driver.ts

@@ -1,6 +1,6 @@
 /**
  * Registers the Supabase media driver with the core media library, at Nitro
- * startup. See the media skill of `@plutocms/pluto`.
+ * startup. See the media skill of `@plutocms/core`.
  */
 export default defineNitroPlugin(() => {
   registerMediaDriver(createSupabaseMediaDriver())

package/server/utils/media-driver.ts

@@ -17,6 +17,23 @@ interface MediaRow {
   size: number | null
   width: number | null
   height: number | null
+  preview_path: string | null
+  preview_width: number | null
+  preview_height: number | null
+}
+
+/** `<yyyy>/<mm>/<name>`: the object key of a file, by the month of its record. */
+function monthKey(createdAt: string, fileName: string): string {
+  const date = new Date(createdAt)
+  return `${date.getUTCFullYear()}/${String(date.getUTCMonth() + 1).padStart(2, '0')}/${fileName}`
+}
+
+/** The order of a list. The id breaks a tie, so pages stay stable. */
+const ORDER: Record<PlutoMediaSort, { column: string; ascending: boolean }> = {
+  newest: { column: 'created_at', ascending: false },
+  oldest: { column: 'created_at', ascending: true },
+  name: { column: 'name', ascending: true },
+  size: { column: 'size', ascending: false },
 }
 
 function toRecord(client: SupabaseClient, row: MediaRow): PlutoMedia {
@@ -34,6 +51,16 @@ function toRecord(client: SupabaseClient, row: MediaRow): PlutoMedia {
     height: row.height,
     alt: row.alt ?? '',
     createdAt: row.created_at,
+    // A preview is always in the `media` bucket.
+    preview:
+      row.preview_path && row.preview_width && row.preview_height
+        ? {
+            url: client.storage.from(MEDIA_BUCKET).getPublicUrl(row.preview_path)
+              .data.publicUrl,
+            width: row.preview_width,
+            height: row.preview_height,
+          }
+        : null,
   }
 }
 
@@ -58,8 +85,9 @@ function numericIds(ids: string[]): number[] {
  * The media driver of the Supabase backend: the bytes in Supabase Storage,
  * the record in `public.media` (db/migrations/009_media.sql). Row Level
  * Security checks the capabilities again (`has_capability`). New files go to
- * `media/<yyyy>/<mm>/<name>-<suffix>.<ext>`. See the media skill of
- * `@plutocms/pluto`.
+ * `media/<yyyy>/<mm>/<name>-<suffix>.<ext>`, and their previews next to them
+ * (`db/migrations/010_media_preview.sql`). See the media skill of
+ * `@plutocms/core`.
  */
 export function createSupabaseMediaDriver(): PlutoMediaDriver {
   async function readRow(client: SupabaseClient, id: string): Promise<MediaRow> {
@@ -90,11 +118,12 @@ export function createSupabaseMediaDriver(): PlutoMediaDriver {
 
     async list(event, query) {
       const client = await supabaseRequestClient(event)
+      const order = ORDER[query.sort ?? 'newest']
       let request = client
         .from('media')
         .select('*', { count: 'exact' })
-        .order('created_at', { ascending: false })
-        .order('id', { ascending: false })
+        .order(order.column, { ascending: order.ascending, nullsFirst: false })
+        .order('id', { ascending: order.ascending })
         .range(query.offset, query.offset + query.limit - 1)
       if (query.search) {
         // Commas and brackets have a meaning in a PostgREST `or` filter.
@@ -135,8 +164,10 @@ export function createSupabaseMediaDriver(): PlutoMediaDriver {
 
     async upload(event, input) {
       const client = await supabaseRequestClient(event)
-      const date = new Date(input.createdAt)
-      const path = `${date.getUTCFullYear()}/${String(date.getUTCMonth() + 1).padStart(2, '0')}/${input.fileName}`
+      const path = monthKey(input.createdAt, input.fileName)
+      const previewPath = input.preview
+        ? monthKey(input.createdAt, input.preview.fileName)
+        : null
       const storage = client.storage.from(MEDIA_BUCKET)
       const { error: uploadError } = await storage.upload(path, input.data, {
         contentType: input.mimeType,
@@ -146,6 +177,17 @@ export function createSupabaseMediaDriver(): PlutoMediaDriver {
       if (uploadError) {
         throw failed(uploadError.message, 'pluto.media.errors.saveFailed')
       }
+      if (input.preview && previewPath) {
+        const { error: previewError } = await storage.upload(
+          previewPath,
+          input.preview.data,
+          { contentType: input.preview.mimeType, cacheControl: '31536000', upsert: true }
+        )
+        if (previewError) {
+          await storage.remove([path])
+          throw failed(previewError.message, 'pluto.media.errors.saveFailed')
+        }
+      }
       const { data, error } = await client
         .from('media')
         .insert({
@@ -158,12 +200,17 @@ export function createSupabaseMediaDriver(): PlutoMediaDriver {
           width: input.width,
           height: input.height,
           created_at: input.createdAt,
+          preview_path: previewPath,
+          preview_width: input.preview?.width ?? null,
+          preview_height: input.preview?.height ?? null,
         })
         .select('*')
         .single()
       if (error) {
         // No record without its file, and no file without its record.
-        const { error: cleanup } = await storage.remove([path])
+        const { error: cleanup } = await storage.remove(
+          previewPath ? [path, previewPath] : [path]
+        )
         if (cleanup) {
           console.warn('[media] could not remove the file of a failed upload:', path, cleanup.message)
         }
@@ -176,6 +223,9 @@ export function createSupabaseMediaDriver(): PlutoMediaDriver {
       const client = await supabaseRequestClient(event)
       const row = await readRow(client, id)
       const changes: Partial<MediaRow> = {}
+      if (patch.name !== undefined) {
+        changes.name = patch.name
+      }
       if (patch.alt !== undefined) {
         changes.alt = patch.alt || null
       }
@@ -197,6 +247,39 @@ export function createSupabaseMediaDriver(): PlutoMediaDriver {
       return toRecord(client, data as MediaRow)
     },
 
+    async setPreview(event, id, preview) {
+      const client = await supabaseRequestClient(event)
+      const row = await readRow(client, id)
+      const storage = client.storage.from(MEDIA_BUCKET)
+      const path = monthKey(row.created_at, preview.fileName)
+      const { error: uploadError } = await storage.upload(path, preview.data, {
+        contentType: preview.mimeType,
+        cacheControl: '31536000',
+        upsert: true,
+      })
+      if (uploadError) {
+        throw failed(uploadError.message, 'pluto.media.errors.saveFailed')
+      }
+      const { data, error } = await client
+        .from('media')
+        .update({
+          preview_path: path,
+          preview_width: preview.width,
+          preview_height: preview.height,
+        })
+        .eq('id', row.id)
+        .select('*')
+        .single()
+      if (error) {
+        throw failed(error.message, 'pluto.media.errors.saveFailed')
+      }
+      // An older preview with another name (another type) goes.
+      if (row.preview_path && row.preview_path !== path) {
+        await storage.remove([row.preview_path])
+      }
+      return toRecord(client, data as MediaRow)
+    },
+
     async remove(event, id) {
       const client = await supabaseRequestClient(event)
       const row = await readRow(client, id)
@@ -209,6 +292,9 @@ export function createSupabaseMediaDriver(): PlutoMediaDriver {
           throw failed(error.message, 'pluto.media.errors.deleteFailed')
         }
       }
+      if (row.preview_path) {
+        await client.storage.from(MEDIA_BUCKET).remove([row.preview_path])
+      }
       const { error } = await client.from('media').delete().eq('id', row.id)
       if (error) {
         throw failed(error.message, 'pluto.media.errors.deleteFailed')

package/server/utils/validate.ts

@@ -4,7 +4,7 @@ import type { ZodSchema } from 'zod'
 /**
  * One field-level validation error.
  *
- * Matches `ContentValidationError` from `@plutocms/pluto`'s
+ * Matches `ContentValidationError` from `@plutocms/core`'s
  * `shared/utils/content-validate.ts`, so a zod failure and a content-model
  * failure look the same to a caller.
  */
@@ -17,7 +17,7 @@ export interface ValidationError {
  * Reads a request body and checks it against a zod schema.
  *
  * On success, returns the parsed, typed body. On failure, throws the same
- * 400 shape `@plutocms/pluto`'s generic content routes throw for a content
+ * 400 shape `@plutocms/core`'s generic content routes throw for a content
  * validation failure: `{ statusCode: 400, statusMessage: 'Validation
  * failed.', data: { errors } }`, with `errors` as `{ field, message }[]`.
  * Every route in this workspace should call this helper instead of

package/tailwind.lint.css

@@ -6,4 +6,4 @@
  */
 @import 'tailwindcss';
 @import '@nuxt/ui';
-@import '@plutocms/pluto/app/assets/css/pluto-layer.css';
+@import '@plutocms/core/app/assets/css/pluto-layer.css';