Skip to content

Commit bed2dfd

Browse files
VilkrinVilkrin
committed
Add Livewire EditUser and update admin user views
Introduces the EditUser Livewire component and its Blade view, and updates the admin user edit page to use this component. Adds a new admin settings view and a Flux icon for user-check. The user show view is refactored to use the new icon and removes the edit-dossier modal trigger. Also includes dependency updates in composer.lock and package-lock.json.
1 parent bbabaed commit bed2dfd

File tree

8 files changed

+415
-466
lines changed

8 files changed

+415
-466
lines changed

‎app/Livewire/Admin/EditUser.php‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<?php
2+
3+
namespace App\Livewire\Admin;
4+
5+
use Livewire\Component;
6+
7+
class EditUser extends Component
8+
{
9+
public function render()
10+
{
11+
return view('livewire.admin.edit-user');
12+
}
13+
}

‎composer.lock‎

Lines changed: 77 additions & 72 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package-lock.json‎

Lines changed: 4 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎resources/views/admin/settings.blade.php‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<x-layouts.admin :title="__('Settings')">
2+
3+
</x-layouts.admin>

‎resources/views/admin/users/edit.blade.php‎

Lines changed: 1 addition & 152 deletions
Original file line numberDiff line numberDiff line change
@@ -1,156 +1,5 @@
11
<x-layouts.admin :title="__('Edit User')">
22

