edit users

frontend/pages/admin/index.vue

@@ -9,8 +9,8 @@ const adminStore = useAdminStore();
 </script>
 
 <template>
-    <div class="grid grid-cols-2 gap-4">
-        <Card>
+    <div class="grid gap-4 lg:grid-cols-2">
+        <Card class="overflow-hidden">
             <CardHeader>
                 <CardTitle
                     ><NuxtLink to="/admin/users">Users</NuxtLink></CardTitle
@@ -20,16 +20,26 @@ const adminStore = useAdminStore();
                     warrens</CardDescription
                 >
             </CardHeader>
-            <CardContent class="max-h-64">
-                <ScrollArea class="h-full">
-                    <div class="flex flex-col gap-4">
+            <CardContent class="max-h-64 overflow-hidden">
+                <ScrollArea class="h-full w-full overflow-hidden">
+                    <div class="flex w-full flex-col gap-2 overflow-hidden">
                         <AdminUserListing
-                            v-for="user in adminStore.users"
+                            v-for="user in adminStore.resources.users"
                             :key="user.id"
                             :user
-                            class="group/user flex flex-row items-center justify-between gap-4"
                         >
                             <template #actions>
+                                <Button
+                                    class="m-1"
+                                    variant="outline"
+                                    size="icon"
+                                    @click="
+                                        () =>
+                                            adminStore.openEditUserDialog(user)
+                                    "
+                                >
+                                    <Icon name="lucide:pencil" />
+                                </Button>
                                 <Button
                                     class="m-1"
                                     variant="destructive"
@@ -50,9 +60,9 @@ const adminStore = useAdminStore();
                 </ScrollArea>
             </CardContent>
             <CardFooter>
-                <div class="mt-4 flex flex-row">
+                <div class="mt-4 flex grow flex-row justify-end">
                     <Button @click="adminStore.openCreateUserDialog"
-                        >Create user</Button
+                        >Create</Button
                     >
                 </div>
             </CardFooter>

frontend/pages/admin/stats.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 definePageMeta({
+    layout: 'admin',
     middleware: ['is-admin'],
 });
 </script>

frontend/pages/admin/users.vue

@@ -1,9 +1,22 @@
 <script setup lang="ts">
 definePageMeta({
+    layout: 'admin',
     middleware: ['is-admin'],
 });
+
+const adminStore = useAdminStore();
 </script>
 
 <template>
-    <p>/admin/users</p>
+    <div class="flex h-full w-full">
+        <ScrollArea class="h-full grow">
+            <div class="flex w-full flex-col gap-2">
+                <AdminUserListing
+                    v-for="user in adminStore.resources.users"
+                    :key="user.id"
+                    :user
+                />
+            </div>
+        </ScrollArea>
+    </div>
 </template>

frontend/pages/admin/warrens.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 definePageMeta({
+    layout: 'admin',
     middleware: ['is-admin'],
 });
 </script>