add alertt

This commit is contained in:
2026-01-26 17:28:11 -03:00
parent a571fb3ba9
commit 63c6344821
4 changed files with 71 additions and 59 deletions

View File

@@ -1,52 +0,0 @@
import type { Route } from './+types/route'
import { useNavigate } from 'react-router'
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle
} from '@repo/ui/components/ui/dialog'
import { request as req } from '@repo/util/request'
export async function loader({ params, request, context }: Route.LoaderArgs) {
const r = await req({
url: `/enrollments/${params.id}`,
request,
context
})
if (!r.ok) {
throw new Response(null, { status: r.status })
}
const enrollment = await r.json()
return { data: enrollment }
}
export default function UserModal({}: Route.ComponentProps) {
const navigate = useNavigate()
return (
<Dialog
open={true}
onOpenChange={(open) => {
if (!open) navigate('/enrollments') // Volta pra listagem ao fechar
}}
>
<DialogContent>
<DialogHeader>
<DialogTitle>...</DialogTitle>
<DialogDescription>Detalhes do usuário</DialogDescription>
</DialogHeader>
<div className="space-y-4">
...
{/* Mais informações... */}
</div>
</DialogContent>
</Dialog>
)
}

View File

@@ -1,7 +1,12 @@
import type { Route } from './+types/route' import type { Route } from './+types/route'
import { useMount } from 'ahooks' import { useMount } from 'ahooks'
import { BookSearchIcon, CircleCheckBigIcon, WalletIcon } from 'lucide-react' import {
BookSearchIcon,
CircleCheckBigIcon,
MegaphoneIcon,
WalletIcon
} from 'lucide-react'
import { use, useEffect, useState } from 'react' import { use, useEffect, useState } from 'react'
import { Link, redirect, useFetcher } from 'react-router' import { Link, redirect, useFetcher } from 'react-router'
@@ -22,6 +27,14 @@ import {
CardHeader, CardHeader,
CardTitle CardTitle
} from '@repo/ui/components/ui/card' } from '@repo/ui/components/ui/card'
import {
Item,
ItemActions,
ItemContent,
ItemDescription,
ItemMedia,
ItemTitle
} from '@repo/ui/components/ui/item'
import { Label } from '@repo/ui/components/ui/label' import { Label } from '@repo/ui/components/ui/label'
import { Switch } from '@repo/ui/components/ui/switch' import { Switch } from '@repo/ui/components/ui/switch'
import { createSearch } from '@repo/util/meili' import { createSearch } from '@repo/util/meili'
@@ -32,6 +45,7 @@ import { Wizard, WizardStep } from '@/components/wizard'
import { useWorksapce } from '@/components/workspace-switcher' import { useWorksapce } from '@/components/workspace-switcher'
import { INTERNAL_EMAIL_DOMAIN } from '@/conf' import { INTERNAL_EMAIL_DOMAIN } from '@/conf'
import { workspaceContext } from '@/middleware/workspace' import { workspaceContext } from '@/middleware/workspace'
import { Button } from '@repo/ui/components/ui/button'
import type { Course } from '../_.$orgid.enrollments.add/data' import type { Course } from '../_.$orgid.enrollments.add/data'
import { Assigned } from './assigned' import { Assigned } from './assigned'
import { Bulk } from './bulk' import { Bulk } from './bulk'
@@ -96,16 +110,13 @@ export async function action({ request, context }: Route.ActionArgs) {
export default function Route({ export default function Route({
loaderData: { courses, seats: seats_ } loaderData: { courses, seats: seats_ }
}: Route.ComponentProps) { }: Route.ComponentProps) {
const seats = use(seats_)
const fetcher = useFetcher() const fetcher = useFetcher()
const [mounted, setMounted] = useState(false) const [mounted, setMounted] = useState(false)
const { address } = useWorksapce() const { address } = useWorksapce()
const { index, kind, setIndex, setKind, reset, update, ...state } = const { index, kind, setIndex, setKind, reset, update, ...state } =
useWizardStore() useWizardStore()
// @TODO
const seats = use(seats_)
console.log(seats)
const onSubmit = async () => { const onSubmit = async () => {
const items = state.items.map(({ course, quantity }) => ({ const items = state.items.map(({ course, quantity }) => ({
...course, ...course,
@@ -148,7 +159,29 @@ export default function Route({
</BreadcrumbList> </BreadcrumbList>
</Breadcrumb> </Breadcrumb>
<div className="lg:max-w-4xl mx-auto"> <div className="lg:max-w-4xl space-y-4 mx-auto">
{seats?.items?.length > 0 && (
<Item
variant="outline"
className="border-dashed bg-green-600/10 border-green-800"
>
<ItemMedia variant="icon">
<MegaphoneIcon />
</ItemMedia>
<ItemContent>
<ItemTitle>Matrículas em aberto</ItemTitle>
<ItemDescription>
Existem matrículas em aberto de cursos adquiridos e
disponíveis para uso.
</ItemDescription>
</ItemContent>
<ItemActions>
<Button size="sm" asChild>
<Link to="../enrollments/seats">Matricular agora</Link>
</Button>
</ItemActions>
</Item>
)}
<Card> <Card>
<CardHeader> <CardHeader>
<CardTitle className="text-2xl">Comprar matrículas</CardTitle> <CardTitle className="text-2xl">Comprar matrículas</CardTitle>

View File

@@ -0,0 +1,32 @@
import type { Route } from './+types/route'
import { Link } from 'react-router'
import {
Breadcrumb,
BreadcrumbItem,
BreadcrumbLink,
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator
} from '@repo/ui/components/ui/breadcrumb'
export default function Route({}: Route.ComponentProps) {
return (
<div className="space-y-2.5">
<Breadcrumb>
<BreadcrumbList>
<BreadcrumbItem>
<BreadcrumbLink asChild>
<Link to="../enrollments">Matrículas</Link>
</BreadcrumbLink>
</BreadcrumbItem>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbPage>Adicionar matrículas</BreadcrumbPage>
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>
</div>
)
}

View File

@@ -41,7 +41,6 @@ import {
DropdownMenu, DropdownMenu,
DropdownMenuContent, DropdownMenuContent,
DropdownMenuItem, DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger DropdownMenuTrigger
} from '@repo/ui/components/ui/dropdown-menu' } from '@repo/ui/components/ui/dropdown-menu'
import { import {