sergio/saladeaula.digital
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add billing

Browse Source
This commit is contained in:
Sérgio Rafael Siqueira
2025-12-12 20:28:47 -03:00
parent 3147ec2317
commit c516960b01
16 changed files with 496 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
apps/admin.saladeaula.digital/app/routes/_.$orgid.admins._index/route.tsx
View File

@@ -1,8 +1,8 @@
import type { Route } from './+types'
import type { Route } from './+types/route'
import { useToggle } from 'ahooks'
import { EllipsisIcon, PencilIcon, UserRoundMinusIcon } from 'lucide-react'
import { Suspense } from 'react'
import { Suspense, type MouseEvent } from 'react'
import { Await, NavLink, useParams, useRevalidator } from 'react-router'
import { toast } from 'sonner'
@@ -48,12 +48,10 @@ export async function loader({ context, request, params }: Route.LoaderArgs) {
request
}).then((r) => r.json())
return {
data: users
}
return { users }
}
export default function Route({ loaderData: { data } }: Route.ComponentProps) {
export default function Route({ loaderData: { users } }: Route.ComponentProps) {
return (
<Suspense fallback={<Skeleton />}>
<div className="space-y-0.5 mb-8">
@@ -63,48 +61,53 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
</p>
</div>
<Await resolve={data}>
{({ items }) => {
return (
<div className="grid gap-4 lg:gap-8 md:grid-cols-2 lg:grid-cols-3">
{items.map(({ sk, name, email }: Admin) => {
const [_, id] = sk.split('#')
<Await resolve={users}>
{({ items }) => (
<div className="grid gap-4 lg:gap-8 md:grid-cols-2 lg:grid-cols-3">
{items.map(({ sk, name, email }: Admin) => {
const [_, id] = sk.split('#')
return (
<section
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"
>
<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">
<AvatarFallback className="text-2xl">
{initials(name)}
</AvatarFallback>
</Avatar>
</div>
<div className="mb-6">
<h1 className="mb-2 text-xl font-bold">
<Abbr>{name}</Abbr>
</h1>
<p className="text-muted-foreground bg-muted/50 inline-block rounded-full px-4 py-1.5 text-sm font-medium">
<Abbr>{email}</Abbr>
</p>
</div>
return (
<section
key={id}
className="group relative p-8 overflow-hidden bg-card
border border-border/50 rounded-2xl
hover:shadow-muted-foreground/10 hover:border-muted
hover:shadow-2xl transition-all duration-300"
>
<ActionMenu id={id} />
<div
className="from-muted-foreground/5 absolute inset-0
bg-linear-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">
<AvatarFallback className="text-2xl">
{initials(name)}
</AvatarFallback>
</Avatar>
</div>
</section>
)
})}
</div>
)
}}
<div className="mb-6">
<h1 className="mb-2 text-xl font-bold">
<Abbr>{name}</Abbr>
</h1>
<p
className="text-muted-foreground bg-muted/50 inline-block
rounded-full px-4 py-1.5 text-sm font-medium"
>
<Abbr>{email}</Abbr>
</p>
</div>
</div>
</section>
)
})}
</div>
)}
</Await>
</Suspense>
)
@@ -116,7 +119,8 @@ function ActionMenu({ id }: { id: string }) {
<DropdownMenuTrigger asChild>
<Button
variant="ghost"
className="data-[state=open]:bg-muted text-muted-foreground cursor-pointer absolute z-1 right-4 top-4"
className="data-[state=open]:bg-muted text-muted-foreground
cursor-pointer absolute z-1 right-4 top-4"
size="icon-sm"
>
<EllipsisIcon />
@@ -145,7 +149,7 @@ function RevokeItem({ id }: { id: string }) {
const { orgid } = useParams()
const { revalidate } = useRevalidator()
const revoke = async (e) => {
const revoke = async (e: MouseEvent<HTMLButtonElement>) => {
e.preventDefault()
set(true)