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

add discount

Browse Source
This commit is contained in:
Sérgio Rafael Siqueira
2025-12-24 01:40:07 -03:00
parent 1a59ad9e91
commit 2459bafc5d
16 changed files with 423 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
api.saladeaula.digital/app/app.py
View File

@@ -15,7 +15,7 @@ from aws_lambda_powertools.utilities.typing import LambdaContext
from api_gateway import JSONResponse
from json_encoder import JSONEncoder
from middlewares.authentication_middleware import AuthenticationMiddleware
from routes import courses, enrollments, orders, orgs, users
from routes import coupons, courses, enrollments, orders, orgs, users
logger = Logger(__name__)
tracer = Tracer()
@@ -35,6 +35,7 @@ app = APIGatewayHttpResolver(
)
app.use(middlewares=[AuthenticationMiddleware()])
app.enable_swagger(path='/swagger')
app.include_router(coupons.router, prefix='/coupons')
app.include_router(courses.router, prefix='/courses')
app.include_router(enrollments.router, prefix='/enrollments')
app.include_router(enrollments.cancel, prefix='/enrollments')

25
api.saladeaula.digital/app/routes/coupons/__init__.py Normal file
View File

@@ -0,0 +1,25 @@
from typing import Annotated
from aws_lambda_powertools.event_handler.api_gateway import Router
from aws_lambda_powertools.event_handler.exceptions import (
NotFoundError,
)
from aws_lambda_powertools.event_handler.openapi.params import Path
from layercake.dynamodb import DynamoDBPersistenceLayer, KeyPair
from boto3clients import dynamodb_client
from config import ORDER_TABLE
router = Router()
dyn = DynamoDBPersistenceLayer(ORDER_TABLE, dynamodb_client)
class CouponNotFoundError(NotFoundError): ...
@router.get('/<coupon>')
def coupon(coupon: Annotated[str, Path(min_length=3)]):
return dyn.collection.get_item(
KeyPair('COUPON', coupon.upper()),
exc_cls=CouponNotFoundError,
)

1
api.saladeaula.digital/tests/conftest.py
View File

@@ -17,6 +17,7 @@ SK = 'sk'
def pytest_configure():
os.environ['TZ'] = 'America/Sao_Paulo'
os.environ['COURSE_TABLE'] = PYTEST_TABLE_NAME
os.environ['ORDER_TABLE'] = PYTEST_TABLE_NAME
os.environ['USER_TABLE'] = PYTEST_TABLE_NAME
os.environ['ENROLLMENT_TABLE'] = PYTEST_TABLE_NAME
os.environ['BUCKET_NAME'] = 'saladeaula.digital'

19
api.saladeaula.digital/tests/routes/test_coupons.py Normal file
View File

@@ -0,0 +1,19 @@
from http import HTTPMethod, HTTPStatus
from ..conftest import HttpApiProxy, LambdaContext
def test_get_coupon(
app,
seeds,
http_api_proxy: HttpApiProxy,
lambda_context: LambdaContext,
):
r = app.lambda_handler(
http_api_proxy(
raw_path='/coupons/10off',
method=HTTPMethod.GET,
),
lambda_context,
)
assert r['statusCode'] == HTTPStatus.OK

5
api.saladeaula.digital/tests/seeds.jsonl
View File

@@ -39,3 +39,8 @@
// Course scormset
{"id": "c27d1b4f-575c-4b6b-82a1-9b91ff369e0b", "sk": "SCORMSET#76c75561-d972-43ef-9818-497d8fc6edbe", "packages": [{"version": "1.2", "scormdriver": "s3://saladeaula.digital/scorm/nr-33-espacos-confinados-conteudo-de-demonstracao-scorm12/scormdriver/indexAPI.html"}]}
// Discounts
{"id": "COUPON", "sk": "PRIMEIRACOMPRA", "discount_amount": 15, "discount_type": "FIXED", "created_at": "2025-12-24T00:05:27-03:00"}
{"id": "COUPON", "sk": "10OFF", "discount_amount": 10, "discount_type": "PERCENT", "created_at": "2025-12-24T00:05:27-03:00"}

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

