roles update

apps/frontend/app/admin/oauth/page.tsx

@@ -133,6 +133,19 @@ export default function AdminOAuthPage() {
     }
   }
 
+  async function handleDeleteClient(client: OAuthClient) {
+    if (!token) return;
+    if (!window.confirm(`Удалить приложение «${client.name}»? Это действие необратимо.`)) return;
+    try {
+      await apiFetch(`/admin/rbac/oauth-clients/${client.clientId}`, { method: 'DELETE' }, token);
+      showToast('Приложение удалено');
+      setSelectedClient(null);
+      await loadData();
+    } catch (error) {
+      showToast(error instanceof Error ? error.message : 'Не удалось удалить приложение');
+    }
+  }
+
   function copyText(value: string, label: string) {
     void navigator.clipboard.writeText(value);
     showToast(`${label} скопирован`);
@@ -213,6 +226,7 @@ export default function AdminOAuthPage() {
         onCopy={copyText}
         onRotateSecret={(clientId) => void handleRotateSecret(clientId)}
         onToggleActive={(client) => void handleToggleActive(client)}
+        onDelete={(client) => void handleDeleteClient(client)}
       />
 
       <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>

apps/frontend/app/admin/rbac/page.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useEffect, useState } from 'react';
-import { Loader2, Plus, ShieldCheck } from 'lucide-react';
+import { Loader2, Pencil, Plus, ShieldCheck, Trash2 } from 'lucide-react';
 import { AdminShell } from '@/components/id/admin-shell';
 import { useAuth } from '@/components/id/auth-provider';
 import { useToast } from '@/components/id/toast-provider';
@@ -11,15 +11,31 @@ import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/u
 import { Input } from '@/components/ui/input';
 import { AdminPermission, AdminRole, apiFetch } from '@/lib/api';
 
+type RoleFormState = {
+  slug: string;
+  name: string;
+  description: string;
+  permissionSlugs: string[];
+};
+
+const emptyForm: RoleFormState = { slug: '', name: '', description: '', permissionSlugs: [] };
+
 export default function AdminRbacPage() {
   const { token, user } = useAuth();
   const { showToast } = useToast();
   const [roles, setRoles] = useState<AdminRole[]>([]);
   const [permissions, setPermissions] = useState<AdminPermission[]>([]);
   const [loading, setLoading] = useState(true);
-  const [creating, setCreating] = useState(false);
+  const [saving, setSaving] = useState(false);
   const [dialogOpen, setDialogOpen] = useState(false);
-  const [form, setForm] = useState({ slug: '', name: '', description: '', permissionSlugs: [] as string[] });
+  const [editingRole, setEditingRole] = useState<AdminRole | null>(null);
+  const [form, setForm] = useState<RoleFormState>(emptyForm);
+
+  async function reloadRoles() {
+    if (!token) return;
+    const response = await apiFetch<{ roles: AdminRole[] }>('/admin/rbac/roles', {}, token);
+    setRoles(response.roles ?? []);
+  }
 
   useEffect(() => {
     if (!token || !user?.canManageRoles) return;
@@ -35,30 +51,74 @@ export default function AdminRbacPage() {
       .finally(() => setLoading(false));
   }, [showToast, token, user?.canManageRoles]);
 
-  async function handleCreateRole() {
+  function openCreateDialog() {
+    setEditingRole(null);
+    setForm(emptyForm);
+    setDialogOpen(true);
+  }
+
+  function openEditDialog(role: AdminRole) {
+    setEditingRole(role);
+    setForm({
+      slug: role.slug,
+      name: role.name,
+      description: role.description ?? '',
+      permissionSlugs: role.permissions.map((permission) => permission.slug)
+    });
+    setDialogOpen(true);
+  }
+
+  async function handleSaveRole() {
     if (!token) return;
-    setCreating(true);
+    setSaving(true);
     try {
-      await apiFetch('/admin/rbac/roles', {
-        method: 'POST',
-        body: JSON.stringify(form)
-      }, token);
-      showToast('Роль создана');
+      if (editingRole) {
+        await apiFetch(`/admin/rbac/roles/${editingRole.slug}`, {
+          method: 'PATCH',
+          body: JSON.stringify({
+            name: form.name,
+            description: form.description || undefined,
+            permissionSlugs: form.permissionSlugs
+          })
+        }, token);
+        showToast('Роль обновлена');
+      } else {
+        await apiFetch('/admin/rbac/roles', {
+          method: 'POST',
+          body: JSON.stringify(form)
+        }, token);
+        showToast('Роль создана');
+      }
       setDialogOpen(false);
-      setForm({ slug: '', name: '', description: '', permissionSlugs: [] });
-      const response = await apiFetch<{ roles: AdminRole[] }>('/admin/rbac/roles', {}, token);
-      setRoles(response.roles ?? []);
+      setForm(emptyForm);
+      setEditingRole(null);
+      await reloadRoles();
     } catch (error) {
-      showToast(error instanceof Error ? error.message : 'Не удалось создать роль');
+      showToast(error instanceof Error ? error.message : 'Не удалось сохранить роль');
     } finally {
-      setCreating(false);
+      setSaving(false);
+    }
+  }
+
+  async function handleDeleteRole(role: AdminRole) {
+    if (!token || role.isSystem) return;
+    if (!window.confirm(`Удалить роль «${role.name}»? Она будет снята со всех пользователей.`)) return;
+    setSaving(true);
+    try {
+      await apiFetch(`/admin/rbac/roles/${role.slug}`, { method: 'DELETE' }, token);
+      showToast('Роль удалена');
+      await reloadRoles();
+    } catch (error) {
+      showToast(error instanceof Error ? error.message : 'Не удалось удалить роль');
+    } finally {
+      setSaving(false);
     }
   }
 
   if (!user?.canManageRoles) {
     return (
       <AdminShell active="/admin/rbac">
-        <p className="text-[#667085]">Управление ролями доступно только супер-администратору.</p>
+        <p className="text-[#667085]">Управление ролями доступно пользователям с правом rbac.manage.</p>
       </AdminShell>
     );
   }
@@ -68,9 +128,9 @@ export default function AdminRbacPage() {
       <div className="mb-6 flex items-center justify-between gap-4">
         <div>
           <h2 className="text-2xl font-medium">Роли и права</h2>
-          <p className="text-sm text-[#667085]">Только супер-администратор может создавать роли и назначать их пользователям</p>
+          <p className="text-sm text-[#667085]">Редактируйте роли, назначайте права всем пользователям или отдельным аккаунтам</p>
         </div>
-        <Button onClick={() => setDialogOpen(true)}>
+        <Button onClick={openCreateDialog}>
           <Plus className="h-4 w-4" />
           Создать роль
         </Button>
@@ -86,17 +146,37 @@ export default function AdminRbacPage() {
           {roles.map((role) => (
             <Card key={role.id} className="bg-[#f8f9fb] shadow-none">
               <CardHeader>
-                <ShieldCheck className="h-6 w-6" />
+                <div className="flex items-start justify-between gap-2">
+                  <ShieldCheck className="h-6 w-6 shrink-0" />
+                  <div className="flex gap-1">
+                    <Button variant="ghost" size="icon" aria-label="Редактировать роль" onClick={() => openEditDialog(role)}>
+                      <Pencil className="h-4 w-4" />
+                    </Button>
+                    {!role.isSystem ? (
+                      <Button variant="ghost" size="icon" aria-label="Удалить роль" disabled={saving} onClick={() => void handleDeleteRole(role)}>
+                        <Trash2 className="h-4 w-4 text-red-600" />
+                      </Button>
+                    ) : null}
+                  </div>
+                </div>
                 <CardTitle>{role.name}</CardTitle>
-                <CardDescription>{role.permissions.length} прав · {role.slug}</CardDescription>
+                <CardDescription>
+                  {role.permissions.length} прав · {role.slug}
+                  {role.isSystem ? ' · системная' : ''}
+                  {role.isDefault ? ' · по умолчанию' : ''}
+                </CardDescription>
               </CardHeader>
               <CardContent className="space-y-2">
-                {role.permissions.map((permission) => (
-                  <div key={permission.id} className="rounded-xl bg-white px-3 py-2 text-sm">
-                    <div className="font-medium">{permission.name}</div>
-                    <div className="text-xs text-[#667085]">{permission.slug}</div>
-                  </div>
-                ))}
+                {role.permissions.length ? (
+                  role.permissions.map((permission) => (
+                    <div key={permission.id} className="rounded-xl bg-white px-3 py-2 text-sm">
+                      <div className="font-medium">{permission.name}</div>
+                      <div className="text-xs text-[#667085]">{permission.slug}</div>
+                    </div>
+                  ))
+                ) : (
+                  <p className="text-sm text-[#667085]">Права не назначены</p>
+                )}
               </CardContent>
             </Card>
           ))}
@@ -106,10 +186,14 @@ export default function AdminRbacPage() {
       <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
         <DialogContent className="max-h-[90vh] overflow-y-auto">
           <DialogHeader>
-            <DialogTitle>Новая роль</DialogTitle>
+            <DialogTitle>{editingRole ? `Редактирование: ${editingRole.name}` : 'Новая роль'}</DialogTitle>
           </DialogHeader>
           <div className="space-y-4">
-            <Input value={form.slug} onChange={(event) => setForm((current) => ({ ...current, slug: event.target.value }))} placeholder="slug, например support" />
+            {!editingRole ? (
+              <Input value={form.slug} onChange={(event) => setForm((current) => ({ ...current, slug: event.target.value }))} placeholder="slug, например support" />
+            ) : (
+              <p className="rounded-xl bg-[#f4f5f8] px-3 py-2 text-sm text-[#667085]">Slug: {editingRole.slug}</p>
+            )}
             <Input value={form.name} onChange={(event) => setForm((current) => ({ ...current, name: event.target.value }))} placeholder="Название роли" />
             <Input value={form.description} onChange={(event) => setForm((current) => ({ ...current, description: event.target.value }))} placeholder="Описание" />
             <div className="space-y-2">
@@ -132,8 +216,8 @@ export default function AdminRbacPage() {
                 </label>
               ))}
             </div>
-            <Button className="w-full" disabled={creating} onClick={() => void handleCreateRole()}>
-              {creating ? <Loader2 className="h-4 w-4 animate-spin" /> : 'Создать роль'}
+            <Button className="w-full" disabled={saving || !form.name.trim() || (!editingRole && !form.slug.trim())} onClick={() => void handleSaveRole()}>
+              {saving ? <Loader2 className="h-4 w-4 animate-spin" /> : editingRole ? 'Сохранить изменения' : 'Создать роль'}
             </Button>
           </div>
         </DialogContent>

apps/frontend/app/admin/users/page.tsx

@@ -11,7 +11,7 @@ import { Button } from '@/components/ui/button';
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
-import { AdminRole, AdminUser, apiFetch } from '@/lib/api';
+import { AdminPermission, AdminRole, AdminUser, apiFetch } from '@/lib/api';
 import { getAdminLandingPath } from '@/lib/admin-access';
 
 const statusLabels: Record<string, string> = {
@@ -21,18 +21,22 @@ const statusLabels: Record<string, string> = {
 };
 
 const roleLabels: Record<string, string> = {
+  user: 'Пользователь',
   admin: 'Администратор',
   moderator: 'Модератор',
   manager: 'Менеджер',
   'super-admin': 'Супер-админ'
 };
 
+const DEFAULT_USER_ROLE = 'user';
+
 export default function AdminUsersPage() {
   const router = useRouter();
   const { token, user: currentUser } = useAuth();
   const { showToast } = useToast();
   const [users, setUsers] = useState<AdminUser[]>([]);
   const [roles, setRoles] = useState<AdminRole[]>([]);
+  const [permissions, setPermissions] = useState<AdminPermission[]>([]);
   const [search, setSearch] = useState('');
   const [loading, setLoading] = useState(true);
   const [selectedUser, setSelectedUser] = useState<AdminUser | null>(null);
@@ -68,12 +72,26 @@ export default function AdminUsersPage() {
 
   useEffect(() => {
     if (!token || !currentUser?.canManageRoles) return;
-    apiFetch<{ roles: AdminRole[] }>('/admin/rbac/roles', {}, token)
-      .then((response) => setRoles(response.roles ?? []))
+    Promise.all([
+      apiFetch<{ roles: AdminRole[] }>('/admin/rbac/roles', {}, token),
+      apiFetch<{ permissions: AdminPermission[] }>('/admin/rbac/permissions', {}, token)
+    ])
+      .then(([rolesResponse, permissionsResponse]) => {
+        setRoles(rolesResponse.roles ?? []);
+        setPermissions(permissionsResponse.permissions ?? []);
+      })
       .catch(() => undefined);
   }, [currentUser?.canManageRoles, token]);
 
-  const assignableRoles = useMemo(() => roles.filter((role) => role.slug !== 'super-admin'), [roles]);
+  const assignableRoles = useMemo(
+    () => roles.filter((role) => role.slug !== 'super-admin' && !role.isDefault),
+    [roles]
+  );
+
+  const permissionLabelBySlug = useMemo(
+    () => Object.fromEntries(permissions.map((permission) => [permission.slug, permission.name])),
+    [permissions]
+  );
 
   async function handleSuspend(user: AdminUser) {
     if (!token) return;
@@ -171,11 +189,52 @@ export default function AdminUsersPage() {
     }
   }
 
+  async function handleAssignPermission(permissionSlug: string) {
+    if (!token || !selectedUser) return;
+    setActionLoading(true);
+    try {
+      const response = await apiFetch<{ permissions: string[] }>(`/admin/rbac/users/${selectedUser.id}/permissions`, {
+        method: 'POST',
+        body: JSON.stringify({ permissionSlug })
+      }, token);
+      setSelectedUser({ ...selectedUser, directPermissions: response.permissions ?? [] });
+      showToast('Право назначено');
+      await loadUsers();
+    } catch (error) {
+      showToast(error instanceof Error ? error.message : 'Не удалось назначить право');
+    } finally {
+      setActionLoading(false);
+    }
+  }
+
+  async function handleRemovePermission(permissionSlug: string) {
+    if (!token || !selectedUser) return;
+    setActionLoading(true);
+    try {
+      const response = await apiFetch<{ permissions: string[] }>(`/admin/rbac/users/${selectedUser.id}/permissions/${permissionSlug}`, {
+        method: 'DELETE'
+      }, token);
+      setSelectedUser({ ...selectedUser, directPermissions: response.permissions ?? [] });
+      showToast('Право снято');
+      await loadUsers();
+    } catch (error) {
+      showToast(error instanceof Error ? error.message : 'Не удалось снять право');
+    } finally {
+      setActionLoading(false);
+    }
+  }
+
   function renderRoles(user: AdminUser) {
     const userRoles = user.roles ?? [];
-    const labels = user.isSuperAdmin ? ['Супер-админ', ...userRoles.map((role) => roleLabels[role] ?? role)] : userRoles.map((role) => roleLabels[role] ?? role);
-    if (!labels.length) return 'Пользователь';
-    return labels.join(', ');
+    const extraRoles = userRoles.filter((role) => role !== DEFAULT_USER_ROLE);
+    const direct = user.directPermissions ?? [];
+    const labels = user.isSuperAdmin
+      ? ['Супер-админ', ...extraRoles.map((role) => roleLabels[role] ?? role)]
+      : extraRoles.map((role) => roleLabels[role] ?? role);
+    const directLabels = direct.map((slug) => permissionLabelBySlug[slug] ?? slug);
+    const parts = [...labels, ...directLabels.map((label) => `+ ${label}`)];
+    if (!parts.length) return roleLabels.user;
+    return parts.join(', ');
   }
 
   return (
@@ -312,10 +371,14 @@ export default function AdminUsersPage() {
           <div className="space-y-2">
             {(selectedUser?.roles ?? []).map((role) => (
               <div key={role} className="flex items-center justify-between rounded-xl bg-[#f4f5f8] px-3 py-2">
-                <span>{roleLabels[role] ?? role}</span>
-                <Button variant="ghost" size="sm" disabled={actionLoading} onClick={() => void handleRemoveRole(role)}>
-                  Снять
-                </Button>
+                <span>{roleLabels[role] ?? role}{role === DEFAULT_USER_ROLE ? ' (стандартная)' : ''}</span>
+                {role === DEFAULT_USER_ROLE ? (
+                  <span className="text-xs text-[#667085]">Нельзя снять</span>
+                ) : (
+                  <Button variant="ghost" size="sm" disabled={actionLoading} onClick={() => void handleRemoveRole(role)}>
+                    Снять
+                  </Button>
+                )}
               </div>
             ))}
             {!(selectedUser?.roles ?? []).length ? <p className="text-sm text-[#667085]">Роли не назначены</p> : null}
@@ -335,6 +398,37 @@ export default function AdminUsersPage() {
               </Button>
             ))}
           </div>
+          <div className="mt-6 space-y-2 border-t border-[#eceef4] pt-4">
+            <p className="text-sm font-medium">Прямые права</p>
+            <p className="text-xs text-[#667085]">Дополнительные permissions без смены роли. Например, oauth.manage для одного пользователя.</p>
+            {(selectedUser?.directPermissions ?? []).map((permissionSlug) => (
+              <div key={permissionSlug} className="flex items-center justify-between rounded-xl bg-[#eef4ff] px-3 py-2">
+                <span className="text-sm">{permissionLabelBySlug[permissionSlug] ?? permissionSlug}</span>
+                <Button variant="ghost" size="sm" disabled={actionLoading} onClick={() => void handleRemovePermission(permissionSlug)}>
+                  Снять
+                </Button>
+              </div>
+            ))}
+            {!(selectedUser?.directPermissions ?? []).length ? (
+              <p className="text-sm text-[#667085]">Прямые права не назначены</p>
+            ) : null}
+            <div className="max-h-48 space-y-1 overflow-y-auto pt-2">
+              {permissions
+                .filter((permission) => !(selectedUser?.directPermissions ?? []).includes(permission.slug))
+                .map((permission) => (
+                  <Button
+                    key={permission.id}
+                    variant="secondary"
+                    size="sm"
+                    className="w-full justify-start"
+                    disabled={actionLoading}
+                    onClick={() => void handleAssignPermission(permission.slug)}
+                  >
+                    + {permission.name}
+                  </Button>
+                ))}
+            </div>
+          </div>
         </DialogContent>
       </Dialog>
 

apps/frontend/components/id/oauth-client-detail-dialog.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { Copy, ExternalLink, KeyRound, RefreshCw } from 'lucide-react';
+import { Copy, ExternalLink, KeyRound, RefreshCw, Trash2 } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog';
 import { OAuthClient } from '@/lib/api';
@@ -27,7 +27,8 @@ export function OAuthClientDetailDialog({
   onOpenChange,
   onCopy,
   onRotateSecret,
-  onToggleActive
+  onToggleActive,
+  onDelete
 }: {
   client: OAuthClient | null;
   endpoints: OAuthEndpoints;
@@ -36,6 +37,7 @@ export function OAuthClientDetailDialog({
   onCopy: (value: string, label: string) => void;
   onRotateSecret: (clientId: string) => void;
   onToggleActive: (client: OAuthClient) => void;
+  onDelete: (client: OAuthClient) => void;
 }) {
   if (!client) return null;
 
@@ -125,6 +127,15 @@ export function OAuthClientDetailDialog({
               <Button variant="secondary" size="sm" onClick={() => onToggleActive(client)}>
                 {client.isActive ? 'Отключить' : 'Включить'}
               </Button>
+              <Button
+                variant="secondary"
+                size="sm"
+                className="text-red-600 hover:text-red-700"
+                onClick={() => onDelete(client)}
+              >
+                <Trash2 className="h-4 w-4" />
+                Удалить
+              </Button>
             </div>
           ) : null}
         </div>

apps/frontend/components/notifications/notification-bell.tsx

@@ -63,6 +63,9 @@ export function NotificationBell() {
       if (event.type === 'family_invite') {
         showToast(event.message || 'Новое приглашение в семью');
       }
+      if (event.type === 'role_assigned' || event.type === 'role_removed') {
+        showToast(event.message || 'Изменение ролей');
+      }
     });
   }, [load, showToast, subscribe]);
 
@@ -80,6 +83,11 @@ export function NotificationBell() {
     if (payload.groupId) {
       setOpen(false);
       router.push(`/family/${payload.groupId}`);
+      return;
+    }
+    if (item.type === 'role_assigned' || item.type === 'role_removed') {
+      setOpen(false);
+      router.push('/admin');
     }
   }
 

apps/frontend/components/notifications/realtime-provider.tsx

@@ -74,7 +74,12 @@ export function RealtimeProvider({ children }: { children: React.ReactNode }) {
         try {
           const data = JSON.parse(event.data as string) as RealtimeEvent;
           emit(data);
-          if (data.type === 'family_invite' || (data.type === 'chat_message' && data.payload?.notificationId)) {
+          if (
+            data.type === 'family_invite' ||
+            data.type === 'role_assigned' ||
+            data.type === 'role_removed' ||
+            (data.type === 'chat_message' && data.payload?.notificationId)
+          ) {
             setUnreadCount((count) => count + 1);
           }
         } catch {

apps/frontend/lib/api.ts

@@ -91,6 +91,7 @@ export interface AdminUser {
   status: string;
   createdAt: string;
   roles: string[];
+  directPermissions?: string[];
 }
 
 export interface AdminRole {
@@ -98,6 +99,8 @@ export interface AdminRole {
   slug: string;
   name: string;
   description?: string;
+  isSystem?: boolean;
+  isDefault?: boolean;
   permissions: { id: string; slug: string; name: string; description?: string }[];
 }