add revoke

This commit is contained in:
2025-11-12 17:13:10 -03:00
parent 0b4d3a9d77
commit 01af999de1
4 changed files with 154 additions and 82 deletions

View File

@@ -1,8 +1,6 @@
from http import HTTPStatus
from typing import Annotated
from aws_lambda_powertools.event_handler.api_gateway import Router
from aws_lambda_powertools.event_handler.openapi.params import Body
from layercake.dynamodb import DynamoDBPersistenceLayer, KeyPair
from api_gateway import JSONResponse
@@ -22,8 +20,8 @@ def get_admins(org_id: str):
)
@router.delete('/<org_id>/admins')
def revoke(org_id: str, user_id: Annotated[str, Body(embed=True)]):
@router.delete('/<org_id>/admins/<user_id>')
def revoke(org_id: str, user_id: str):
with dyn.transact_writer() as transact:
transact.delete(
# Post-migration: rename `admins` to `ADMIN`

View File

@@ -34,9 +34,8 @@ def test_revoke(
):
r = app.lambda_handler(
http_api_proxy(
raw_path='/orgs/f6000f79-6e5c-49a0-952f-3bda330ef278/admins',
raw_path='/orgs/f6000f79-6e5c-49a0-952f-3bda330ef278/admins/15bacf02-1535-4bee-9022-19d106fd7518',
method=HTTPMethod.DELETE,
body={'user_id': '15bacf02-1535-4bee-9022-19d106fd7518'},
),
lambda_context,
)

View File

@@ -1,16 +1,29 @@
import type { Route } from './+types'
import { useToggle } from 'ahooks'
import {
EllipsisVerticalIcon,
PencilIcon,
UserRoundMinusIcon
} from 'lucide-react'
import { Suspense } from 'react'
import { Await, NavLink } from 'react-router'
import { Await, NavLink, useParams, useRevalidator } from 'react-router'
import { toast } from 'sonner'
import { Abbr } from '@/components/abbr'
import { request as req } from '@/lib/request'
import { Skeleton } from '@repo/ui/components/skeleton'
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogTrigger
} from '@repo/ui/components/ui/alert-dialog'
import { Avatar, AvatarFallback } from '@repo/ui/components/ui/avatar'
import { Button } from '@repo/ui/components/ui/button'
import {
@@ -22,19 +35,25 @@ import {
import { Spinner } from '@repo/ui/components/ui/spinner'
import { initials } from '@repo/ui/lib/utils'
type Admin = {
sk: string
name: string
email: string
}
export function meta({}: Route.MetaArgs) {
return [{ title: 'Gestores' }]
}
export async function loader({ context, request, params }: Route.LoaderArgs) {
const data = req({
const admins = req({
url: `/orgs/${params.orgid}/admins`,
context,
request
}).then((r) => r.json())
return {
data
data: admins
}
}
@@ -53,48 +72,20 @@ export default function Route({ loaderData: { data } }) {
{({ items }) => {
return (
<div className="grid gap-4 lg:gap-8 md:grid-cols-2 lg:grid-cols-3">
{items.map(({ sk, name, email }, index) => {
{items.map(({ sk, name, email }: Admin) => {
const [_, id] = sk.split('#')
return (
<section
key={index}
className="bg-card border-border/50 hover:shadow-muted-foreground/10 hover:border-muted group relative overflow-hidden rounded-2xl border p-8 transition-all duration-300 hover:shadow-2xl"
key={id}
className="bg-card border-border/50 hover:shadow-muted-foreground/10 hover:border-muted group
relative overflow-hidden rounded-2xl border p-8 transition-all duration-300 hover:shadow-2xl"
>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button
variant="ghost"
className="data-[state=open]:bg-muted text-muted-foreground cursor-pointer absolute z-1 right-4 top-4"
size="icon-sm"
>
<EllipsisVerticalIcon />
<span className="sr-only">Abrir menu</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent
align="end"
className="w-46 *:cursor-pointer"
>
<DropdownMenuItem
asChild
onSelect={(e) => e.preventDefault()}
>
<NavLink to={`../users/${id}`}>
{({ isPending }) => (
<>
{isPending ? <Spinner /> : <PencilIcon />}
Editar
</>
)}
</NavLink>
</DropdownMenuItem>
<DropdownMenuItem variant="destructive">
<UserRoundMinusIcon /> Revogar privilégios
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
<div className="from-muted-foreground/5 absolute inset-0 bg-gradient-to-br to-transparent opacity-0 transition-opacity duration-300 group-hover:opacity-100" />
<ActionMenu id={id} />
<div
className="from-muted-foreground/5 absolute inset-0 bg-gradient-to-br to-transparent
opacity-0 transition-opacity duration-300 group-hover:opacity-100"
/>
<div className="relative flex flex-col items-center text-center">
<div className="relative mb-6">
<Avatar className="size-24 lg:size-28">
@@ -124,3 +115,83 @@ export default function Route({ loaderData: { data } }) {
</>
)
}
function ActionMenu({ id }: { id: string }) {
return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button
variant="ghost"
className="data-[state=open]:bg-muted text-muted-foreground cursor-pointer absolute z-1 right-4 top-4"
size="icon-sm"
>
<EllipsisVerticalIcon />
<span className="sr-only">Abrir menu</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="w-46 *:cursor-pointer">
<DropdownMenuItem asChild onSelect={(e) => e.preventDefault()}>
<NavLink to={`../users/${id}`}>
{({ isPending }) => (
<>
{isPending ? <Spinner /> : <PencilIcon />}
Editar
</>
)}
</NavLink>
</DropdownMenuItem>
<RevokeItem id={id} />
</DropdownMenuContent>
</DropdownMenu>
)
}
function RevokeItem({ id }: { id: string }) {
const [loading, { set }] = useToggle(false)
const { orgid } = useParams()
const { revalidate } = useRevalidator()
const revoke = async (e: MouseEvent) => {
e.preventDefault()
set(true)
const r = await fetch(`/~/api/orgs/${orgid}/admins/${id}`, {
method: 'DELETE'
})
if (r.ok) {
toast.info('Os privilégios foram revogados')
revalidate()
}
}
return (
<AlertDialog>
<AlertDialogTrigger asChild>
<DropdownMenuItem
variant="destructive"
onSelect={(e) => e.preventDefault()}
>
<UserRoundMinusIcon /> Revogar privilégios
</DropdownMenuItem>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Tem certeza absoluta?</AlertDialogTitle>
<AlertDialogDescription>
Esta ação não pode ser desfeita. Isso revogará permanentemente os
privilégios deste gestor.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter className="*:cursor-pointer">
<AlertDialogCancel>Cancelar</AlertDialogCancel>
<AlertDialogAction asChild>
<Button onClick={revoke} disabled={loading} variant="destructive">
{loading ? <Spinner /> : null} Continuar
</Button>
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
)
}

View File

@@ -1,7 +1,7 @@
'use client'
import { formatCPF } from '@brazilian-utils/brazilian-utils'
import { type ColumnDef } from '@tanstack/react-table'
import { type ColumnDef, type RowData } from '@tanstack/react-table'
import { useToggle } from 'ahooks'
import {
EllipsisVerticalIcon,
@@ -113,55 +113,59 @@ export const columns: ColumnDef<User>[] = [
},
{
id: 'actions',
cell: ({ row }) => (
<div className="flex justify-end items-center">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button
variant="ghost"
className="data-[state=open]:bg-muted text-muted-foreground cursor-pointer"
size="icon-sm"
>
<EllipsisVerticalIcon />
<span className="sr-only">Abrir menu</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="w-36 *:cursor-pointer">
<DropdownMenuItem asChild onSelect={(e) => e.preventDefault()}>
<NavLink to={`${row.id}`}>
{({ isPending }) => (
<>
{isPending ? <Spinner /> : <PencilIcon />}
Editar
</>
)}
</NavLink>
</DropdownMenuItem>
<UnlinkMenuItem userId={row.id} />
</DropdownMenuContent>
</DropdownMenu>
</div>
)
cell: ({ row }) => <ActionMenu row={row} />
}
]
function UnlinkMenuItem({ userId }: { userId: string }) {
function ActionMenu({ row }: { row: any }) {
return (
<div className="flex justify-end items-center">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button
variant="ghost"
className="data-[state=open]:bg-muted text-muted-foreground cursor-pointer"
size="icon-sm"
>
<EllipsisVerticalIcon />
<span className="sr-only">Abrir menu</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="w-36 *:cursor-pointer">
<DropdownMenuItem asChild onSelect={(e) => e.preventDefault()}>
<NavLink to={`${row.id}`}>
{({ isPending }) => (
<>
{isPending ? <Spinner /> : <PencilIcon />}
Editar
</>
)}
</NavLink>
</DropdownMenuItem>
<UnlinkItem id={row.id} />
</DropdownMenuContent>
</DropdownMenu>
</div>
)
}
function UnlinkItem({ id }: { id: string }) {
const [loading, { set }] = useToggle(false)
const { orgid } = useParams()
const { table } = useDataTable<User>()
const unlink = async (e) => {
const unlink = async (e: MouseEvent) => {
e.preventDefault()
set(true)
const r = await fetch(`/~/api/orgs/${orgid}/users/${userId}`, {
const r = await fetch(`/~/api/orgs/${orgid}/users/${id}`, {
method: 'DELETE'
})
if (r.ok) {
toast.info('O colaborador foi desvinculado')
// @ts-ignore
table.options.meta?.removeRow?.(userId)
table.options.meta?.removeRow?.(id)
}
}
@@ -184,7 +188,7 @@ function UnlinkMenuItem({ userId }: { userId: string }) {
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter className="*:cursor-pointer">
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogCancel>Cancelar</AlertDialogCancel>
<AlertDialogAction asChild>
<Button onClick={unlink} disabled={loading} variant="destructive">
{loading ? <Spinner /> : null} Continuar