@@ -3,6 +3,5 @@ import type { Route } from './+types/route'
import { redirect } from 'react-router'
export async function loader({ params }: Route.LoaderArgs) {
const { orgid } = params
throw redirect(`/${orgid}/main`)
throw redirect(`/${params.orgid}/main`)
}

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

@@ -230,6 +230,7 @@ function List({ items, search }) {
<TableHead>Valor unit.</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{charges?.map(
(
@@ -306,6 +307,7 @@ function List({ items, search }) {
<Currency>{subtotal}</Currency>
</TableCell>
</TableRow>
<TableRow>
<TableCell colSpan={4} className="text-right pointer-events-none">
Descontos
@@ -314,6 +316,7 @@ function List({ items, search }) {
<Currency>{discounts}</Currency>
</TableCell>
</TableRow>
<TableRow>
<TableCell colSpan={4} className="text-right pointer-events-none">
Total

85
apps/admin.saladeaula.digital/app/routes/_.$orgid.checkout/route.tsx
View File

@@ -1,85 +0,0 @@
import type { Route } from './+types/route'
import { useToggle } from 'ahooks'
import {
Card,
CardContent,
CardHeader,
CardDescription,
CardTitle
} from '@repo/ui/components/ui/card'
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 default function Route({
loaderData: { courses }
}: Route.ComponentProps) {
const [state, { toggle }] = useToggle('bulk', 'assigned')
return (
<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
bg-accent/50 rounded-lg border p-4 cursor-pointer
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 para fazer isso depois.
</p>
</div>
<Switch
checked={state === 'assigned'}
onCheckedChange={toggle}
className="cursor-pointer"
/>
</Label>
{state == 'assigned' ? (
<Assigned courses={courses} />
) : (
<Bulk courses={courses} />
)}
</CardContent>
</Card>
</div>
)
}

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

@@ -62,12 +62,6 @@ export async function loader({ params, context, request }: Route.LoaderArgs) {
}
}
const formatted = new Intl.DateTimeFormat('en-CA', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
})
export default function Route({ loaderData: { data } }: Route.ComponentProps) {
const { orgid } = useParams()
const [searchParams, setSearchParams] = useSearchParams()
@@ -176,6 +170,12 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
})
)}
onChange={(props) => {
const dt = new Intl.DateTimeFormat('en-CA', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
})
setSearchParams((searchParams) => {
if (!props) {
searchParams.delete('from')
@@ -187,12 +187,9 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
searchParams.set(
'from',
`${rangeField}:${formatted.format(dateRange?.from)}`
)
searchParams.set(
'to',
formatted.format(dateRange?.to)
`${rangeField}:${dt.format(dateRange?.from)}`
)
searchParams.set('to', dt.format(dateRange?.to))
return searchParams
})

3
apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.add/route.tsx
View File

@@ -65,7 +65,6 @@ import {
MAX_ITEMS,
formSchema,
type Schema,
type Course,
type User,
type Enrolled
} from './data'
@@ -405,7 +404,7 @@ function DuplicateRowMultipleTimes({
</Button>
</PopoverTrigger>
<PopoverContent align={isMobile ? 'start' : 'end'} className="w-82">
<PopoverContent align={isMobile ? 'center' : 'end'} className="w-82">
<form
onSubmit={(e) => {
e.stopPropagation()

19
apps/admin.saladeaula.digital/app/routes/_.$orgid.checkout/assigned.tsx → apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/assigned.tsx
View File

@@ -13,6 +13,8 @@ import {
} from '@repo/ui/components/ui/input-group'
import { Button } from '@repo/ui/components/ui/button'
import { Separator } from '@repo/ui/components/ui/separator'
import { Kbd } from '@repo/ui/components/ui/kbd'
import { Spinner } from '@repo/ui/components/ui/spinner'
import {
HoverCard,
HoverCardContent,
@@ -29,7 +31,6 @@ import { ScheduledForInput } from '../_.$orgid.enrollments.add/scheduled-for'
import { Cell } from '../_.$orgid.enrollments.add/route'
import { CoursePicker } from '../_.$orgid.enrollments.add/course-picker'
import { UserPicker } from '../_.$orgid.enrollments.add/user-picker'
import { Kbd } from '@repo/ui/components/ui/kbd'
const emptyRow = {
user: undefined,
@@ -38,10 +39,11 @@ const emptyRow = {
}
type AssignedProps = {
onSubmit: (value: any) => void | Promise<void>
courses: Promise<{ hits: Course[] }>
}
export function Assigned({ courses }: AssignedProps) {
export function Assigned({ courses, onSubmit }: AssignedProps) {
const { orgid } = useParams()
const form = useForm({
resolver: zodResolver(formSchema),
@@ -68,13 +70,13 @@ export function Assigned({ courses }: AssignedProps) {
return hits
}
const onSubmit = async (data: any) => {
console.log(data)
const onSubmit_ = async (data: any) => {
await onSubmit(data)
}
return (
<Form {...form}>
<form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
<form onSubmit={handleSubmit(onSubmit_)} className="space-y-4">
<div className="grid w-full gap-1.5 lg:grid-cols-[3fr_3fr_2fr_2fr_auto]">
{/* Header */}
<>
@@ -291,7 +293,12 @@ export function Assigned({ courses }: AssignedProps) {
<Separator />
<Button type="submit" className="cursor-pointer">
<Button
type="submit"
className="cursor-pointer"
disabled={formState.isSubmitting}
>
{formState.isSubmitting && <Spinner />}
Continuar
</Button>
</form>

96
apps/admin.saladeaula.digital/app/routes/_.$orgid.checkout/bulk.tsx → apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/bulk.tsx
View File

@@ -1,5 +1,5 @@
import { Fragment } from 'react'
import { MinusIcon, PlusIcon, Trash2Icon } from 'lucide-react'
import { MinusIcon, PlusIcon, Trash2Icon, XIcon } from 'lucide-react'
import { useForm, useFieldArray, Controller, useWatch } from 'react-hook-form'
import { ErrorMessage } from '@hookform/error-message'
import { zodResolver } from '@hookform/resolvers/zod'
@@ -11,20 +11,22 @@ import {
InputGroupButton,
InputGroupInput
} from '@repo/ui/components/ui/input-group'
import { Input } from '@repo/ui/components/ui/input'
import { Form } from '@repo/ui/components/ui/form'
import { Button } from '@repo/ui/components/ui/button'
import { Separator } from '@repo/ui/components/ui/separator'
import { Spinner } from '@repo/ui/components/ui/spinner'
import { Cell } from '../_.$orgid.enrollments.add/route'
import { CoursePicker } from '../_.$orgid.enrollments.add/course-picker'
import { MAX_ITEMS, type Course } from '../_.$orgid.enrollments.add/data'
import { Discount } from './discount'
const emptyRow = {
course: undefined
}
type BulkProps = {
onSubmit: (value: any) => void | Promise<void>
courses: Promise<{ hits: Course[] }>
}
@@ -44,12 +46,19 @@ const item = z.object({
})
const formSchema = z.object({
items: z.array(item).min(1).max(MAX_ITEMS)
items: z.array(item).min(1).max(MAX_ITEMS),
coupon: z
.object({
coupon: z.string(),
type: z.enum(['FIXED', 'PERCENT']),
amount: z.number().positive()
})
.optional()
})
type Schema = z.infer<typeof formSchema>
export function Bulk({ courses }: BulkProps) {
export function Bulk({ courses, onSubmit }: BulkProps) {
const form = useForm({
resolver: zodResolver(formSchema),
defaultValues: { items: [emptyRow] }
@@ -71,6 +80,7 @@ export function Bulk({ courses }: BulkProps) {
control,
name: 'items'
})
const coupon = useWatch({ control, name: 'coupon' })
const subtotal = items.reduce(
(acc, { course, quantity }) =>
acc +
@@ -78,14 +88,18 @@ export function Bulk({ courses }: BulkProps) {
(Number.isFinite(quantity) && quantity > 0 ? quantity : 1),
0
)
const discount = coupon
? applyDiscount(subtotal, coupon.amount, coupon.type)
: 0
const total = subtotal > 0 ? subtotal - discount : 0
const onSubmit = async (data: Schema) => {
console.log(data)
const onSubmit_ = async (data: Schema) => {
await onSubmit(data)
}
return (
<Form {...form}>
<form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
<form onSubmit={handleSubmit(onSubmit_)} className="space-y-4">
<div className="grid w-full gap-1.5 lg:grid-cols-[4fr_2fr_2fr_2fr_auto]">
{/* Header */}
<>
@@ -272,6 +286,7 @@ export function Bulk({ courses }: BulkProps) {
Subtotal
</InputGroupAddon>
<InputGroupInput
tabIndex={-1}
name="subtotal"
value={currency.format(subtotal)}
className="pointer-events-none text-muted-foreground"
@@ -283,26 +298,46 @@ export function Bulk({ courses }: BulkProps) {
{/* Discount */}
<>
<div className="col-start-3 flex items-center justify-end text-sm font-medium max-lg:hidden">
Cupom
{coupon ? <>Descontos</> : <>Cupom</>}
</div>
<InputGroup>
<InputGroupAddon className="border-r pr-2.5 w-1/3 lg:hidden justify-end">
Cupom
{coupon ? <>Descontos</> : <>Cupom</>}
</InputGroupAddon>
<InputGroupInput
name="discount"
value={currency.format(0)}
value={currency.format(discount * -1)}
tabIndex={-1}
className="pointer-events-none text-muted-foreground"
readOnly
/>
<InputGroupAddon align="inline-end">
<Button
variant="outline"
className="text-xs cursor-pointer h-6 px-2"
type="button"
>
Adicionar
</Button>
{coupon ? (
<InputGroupButton
size="icon-xs"
className="cursor-pointer"
variant="ghost"
onClick={() => {
setValue('coupon', undefined)
}}
>
<XIcon />
</InputGroupButton>
) : (
<Discount
disabled={subtotal === 0}
onChange={({ sk, discount_amount, discount_type }) => {
setValue('coupon', {
coupon: sk,
amount: discount_amount,
type: discount_type
})
}}
/>
)}
</InputGroupAddon>
</InputGroup>
</>
@@ -318,7 +353,8 @@ export function Bulk({ courses }: BulkProps) {
</InputGroupAddon>
<InputGroupInput
name="total"
value={currency.format(subtotal)}
tabIndex={-1}
value={currency.format(total)}
className="pointer-events-none text-muted-foreground"
readOnly
/>
@@ -328,7 +364,12 @@ export function Bulk({ courses }: BulkProps) {
<Separator />
<Button type="submit" className="cursor-pointer">
<Button
type="submit"
className="cursor-pointer"
disabled={formState.isSubmitting}
>
{formState.isSubmitting && <Spinner />}
Continuar
</Button>
</form>
@@ -340,3 +381,20 @@ const currency = new Intl.NumberFormat('pt-BR', {
style: 'currency',
currency: 'BRL'
})
function applyDiscount(
subtotal: number,
discountAmount: number,
discountType: 'FIXED' | 'PERCENT'
) {
if (subtotal <= 0) {
return 0
}
const amount =
discountType === 'PERCENT'
? (subtotal * discountAmount) / 100
: discountAmount
return Math.min(amount, subtotal)
}

135
apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/discount.tsx Normal file
View File

@@ -0,0 +1,135 @@
import type { InputHTMLAttributes } from 'react'
import { useRequest, useToggle } from 'ahooks'
import { useForm } from 'react-hook-form'
import { zodResolver } from '@hookform/resolvers/zod'
import { z } from 'zod'
import { Button } from '@repo/ui/components/ui/button'
import { Input } from '@repo/ui/components/ui/input'
import { Spinner } from '@repo/ui/components/ui/spinner'
import {
Popover,
PopoverContent,
PopoverTrigger
} from '@repo/ui/components/ui/popover'
import {
Form,
FormControl,
FormField,
FormItem,
FormLabel,
FormMessage
} from '@repo/ui/components/ui/form'
export const formSchema = z.object({
coupon: z.string().min(3, { error: 'Digite um cupom válido' }).trim()
})
export type Schema = z.infer<typeof formSchema>
interface DiscountProps extends Omit<
InputHTMLAttributes<HTMLInputElement>,
'value' | 'onChange'
> {
onChange?: (value: any) => void
}
export function Discount({ onChange, ...props }: DiscountProps) {
const form = useForm({
resolver: zodResolver(formSchema)
})
const [open, { toggle, set }] = useToggle()
const { runAsync } = useRequest(
async (coupon) => {
return await fetch(`/~/api/coupons/${coupon}`, {
method: 'GET'
})
},
{ manual: true }
)
const { handleSubmit, control, formState, setError, reset } = form
const onSubmit = async (data: Schema) => {
const r = await runAsync(data.coupon)
if (!r.ok) {
return setError('coupon', { message: 'Cupom inválido' })
}
onChange?.(await r.json())
reset()
set(false)
}
return (
<Popover open={open} onOpenChange={toggle} modal={true}>
<PopoverTrigger asChild>
<Button
tabIndex={-1}
variant="outline"
className="text-xs cursor-pointer h-6 px-2"
type="button"
{...props}
>
Adicionar
</Button>
</PopoverTrigger>
<PopoverContent align="end" className="w-82">
<Form {...form}>
<form
onSubmit={async (e) => {
e.stopPropagation()
e.preventDefault()
await handleSubmit(onSubmit)(e)
}}
>
<div className="space-y-2.5">
<h4 className="leading-none font-medium">Recebeu um cupom?</h4>
<p className="text-muted-foreground text-sm">
Aplique seu cupom e tenha acesso aos cursos com descontos
exclusivos.
</p>
<FormField
control={control}
name="coupon"
defaultValue=""
render={({ field }) => (
<FormItem className="grid grid-cols-[20%_auto] gap-1">
<FormLabel>Cupom</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage className="col-start-2 " />
</FormItem>
)}
/>
<div className="flex justify-end gap-2.5">
<Button
type="button"
variant="link"
tabIndex={-1}
className="cursor-pointer dark:text-white text-black"
onClick={() => set(false)}
>
Cancelar
</Button>
<Button
type="submit"
className="cursor-pointer"
disabled={formState.isSubmitting}
>
{formState.isSubmitting && <Spinner />}
Aplicar
</Button>
</div>
</div>
</form>
</Form>
</PopoverContent>
</Popover>
)
}

122
apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/route.tsx Normal file
View File

@@ -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>
)
}

1
apps/admin.saladeaula.digital/app/routes/_.$orgid/route.tsx
View File

@@ -101,6 +101,7 @@ export default function Route({ loaderData }: Route.ComponentProps) {
<div className="p-4">
<div className="container mx-auto relative max-w-7xl">
<Outlet />
<Toaster
position="top-center"
richColors={true}

16
packages/ui/src/components/data-table/view-options.tsx
View File

@@ -7,16 +7,14 @@ import {
DropdownMenu,
DropdownMenuCheckboxItem,
DropdownMenuContent,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger
} from '@repo/ui/components/ui/dropdown-menu'
import { cn } from '@repo/ui/lib/utils'
import { useDataTable } from './data-table'
export function DataTableViewOptions<TData>({
className
}: {
className?: string
}) {
export function DataTableViewOptions({ className }: { className?: string }) {
const { table } = useDataTable()
return (
@@ -26,7 +24,12 @@ export function DataTableViewOptions<TData>({
<Columns2Icon /> Colunas
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="w-44 *:cursor-pointer">
<DropdownMenuContent align="end" className="w-44">
<DropdownMenuLabel className="text-muted-foreground text-sm">
Exibir colunas
</DropdownMenuLabel>
<DropdownMenuSeparator />
{table
.getAllColumns()
.filter(
@@ -43,6 +46,7 @@ export function DataTableViewOptions<TData>({
checked={column.getIsVisible()}
onSelect={(e) => e.preventDefault()}
onCheckedChange={(value) => column.toggleVisibility(!!value)}
className="cursor-pointer"
>
{title}
</DropdownMenuCheckboxItem>