Skip to content

Commit 583bc13

Browse files
committed
✨ feat: adicionar configuração de páginas excluídas da barra de progresso
- Criar array EXCLUDED_PATHS para definir páginas onde a barra não aparece - Adicionar hook useLocation para detectar mudanças de página - Implementar lógica para não renderizar barra em páginas excluídas - Incluir '/pt_BR/' e '/pt_BR' como paths excluídos por padrão - Resetar progresso ao mudar de página - Adicionar comentários explicativos para facilitar manutenção
1 parent 71a8b10 commit 583bc13

1 file changed

Lines changed: 30 additions & 2 deletions

File tree

src/components/ReadingProgressBar/index.jsx

Lines changed: 30 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,38 @@
11
import React, { useState, useEffect, useCallback, useRef } from 'react';
2+
import { useLocation } from '@docusaurus/router';
23
import confetti from 'canvas-confetti';
34
import styles from './styles.module.css';
45

6+
/**
7+
* Caminhos onde a barra de progresso NÃO deve ser exibida
8+
*
9+
* Adicione aqui os paths que são muito curtos ou onde a barra
10+
* de progresso não faz sentido (ex: landing pages, índices, etc)
11+
*/
12+
const EXCLUDED_PATHS = [
13+
'/pt_BR/',
14+
'/pt_BR',
15+
// Adicione mais paths aqui conforme necessário
16+
// Exemplo: '/sobre', '/contato', etc
17+
];
18+
519
/**
620
* Barra de Progresso de Leitura
721
*
822
* Mostra o progresso de leitura da página atual e dispara confetti
923
* quando o usuário completa a leitura (chega ao final da página).
24+
*
25+
* A barra não é exibida em páginas definidas em EXCLUDED_PATHS.
1026
*/
1127
export default function ReadingProgressBar() {
28+
const location = useLocation();
1229
const [progress, setProgress] = useState(0);
1330
const hasCompletedRef = useRef(false);
1431
const confettiTimeoutRef = useRef(null);
1532

33+
// Verificar se a página atual está na lista de exclusão
34+
const isExcludedPath = EXCLUDED_PATHS.includes(location.pathname);
35+
1636
const fireConfetti = useCallback(() => {
1737
const duration = 3000;
1838
const animationEnd = Date.now() + duration;
@@ -51,6 +71,9 @@ export default function ReadingProgressBar() {
5171
}, []);
5272

5373
const handleScroll = useCallback(() => {
74+
// Não processar scroll em páginas excluídas
75+
if (isExcludedPath) return;
76+
5477
const windowHeight = window.innerHeight;
5578
const documentHeight = document.documentElement.scrollHeight;
5679
const scrollTop = window.scrollY || window.pageYOffset || document.documentElement.scrollTop;
@@ -81,7 +104,7 @@ export default function ReadingProgressBar() {
81104
if (scrollPercentage < 10) {
82105
hasCompletedRef.current = false;
83106
}
84-
}, [fireConfetti]);
107+
}, [fireConfetti, isExcludedPath]);
85108

86109
useEffect(() => {
87110
// Adicionar listener de scroll
@@ -103,7 +126,12 @@ export default function ReadingProgressBar() {
103126
useEffect(() => {
104127
hasCompletedRef.current = false;
105128
setProgress(0);
106-
}, []);
129+
}, [location.pathname]);
130+
131+
// Não renderizar a barra em páginas excluídas
132+
if (isExcludedPath) {
133+
return null;
134+
}
107135

108136
return (
109137
<div className={styles.progressBarContainer}>

0 commit comments

Comments
 (0)