import { Fragment, useState, useEffect, useRef, useCallback } from 'react'; import Cookies from "universal-cookie"; import Link from 'next/link'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faCheck, faTrash } from '@fortawesome/free-solid-svg-icons'; import redirect from '../../utils/redirect'; import HeadTag from '../../components/HeadTag'; import api from '../../utils/api'; import '../../public/css/pages/admin.css'; const manageQuotes = (props) => { const [quotesData, setQuotesData] = useState({ hasMore: true, rows: [], totalItems: 0 }); const [isLoadingQuotes, setLoadingQuotes] = useState(true); const [pageQuotes, setPageQuotes] = useState(1); // Récupère les citations si la page change useEffect(() => { getQuotesData(); }, [pageQuotes]); const getQuotesData = async () => { setLoadingQuotes(true); const { data } = await api.get(`/admin/quotes?limit=20page=${pageQuotes}`, { headers: { 'Authorization': props.user.token } }); setQuotesData({ hasMore: data.hasMore, rows: [...quotesData.rows, ...data.rows], totalItems: data.totalItems }); setLoadingQuotes(false); } // Permet la pagination au scroll const observer = useRef(); const lastQuoteRef = useCallback((node) => { if (isLoadingQuotes) return; if (observer.current) observer.current.disconnect(); observer.current = new IntersectionObserver((entries) => { if (entries[0].isIntersecting && quotesData.hasMore) { setPageQuotes(pageQuotes + 1); } }, { threshold: 1 }); if (node) observer.current.observe(node); }, [isLoadingQuotes, quotesData.hasMore]); const handleValidationQuote = async (id, isValid) => { try { await api.put(`/admin/quotes/${id}`, { isValid }, { headers: { 'Authorization': props.user.token } }); window.location.reload(true); } catch {} } return (

Liste des citations (non validées) :

Total de {quotesData.totalItems} citations.

{quotesData.rows.map((currentQuote, index) => { const quoteJSX = ( ); // Si c'est le dernier élément if (quotesData.rows.length === index + 1) { return {quoteJSX} } return {quoteJSX} })}
Citation/Proverbe Auteur Proposée par Valider Supprimer
{currentQuote.quote} {currentQuote.author} {currentQuote.user.name} handleValidationQuote(currentQuote.id, true)} className="table-row text-center" style={{ cursor: 'pointer' }}> handleValidationQuote(currentQuote.id, false)} className="table-row text-center" style={{ cursor: 'pointer' }}>
); } export async function getServerSideProps(context) { const cookies = new Cookies(context.req.headers.cookie); const user = { ...cookies.get('user') }; if (!user.isAdmin) { return redirect(context, '/404'); } return { props: { user } }; } export default manageQuotes;