@plutocms/supabase 0.15.0 → 0.15.2

package/.prettierignore

@@ -1,2 +1,8 @@
 # Agent skill files keep their own formatting. Prettier must not rewrite them.
 .agents/**/*.md
+
+# Generated by release-please.
+CHANGELOG.md
+
+# Generated by scripts/supabase-typegen.ts.
+shared/types/supabase.ts

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## [0.15.2](https://github.com/plutocms/supabase/compare/v0.15.1...v0.15.2) (2026-10-29)
+
+
+### Bug Fixes
+
+* **deps:** use @plutocms/pluto 0.32 ([#117](https://github.com/plutocms/supabase/issues/117)) ([51e841d](https://github.com/plutocms/supabase/commit/51e841dc33cd887b22e14d05335eaa75a953ed09))
+
+## [0.15.1](https://github.com/plutocms/supabase/compare/v0.15.0...v0.15.1) (2026-10-28)
+
+
+### Bug Fixes
+
+* **deps:** use @plutocms/pluto 0.30; Prettier formatting and canonical Tailwind classes ([#111](https://github.com/plutocms/supabase/issues/111)) ([925c138](https://github.com/plutocms/supabase/commit/925c1386ad2c4380e2e3217766c0ae342d96cae8))
+
 ## [0.15.0](https://github.com/plutocms/supabase/compare/v0.14.1...v0.15.0) (2026-10-28)
 
 

package/app/components/access/DeleteRoleModal.vue

@@ -23,7 +23,9 @@ async function remove() {
   working.value = true
 
   try {
-    await $fetch(`/api/_pluto/supabase/access/roles/${props.role.key}`, { method: 'DELETE' })
+    await $fetch(`/api/_pluto/supabase/access/roles/${props.role.key}`, {
+      method: 'DELETE',
+    })
 
     toast.add({
       title: t('supabase.access.toasts.roleDeleted'),
@@ -52,7 +54,9 @@ async function remove() {
   >
     <template #body>
       <UAlert
-        :description="t('supabase.access.deleteRole.usersLose', role.user_count)"
+        :description="
+          t('supabase.access.deleteRole.usersLose', role.user_count)
+        "
         :color="role.user_count > 0 ? 'warning' : 'neutral'"
         variant="subtle"
         icon="lucide:users"
@@ -61,10 +65,19 @@ async function remove() {
 
     <template #footer>
       <div class="flex w-full justify-end gap-2">
-        <UButton color="neutral" variant="outline" @click="emit('close', false)">
+        <UButton
+          color="neutral"
+          variant="outline"
+          @click="emit('close', false)"
+        >
           {{ t('pluto.common.cancel') }}
         </UButton>
-        <UButton :loading="working" color="error" icon="lucide:trash-2" @click="remove">
+        <UButton
+          :loading="working"
+          color="error"
+          icon="lucide:trash-2"
+          @click="remove"
+        >
           {{ t('supabase.access.deleteRole.confirm') }}
         </UButton>
       </div>

package/app/components/access/EditRolesSlideover.vue

@@ -3,7 +3,11 @@
 // roles of the signed-in admin loads the permissions again, so the menu and
 // the tabs follow at once.
 import type { AccessRole, AccessUser } from '../../../shared/types/access'
-import { ADMIN_ROLE_KEY, sameKeys, userDisplayName } from '../../utils/access-ui'
+import {
+  ADMIN_ROLE_KEY,
+  sameKeys,
+  userDisplayName,
+} from '../../utils/access-ui'
 
 const props = defineProps<{
   user: AccessUser | null
@@ -43,14 +47,16 @@ const items = computed(() =>
 )
 
 const name = computed(() => (props.user ? userDisplayName(props.user) : ''))
-const unchanged = computed(() => !props.user || sameKeys(roleKeys.value, props.user.roles))
+const unchanged = computed(
+  () => !props.user || sameKeys(roleKeys.value, props.user.roles)
+)
 
 // The warning shows when the admin removes their own admin role.
 const removesOwnAdmin = computed(
   () =>
-    props.self
-    && (props.user?.roles.includes(ADMIN_ROLE_KEY) ?? false)
-    && !roleKeys.value.includes(ADMIN_ROLE_KEY)
+    props.self &&
+    (props.user?.roles.includes(ADMIN_ROLE_KEY) ?? false) &&
+    !roleKeys.value.includes(ADMIN_ROLE_KEY)
 )
 
 async function save() {

package/app/components/access/InviteModal.vue

@@ -85,16 +85,21 @@ async function submit() {
   mailProblem.value = null
 
   try {
-    const result = await $fetch<AccessInviteResult>('/api/_pluto/supabase/access/users/invite', {
-      method: 'POST',
-      body: { ...body(), locale: emailLocale.value },
-    })
+    const result = await $fetch<AccessInviteResult>(
+      '/api/_pluto/supabase/access/users/invite',
+      {
+        method: 'POST',
+        body: { ...body(), locale: emailLocale.value },
+      }
+    )
 
     emit('done')
 
     if (result.status === 'granted') {
       toast.add({
-        title: t('supabase.access.toasts.granted', { email: email.value.trim() }),
+        title: t('supabase.access.toasts.granted', {
+          email: email.value.trim(),
+        }),
         color: 'success',
         icon: 'lucide:circle-check',
       })
@@ -103,13 +108,17 @@ async function submit() {
       // The user exists and has the roles. Only the email failed.
       link.value = result.link
       toast.add({
-        title: t('supabase.access.toasts.emailFailed', { email: email.value.trim() }),
+        title: t('supabase.access.toasts.emailFailed', {
+          email: email.value.trim(),
+        }),
         color: 'warning',
         icon: 'lucide:triangle-alert',
       })
     } else {
       toast.add({
-        title: t('supabase.access.toasts.invited', { email: email.value.trim() }),
+        title: t('supabase.access.toasts.invited', {
+          email: email.value.trim(),
+        }),
         color: 'success',
         icon: 'lucide:circle-check',
       })
@@ -139,10 +148,13 @@ async function copyLink() {
   submitting.value = true
 
   try {
-    const result = await $fetch<{ status: 'invited' | 'granted', link: string | null }>(
-      '/api/_pluto/supabase/access/users/invite-link',
-      { method: 'POST', body: body() }
-    )
+    const result = await $fetch<{
+      status: 'invited' | 'granted'
+      link: string | null
+    }>('/api/_pluto/supabase/access/users/invite-link', {
+      method: 'POST',
+      body: body(),
+    })
 
     mailProblem.value = null
     emit('done')
@@ -180,8 +192,16 @@ async function setupEmail() {
 <template>
   <UModal
     v-model:open="open"
-    :title="link ? t('supabase.access.invite.linkTitle') : t('supabase.access.invite.title')"
-    :description="link ? t('supabase.access.invite.linkDescription') : t('supabase.access.invite.description')"
+    :title="
+      link
+        ? t('supabase.access.invite.linkTitle')
+        : t('supabase.access.invite.title')
+    "
+    :description="
+      link
+        ? t('supabase.access.invite.linkDescription')
+        : t('supabase.access.invite.description')
+    "
   >
     <template #body>
       <AccessLinkField v-if="link" :link="link" />
@@ -219,10 +239,7 @@ async function setupEmail() {
           </template>
         </UAlert>
 
-        <p
-          v-if="mailProblem && !canCopyLink"
-          class="text-muted text-sm"
-        >
+        <p v-if="mailProblem && !canCopyLink" class="text-muted text-sm">
           {{ t('supabase.access.invite.needsKey') }}
         </p>
 
@@ -248,7 +265,11 @@ async function setupEmail() {
 
         <UFormField
           :label="t('supabase.access.invite.roles')"
-          :error="showRolesError && roleKeys.length === 0 ? t('supabase.access.invite.rolesRequired') : undefined"
+          :error="
+            showRolesError && roleKeys.length === 0
+              ? t('supabase.access.invite.rolesRequired')
+              : undefined
+          "
           required
         >
           <UCheckboxGroup v-model="roleKeys" :items="roleItems" />
@@ -258,7 +279,11 @@ async function setupEmail() {
           :label="t('supabase.access.invite.locale')"
           :description="t('supabase.access.invite.localeHint')"
         >
-          <USelect v-model="emailLocale" :items="localeItems" class="w-full sm:w-64" />
+          <USelect
+            v-model="emailLocale"
+            :items="localeItems"
+            class="w-full sm:w-64"
+          />
         </UFormField>
 
         <!-- Enter in a field submits the form. -->

package/app/components/access/LinkField.vue

@@ -9,10 +9,21 @@ const { t } = usePlutoI18n()
 </script>
 
 <template>
-  <UFormField :label="t('supabase.access.link.label')" :help="t('supabase.access.link.note')">
-    <UInput :model-value="link" class="w-full" readonly @focus="($event.target as HTMLInputElement).select()">
+  <UFormField
+    :label="t('supabase.access.link.label')"
+    :help="t('supabase.access.link.note')"
+  >
+    <UInput
+      :model-value="link"
+      class="w-full"
+      readonly
+      @focus="($event.target as HTMLInputElement).select()"
+    >
       <template #trailing>
-        <AccessCopyButton :text="link" :label="t('supabase.access.link.copy')" />
+        <AccessCopyButton
+          :text="link"
+          :label="t('supabase.access.link.copy')"
+        />
       </template>
     </UInput>
   </UFormField>

package/app/components/access/LinkModal.vue

@@ -20,7 +20,11 @@ const { t } = usePlutoI18n()
 
     <template #footer>
       <div class="flex w-full justify-end">
-        <UButton color="neutral" variant="outline" @click="emit('close', false)">
+        <UButton
+          color="neutral"
+          variant="outline"
+          @click="emit('close', false)"
+        >
           {{ t('pluto.common.close') }}
         </UButton>
       </div>

package/app/components/access/RevokeModal.vue

@@ -27,7 +27,9 @@ async function revoke() {
   working.value = true
 
   try {
-    await $fetch(`/api/_pluto/supabase/access/users/${props.user.id}/roles`, { method: 'DELETE' })
+    await $fetch(`/api/_pluto/supabase/access/users/${props.user.id}/roles`, {
+      method: 'DELETE',
+    })
 
     toast.add({
       title: t('supabase.access.toasts.revoked'),
@@ -56,7 +58,9 @@ async function revoke() {
 <template>
   <UModal
     :title="t('supabase.access.revoke.title')"
-    :description="t('supabase.access.revoke.body', { name: userDisplayName(user) })"
+    :description="
+      t('supabase.access.revoke.body', { name: userDisplayName(user) })
+    "
     :close="{ onClick: () => emit('close', false) }"
   >
     <template #body>
@@ -71,10 +75,19 @@ async function revoke() {
 
     <template #footer>
       <div class="flex w-full justify-end gap-2">
-        <UButton color="neutral" variant="outline" @click="emit('close', false)">
+        <UButton
+          color="neutral"
+          variant="outline"
+          @click="emit('close', false)"
+        >
           {{ t('pluto.common.cancel') }}
         </UButton>
-        <UButton :loading="working" color="error" icon="lucide:user-x" @click="revoke">
+        <UButton
+          :loading="working"
+          color="error"
+          icon="lucide:user-x"
+          @click="revoke"
+        >
           {{ t('supabase.access.revoke.confirm') }}
         </UButton>
       </div>

package/app/components/access/RoleSlideover.vue

@@ -94,7 +94,10 @@ function groupValue(group: CapabilityGroup): string[] {
 function setGroup(group: CapabilityGroup, value: string[]) {
   const keys = new Set(group.items.map((item) => item.key))
 
-  selected.value = [...selected.value.filter((current) => !keys.has(current)), ...value]
+  selected.value = [
+    ...selected.value.filter((current) => !keys.has(current)),
+    ...value,
+  ]
 }
 
 const keyError = computed(() =>
@@ -112,11 +115,11 @@ async function save() {
   submitted.value = true
 
   if (
-    saving.value
-    || fullAccess.value
-    || !label.value.trim()
-    || keyError.value
-    || capabilitiesError.value
+    saving.value ||
+    fullAccess.value ||
+    !label.value.trim() ||
+    keyError.value ||
+    capabilitiesError.value
   ) {
     return
   }
@@ -136,7 +139,10 @@ async function save() {
         body: { ...body, key: key.value },
       })
     } else {
-      await $fetch(`/api/_pluto/supabase/access/roles/${props.role!.key}`, { method: 'PUT', body })
+      await $fetch(`/api/_pluto/supabase/access/roles/${props.role!.key}`, {
+        method: 'PUT',
+        body,
+      })
     }
 
     toast.add({
@@ -180,7 +186,11 @@ async function save() {
       <form v-else class="flex flex-col gap-y-5" @submit.prevent="save">
         <UFormField
           :label="t('supabase.access.role.label')"
-          :error="submitted && !label.trim() ? t('supabase.access.errors.invalidLabel') : undefined"
+          :error="
+            submitted && !label.trim()
+              ? t('supabase.access.errors.invalidLabel')
+              : undefined
+          "
           required
         >
           <UInput
@@ -222,8 +232,14 @@ async function save() {
           required
         >
           <div class="flex flex-col gap-y-4">
-            <div v-for="group in groups" :key="group.id" class="flex flex-col gap-y-2">
-              <h3 class="text-highlighted text-sm font-semibold">{{ group.label }}</h3>
+            <div
+              v-for="group in groups"
+              :key="group.id"
+              class="flex flex-col gap-y-2"
+            >
+              <h3 class="text-highlighted text-sm font-semibold">
+                {{ group.label }}
+              </h3>
               <UCheckboxGroup
                 :model-value="groupValue(group)"
                 :items="groupItems(group)"
@@ -242,7 +258,12 @@ async function save() {
         <UButton color="neutral" variant="outline" @click="open = false">
           {{ fullAccess ? t('pluto.common.close') : t('pluto.common.cancel') }}
         </UButton>
-        <UButton v-if="!fullAccess" :loading="saving" icon="lucide:save" @click="save">
+        <UButton
+          v-if="!fullAccess"
+          :loading="saving"
+          icon="lucide:save"
+          @click="save"
+        >
           {{ t('supabase.access.role.save') }}
         </UButton>
       </div>

package/app/components/mail/AuthEmailsPanel.vue

@@ -12,24 +12,68 @@ import {
 
 const { t } = usePlutoI18n()
 
-const projectRef = computed(() => supabaseProjectRef(useRuntimeConfig().public.supabase?.url))
-const links = computed(() => (projectRef.value ? supabaseDashboardLinks(projectRef.value) : null))
+const projectRef = computed(() =>
+  supabaseProjectRef(useRuntimeConfig().public.supabase?.url)
+)
+const links = computed(() =>
+  projectRef.value ? supabaseDashboardLinks(projectRef.value) : null
+)
 
 const smtpRows = computed(() => [
-  { key: 'host', label: t('supabase.mail.authEmails.host'), value: RESEND_SMTP.host, copy: RESEND_SMTP.host },
-  { key: 'port', label: t('supabase.mail.authEmails.port'), value: RESEND_SMTP.port, copy: RESEND_SMTP.port },
-  { key: 'username', label: t('supabase.mail.authEmails.username'), value: RESEND_SMTP.username, copy: RESEND_SMTP.username },
+  {
+    key: 'host',
+    label: t('supabase.mail.authEmails.host'),
+    value: RESEND_SMTP.host,
+    copy: RESEND_SMTP.host,
+  },
+  {
+    key: 'port',
+    label: t('supabase.mail.authEmails.port'),
+    value: RESEND_SMTP.port,
+    copy: RESEND_SMTP.port,
+  },
+  {
+    key: 'username',
+    label: t('supabase.mail.authEmails.username'),
+    value: RESEND_SMTP.username,
+    copy: RESEND_SMTP.username,
+  },
   // The password is the API key. Pluto never shows it, so there is nothing to copy.
-  { key: 'password', label: t('supabase.mail.authEmails.password'), value: t('supabase.mail.authEmails.passwordValue'), copy: null },
+  {
+    key: 'password',
+    label: t('supabase.mail.authEmails.password'),
+    value: t('supabase.mail.authEmails.passwordValue'),
+    copy: null,
+  },
 ])
 
 const dashboardLinks = computed(() =>
   links.value
     ? [
-        { key: 'smtp', label: t('supabase.mail.authEmails.dashboardSmtp'), to: links.value.smtp, icon: 'lucide:mail' },
-        { key: 'templates', label: t('supabase.mail.authEmails.dashboardTemplates'), to: links.value.templates, icon: 'lucide:layout-template' },
-        { key: 'rateLimits', label: t('supabase.mail.authEmails.dashboardRateLimits'), to: links.value.rateLimits, icon: 'lucide:gauge' },
-        { key: 'project', label: t('supabase.mail.authEmails.dashboardHome'), to: links.value.project, icon: 'lucide:external-link' },
+        {
+          key: 'smtp',
+          label: t('supabase.mail.authEmails.dashboardSmtp'),
+          to: links.value.smtp,
+          icon: 'lucide:mail',
+        },
+        {
+          key: 'templates',
+          label: t('supabase.mail.authEmails.dashboardTemplates'),
+          to: links.value.templates,
+          icon: 'lucide:layout-template',
+        },
+        {
+          key: 'rateLimits',
+          label: t('supabase.mail.authEmails.dashboardRateLimits'),
+          to: links.value.rateLimits,
+          icon: 'lucide:gauge',
+        },
+        {
+          key: 'project',
+          label: t('supabase.mail.authEmails.dashboardHome'),
+          to: links.value.project,
+          icon: 'lucide:external-link',
+        },
       ]
     : []
 )
@@ -40,8 +84,12 @@ const dashboardLinks = computed(() =>
     <p class="text-muted text-sm">{{ t('supabase.mail.authEmails.intro') }}</p>
 
     <section class="flex flex-col gap-y-2">
-      <h3 class="text-highlighted text-sm font-semibold">{{ t('supabase.mail.authEmails.resendTitle') }}</h3>
-      <p class="text-muted text-sm">{{ t('supabase.mail.authEmails.resendBody') }}</p>
+      <h3 class="text-highlighted text-sm font-semibold">
+        {{ t('supabase.mail.authEmails.resendTitle') }}
+      </h3>
+      <p class="text-muted text-sm">
+        {{ t('supabase.mail.authEmails.resendBody') }}
+      </p>
       <div>
         <UButton
           :to="RESEND_SUPABASE_INTEGRATION_URL"
@@ -57,24 +105,41 @@ const dashboardLinks = computed(() =>
     </section>
 
     <section class="flex flex-col gap-y-2">
-      <h3 class="text-highlighted text-sm font-semibold">{{ t('supabase.mail.authEmails.manualTitle') }}</h3>
-      <p class="text-muted text-sm">{{ t('supabase.mail.authEmails.manualBody') }}</p>
+      <h3 class="text-highlighted text-sm font-semibold">
+        {{ t('supabase.mail.authEmails.manualTitle') }}
+      </h3>
+      <p class="text-muted text-sm">
+        {{ t('supabase.mail.authEmails.manualBody') }}
+      </p>
 
-      <ul class="border-default bg-elevated/50 divide-default divide-y rounded-md border">
-        <li v-for="row in smtpRows" :key="row.key" class="flex items-center gap-3 px-3 py-2">
+      <ul
+        class="border-default bg-elevated/50 divide-default divide-y rounded-md border"
+      >
+        <li
+          v-for="row in smtpRows"
+          :key="row.key"
+          class="flex items-center gap-3 px-3 py-2"
+        >
           <span class="text-muted w-24 shrink-0 text-sm">{{ row.label }}</span>
-          <code class="min-w-0 flex-1 overflow-x-auto text-sm whitespace-nowrap">{{ row.value }}</code>
+          <code
+            class="min-w-0 flex-1 overflow-x-auto text-sm whitespace-nowrap"
+            >{{ row.value }}</code
+          >
           <AccessCopyButton
             v-if="row.copy"
             :text="row.copy"
-            :label="t('supabase.mail.authEmails.copyValue', { label: row.label })"
+            :label="
+              t('supabase.mail.authEmails.copyValue', { label: row.label })
+            "
           />
         </li>
       </ul>
     </section>
 
     <section class="flex flex-col gap-y-2">
-      <h3 class="text-highlighted text-sm font-semibold">{{ t('supabase.mail.authEmails.dashboardTitle') }}</h3>
+      <h3 class="text-highlighted text-sm font-semibold">
+        {{ t('supabase.mail.authEmails.dashboardTitle') }}
+      </h3>
 
       <div v-if="dashboardLinks.length > 0" class="flex flex-wrap gap-2">
         <UButton
@@ -91,7 +156,9 @@ const dashboardLinks = computed(() =>
           {{ link.label }}
         </UButton>
       </div>
-      <p v-else class="text-muted text-sm">{{ t('supabase.mail.authEmails.noProject') }}</p>
+      <p v-else class="text-muted text-sm">
+        {{ t('supabase.mail.authEmails.noProject') }}
+      </p>
 
       <p v-if="dashboardLinks.length > 0" class="text-muted text-xs">
         {{ t('supabase.mail.authEmails.dashboardNote') }}

package/app/components/migrations/MigrationsBanner.vue

@@ -14,9 +14,9 @@ const title = computed(() =>
 
 const isVisible = computed(
   () =>
-    Boolean(status.value)
-    && pendingCount.value > 0
-    && !route.path.startsWith('/admin/migrations')
+    Boolean(status.value) &&
+    pendingCount.value > 0 &&
+    !route.path.startsWith('/admin/migrations')
 )
 </script>
 
@@ -30,7 +30,8 @@ const isVisible = computed(
         icon="lucide:triangle-alert"
       >
         <template #description>
-          <ULink to="/admin/migrations" class="underline"> {{ t('supabase.migrations.goTo') }} </ULink
+          <ULink to="/admin/migrations" class="underline">
+            {{ t('supabase.migrations.goTo') }} </ULink
           >.
         </template>
       </UAlert>

package/app/composables/migrations.ts

@@ -73,10 +73,13 @@ export function useMigrations() {
     let result: RunMigrationsResponse
 
     try {
-      result = await $fetch<RunMigrationsResponse>('/api/_pluto/supabase/migrations/run', {
-        method: 'POST',
-        body: connectionString ? { connectionString } : undefined,
-      })
+      result = await $fetch<RunMigrationsResponse>(
+        '/api/_pluto/supabase/migrations/run',
+        {
+          method: 'POST',
+          body: connectionString ? { connectionString } : undefined,
+        }
+      )
     } catch (error) {
       // The route answers a failed run with an HTTP error that carries
       // `needsConnectionString` or `error` in its data. Turn it back into
@@ -84,13 +87,17 @@ export function useMigrations() {
       // (for example a dropped connection) goes on to the caller.
       const failure = failureData(error)
 
-      if (failure?.needsConnectionString !== true && typeof failure?.error !== 'string') {
+      if (
+        failure?.needsConnectionString !== true &&
+        typeof failure?.error !== 'string'
+      ) {
         throw error
       }
 
       result = {
         success: false,
-        needsConnectionString: failure.needsConnectionString === true ? true : undefined,
+        needsConnectionString:
+          failure.needsConnectionString === true ? true : undefined,
         error: typeof failure.error === 'string' ? failure.error : undefined,
       }
     }

package/app/pages/admin/(auth)/accept-invite.vue

@@ -86,11 +86,23 @@ async function submitForm() {
 
 <template>
   <PlutoAdminAuthCard
-    :title="state === 'ready' ? t('supabase.auth.invite.title') : t('supabase.auth.invite.pageTitle')"
-    :description="state === 'ready' ? t('supabase.auth.invite.description') : undefined"
+    :title="
+      state === 'ready'
+        ? t('supabase.auth.invite.title')
+        : t('supabase.auth.invite.pageTitle')
+    "
+    :description="
+      state === 'ready' ? t('supabase.auth.invite.description') : undefined
+    "
   >
-    <div v-if="state === 'checking'" class="flex items-center justify-center py-10">
-      <UIcon name="lucide:loader-circle" class="size-6 animate-spin text-muted" />
+    <div
+      v-if="state === 'checking'"
+      class="flex items-center justify-center py-10"
+    >
+      <UIcon
+        name="lucide:loader-circle"
+        class="size-6 animate-spin text-muted"
+      />
     </div>
 
     <div v-else-if="state !== 'ready'" class="space-y-6 py-10 text-center">
@@ -99,7 +111,11 @@ async function submitForm() {
       </span>
 
       <p>
-        {{ state === 'expired' ? t('supabase.auth.invite.expired') : t('supabase.auth.invite.invalid') }}
+        {{
+          state === 'expired'
+            ? t('supabase.auth.invite.expired')
+            : t('supabase.auth.invite.invalid')
+        }}
       </p>
 
       <div class="flex items-center justify-center">