import React from ‘react’;
import { useQuery } from ‘@tanstack/react-query’;
import { base44 } from ‘@/api/base44Client’;
import { motion } from ‘framer-motion’;
import { ArrowRight, BookOpen, Puzzle } from ‘lucide-react’;
import { Link } from ‘react-router-dom’;
import { createPageUrl } from ‘@/utils’;

import HeroSection from ‘@/components/blog/HeroSection’;
import PostCard from ‘@/components/blog/PostCard’;
import TutorialCard from ‘@/components/blog/TutorialCard’;
import SectionHeader from ‘@/components/blog/SectionHeader’;
import { Button } from “@/components/ui/button”;
import { Skeleton } from “@/components/ui/skeleton”;

export default function Home() {
const { data: posts = [], isLoading } = useQuery({
queryKey: [‘posts’],
queryFn: () => base44.entities.Post.list(‘-created_date’, 10),
});

const latestPosts = posts.slice(0, 3);
const tutorials = posts.filter(p => p.category === ‘tutoriais’).slice(0, 4);

return (

{/* Hero Section */}

{/* Latest Posts Section */}




{isLoading ? (

{[1, 2, 3].map((i) => (




))}

) : latestPosts.length > 0 ? (

{latestPosts.map((post, index) => (

))}

) : (

Nenhum post publicado ainda.

)}

{/* Tutorials Section */}

{isLoading ? (
[1, 2, 3].map((i) => (


))
) : tutorials.length > 0 ? (
tutorials.map((post, index) => (

))
) : (

Tutoriais em breve!

)}



{/* Feature Card */}

Plug-ins que Turbinam seu Assistente

Descubra as melhores ferramentas e extensões para ampliar as funcionalidades
do seu assistente de IA e automatizar ainda mais suas tarefas.

    {[‘Integração com APIs’, ‘Automação de tarefas’, ‘Análise de dados’, ‘Geração de conteúdo’].map((item, i) => (

  • {item}
  • ))}



);
}