@plutocms/supabase 0.29.0 → 0.31.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -124,140 +124,138 @@ function menuItems(role: AccessRole): DropdownMenuItem[][] {
124
124
  </script>
125
125
 
126
126
  <template>
127
- <main>
128
- <AdminView>
129
- <!-- The section (the Users item of the menu) and its tabs, like Settings. -->
130
- <h1 class="text-3xl font-bold lg:text-4xl">
131
- {{ t('supabase.access.users.title') }}
132
- </h1>
127
+ <PlutoViewAdminPanel>
128
+ <!-- The section (the Users item of the menu) and its tabs, like Settings. -->
129
+ <template #toolbar>
130
+ <PlutoViewToolbar
131
+ :title="t('supabase.access.users.title')"
132
+ icon="lucide:users"
133
+ >
134
+ <template #right>
135
+ <UButton icon="lucide:plus" @click="openRole(null)">
136
+ {{ t('supabase.access.roles.create') }}
137
+ </UButton>
138
+ </template>
139
+ </PlutoViewToolbar>
133
140
 
134
141
  <PlutoAdminNavTabs />
142
+ </template>
135
143
 
136
- <div class="flex flex-wrap items-start justify-between gap-4">
137
- <div>
138
- <h2 class="text-xl font-semibold">
139
- {{ t('supabase.access.roles.title') }}
140
- </h2>
141
- <p class="text-muted text-sm">
142
- {{ t('supabase.access.roles.description') }}
143
- </p>
144
- </div>
144
+ <p class="text-muted text-sm">
145
+ {{ t('supabase.access.roles.description') }}
146
+ </p>
145
147
 
146
- <UButton icon="lucide:plus" @click="openRole(null)">
147
- {{ t('supabase.access.roles.create') }}
148
- </UButton>
149
- </div>
148
+ <UAlert
149
+ v-if="!allowed"
150
+ :title="t('pluto.settings.noPermission.title')"
151
+ :description="
152
+ t('pluto.settings.noPermission.description', {
153
+ page: t('supabase.access.roles.title'),
154
+ })
155
+ "
156
+ icon="lucide:lock"
157
+ color="warning"
158
+ />
150
159
 
151
- <UAlert
152
- v-if="!allowed"
153
- :title="t('pluto.settings.noPermission.title')"
154
- :description="
155
- t('pluto.settings.noPermission.description', {
156
- page: t('supabase.access.roles.title'),
157
- })
158
- "
159
- icon="lucide:lock"
160
- color="warning"
161
- />
162
-
163
- <!-- Loading -->
164
- <div
165
- v-else-if="status === 'loading'"
166
- class="flex flex-col gap-y-3"
167
- aria-busy="true"
168
- >
169
- <USkeleton v-for="row in 3" :key="row" class="h-12 w-full" />
170
- </div>
160
+ <!-- Loading -->
161
+ <div
162
+ v-else-if="status === 'loading'"
163
+ class="flex flex-col gap-y-3"
164
+ aria-busy="true"
165
+ >
166
+ <USkeleton v-for="row in 3" :key="row" class="h-12 w-full" />
167
+ </div>
171
168
 
172
- <!-- Error -->
173
- <UAlert
174
- v-else-if="status === 'error'"
175
- :title="t('supabase.access.roles.error.title')"
176
- :description="loadError"
177
- :actions="[
178
- {
179
- label: t('pluto.common.tryAgain'),
180
- color: 'neutral',
181
- variant: 'outline',
182
- onClick: load,
183
- },
184
- ]"
185
- color="error"
186
- variant="subtle"
187
- icon="lucide:circle-x"
188
- />
169
+ <!-- Error -->
170
+ <UAlert
171
+ v-else-if="status === 'error'"
172
+ :title="t('supabase.access.roles.error.title')"
173
+ :description="loadError"
174
+ :actions="[
175
+ {
176
+ label: t('pluto.common.tryAgain'),
177
+ color: 'neutral',
178
+ variant: 'outline',
179
+ onClick: load,
180
+ },
181
+ ]"
182
+ color="error"
183
+ variant="subtle"
184
+ icon="lucide:circle-x"
185
+ />
189
186
 
