add discount

apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/route.tsx

@@ -0,0 +1,122 @@
+import type { Route } from './+types/route'
+
+import { Link } from 'react-router'
+import { useToggle } from 'ahooks'
+
+import {
+  Card,
+  CardContent,
+  CardHeader,
+  CardDescription,
+  CardTitle
+} from '@repo/ui/components/ui/card'
+import {
+  Breadcrumb,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbList,
+  BreadcrumbPage,
+  BreadcrumbSeparator
+} from '@repo/ui/components/ui/breadcrumb'
+import { Switch } from '@repo/ui/components/ui/switch'
+import { createSearch } from '@repo/util/meili'
+import { cloudflareContext } from '@repo/auth/context'
+import { Label } from '@repo/ui/components/ui/label'
+
+import { Assigned } from './assigned'
+import { Bulk } from './bulk'
+import type { Course } from '../_.$orgid.enrollments.add/data'
+
+export function meta({}: Route.MetaArgs) {
+  return [{ title: 'Comprar matrículas' }]
+}
+
+export async function loader({ params, context, request }: Route.LoaderArgs) {
+  const cloudflare = context.get(cloudflareContext)
+  const courses = createSearch<Course>({
+    index: 'saladeaula_courses',
+    sort: ['created_at:desc'],
+    filter: 'unlisted NOT EXISTS',
+    hitsPerPage: 100,
+    env: cloudflare.env
+  })
+
+  return { courses }
+}
+
+export async function action({ request }: Route.ActionArgs) {
+  const body = (await request.json()) as object
+  console.log(body)
+}
+
+export default function Route({
+  loaderData: { courses }
+}: Route.ComponentProps) {
+  const [state, { toggle }] = useToggle('bulk', 'assigned')
+
+  const onSubmit = async (data: any) => {
+    await new Promise((r) => setTimeout(r, 2000))
+    console.log(data)
+  }
+
+  const props = { courses, onSubmit }
+
+  return (
+    <div className="space-y-2.5">
+      <Breadcrumb>
+        <BreadcrumbList>
+          <BreadcrumbItem>
+            <BreadcrumbLink asChild>
+              <Link to="../enrollments">Matrículas</Link>
+            </BreadcrumbLink>
+          </BreadcrumbItem>
+          <BreadcrumbSeparator />
+          <BreadcrumbItem>
+            <BreadcrumbPage>Comprar matrículas</BreadcrumbPage>
+          </BreadcrumbItem>
+        </BreadcrumbList>
+      </Breadcrumb>
+
+      <div className="lg:max-w-4xl mx-auto space-y-2.5">
+        <Card>
+          <CardHeader>
+            <CardTitle className="text-2xl">Comprar matrículas</CardTitle>
+            <CardDescription>
+              Siga os passos abaixo para comprar novas matrículas.
+            </CardDescription>
+          </CardHeader>
+
+          <CardContent className="space-y-4">
+            <Label
+              className="flex flex-row items-center justify-between cursor-pointer
+                       bg-accent/50 hover:bg-accent rounded-lg border p-4
+                       dark:has-aria-checked:border-blue-900
+                       dark:has-aria-checked:bg-blue-950"
+            >
+              <div className="grid gap-1.5 font-normal">
+                <p className="text-sm leading-none font-medium">
+                  Adicionar colaboradores
+                </p>
+                <p className="text-muted-foreground text-sm">
+                  Você pode adicionar agora os colaboradores que irão fazer o
+                  curso ou deixar isso para depois.
+                </p>
+              </div>
+              <Switch
+                checked={state === 'assigned'}
+                onCheckedChange={toggle}
+                className="cursor-pointer"
+              />
+            </Label>
+
+            {state == 'assigned' ? (
+              <Assigned {...props} />
+            ) : (
+              <Bulk {...props} />
+            )}
+          </CardContent>
+        </Card>
+      </div>
+    </div>
+  )
+}