add subscription to org

This commit is contained in:
2026-01-17 23:45:25 -03:00
parent d0a9998bf4
commit 3f0f7ec1e1
14 changed files with 550 additions and 367 deletions

View File

@@ -1,6 +1,5 @@
import type { Route } from './+types/route' import type { Route } from './+types/route'
import type { MouseEvent, ReactNode } from 'react'
import { useRequest, useToggle } from 'ahooks' import { useRequest, useToggle } from 'ahooks'
import { import {
AlertTriangleIcon, AlertTriangleIcon,
@@ -15,44 +14,15 @@ import {
RocketIcon, RocketIcon,
UserIcon UserIcon
} from 'lucide-react' } from 'lucide-react'
import { toast } from 'sonner'
import { DateTime as LuxonDateTime } from 'luxon' import { DateTime as LuxonDateTime } from 'luxon'
import type { MouseEvent, ReactNode } from 'react'
import { Fragment, Suspense } from 'react' import { Fragment, Suspense } from 'react'
import { Await } from 'react-router' import { Await } from 'react-router'
import { toast } from 'sonner'
import { request as req } from '@repo/util/request'
import { Button } from '@repo/ui/components/ui/button'
import {
Empty,
EmptyContent,
EmptyDescription,
EmptyHeader,
EmptyMedia,
EmptyTitle
} from '@repo/ui/components/ui/empty'
import { Skeleton } from '@repo/ui/components/skeleton'
import { Card, CardContent } from '@repo/ui/components/ui/card'
import {
Item,
ItemActions,
ItemContent,
ItemDescription,
ItemGroup,
ItemMedia,
ItemSeparator,
ItemTitle
} from '@repo/ui/components/ui/item'
import { Link } from 'react-router'
import { Avatar, AvatarFallback } from '@repo/ui/components/ui/avatar'
import { initials } from '@repo/ui/lib/utils'
import { Abbr } from '@repo/ui/components/abbr' import { Abbr } from '@repo/ui/components/abbr'
import { import { DateTime } from '@repo/ui/components/datetime'
DropdownMenu, import { Skeleton } from '@repo/ui/components/skeleton'
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger
} from '@repo/ui/components/ui/dropdown-menu'
import { import {
AlertDialog, AlertDialog,
AlertDialogAction, AlertDialogAction,
@@ -64,17 +34,44 @@ import {
AlertDialogTitle, AlertDialogTitle,
AlertDialogTrigger AlertDialogTrigger
} from '@repo/ui/components/ui/alert-dialog' } 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 { Card, CardContent } from '@repo/ui/components/ui/card'
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger
} from '@repo/ui/components/ui/dropdown-menu'
import {
Empty,
EmptyContent,
EmptyDescription,
EmptyHeader,
EmptyMedia,
EmptyTitle
} from '@repo/ui/components/ui/empty'
import {
Item,
ItemActions,
ItemContent,
ItemDescription,
ItemGroup,
ItemMedia,
ItemSeparator,
ItemTitle
} from '@repo/ui/components/ui/item'
import { Spinner } from '@repo/ui/components/ui/spinner' import { Spinner } from '@repo/ui/components/ui/spinner'
import { useParams } from 'react-router'
import { useRevalidator } from 'react-router'
import { DateTime } from '@repo/ui/components/datetime'
import { import {
Tabs, Tabs,
TabsContent, TabsContent,
TabsList, TabsList,
TabsTrigger TabsTrigger
} from '@repo/ui/components/ui/tabs' } from '@repo/ui/components/ui/tabs'
import { useSearchParams } from 'react-router' import { initials } from '@repo/ui/lib/utils'
import { request as req } from '@repo/util/request'
import { Link, useParams, useRevalidator, useSearchParams } from 'react-router'
export function meta({}: Route.MetaArgs) { export function meta({}: Route.MetaArgs) {
return [{ title: 'Matrículas agendadas' }] return [{ title: 'Matrículas agendadas' }]
@@ -442,8 +439,8 @@ function ActionMenu({ sk }: { sk: string }) {
</DropdownMenuTrigger> </DropdownMenuTrigger>
<DropdownMenuContent align="end" className="*:cursor-pointer w-42"> <DropdownMenuContent align="end" className="*:cursor-pointer w-42">
<Proceedtem sk={sk} onSuccess={onSuccess} /> {/* <Proceedtem sk={sk} onSuccess={onSuccess} />
<DropdownMenuSeparator /> <DropdownMenuSeparator />*/}
<CancelItem sk={sk} onSuccess={onSuccess} /> <CancelItem sk={sk} onSuccess={onSuccess} />
</DropdownMenuContent> </DropdownMenuContent>
</DropdownMenu> </DropdownMenu>

View File

@@ -89,108 +89,104 @@ export default function Route({}: Route.ComponentProps) {
return ( return (
<Form {...form}> <Form {...form}>
<form onSubmit={handleSubmit(onSubmit)}> <form onSubmit={handleSubmit(onSubmit)} className="space-y-3">
<fieldset disabled={!!user?.rate_limit_exceeded} className="space-y-4"> {user?.rate_limit_exceeded && (
{user?.rate_limit_exceeded && ( <Alert variant="destructive">
<Alert variant="destructive"> <AlertCircleIcon />
<AlertCircleIcon /> <AlertTitle>Limite diário de atualizações atingido.</AlertTitle>
<AlertTitle>Limite diário de atualizações atingido.</AlertTitle> <AlertDescription>
<AlertDescription> Tente novamente a partir de{' '}
Tente novamente a partir de{' '} {getDaysRemaining(user.rate_limit_exceeded.ttl)}
{getDaysRemaining(user.rate_limit_exceeded.ttl)} </AlertDescription>
</AlertDescription> </Alert>
</Alert> )}
)}
<Card> <Card>
<CardHeader> <CardHeader>
<CardTitle className="text-2xl">Editar colaborador</CardTitle> <CardTitle className="text-2xl">Editar colaborador</CardTitle>
<CardDescription> <CardDescription>
Configurar as informações gerais para este colaborador. Configurar as informações gerais para este colaborador.
</CardDescription> </CardDescription>
</CardHeader> </CardHeader>
<CardContent> <CardContent className="space-y-6">
<FieldSet> <FieldSet disabled={!!user?.rate_limit_exceeded}>
<FormField <FormField
control={control} control={control}
name="name" name="name"
render={({ field }) => ( render={({ field }) => (
<FormItem> <FormItem>
<FormLabel>Nome</FormLabel> <FormLabel>Nome</FormLabel>
<FormControl> <FormControl>
<Input {...field} /> <Input {...field} />
</FormControl> </FormControl>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>
)} )}
/> />
<FormField <FormField
control={control} control={control}
name="email" name="email"
disabled={true} disabled={true}
render={({ field }) => ( render={({ field }) => (
<FormItem> <FormItem>
<FormLabel>Email</FormLabel> <FormLabel>Email</FormLabel>
<FormControl> <FormControl>
<Input {...field} /> <Input {...field} />
</FormControl> </FormControl>
<FormLabel className="text-sm font-normal text-muted-foreground"> <FormLabel className="text-sm font-normal text-muted-foreground">
<span> <span>
Para gerenciar os emails ou trocar o email principal, Para gerenciar os emails ou trocar o email principal,
use as{' '} use as{' '}
<Link <Link
to="emails" to="emails"
className="text-blue-400 underline hover:no-underline" className="text-blue-400 underline hover:no-underline"
> >
configurações de emails configurações de emails
</Link> </Link>
</span> </span>
</FormLabel> </FormLabel>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>
)} )}
/> />
<FormField <FormField
control={control} control={control}
name="cpf" name="cpf"
render={({ field: { onChange, ref, ...props } }) => ( render={({ field: { onChange, ref, ...props } }) => (
<FormItem> <FormItem>
<FormLabel>CPF</FormLabel> <FormLabel>CPF</FormLabel>
<FormControl> <FormControl>
<PatternFormat <PatternFormat
format="###.###.###-##" format="###.###.###-##"
mask="_" mask="_"
placeholder="___.___.___-__" placeholder="___.___.___-__"
customInput={Input} customInput={Input}
getInputRef={ref} getInputRef={ref}
onValueChange={({ value }) => { onValueChange={({ value }) => {
onChange(value) onChange(value)
}} }}
{...props} {...props}
/> />
</FormControl> </FormControl>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>
)} )}
/> />
</FieldSet>
<div className="flex justify-end"> <Button
<Button type="submit"
type="submit" className="cursor-pointer"
className="cursor-pointer" disabled={formState.isSubmitting || !!user?.rate_limit_exceeded}
disabled={formState.isSubmitting} >
> {formState.isSubmitting && <Spinner />}
{formState.isSubmitting && <Spinner />} Editar colaborador
Editar </Button>
</Button> </CardContent>
</div> </Card>
</FieldSet>
</CardContent>
</Card>
</fieldset>
</form> </form>
</Form> </Form>
) )

View File

@@ -83,7 +83,7 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
) )
})} })}
</NativeSelect> </NativeSelect>
<Button>Mudar</Button> <Button>Alterar email</Button>
</form> </form>
</CardContent> </CardContent>
</Card> </Card>

