feat: remover estado atual e navegação do componente RetrospectiveSlides para simplificação

src/views/components/retrospective-slides.tsx

@@ -10,9 +10,7 @@ import {
   SpinnerIcon,
 } from '@phosphor-icons/react';
 import { motion } from 'framer-motion';
-import * as React from 'react';
 import { useSearchParams } from 'react-router-dom';
-import { Navigation } from './navigation';
 import ProfileCard from './ProfileCard';
 import { StorySlide } from './story-slide';
 
@@ -35,8 +33,6 @@ export function RetrospectiveSlides() {
     error: errorSystems,
   } = useMetricsBySystems(cpf, ano);
 
-  const [current, setCurrent] = React.useState(0);
-
   // Calcula slides baseado nos dados disponíveis
   const slides: number[] = [];
   slides.push(0); // Slide inicial
@@ -49,8 +45,6 @@ export function RetrospectiveSlides() {
   }
   slides.push(3); // Slide final
 
-  const total = slides.length;
-
   const isLoading = isLoadingPortal || isLoadingSystems;
   const hasError = errorPortal || errorSystems;
 
@@ -97,8 +91,6 @@ export function RetrospectiveSlides() {
         </div>
       ) : (
         <>
-          <Navigation total={total} current={current} setCurrent={setCurrent} />
-
           <div className="h-full snap-y snap-mandatory overflow-y-scroll scroll-smooth">
             <StorySlide className="bg-linear-to-br from-[#0e233d] via-[#173b63] to-[#145190] text-white">
               <div className="text-center space-y-8">
@@ -135,15 +127,6 @@ export function RetrospectiveSlides() {
                   pública
                 </motion.p>
 
-                <motion.p
-                  className="text-lg text-white/70"
-                  initial={{ y: 20, opacity: 0 }}
-                  whileInView={{ y: 0, opacity: 1 }}
-                  viewport={{ once: true }}
-                  transition={{ duration: 0.6, delay: 0.5 }}>
-                  Seus dados analisados: CPF •••••••••••
-                </motion.p>
-
                 <motion.div
                   className="flex items-center justify-center gap-4 text-sm text-white/70 pt-8"
                   initial={{ opacity: 0 }}
@@ -162,14 +145,12 @@ export function RetrospectiveSlides() {
             {metricsPortal && metricsPortal.length > 0 && (
               <StorySlide className="bg-linear-to-br from-[#0e233d] via-[#173b63] to-[#145190] text-white overflow-hidden">
                 <div className="flex flex-col md:flex-row items-center justify-between h-full px-6 py-8 md:py-12 md:px-8">
-                  {/* Coluna esquerda - Ícone e números principais */}
                   <motion.div
                     className="md:w-2/5 flex flex-col items-center md:items-start mb-8 md:mb-0 md:pr-8"
                     initial={{ opacity: 0, x: -30 }}
                     whileInView={{ opacity: 1, x: 0 }}
                     viewport={{ once: true }}
                     transition={{ duration: 0.6 }}>
-                    {/* Ícone com efeito */}
                     <motion.div
                       initial={{ scale: 0 }}
                       whileInView={{ scale: 1 }}
@@ -182,7 +163,6 @@ export function RetrospectiveSlides() {
                       </div>
                     </motion.div>
 
-                    {/* Título */}
                     <motion.h2
                       className="text-2xl md:text-3xl lg:text-4xl font-bold text-center md:text-left mb-4"
                       initial={{ opacity: 0, y: -20 }}
@@ -201,7 +181,6 @@ export function RetrospectiveSlides() {
                       A porta de entrada para todas as aplicações
                     </motion.p>
 
-                    {/* Número principal */}
                     <motion.div
                       className="space-y-3 mb-6"
                       initial={{ opacity: 0, scale: 0.8 }}
@@ -218,7 +197,6 @@ export function RetrospectiveSlides() {
                       </p>
                     </motion.div>
 
-                    {/* Estatísticas rápidas */}
                     <motion.div
                       className="mt-4 md:mt-auto w-full"
                       initial={{ opacity: 0 }}
@@ -257,7 +235,6 @@ export function RetrospectiveSlides() {
                     </motion.div>
                   </motion.div>
 
-                  {/* Coluna direita - Sistemas mais acessados (mantendo seu design) */}
                   <div className="md:w-3/5 h-full flex items-center">
                     <div className="w-full">
                       <motion.div
@@ -274,7 +251,6 @@ export function RetrospectiveSlides() {
                         </div>
                       </motion.div>
 
-                      {/* Lista de sistemas */}
                       <div className="w-full grid grid-cols-1 gap-3 md:gap-4 max-h-full">
                         {topItems.slice(0, 6).map((item, index) => {
                           const medalColors = [
@@ -333,8 +309,7 @@ export function RetrospectiveSlides() {
                                 }}>
                                 <p className="text-xl md:text-2xl font-bold text-yellow-300 mb-1">
                                   {(
-                                    (item.totalAcessos /
+                                    (item.totalAcessos / (totalAcessos || 1)) *
-                                      (topItems[0]?.totalAcessos || 1)) *
                                     100
                                   ).toFixed(0)}
                                   %
@@ -346,7 +321,7 @@ export function RetrospectiveSlides() {
                                     whileInView={{
                                       width: `${
                                         (item.totalAcessos /
-                                          (topItems[0]?.totalAcessos || 1)) *
+                                          (totalAcessos || 1)) *
                                         100
                                       }%`,
                                     }}