3-
<a href="users.html" class="inline-flex items-center gap-2 px-3 py-2 text-sm text-slate-300 hover:bg-slate-800/50 rounded transition-colors">
4-
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
5-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
6-
</svg>
7-
Back to Users
8-
</a>
9-
<div class="h-6 w-px bg-slate-700"></div>
10-
<div>
11-
<h1 class="font-semibold text-lg text-slate-100">Edit User</h1>
12-
<p class="text-sm text-slate-400">Modify user information and permissions</p>
13-
</div>
14-
15-
<div class="space-y-6">
16-
<!-- Basic Information -->
17-
<div class="bg-slate-900/50 border border-amber-400/20 backdrop-blur-sm rounded-lg shadow-sm">
18-
<div class="p-6 border-b border-slate-700">
19-
<h3 class="text-2xl font-semibold leading-none tracking-tight text-slate-100">Basic Information</h3>
20-
</div>
21-
<div class="p-6">
22-
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
23-
<div class="space-y-2">
24-
<label for="name" class="text-sm font-medium text-slate-200">Full Name</label>
25-
<input id="name" value="Alex Chen" class="flex h-10 w-full rounded-md border border-slate-700 bg-slate-900/50 px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-amber-400" />
26-
</div>
27-
28-
<div class="space-y-2">
29-
<label for="email" class="text-sm font-medium text-slate-200">Email</label>
30-
<input id="email" type="email" value="alex.chen@imperialarms.com" class="flex h-10 w-full rounded-md border border-slate-700 bg-slate-900/50 px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-amber-400" />
31-
</div>
32-
33-
<div class="space-y-2">
34-
<label for="phone" class="text-sm font-medium text-slate-200">Phone</label>
35-
<input id="phone" value="+1 (555) 123-4567" class="flex h-10 w-full rounded-md border border-slate-700 bg-slate-900/50 px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-amber-400" />
36-
</div>
37-
38-
<div class="space-y-2">
39-
<label for="status" class="text-sm font-medium text-slate-200">Status</label>
40-
<select id="status" class="flex h-10 w-full rounded-md border border-slate-700 bg-slate-900/50 px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-amber-400">
41-
<option value="Active" selected>Active</option>
42-
<option value="Inactive">Inactive</option>
43-
</select>
44-
</div>
45-
46-
<div class="space-y-2">
47-
<label for="department" class="text-sm font-medium text-slate-200">Department</label>
48-
<input id="department" value="Engineering" class="flex h-10 w-full rounded-md border border-slate-700 bg-slate-900/50 px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-amber-400" />
49-
</div>
50-
51-
<div class="space-y-2">
52-
<label for="location" class="text-sm font-medium text-slate-200">Location</label>
53-
<input id="location" value="San Francisco, CA" class="flex h-10 w-full rounded-md border border-slate-700 bg-slate-900/50 px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-amber-400" />
54-
</div>
55-
</div>
56-
</div>
57-
</div>
58-
59-
<!-- User Roles -->
60-
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
61-
<div class="bg-slate-900/50 border border-amber-400/20 backdrop-blur-sm rounded-lg shadow-sm">
62-
<div class="p-6 border-b border-slate-700">
63-
<div class="flex items-center justify-between">
64-
<h3 class="text-2xl font-semibold leading-none tracking-tight flex items-center gap-2 text-slate-100">
65-
<svg class="h-5 w-5 text-amber-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
66-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/>
67-
</svg>
68-
Roles
69-
</h3>
70-
<span class="inline-flex items-center gap-1 rounded-full border px-2.5 py-0.5 text-xs font-semibold border-slate-700 bg-slate-800 text-slate-300">
71-
<svg class="h-3 w-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
72-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197m13.5-9a2.5 2.5 0 11-5 0 2.5 2.5 0 015 0z"/>
73-
</svg>
74-
<span id="assignedCount">1</span> assigned
75-
</span>
76-
</div>
77-
</div>
78-
<div class="p-6">
79-
<div class="space-y-3">
80-
<div class="flex items-center justify-between p-3 border border-slate-700 rounded-lg hover:bg-slate-800/50 transition-colors">
81-
<div class="flex-1">
82-
<div class="flex items-center gap-2 mb-1">
83-
<span class="font-medium text-slate-100">Super Admin</span>
84-
<span class="inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-mono border-slate-700 bg-slate-800 text-slate-300">super-admin</span>
85-
</div>
86-
<p class="text-sm text-slate-400">Full system access with all permissions</p>
87-
</div>
88-
<label class="relative inline-flex items-center cursor-pointer">
89-
<input type="checkbox" class="sr-only peer" onchange="updateRoleCount()">
90-
<div class="w-11 h-6 bg-slate-700 peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-amber-400 rounded-full peer peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-amber-400"></div>
91-
</label>
92-
</div>
93-
94-
<div class="flex items-center justify-between p-3 border border-slate-700 rounded-lg hover:bg-slate-800/50 transition-colors">
95-
<div class="flex-1">
96-
<div class="flex items-center gap-2 mb-1">
97-
<span class="font-medium text-slate-100">Administrator</span>
98-
<span class="inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-mono border-slate-700 bg-slate-800 text-slate-300">admin</span>
99-
</div>
100-
<p class="text-sm text-slate-400">Administrative access to most features</p>
101-
</div>
102-
<label class="relative inline-flex items-center cursor-pointer">
103-
<input type="checkbox" checked class="sr-only peer" onchange="updateRoleCount()">
104-
<div class="w-11 h-6 bg-slate-700 peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-amber-400 rounded-full peer peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-amber-400"></div>
105-
</label>
106-
</div>
107-
108-
<div class="flex items-center justify-between p-3 border border-slate-700 rounded-lg hover:bg-slate-800/50 transition-colors">
109-
<div class="flex-1">
110-
<div class="flex items-center gap-2 mb-1">
111-
<span class="font-medium text-slate-100">Editor</span>
112-
<span class="inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-mono border-slate-700 bg-slate-800 text-slate-300">editor</span>
113-
</div>
114-
<p class="text-sm text-slate-400">Content creation and editing permissions</p>
115-
</div>
116-
<label class="relative inline-flex items-center cursor-pointer">
117-
<input type="checkbox" class="sr-only peer" onchange="updateRoleCount()">
118-
<div class="w-11 h-6 bg-slate-700 peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-amber-400 rounded-full peer peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-amber-400"></div>
119-
</label>
120-
</div>
121-
122-
<div class="flex items-center justify-between p-3 border border-slate-700 rounded-lg hover:bg-slate-800/50 transition-colors">
123-
<div class="flex-1">
124-
<div class="flex items-center gap-2 mb-1">
125-
<span class="font-medium text-slate-100">Viewer</span>
126-
<span class="inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-mono border-slate-700 bg-slate-800 text-slate-300">viewer</span>
127-
</div>
128-
<p class="text-sm text-slate-400">Read-only access to content</p>
129-
</div>
130-
<label class="relative inline-flex items-center cursor-pointer">
131-
<input type="checkbox" class="sr-only peer" onchange="updateRoleCount()">
132-
<div class="w-11 h-6 bg-slate-700 peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-amber-400 rounded-full peer peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-amber-400"></div>
133-
</label>
134-
</div>
135-
136-
<div class="flex items-center justify-between p-3 border border-slate-700 rounded-lg hover:bg-slate-800/50 transition-colors">
137-
<div class="flex-1">
138-
<div class="flex items-center gap-2 mb-1">
139-
<span class="font-medium text-slate-100">Moderator</span>
140-
<span class="inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-mono border-slate-700 bg-slate-800 text-slate-300">moderator</span>
141-
</div>
142-
<p class="text-sm text-slate-400">Content moderation and user management</p>
143-
</div>
144-
<label class="relative inline-flex items-center cursor-pointer">
145-
<input type="checkbox" class="sr-only peer" onchange="updateRoleCount()">
146-
<div class="w-11 h-6 bg-slate-700 peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-amber-400 rounded-full peer peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-amber-400"></div>
147-
</label>
148-
</div>
149-
</div>
150-
</div>
151-
</div>
152-
</div>
153-
</div>
154-
3+
<livewire:admin.edit-user />
1554

1565
</x-layouts.admin>

0 commit comments

Comments
 (0)