@plutocms/supabase 0.1.1 → 0.2.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## [0.2.0](https://github.com/plutocms/supabase/compare/v0.1.2...v0.2.0) (2026-09-09)
+
+
+### Features
+
+* make admin account views responsive ([#35](https://github.com/plutocms/supabase/issues/35)) ([cfa5bf0](https://github.com/plutocms/supabase/commit/cfa5bf0b902e0180272eb40d0d170589442ea179))
+
+## [0.1.2](https://github.com/plutocms/supabase/compare/v0.1.1...v0.1.2) (2026-09-08)
+
+
+### Bug Fixes
+
+* type layerSchemas runtime config as Record<string, string> ([0ad5a8a](https://github.com/plutocms/supabase/commit/0ad5a8a42751e33c87e0c733df8344616e3706e0))
+
 ## [0.1.1](https://github.com/plutocms/supabase/compare/v0.1.0...v0.1.1) (2026-09-03)
 
 

package/app/components/navbar/NavbarAdmin.vue

@@ -5,6 +5,11 @@ import { domainFromUrl } from '#imports'
 const host = useRequestURL().host
 
 const route = useRoute()
+const isSidebarOpen = useState<boolean>('pluto-admin-sidebar-open', () => false)
+
+function openSidebar() {
+  isSidebarOpen.value = true
+}
 
 const { isLoggedIn, user, logout } = await useAuth()
 
@@ -81,8 +86,20 @@ defineShortcuts(extractShortcuts(items.value))
 
 <template>
   <PlutoNavbarAdmin>
-    <div class="flex h-full items-stretch justify-between px-4">
-      <div class="flex items-center gap-x-3">
+    <div
+      class="flex h-full min-w-0 items-stretch justify-between gap-1 px-2 lg:px-4"
+    >
+      <div class="flex min-w-0 items-center gap-x-1 lg:gap-x-3">
+        <UButton
+          class="lg:hidden"
+          icon="lucide:menu"
+          color="neutral"
+          variant="ghost"
+          aria-label="Open navigation"
+          square
+          @click="openSidebar"
+        />
+
         <div class="h-full shrink-0 py-1">
           <NuxtLink
             title="Go to dashboard home"
@@ -96,8 +113,8 @@ defineShortcuts(extractShortcuts(items.value))
           </NuxtLink>
         </div>
 
-        <div class="h-full">
-          <ul class="flex h-full items-center text-sm">
+        <div class="min-w-0 h-full overflow-hidden">
+          <ul class="flex h-full min-w-0 items-center text-sm">
             <NavbarAdminActionButton
               :show="route.path.startsWith('/admin')"
               :title="`Visit ${domainFromUrl(maybeDevUrl)}`"
@@ -129,7 +146,7 @@ defineShortcuts(extractShortcuts(items.value))
         </div>
       </div>
 
-      <div class="flex items-center gap-3">
+      <div class="flex shrink-0 items-center gap-1 lg:gap-3">
         <ColorModeButton />
 
         <div class="h-full">
@@ -140,7 +157,11 @@ defineShortcuts(extractShortcuts(items.value))
             }"
             :modal="false"
           >
-            <button class="group h-full py-1">
+            <button
+              class="group h-full py-1"
+              aria-label="Open user menu"
+              type="button"
+            >
               <div
                 class="flex h-full items-center gap-x-2 rounded-sm rounded-l-xl pr-2 pl-0.5 group-hover:bg-white/20"
               >
@@ -156,7 +177,7 @@ defineShortcuts(extractShortcuts(items.value))
                 />
 
                 <span
-                  class="light:text-zinc-800 text-sm font-bold dark:text-white"
+                  class="light:text-zinc-800 hidden text-sm font-bold dark:text-white lg:inline"
                 >
                   {{ user?.display_name.split(' ')[0] || 'User' }}
                 </span>

package/app/pages/admin/(auth)/confirm.vue

@@ -9,8 +9,8 @@ useHead({
 </script>
 
 <template>
-  <div class="grid h-full place-items-center">
-    <UCard class="w-100">
+  <div class="grid min-h-dvh place-items-center p-4">
+    <UCard class="w-full max-w-100">
       <div class="space-y-6 py-10">
         <div class="text-center space-y-4">
           <hgroup class="flex flex-col gap-y-1">

package/app/pages/admin/(auth)/forgot-password.vue

@@ -22,8 +22,8 @@ async function submitForm() {
 </script>
 
 <template>
-  <div class="grid h-full place-items-center">
-    <UCard class="w-100">
+  <div class="grid min-h-dvh place-items-center p-4">
+    <UCard class="w-full max-w-100">
       <div v-if="isEmailSent" class="space-y-6 py-10">
         <div class="text-center space-y-4">
           <hgroup class="flex flex-col gap-y-1">
@@ -68,9 +68,16 @@ async function submitForm() {
             />
           </UFormField>
 
-          <div class="flex items-center justify-between gap-x-4">
+          <div
+            class="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between sm:gap-x-4"
+          >
             <UFormField>
-              <UButton :loading="isSubmitting" type="submit" icon="lucide:send">
+              <UButton
+                :loading="isSubmitting"
+                type="submit"
+                icon="lucide:send"
+                class="w-full justify-center sm:w-auto"
+              >
                 Send Reset Link
               </UButton>
             </UFormField>

package/app/pages/admin/(auth)/login.vue

@@ -25,8 +25,8 @@ function submitForm() {
 </script>
 
 <template>
-  <div class="grid h-full place-items-center">
-    <UCard class="w-100">
+  <div class="grid min-h-dvh place-items-center p-4">
+    <UCard class="w-full max-w-100">
       <form @submit.prevent="submitForm">
         <div class="flex flex-col gap-y-6">
           <h1 class="text-3xl font-bold">Login</h1>
@@ -49,12 +49,15 @@ function submitForm() {
             />
           </UFormField>
 
-          <div class="flex items-center justify-between gap-x-4">
+          <div
+            class="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between sm:gap-x-4"
+          >
             <UFormField>
               <UButton
                 :loading="isSubmitting"
                 type="submit"
                 icon="lucide:log-in"
+                class="w-full justify-center sm:w-auto"
               >
                 Login
               </UButton>
@@ -67,7 +70,9 @@ function submitForm() {
             </UFormField>
           </div>
 
-          <div class="flex items-center justify-between">
+          <div
+            class="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between"
+          >
             <UButton
               variant="link"
               icon="lucide:arrow-left"

package/app/pages/admin/(auth)/signup.vue

@@ -68,8 +68,8 @@ async function submitForm() {
 </script>
 
 <template>
-  <div class="grid h-full place-items-center">
-    <UCard class="w-100">
+  <div class="grid min-h-dvh place-items-center p-4">
+    <UCard class="w-full max-w-120">
       <div v-if="isEmailVerificationMessageVisible" class="space-y-6 py-10">
         <div class="text-center space-y-4">
           <hgroup class="flex flex-col gap-y-1">
@@ -118,7 +118,7 @@ async function submitForm() {
             />
           </UFormField>
 
-          <div class="flex gap-x-4">
+          <div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
             <UFormField label="Username" required>
               <UInput
                 v-model="form.username"
@@ -159,7 +159,9 @@ async function submitForm() {
             />
           </UFormField>
 
-          <div class="flex items-center justify-between gap-x-4">
+          <div
+            class="flex flex-col-reverse gap-2 sm:flex-row sm:items-center sm:justify-between sm:gap-x-4"
+          >
             <UFormField>
               <UButton
                 to="/admin/login"
@@ -176,6 +178,7 @@ async function submitForm() {
                 :disabled="isSubmitting || !passwordMatch"
                 :loading="isSubmitting"
                 type="submit"
+                class="w-full justify-center sm:w-auto"
               >
                 Create account
               </UButton>

package/app/pages/admin/(auth)/update-password.vue

@@ -48,8 +48,8 @@ async function submitForm() {
 </script>
 
 <template>
-  <div class="grid h-full place-items-center">
-    <UCard class="w-100">
+  <div class="grid min-h-dvh place-items-center p-4">
+    <UCard class="w-full max-w-100">
       <div v-if="isPasswordUpdated" class="space-y-6 py-10">
         <div class="text-center space-y-4">
           <hgroup class="flex flex-col gap-y-1">
@@ -109,13 +109,16 @@ async function submitForm() {
             />
           </UFormField>
 
-          <div class="flex items-center justify-between gap-x-4">
+          <div
+            class="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between sm:gap-x-4"
+          >
             <UFormField>
               <UButton
                 :loading="isSubmitting"
                 :disabled="!passwordMatch"
                 type="submit"
                 icon="lucide:lock-keyhole"
+                class="w-full justify-center sm:w-auto"
               >
                 Update Password
               </UButton>

package/app/pages/admin/settings.vue

@@ -68,12 +68,16 @@ async function submitForm() {
 
 <template>
   <AdminView>
-    <h1 class="text-4xl font-bold">Settings</h1>
+    <h1 class="text-3xl font-bold lg:text-4xl">Settings</h1>
 
     <UCard>
       <UForm :schema="schema" :state="form" @submit="submitForm">
         <div class="flex flex-col gap-y-6">
-          <UFormField label="Website Title" name="website_title" class="w-1/2">
+          <UFormField
+            label="Website Title"
+            name="website_title"
+            class="w-full lg:w-1/2"
+          >
             <UInput
               v-model="form.website_title"
               placeholder="e.g. My Website"
@@ -83,7 +87,7 @@ async function submitForm() {
           <UFormField
             label="Website Description"
             name="website_description"
-            class="w-1/2"
+            class="w-full lg:w-1/2"
           >
             <UInput
               v-model="form.website_description"
@@ -91,7 +95,11 @@ async function submitForm() {
             />
           </UFormField>
 
-          <UFormField label="Website URL" name="website_url" class="w-1/2">
+          <UFormField
+            label="Website URL"
+            name="website_url"
+            class="w-full lg:w-1/2"
+          >
             <UInput
               v-model="form.website_url"
               type="url"
@@ -99,12 +107,13 @@ async function submitForm() {
             />
           </UFormField>
 
-          <div>
+          <div class="flex">
             <UButton
               :loading="isSubmitting"
               :disabled="isSubmitting"
               type="submit"
               icon="lucide:save"
+              class="w-full justify-center sm:w-auto"
             >
               Save
             </UButton>

package/app/pages/admin/setup.vue

@@ -123,8 +123,8 @@ function handleStepChange(step: number) {
 
 <template>
   <UApp>
-    <div class="flex justify-center items-center h-screen">
-      <UCard class="w-125">
+    <div class="flex min-h-dvh items-center justify-center p-4">
+      <UCard class="w-full max-w-125">
         <div class="flex flex-col gap-y-8">
           <UStepper ref="stepper" v-model="currentStep" :items="items" linear />
 
@@ -205,7 +205,7 @@ function handleStepChange(step: number) {
                       </p>
 
                       <div>
-                        <UPopover :content="{ side: 'right' }" arrow>
+                        <UPopover :content="{ side: 'bottom' }" arrow>
                           <UButton
                             icon="lucide:lightbulb"
                             label="Technical details"
@@ -284,13 +284,14 @@ function handleStepChange(step: number) {
           </div>
 
           <div class="flex justify-end">
-            <div>
+            <div class="w-full sm:w-auto">
               <UButton
                 v-if="stepper?.hasNext"
                 :form="currentStepId"
                 :loading="currentLoading"
                 leading-icon="lucide:check"
                 type="submit"
+                class="w-full justify-center sm:w-auto"
               >
                 {{ currentStepSubmitLabel }}
               </UButton>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@plutocms/supabase",
   "type": "module",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "trustedDependencies": [
     "@parcel/watcher",
     "@plutocms/pluto",
@@ -32,13 +32,14 @@
     "lint": "eslint .",
     "lint:fix": "eslint . --fix && prettier --write .",
     "typecheck": "nuxi typecheck",
+    "test": "vitest run",
     "supabase-types": "bun ./scripts/supabase-typegen.ts"
   },
   "dependencies": {
     "@nuxt/ui": "^4.9.0",
     "@nuxtjs/supabase": "^2.0.9",
-    "@plutocms/pluto": "^0.1.0",
-    "@plutocms/utils": "^0.1.0",
+    "@plutocms/pluto": "^0.3.0",
+    "@plutocms/utils": "^0.2.0",
     "postgres": "^3.4.9",
     "supabase": "^2.109.1",
     "yup": "1.7.1"
@@ -52,6 +53,7 @@
     "nuxt": "^4.4.2",
     "prettier": "^3.9.4",
     "tailwindcss": "^4.3.2",
+    "vitest": "^5.0.0",
     "vue": "^3.5.39",
     "vue-router": "^5.1.0",
     "vue-tsc": "^3.3.7"

package/server/plugins/migrations.ts

@@ -8,7 +8,7 @@ export default defineNitroPlugin(async () => {
   }
 
   const config = useRuntimeConfig()
-  const layerSchemas = config.plutoLayerSchemas ?? {}
+  const layerSchemas: Record<string, string> = config.plutoLayerSchemas ?? {}
 
   const layerNames = Object.keys(layerSchemas)