add itens

superpage/src/components/FAQ.jsx

@@ -5,56 +5,14 @@ import {
 } from '@headlessui/react'
 import { ChevronDownIcon } from '@heroicons/react/24/solid'
 
-export function FAQ() {
+export function Faq({ topics }) {
   return (
     <>
-      <ListItem defaultOpen={false}>
-        <ListButton>1. Introdução</ListButton>
-        <ListPanel>
-          <p>
-            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit
-            amet neque id libero semper vulputate a ut ex. Pellentesque semper
-            ultrices mi in efficitur.
-          </p>
-          <p>
-            Nulla sit amet quam eu neque convallis volutpat. Pellentesque eu
-            commodo sem. Suspendisse ac lobortis massa, ac mattis mauris.
-            Integer malesuada bibendum ante, sed consequat augue convallis et.
-          </p>
-        </ListPanel>
-      </ListItem>
-      <ListItem>
-        <ListButton>2. Aspectos gerais dos primeiros socorros</ListButton>
-        <ListPanel>
-          <p>
-            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit
-            amet neque id libero semper vulputate a ut ex. Pellentesque semper
-            ultrices mi in efficitur.
-          </p>
-          <p>
-            Nulla sit amet quam eu neque convallis volutpat. Pellentesque eu
-            commodo sem. Suspendisse ac lobortis massa, ac mattis mauris.
-            Integer malesuada bibendum ante, sed consequat augue convallis et.
-          </p>
-        </ListPanel>
-      </ListItem>
-      <ListItem>
-        <ListButton>3. Sinais vitais e avaliação primária</ListButton>
-        <ListPanel>
-          <p>
-            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit
-            amet neque id libero semper vulputate a ut ex. Pellentesque semper
-            ultrices mi in efficitur.
-          </p>
-          <p>
-            Nulla sit amet quam eu neque convallis volutpat. Pellentesque eu
-            commodo sem. Suspendisse ac lobortis massa, ac mattis mauris.
-            Integer malesuada bibendum ante, sed consequat augue convallis et.
-          </p>
-        </ListPanel>
-      </ListItem>
-      <ListItem>
-        <ListButton>4. Parada cardiorrespiratória</ListButton>
+      {topics?.map((topic, idx) => (
+        <ListItem defaultOpen={false} key={idx}>
+          <ListButton>
+            {idx + 1}. {topic}
+          </ListButton>
           <ListPanel>
             <p>
               Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit
@@ -68,6 +26,7 @@ export function FAQ() {
             </p>
           </ListPanel>
         </ListItem>
+      ))}
     </>
   )
 }

superpage/src/content.config.ts

@@ -1,13 +1,32 @@
-import { defineCollection, z } from 'astro:content'
+import { defineCollection, z, reference } from 'astro:content'
 import { glob } from 'astro/loaders'
 
+const trainers = defineCollection({
+  loader: glob({ pattern: '**/*.md', base: './src/data/trainers' }),
+  schema: z.object({
+    name: z.string(),
+    bio: z.string(),
+  }),
+})
+
 const courses = defineCollection({
   loader: glob({ pattern: '**/*.md', base: './src/data/courses' }),
   schema: z.object({
     id: z.string(),
     title: z.string(),
     slug: z.string(),
+    course: z.object({
+      hours: z.number(),
+      modules: z.array(z.string()),
+      trainer: reference('trainers').optional(),
+    }),
+    seo: z
+      .object({
+        tags: z.array(z.string()),
+      })
+      .optional(),
+    draft: z.boolean().default(true),
   }),
 })
 
-export const collections = { courses }
+export const collections = { trainers, courses }

superpage/src/data/courses/lei-lucas.md

@@ -1,7 +1,20 @@
 ---
-id: '96c03c32-089c-4ccb-8aa1-73b0f49228b9'
-title: 'Lei Lucas'
-slug: 'lei-lucas'
----
+id: 96c03c32-089c-4ccb-8aa1-73b0f49228b9
+title: Lei Lucas
+slug: lei-lucas
+draft: false
 
-asdasdas
+course:
+  hours: 8
+  modules:
+    - Introdução à Lei Lucas
+    - Aspectos gerais dos primeiros socorros
+    - Sinais vitais e avaliação primária
+    - Parada cardiorrespiratória (PCR)
+    - Hemorragias e controle
+    - Queimaduras
+    - Engasgo e manobra de Heimlich
+    - fraturas, luxações e entorses
+    - Emergências traumáticas
+    - Convulsões e desmaios
+---

superpage/src/data/courses/nr-18-plataforma-de-trabalho-aereo.md

@@ -1,7 +1,23 @@
 ---
-id: '450a70ca-8ab5-4520-8a22-0e277359797d'
-title: 'NR-18 PEMT Plataforma Móvel de Trabalho Aéreo'
-slug: 'nr-18-plataforma-de-trabalho-aereo'
+id: 450a70ca-8ab5-4520-8a22-0e277359797d
+title: NR-18 PEMT Plataforma Móvel de Trabalho Aéreo
+slug: nr-18-plataforma-de-trabalho-aereo
+draft: false
+
+seo:
+  tags:
+    - test
+
+course:
+  hours: 4
+  trainer: francis
+  modules:
+    - Aspectos regulamentares e legais da NR-18
+    - Tipos construtivos das PEMTs, aplicações, características técnicas e operacionais
+    - Acidentes previsíveis com PEMTs e como evitá-los
+    - Plano de segurança da operação – PSO
+    - Manutenção mínima de segurança nas PEMTs
+    - Noções de primeiros socorros
 ---
 
 asdasdas

superpage/src/data/courses/nr-35-trabalhos-em-altura.md

@@ -1,7 +1,15 @@
 ---
-id: 'e1c44881-2fe3-484e-ada2-12b6bf5b9398'
-title: 'NR-35 Trabalho em Altura'
-slug: 'nr-35-trabalhos-em-altura-teorico'
----
+id: e1c44881-2fe3-484e-ada2-12b6bf5b9398
+title: NR-35 Trabalho em Altura
+slug: nr-35-trabalhos-em-altura-teorico
+draft: false
 
-asdasdas
+course:
+  hours: 8
+  trainer: francis
+  modules:
+    - Introdução
+    - Aspectos gerais dos primeiros socorros
+    - Sinais vitais e avaliação primária
+    - Parada cardiorrespiratória
+---

superpage/src/data/posts/prevencao-na-seguranca-do-trabalho.md

@@ -0,0 +1,10 @@
+---
+title: 'Prevenção na segurança do trabalho: um investimento que salva vidas'
+slug: prevencao-na-seguranca-do-trabalho
+---
+
+Prevenção na segurança do trabalho ainda é vista por muitas empresas como um custo. No entanto, a verdade é que prevenir não é apenas mais barato — é vital. Reagir após um acidente pode custar milhões, impactar a imagem da empresa e, o mais grave, custar vidas humanas.
+
+Quando falamos de segurança do trabalho, a frase “prevenir é melhor do que remediar” não é apenas um clichê. É uma realidade que salva vidas, preserva famílias e evita prejuízos financeiros gigantescos para as empresas. Apesar disso, muitas organizações ainda enxergam a prevenção como um gasto, e não como um investimento estratégico.
+
+Neste artigo, vamos explorar por que essa visão precisa mudar com urgência. Afinal, reagir a um acidente de trabalho pode custar infinitamente mais — em dinheiro, em reputação e, mais grave ainda, em vidas humanas.

superpage/src/data/trainers/francis.md

@@ -0,0 +1,9 @@
+---
+name: Francis Ricardo Baretta
+bio:
+  Francis Ricardo Baretta é Engenheiro em Segurança do Trabalho e Engenheiro Eletricista com registro no CREA SC 126693-0. Além disso, possui formação acadêmica pela Universidade Regional de Blumenau (FURB) em Engenharia de Telecomunicações e Engenharia Elétrica, além de estar cursando Pós-Graduação em Engenharia de Segurança do Trabalho pela UNIASSELVI.
+
+  Participou de cursos e atividades complementares, incluindo NR-10, NR-35, eficiência energética, gerenciamento de projetos, energia fotovoltaica e treinamento de ferramentas de gestão avançadas.
+networks:
+  - linkedin: https://www.linkedin.com/in/francis-ricardo-baretta-5262ab11a/
+---

superpage/src/layouts/Layout.astro

@@ -1,9 +1,15 @@
 ---
-import '../styles/app.css'
-import { Regular as Logo } from '@components/Logo'
-import { Container } from '@components/Container'
-import { Menu } from '@components/Menu'
+export interface Props {
+  title: string
+}
+
+import '~/styles/app.css'
+import { Regular as Logo } from '~/components/Logo'
+import { Container } from '~/components/Container'
+import { Menu } from '~/components/Menu'
 import { ArrowLeftStartOnRectangleIcon } from '@heroicons/react/24/solid'
+
+const { title } = Astro.props
 ---
 
 <!doctype html>
@@ -13,7 +19,9 @@ import { ArrowLeftStartOnRectangleIcon } from '@heroicons/react/24/solid'
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <meta name="generator" content={Astro.generator} />
-    <title>EDUSEG&reg; &mdash; Educação que garante sua segurança</title>
+    <title>
+      {title} &dash; EDUSEG&reg; &mdash; Educação que garante sua segurança
+    </title>
   </head>
 
   <body>

superpage/src/pages/[slug].astro

@@ -1,24 +1,25 @@
 ---
-import Layout from '@layouts/Layout.astro'
-import { Picture, Image } from 'astro:assets'
-import { Container } from '@components/Container'
-import { FAQ } from '@components/FAQ'
+import { Picture } from 'astro:assets'
+import Layout from '~/layouts/Layout.astro'
+import { Container } from '~/components/Container'
+import { Faq } from '~/components/Faq'
 import { StarIcon, ClockIcon } from '@heroicons/react/24/outline'
 import { CheckBadgeIcon } from '@heroicons/react/24/solid'
-import { LinkedInIcon } from '@components/LinkedInIcon'
-import nr18plataforma from '../assets/nr18-plataforma.png'
-import mulherdenegocios from '../assets/mulher-de-negocios.png'
-import homemdenegocios from '../assets/homem-de-negocios.png'
-import francis from '../assets/francis.jpeg'
-import Natura from '../assets/natura.svg'
-import Nissan from '../assets/nissan.svg'
-import Kordsa from '../assets/kordsa.svg'
-import Manserv from '../assets/manserv.svg'
-import Semeq from '../assets/semeq.svg'
-import { getCollection, render } from 'astro:content'
+import { LinkedInIcon } from '~/components/LinkedInIcon'
+import nr18plataforma from '~/assets/nr18-plataforma.png'
+import mulherdenegocios from '~/assets/mulher-de-negocios.png'
+import homemdenegocios from '~/assets/homem-de-negocios.png'
+import francis from '~/assets/francis.jpeg'
+import Natura from '~/assets/natura.svg'
+import Nissan from '~/assets/nissan.svg'
+import Kordsa from '~/assets/kordsa.svg'
+import Manserv from '~/assets/manserv.svg'
+import Semeq from '~/assets/semeq.svg'
+
+import { getCollection, getEntry } from 'astro:content'
 
 export async function getStaticPaths() {
-  const posts = await getCollection('courses')
+  const posts = await getCollection('courses', ({ data }) => data.draft != true)
 
   return posts.map((course) => {
     return {
@@ -27,12 +28,17 @@ export async function getStaticPaths() {
     }
   })
 }
-// 2. For your template, you can get the entry directly from the prop
-const { course } = Astro.props
-const { Content } = await render(course)
+
+const {
+  course: { data },
+} = Astro.props
+
+const trainer = data.course?.trainer
+  ? await getEntry(data.course?.trainer)
+  : null
 ---
 
-<Layout>
+<Layout title={data.title}>
   <Container className="py-3 lg:py-12 lg:flex items-center gap-5">
     <Picture
       src={nr18plataforma}
@@ -44,7 +50,7 @@ const { Content } = await render(course)
       <div class="space-y-5">
         <span class="font-medium">Curso de formação</span>
         <h1 class="text-pretty font-semibold text-4xl lg:text-7xl">
-          {course.data.title}
+          {data.title}
         </h1>
         <p class="text-base/6">
           NR 18 PEMT capacita operadores de plataformas elevatórias para
@@ -55,7 +61,7 @@ const { Content } = await render(course)
         <ul class="lg:flex gap-3">
           <li class="flex gap-1">
             <ClockIcon className="w-5" />
-            <span>Carga horária de 40 horas</span>
+            <span>Carga horária de {data.course.hours} horas</span>
           </li>
 
           <li class="flex gap-1">
@@ -217,10 +223,12 @@ const { Content } = await render(course)
       </p>
     </div>
     <div class="lg:col-span-2 flex flex-col gap-1.5">
-      <FAQ client:load />
+      <Faq topics={data.course.modules} client:load />
     </div>
   </Container>
 
+  {
+    trainer && (
       <Container>
         <div class="bg-white/10 rounded-2xl p-2.5 lg:py-6 xl:py-24">
           <div class="lg:w-8/12 flex max-lg:flex-col gap-5 mx-auto">
@@ -235,21 +243,13 @@ const { Content } = await render(course)
             <div class="space-y-2.5">
               <h5 class="text-xl text-pretty">Quem é o instrutor?</h5>
               <h5 class="text-4xl lg:text-5xl text-pretty">
-            Francis Ricardo Baretta
+                {trainer.data.name}
               </h5>
-          <p class="text-sm/6 text-white/70">
-            Francis Ricardo Baretta é Engenheiro em Segurança do Trabalho e
-            Engenheiro Eletricista com registro no CREA SC 126693-0. Além disso,
-            possui formação acadêmica pela Universidade Regional de Blumenau
-            (FURB) em Engenharia de Telecomunicações e Engenharia Elétrica, além
-            de estar cursando Pós-Graduação em Engenharia de Segurança do
-            Trabalho pela UNIASSELVI.
-          </p>
-          <p class="text-sm/6 text-white/70">
-            Participou de cursos e atividades complementares, incluindo NR-10,
-            NR-35, eficiência energética, gerenciamento de projetos, energia
-            fotovoltaica e treinamento de ferramentas de gestão avançadas.
-          </p>
+
+              {trainer.data.bio.split(/\r?\n/).map((x) => (
+                <p class="text-sm/6 text-white/70">{x}</p>
+              ))}
+
               <div class="flex">
                 <a
                   href="https://www.linkedin.com/in/francis-ricardo-baretta-5262ab11a/"
@@ -262,4 +262,6 @@ const { Content } = await render(course)
           </div>
         </div>
       </Container>
+    )
+  }
 </Layout>

superpage/src/pages/index.astro

@@ -1,23 +1,23 @@
 ---
-import Layout from '@layouts/Layout.astro'
-import { Picture, Image } from 'astro:assets'
-import { Container } from '@components/Container'
-import { FAQ } from '@components/FAQ'
+import { Picture } from 'astro:assets'
+import Layout from '~/layouts/Layout.astro'
+import { Container } from '~/components/Container'
+import { Faq } from '~/components/Faq'
 import { StarIcon, ClockIcon } from '@heroicons/react/24/outline'
 import { CheckBadgeIcon } from '@heroicons/react/24/solid'
-import { LinkedInIcon } from '@components/LinkedInIcon'
-import nr18plataforma from '../assets/nr18-plataforma.png'
-import mulherdenegocios from '../assets/mulher-de-negocios.png'
-import homemdenegocios from '../assets/homem-de-negocios.png'
-import francis from '../assets/francis.jpeg'
-import Natura from '../assets/natura.svg'
-import Nissan from '../assets/nissan.svg'
-import Kordsa from '../assets/kordsa.svg'
-import Manserv from '../assets/manserv.svg'
-import Semeq from '../assets/semeq.svg'
+import { LinkedInIcon } from '~/components/LinkedInIcon'
+import nr18plataforma from '~/assets/nr18-plataforma.png'
+import mulherdenegocios from '~/assets/mulher-de-negocios.png'
+import homemdenegocios from '~/assets/homem-de-negocios.png'
+import francis from '~/assets/francis.jpeg'
+import Natura from '~/assets/natura.svg'
+import Nissan from '~/assets/nissan.svg'
+import Kordsa from '~/assets/kordsa.svg'
+import Manserv from '~/assets/manserv.svg'
+import Semeq from '~/assets/semeq.svg'
 ---
 
-<Layout>
+<Layout title="">
   <Container className="py-3 lg:py-12 lg:flex items-center gap-5">
     <Picture
       src={nr18plataforma}
@@ -202,7 +202,7 @@ import Semeq from '../assets/semeq.svg'
       </p>
     </div>
     <div class="lg:col-span-2 flex flex-col gap-1.5">
-      <FAQ client:load />
+      <Faq topics={[]} client:load />
     </div>
   </Container>
 

superpage/tsconfig.json

@@ -7,8 +7,7 @@
     "jsxImportSource": "react",
     "baseUrl": ".",
     "paths": {
-      "@components/*": ["src/components/*"],
-      "@layouts/*": ["src/layouts/*"]
+      "~/*": ["src/*"]
     },
     "strictNullChecks": true
   }