190
- <!-- The list -->
191
- <UTable
192
- v-else
193
- :data="roles"
194
- :columns="columns"
195
- class="border-default rounded-lg border"
196
- >
197
- <template #role-cell="{ row }">
198
- <div class="flex min-w-0 flex-col">
199
- <span class="flex items-center gap-2">
200
- <span class="text-highlighted truncate font-medium">{{
201
- row.original.label
202
- }}</span>
203
- <UBadge
204
- v-if="row.original.is_builtin"
205
- :label="t('supabase.access.roles.builtin')"
206
- color="neutral"
207
- variant="subtle"
208
- size="sm"
209
- />
210
- </span>
211
- <code class="text-muted truncate font-mono text-xs">{{
212
- row.original.key
213
- }}</code>
214
- </div>
215
- </template>
216
-
217
- <template #permissions-cell="{ row }">
218
- <span v-if="isFullAccess(row.original)" class="text-sm">
219
- {{ t('supabase.access.roles.fullAccess') }}
220
- </span>
221
- <span v-else class="text-sm">
222
- {{
223
- t(
224
- 'supabase.access.roles.permissionCount',
225
- row.original.capabilities.length
226
- )
227
- }}
187
+ <!-- The list -->
188
+ <UTable
189
+ v-else
190
+ :data="roles"
191
+ :columns="columns"
192
+ class="border-default rounded-lg border"
193
+ >
194
+ <template #role-cell="{ row }">
195
+ <div class="flex min-w-0 flex-col">
196
+ <span class="flex items-center gap-2">
197
+ <span class="text-highlighted truncate font-medium">{{
198
+ row.original.label
199
+ }}</span>
200
+ <UBadge
201
+ v-if="row.original.is_builtin"
202
+ :label="t('supabase.access.roles.builtin')"
203
+ color="neutral"
204
+ variant="subtle"
205
+ size="sm"
206
+ />
228
207
  </span>
229
- </template>
208
+ <code class="text-muted truncate font-mono text-xs">{{
209
+ row.original.key
210
+ }}</code>
211
+ </div>
212
+ </template>
230
213
 
231
- <template #users-cell="{ row }">
232
- <span class="text-sm">{{
233
- t('supabase.access.roles.userCount', row.original.user_count)
234
- }}</span>
235
- </template>
214
+ <template #permissions-cell="{ row }">
215
+ <span v-if="isFullAccess(row.original)" class="text-sm">
216
+ {{ t('supabase.access.roles.fullAccess') }}
217
+ </span>
218
+ <span v-else class="text-sm">
219
+ {{
220
+ t(
221
+ 'supabase.access.roles.permissionCount',
222
+ row.original.capabilities.length
223
+ )
224
+ }}
225
+ </span>
226
+ </template>
227
+
228
+ <template #users-cell="{ row }">
229
+ <span class="text-sm">{{
230
+ t('supabase.access.roles.userCount', row.original.user_count)
231
+ }}</span>
232
+ </template>
236
233
 
237
- <template #actions-cell="{ row }">
238
- <div class="flex justify-end">
239
- <UDropdownMenu
240
- :items="menuItems(row.original)"
241
- :content="{ align: 'end' }"
242
- >
234
+ <template #actions-cell="{ row }">
235
+ <div class="flex justify-end">
236
+ <UDropdownMenu
237
+ :items="menuItems(row.original)"
238
+ :content="{ align: 'end' }"
239
+ >
240
+ <UTooltip :text="row.original.label">
243
241
  <UButton
244
242
  :aria-label="row.original.label"
245
243
  icon="lucide:ellipsis"
246
244
  color="neutral"
247
245
  variant="ghost"
248
246
  />
249
- </UDropdownMenu>
250
- </div>
251
- </template>
252
- </UTable>
247
+ </UTooltip>
248
+ </UDropdownMenu>
249
+ </div>
250
+ </template>
251
+ </UTable>
253
252
 
254
- <!-- Lazy: the chunk loads on the first open. -->
255
- <RoleSlideover
256
- v-if="slideoverMounted"
257
- v-model:open="slideoverOpen"
258
- :role="editing"
259
- @saved="load"
260
- />
261
- </AdminView>
262
- </main>
253
+ <!-- Lazy: the chunk loads on the first open. -->
254
+ <RoleSlideover
255
+ v-if="slideoverMounted"
256
+ v-model:open="slideoverOpen"
257
+ :role="editing"
258
+ @saved="load"
259
+ />
260
+ </PlutoViewAdminPanel>
263
261
  </template>