Proyectos de Subversion LeadersLinked - SPA

import React from 'react';
import { useNavigate } from 'react-router-dom';
import { Button } from '@mui/material';

import { useSlide } from '@microlearning/hooks';

import { Spinner } from '@shared/components';
import { CapsuleSuccessFeedback } from './capsule-success-feedback';
import { SlideCard } from './slide-card';

export function SlideForm({ slideUuid = '', autoPlay = false }) {
  const navigate = useNavigate();

  const { slide, loading: slideLoading, handleMarkSlideCompleted } = useSlide(slideUuid);

  if (slide.completed) {
    return (
      <CapsuleSuccessFeedback
        text='¡Felicidades! Has completado la lección.'
        onConfirm={() => navigate('/microlearning')}
      />
    );
  }

  if (slideLoading) {
    return <Spinner />;
  }

  return (
    <>
      <SlideCard
        completed={slide.completed}
        slide={slide}
        autoPlay={autoPlay}
        onComplete={() => handleMarkSlideCompleted(slide.uuid)}
      />

      {slide.type !== 'quiz' && (
        <Button
          color='primary'
          disabled={slide.completed}
          onClick={() => handleMarkSlideCompleted(slide.uuid)}
          sx={{ mt: 2 }}
        >
          Marcar como completado
        </Button>
      )}
    </>
  );
}