View File

@@ -1,7 +1,7 @@
import type { Route } from './+types/route' import type { Route } from './+types/route'
import { useEffect } from 'react'
import { zodResolver } from '@hookform/resolvers/zod' import { zodResolver } from '@hookform/resolvers/zod'
import { useEffect } from 'react'
import { useForm } from 'react-hook-form' import { useForm } from 'react-hook-form'
import { PatternFormat } from 'react-number-format' import { PatternFormat } from 'react-number-format'
import { Link, useFetcher } from 'react-router' import { Link, useFetcher } from 'react-router'
@@ -37,6 +37,7 @@ import { Spinner } from '@repo/ui/components/ui/spinner'
import { HttpMethod, request as req } from '@repo/util/request' import { HttpMethod, request as req } from '@repo/util/request'
import { useWorksapce } from '@/components/workspace-switcher' import { useWorksapce } from '@/components/workspace-switcher'
import { FieldSet } from '@repo/ui/components/ui/field'
import { formSchema, type Schema } from './data' import { formSchema, type Schema } from './data'
export function meta({}: Route.MetaArgs) { export function meta({}: Route.MetaArgs) {
@@ -115,7 +116,7 @@ export default function Route({}: Route.ComponentProps) {
<div className="lg:max-w-2xl mx-auto"> <div className="lg:max-w-2xl mx-auto">
<Form {...form}> <Form {...form}>
<form onSubmit={handleSubmit(onSubmit)} className="space-y-4"> <form onSubmit={handleSubmit(onSubmit)}>
<Card> <Card>
<CardHeader> <CardHeader>
<CardTitle className="text-2xl"> <CardTitle className="text-2xl">
@@ -126,99 +127,99 @@ export default function Route({}: Route.ComponentProps) {
</CardDescription> </CardDescription>
</CardHeader> </CardHeader>
<CardContent className="space-y-4"> <CardContent className="space-y-6">
<FormField <FieldSet>
control={control}
name="name"
defaultValue=""
render={({ field }) => (
<FormItem>
<FormLabel>Nome</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<div className="space-y-2.5">
<FormField <FormField
control={control} control={control}
name="email" name="name"
defaultValue="" defaultValue=""
render={({ field }) => ( render={({ field }) => (
<FormItem> <FormItem>
<FormLabel>Email</FormLabel> <FormLabel>Nome</FormLabel>
<FormControl> <FormControl>
<Input <Input {...field} />
{...field}
readOnly={givenEmail}
className="read-only:pointer-events-none read-only:opacity-50"
/>
</FormControl> </FormControl>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>
)} )}
/> />
<div className="space-y-2.5">
<FormField
control={control}
name="email"
defaultValue=""
render={({ field }) => (
<FormItem>
<FormLabel>Email</FormLabel>
<FormControl>
<Input
{...field}
readOnly={givenEmail}
className="read-only:pointer-events-none read-only:opacity-50"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={control}
name="given_email"
defaultValue={false}
render={({ field: { value, onChange, ...field } }) => (
<FormItem className="flex items-center gap-2">
<FormControl>
<Checkbox
checked={Boolean(value)}
onCheckedChange={onChange}
tabIndex={-1}
{...field}
/>
</FormControl>
<FormLabel className="cursor-pointer">
Usar email gerado pela plataforma
</FormLabel>
</FormItem>
)}
/>
</div>
<FormField <FormField
control={control} control={control}
name="given_email" name="cpf"
defaultValue={false} defaultValue=""
render={({ field: { value, onChange, ...field } }) => ( render={({ field: { onChange, ref, ...props } }) => (
<FormItem className="flex items-center gap-2"> <FormItem>
<FormLabel>CPF</FormLabel>
<FormControl> <FormControl>
<Checkbox <PatternFormat
checked={Boolean(value)} format="###.###.###-##"
onCheckedChange={onChange} mask="_"
tabIndex={-1} placeholder="___.___.___-__"
{...field} customInput={Input}
getInputRef={ref}
onValueChange={({ value }) => {
onChange(value)
}}
{...props}
/> />
</FormControl> </FormControl>
<FormLabel className="cursor-pointer"> <FormMessage />
Usar email gerado pela plataforma
</FormLabel>
</FormItem> </FormItem>
)} )}
/> />
</div> </FieldSet>
<FormField <Button
control={control} type="submit"
name="cpf" className="cursor-pointer"
defaultValue="" disabled={formState.isSubmitting}
render={({ field: { onChange, ref, ...props } }) => ( >
<FormItem> {formState.isSubmitting && <Spinner />}
<FormLabel>CPF</FormLabel> Adicionar usuário
<FormControl> </Button>
<PatternFormat
format="###.###.###-##"
mask="_"
placeholder="___.___.___-__"
customInput={Input}
getInputRef={ref}
onValueChange={({ value }) => {
onChange(value)
}}
{...props}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<div className="flex justify-end">
<Button
type="submit"
className="cursor-pointer"
disabled={formState.isSubmitting}
>
{formState.isSubmitting && <Spinner />}
Adicionar
</Button>
</div>
</CardContent> </CardContent>
</Card> </Card>
</form> </form>

View File

@@ -1,17 +1,8 @@
import type { Route } from './+types/route' import type { Route } from './+types/route'
import { useForm } from 'react-hook-form' import { useForm } from 'react-hook-form'
import { Link } from 'react-router' import { useOutletContext } from 'react-router'
import { Avatar, AvatarFallback } from '@repo/ui/components/ui/avatar'
import {
Breadcrumb,
BreadcrumbItem,
BreadcrumbLink,
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator
} from '@repo/ui/components/ui/breadcrumb'
import { Button } from '@repo/ui/components/ui/button' import { Button } from '@repo/ui/components/ui/button'
import { import {
Card, Card,
@@ -30,139 +21,78 @@ import {
FormMessage FormMessage
} from '@repo/ui/components/ui/form' } from '@repo/ui/components/ui/form'
import { Input } from '@repo/ui/components/ui/input' import { Input } from '@repo/ui/components/ui/input'
import { initials } from '@repo/ui/lib/utils'
import { request as req } from '@repo/util/request'
import { BadgeCheckIcon } from 'lucide-react'
export function meta() { export default function Route({}: Route.ComponentProps) {
return [ const { org } = useOutletContext()
{
title: 'Editar empresa'
}
]
}
export async function loader({ params, request, context }: Route.LoaderArgs) {
const r = await req({
url: `/orgs/${params.id}`,
request,
context
})
if (!r.ok) {
throw new Response(null, { status: r.status })
}
return { org: await r.json() } as { org: any }
}
export default function Route({ loaderData: { org } }: Route.ComponentProps) {
const form = useForm({ defaultValues: org }) const form = useForm({ defaultValues: org })
const { handleSubmit } = form const { handleSubmit, formState } = form
const onSubmit = async () => {} const onSubmit = async () => {}
return ( return (
<div className="space-y-2.5"> <Form {...form}>
<Breadcrumb> <form onSubmit={handleSubmit(onSubmit)} className="space-y-8">
<BreadcrumbList> <Card>
<BreadcrumbItem> <CardHeader>
<BreadcrumbLink asChild> <CardTitle className="font-semibold text-2xl">
<Link to="../orgs">Empresas</Link> Editar empresa
</BreadcrumbLink> </CardTitle>
</BreadcrumbItem> <CardDescription>
<BreadcrumbSeparator /> Configurar as informações gerais para esta empresa.
<BreadcrumbItem> </CardDescription>
<BreadcrumbPage>Editar empresa</BreadcrumbPage> </CardHeader>
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>
<div className="lg:max-w-2xl mx-auto space-y-2.5"> <CardContent className="space-y-6">
<div className="flex gap-2.5 items-center mb-5"> <FieldSet disabled={true}>
<div className="relative"> <FormField
{org?.subscription ? ( control={form.control}
<BadgeCheckIcon className="fill-blue-500 stroke-white absolute size-4 dark:size-3.5 -top-0 -right-0 z-2" /> name="name"
) : null} render={({ field }) => (
<FormItem>
<FormLabel>Nome</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<Avatar className="size-12"> <FormField
<AvatarFallback>{initials(org.name)}</AvatarFallback> control={form.control}
</Avatar> name="email"
</div> render={({ field }) => (
<FormItem>
<FormLabel>Email</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<ul> <FormField
<li className="font-bold text-lg">{org.name}</li> control={form.control}
<li className="text-muted-foreground text-sm truncate max-lg:max-w-62"> name="cnpj"
{org.email} render={({ field }) => (
</li> <FormItem>
</ul> <FormLabel>CNPJ</FormLabel>
</div> <FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</FieldSet>
<Form {...form}> <Button type="submit" disabled={true}>
<form onSubmit={handleSubmit(onSubmit)} className="space-y-8"> Atualizar perfil
<Card> </Button>
<CardHeader> </CardContent>
<CardTitle className="font-semibold text-2xl"> </Card>
Editar empresa </form>
</CardTitle> </Form>
<CardDescription>
Configurar as informações gerais para esta empresa.
</CardDescription>
</CardHeader>
<CardContent>
<FieldSet disabled={true}>
<FormField
control={form.control}
name="name"
render={({ field }) => (
<FormItem>
<FormLabel>Nome</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="email"
render={({ field }) => (
<FormItem>
<FormLabel>Email</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="cnpj"
render={({ field }) => (
<FormItem>
<FormLabel>CNPJ</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<div className="flex justify-end">
<Button type="submit">Editar</Button>
</div>
</FieldSet>
</CardContent>
</Card>
</form>
</Form>
</div>
</div>
) )
} }

View File

@@ -0,0 +1,11 @@
import type { Route } from './+types/route'
import { Card, CardContent } from '@repo/ui/components/ui/card'
export default function Route({}: Route.ComponentProps) {
return (
<Card>
<CardContent>address</CardContent>
</Card>
)
}

View File

@@ -0,0 +1,123 @@
import type { Route } from './+types/route'
import { useForm } from 'react-hook-form'
import { useOutletContext } from 'react-router'
import { Button } from '@repo/ui/components/ui/button'
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle
} from '@repo/ui/components/ui/card'
import { FieldGroup, FieldLegend, FieldSet } from '@repo/ui/components/ui/field'
import {
Form,
FormControl,
FormField,
FormItem,
FormLabel,
FormMessage
} from '@repo/ui/components/ui/form'
import { Input } from '@repo/ui/components/ui/input'
import { Label } from '@repo/ui/components/ui/label'
import {
NativeSelect,
NativeSelectOption
} from '@repo/ui/components/ui/native-select'
import { RadioGroup, RadioGroupItem } from '@repo/ui/components/ui/radio-group'
export default function Route({}: Route.ComponentProps) {
const { org } = useOutletContext()
const form = useForm({ defaultValues: org?.subscription })
const { handleSubmit, formState } = form
const onSubmit = async (data) => {
console.log(data)
}
return (
<Form {...form}>
<form onSubmit={handleSubmit(onSubmit)}>
<Card>
<CardHeader>
<CardTitle className="font-semibold text-lg">
Escolha seu plano
</CardTitle>
<CardDescription>
Escolha o plano que será utilizado para configurar o funcionamento
e os recursos da empresa.
</CardDescription>
</CardHeader>
<CardContent className="space-y-6">
<RadioGroup
defaultValue="none"
className="lg:grid-cols-2 *:border *:p-4 *:rounded-lg *:cursor-pointer
*:has-[[aria-checked=true]]:bg-muted"
>
<Label className="flex items-center gap-3">
<RadioGroupItem value="none" />
<div>Nenhum</div>
</Label>
<Label className="flex items-center gap-3">
<RadioGroupItem value="flexivel" />
<div>Flexível</div>
</Label>
</RadioGroup>
<FieldSet className="border rounded-lg p-6 bg-accent/10">
<FieldLegend className="mb-0">Configurações do plano</FieldLegend>
<FieldGroup>
<FormField
control={form.control}
name="billing_day"
render={({ field }) => (
<FormItem>
<FormLabel>Dia para faturar</FormLabel>
<FormControl>
<Input type="number" min={1} max={30} {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="payment_method"
render={({ field }) => (
<FormItem className="*:w-full">
<FormLabel>Forma de pagamento</FormLabel>
<FormControl>
<NativeSelect {...field}>
<NativeSelectOption value="BANK_SLIP">
Boleto bancário
</NativeSelectOption>
<NativeSelectOption value="MANUAL">
Depósito bancário
</NativeSelectOption>
</NativeSelect>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</FieldGroup>
</FieldSet>
<Button
type="submit"
className="cursor-pointer"
disabled={formState.isSubmitting}
>
Atualizar plano
</Button>
</CardContent>
</Card>
</form>
</Form>
)
}

View File

@@ -0,0 +1,123 @@
import type { Route } from './+types/route'
import {
Link,
NavLink,
Outlet,
type ShouldRevalidateFunctionArgs
} from 'react-router'
import { Avatar, AvatarFallback } from '@repo/ui/components/ui/avatar'
import {
Breadcrumb,
BreadcrumbItem,
BreadcrumbLink,
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator
} from '@repo/ui/components/ui/breadcrumb'
import { Tabs, TabsList, TabsTrigger } from '@repo/ui/components/ui/tabs'
import { initials } from '@repo/ui/lib/utils'
import { request as req } from '@repo/util/request'
import { BadgeCheckIcon } from 'lucide-react'
const links = [
{ to: '', title: 'Perfil', end: true },
{ to: 'subscription', title: 'Plano' },
{ to: 'address', title: 'Endereço' }
]
export function meta() {
return [
{
title: 'Editar empresa'
}
]
}
export async function loader({ params, request, context }: Route.LoaderArgs) {
const r = await req({
url: `/orgs/${params.id}`,
request,
context
})
if (!r.ok) {
throw new Response(null, { status: r.status })
}
return { org: await r.json() } as { org: any }
}
export function shouldRevalidate({
currentParams,
nextParams
}: ShouldRevalidateFunctionArgs) {
return currentParams.id !== nextParams.id
}
export default function Route({ loaderData: { org } }: Route.ComponentProps) {
return (
<div className="space-y-2.5">
<Breadcrumb>
<BreadcrumbList>
<BreadcrumbItem>
<BreadcrumbLink asChild>
<Link to="../orgs">Empresas</Link>
</BreadcrumbLink>
</BreadcrumbItem>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbPage>Editar empresa</BreadcrumbPage>
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>
<div className="lg:max-w-2xl mx-auto space-y-2.5">
<div className="flex gap-2.5 items-center mb-5">
<div className="relative">
{org?.subscription ? (
<BadgeCheckIcon className="fill-blue-500 stroke-white absolute size-4 dark:size-3.5 -top-0 -right-0 z-2" />
) : null}
<Avatar className="size-12">
<AvatarFallback>{initials(org.name)}</AvatarFallback>
</Avatar>
</div>
<ul>
<li className="font-bold text-lg">{org.name}</li>
<li className="text-muted-foreground text-sm truncate max-lg:max-w-62">
{org.email}
</li>
</ul>
</div>
<Tabs>
<TabsList>
{links.map(({ to, title, ...props }, idx) => (
<NavLink
to={to}
key={idx}
className="aria-[current=page]:pointer-events-none"
{...props}
>
{({ isActive }) => (
<TabsTrigger
data-state={isActive ? 'active' : ''}
value={title}
asChild
>
<span>{title}</span>
</TabsTrigger>
)}
</NavLink>
))}
</TabsList>
</Tabs>
<Outlet context={{ org }} />
</div>
</div>
)
}

View File

@@ -8,7 +8,6 @@ import { Await, useAsyncValue, useFetcher } from 'react-router'
import { toast } from 'sonner' import { toast } from 'sonner'
import { z } from 'zod' import { z } from 'zod'
import { request as req, HttpMethod } from '@repo/util/request'
import { Skeleton } from '@repo/ui/components/skeleton' import { Skeleton } from '@repo/ui/components/skeleton'
import { import {
Breadcrumb, Breadcrumb,
@@ -33,6 +32,7 @@ import {
DropdownMenuItem, DropdownMenuItem,
DropdownMenuTrigger DropdownMenuTrigger
} from '@repo/ui/components/ui/dropdown-menu' } from '@repo/ui/components/ui/dropdown-menu'
import { FieldGroup, FieldLegend, FieldSet } from '@repo/ui/components/ui/field'
import { import {
Form, Form,
FormControl, FormControl,
@@ -51,6 +51,7 @@ import {
} from '@repo/ui/components/ui/input-group' } from '@repo/ui/components/ui/input-group'
import { Spinner } from '@repo/ui/components/ui/spinner' import { Spinner } from '@repo/ui/components/ui/spinner'
import { Switch } from '@repo/ui/components/ui/switch' import { Switch } from '@repo/ui/components/ui/switch'
import { HttpMethod, request as req } from '@repo/util/request'
const formSchema = z const formSchema = z
.object({ .object({
@@ -211,7 +212,8 @@ function Editing() {
Configurar as informações gerais para este curso Configurar as informações gerais para este curso
</CardDescription> </CardDescription>
</CardHeader> </CardHeader>
<CardContent className="space-y-4">
<CardContent className="space-y-6">
<FormField <FormField
control={form.control} control={form.control}
name="name" name="name"
@@ -276,8 +278,10 @@ function Editing() {
/> />
{givenCert ? ( {givenCert ? (
<div className="space-y-4 border rounded-lg p-4 bg-accent/50"> <FieldSet className="border rounded-lg p-6 bg-accent/10">
<h3 className="font-medium">Configurações do certificado</h3> <FieldLegend className="mb-0">
Configurações do certificado
</FieldLegend>
<div className="space-y-1.5"> <div className="space-y-1.5">
<FormField <FormField
@@ -369,7 +373,7 @@ function Editing() {
</FormItem> </FormItem>
)} )}
/> />
</div> </FieldSet>
) : null} ) : null}
<FormField <FormField
@@ -388,19 +392,17 @@ function Editing() {
</FormItem> </FormItem>
)} )}
/> />
<Button
type="submit"
className="cursor-pointer"
disabled={formState.isSubmitting}
>
{formState.isSubmitting && <Spinner />}
Atualizar curso
</Button>
</CardContent> </CardContent>
</Card> </Card>
<div className="flex justify-end">
<Button
type="submit"
className="cursor-pointer"
disabled={formState.isSubmitting}
>
{formState.isSubmitting && <Spinner />}
Editar
</Button>
</div>
</form> </form>
</Form> </Form>
) )

View File

@@ -25,7 +25,7 @@ Globals:
Architectures: Architectures:
- x86_64 - x86_64
Layers: Layers:
- !Sub arn:aws:lambda:sa-east-1:336641857101:layer:layercake:104 - !Sub arn:aws:lambda:${AWS::Region}:${AWS::AccountId}:layer:layercake:104
Environment: Environment:
Variables: Variables:
TZ: America/Sao_Paulo TZ: America/Sao_Paulo

View File

@@ -14,7 +14,7 @@ Globals:
Architectures: Architectures:
- x86_64 - x86_64
Layers: Layers:
- !Sub arn:aws:lambda:sa-east-1:336641857101:layer:layercake:104 - !Sub arn:aws:lambda:${AWS::Region}:${AWS::AccountId}:layer:layercake:104
Environment: Environment:
Variables: Variables:
TZ: America/Sao_Paulo TZ: America/Sao_Paulo

View File

@@ -26,7 +26,7 @@ Globals:
Architectures: Architectures:
- x86_64 - x86_64
Layers: Layers:
- !Sub arn:aws:lambda:sa-east-1:336641857101:layer:layercake:104 - !Sub arn:aws:lambda:${AWS::Region}:${AWS::AccountId}:layer:layercake:104
Environment: Environment:
Variables: Variables:
TZ: America/Sao_Paulo TZ: America/Sao_Paulo

View File

@@ -8,7 +8,7 @@ Globals:
Architectures: Architectures:
- x86_64 - x86_64
Layers: Layers:
- !Sub arn:aws:lambda:sa-east-1:336641857101:layer:layercake:104 - !Sub arn:aws:lambda:${AWS::Region}:${AWS::AccountId}:layer:layercake:104
Environment: Environment:
Variables: Variables:
LOG_LEVEL: DEBUG LOG_LEVEL: DEBUG

View File

@@ -17,7 +17,7 @@ Globals:
Architectures: Architectures:
- x86_64 - x86_64
Layers: Layers:
- !Sub arn:aws:lambda:sa-east-1:336641857101:layer:layercake:104 - !Sub arn:aws:lambda:${AWS::Region}:${AWS::AccountId}:layer:layercake:104
Environment: Environment:
Variables: Variables:
TZ: America/Sao_Paulo TZ: America/Sao_Paulo