add subscription to org

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

@@ -1,6 +1,5 @@
 import type { Route } from './+types/route'
 
-import type { MouseEvent, ReactNode } from 'react'
 import { useRequest, useToggle } from 'ahooks'
 import {
   AlertTriangleIcon,
@@ -15,44 +14,15 @@ import {
   RocketIcon,
   UserIcon
 } from 'lucide-react'
-import { toast } from 'sonner'
 import { DateTime as LuxonDateTime } from 'luxon'
+import type { MouseEvent, ReactNode } from 'react'
 import { Fragment, Suspense } from 'react'
 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 {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger
-} from '@repo/ui/components/ui/dropdown-menu'
+import { DateTime } from '@repo/ui/components/datetime'
+import { Skeleton } from '@repo/ui/components/skeleton'
 import {
   AlertDialog,
   AlertDialogAction,
@@ -64,17 +34,44 @@ import {
   AlertDialogTitle,
   AlertDialogTrigger
 } 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 { useParams } from 'react-router'
-import { useRevalidator } from 'react-router'
-import { DateTime } from '@repo/ui/components/datetime'
 import {
   Tabs,
   TabsContent,
   TabsList,
   TabsTrigger
 } 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) {
   return [{ title: 'Matrículas agendadas' }]
@@ -442,8 +439,8 @@ function ActionMenu({ sk }: { sk: string }) {
       </DropdownMenuTrigger>
 
       <DropdownMenuContent align="end" className="*:cursor-pointer w-42">
-        <Proceedtem sk={sk} onSuccess={onSuccess} />
-        <DropdownMenuSeparator />
+        {/*        <Proceedtem sk={sk} onSuccess={onSuccess} />
+        <DropdownMenuSeparator />*/}
         <CancelItem sk={sk} onSuccess={onSuccess} />
       </DropdownMenuContent>
     </DropdownMenu>

apps/admin.saladeaula.digital/app/routes/_.$orgid.users.$id._index/route.tsx

@@ -89,8 +89,7 @@ export default function Route({}: Route.ComponentProps) {
 
   return (
     <Form {...form}>
-      <form onSubmit={handleSubmit(onSubmit)}>
-        <fieldset disabled={!!user?.rate_limit_exceeded} className="space-y-4">
+      <form onSubmit={handleSubmit(onSubmit)} className="space-y-3">
         {user?.rate_limit_exceeded && (
           <Alert variant="destructive">
             <AlertCircleIcon />
@@ -110,8 +109,8 @@ export default function Route({}: Route.ComponentProps) {
             </CardDescription>
           </CardHeader>
 
-            <CardContent>
-              <FieldSet>
+          <CardContent className="space-y-6">
+            <FieldSet disabled={!!user?.rate_limit_exceeded}>
               <FormField
                 control={control}
                 name="name"
@@ -176,21 +175,18 @@ export default function Route({}: Route.ComponentProps) {
                   </FormItem>
                 )}
               />
+            </FieldSet>
 
-                <div className="flex justify-end">
             <Button
               type="submit"
               className="cursor-pointer"
-                    disabled={formState.isSubmitting}
+              disabled={formState.isSubmitting || !!user?.rate_limit_exceeded}
             >
               {formState.isSubmitting && <Spinner />}
-                    Editar
+              Editar colaborador
             </Button>
-                </div>
-              </FieldSet>
           </CardContent>
         </Card>
-        </fieldset>
       </form>
     </Form>
   )

apps/admin.saladeaula.digital/app/routes/_.$orgid.users.$id.emails/route.tsx

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

apps/admin.saladeaula.digital/app/routes/_.$orgid.users.add/route.tsx

@@ -1,7 +1,7 @@
 import type { Route } from './+types/route'
 
-import { useEffect } from 'react'
 import { zodResolver } from '@hookform/resolvers/zod'
+import { useEffect } from 'react'
 import { useForm } from 'react-hook-form'
 import { PatternFormat } from 'react-number-format'
 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 { useWorksapce } from '@/components/workspace-switcher'
+import { FieldSet } from '@repo/ui/components/ui/field'
 import { formSchema, type Schema } from './data'
 
 export function meta({}: Route.MetaArgs) {
@@ -115,7 +116,7 @@ export default function Route({}: Route.ComponentProps) {
 
       <div className="lg:max-w-2xl mx-auto">
         <Form {...form}>
-          <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
+          <form onSubmit={handleSubmit(onSubmit)}>
             <Card>
               <CardHeader>
                 <CardTitle className="text-2xl">
@@ -126,7 +127,8 @@ export default function Route({}: Route.ComponentProps) {
                 </CardDescription>
               </CardHeader>
 
-              <CardContent className="space-y-4">
+              <CardContent className="space-y-6">
+                <FieldSet>
                   <FormField
                     control={control}
                     name="name"
@@ -208,17 +210,16 @@ export default function Route({}: Route.ComponentProps) {
                       </FormItem>
                     )}
                   />
+                </FieldSet>
 
-                <div className="flex justify-end">
                 <Button
                   type="submit"
                   className="cursor-pointer"
                   disabled={formState.isSubmitting}
                 >
                   {formState.isSubmitting && <Spinner />}
-                    Adicionar
+                  Adicionar usuário
                 </Button>
-                </div>
               </CardContent>
             </Card>
           </form>

apps/insights.saladeaula.digital/app/routes/_app.orgs.$id._index/route.tsx

@@ -1,17 +1,8 @@
 import type { Route } from './+types/route'
 
 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 {
   Card,
@@ -30,74 +21,15 @@ import {
   FormMessage
 } from '@repo/ui/components/ui/form'
 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() {
-  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 default function Route({ loaderData: { org } }: Route.ComponentProps) {
+export default function Route({}: Route.ComponentProps) {
+  const { org } = useOutletContext()
   const form = useForm({ defaultValues: org })
-  const { handleSubmit } = form
+  const { handleSubmit, formState } = form
 
   const onSubmit = async () => {}
 
   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>
-
     <Form {...form}>
       <form onSubmit={handleSubmit(onSubmit)} className="space-y-8">
         <Card>
@@ -110,7 +42,7 @@ export default function Route({ loaderData: { org } }: Route.ComponentProps) {
             </CardDescription>
           </CardHeader>
 
-              <CardContent>
+          <CardContent className="space-y-6">
             <FieldSet disabled={true}>
               <FormField
                 control={form.control}
@@ -153,16 +85,14 @@ export default function Route({ loaderData: { org } }: Route.ComponentProps) {
                   </FormItem>
                 )}
               />
-
-                  <div className="flex justify-end">
-                    <Button type="submit">Editar</Button>
-                  </div>
             </FieldSet>
+
+            <Button type="submit" disabled={true}>
+              Atualizar perfil
+            </Button>
           </CardContent>
         </Card>
       </form>
     </Form>
-      </div>
-    </div>
   )
 }

apps/insights.saladeaula.digital/app/routes/_app.orgs.$id.address/route.tsx

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

apps/insights.saladeaula.digital/app/routes/_app.orgs.$id.subscription/route.tsx

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

apps/insights.saladeaula.digital/app/routes/_app.orgs.$id/route.tsx

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

apps/studio.saladeaula.digital/app/routes/edit.tsx

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

enrollments-events/template.yaml

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

id.saladeaula.digital/template.yaml

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

orders-events/template.yaml

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

streams-events/template.yaml

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

users-events/template.yaml

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