WillyAntunez

import { useEffect, useMemo, useRef, useState } from "react"
import { useLocation, useNavigate } from "react-router-dom";


interface HistoryNavigation  {
    prevPageExists: boolean;
    nextPageExists: boolean;
    navigateBackward: () => void;
    navigateForward: () => void;
    currentPageIdx: number;

WillyAntunez

import React, { useEffect } from 'react';

export const useOutsideAlerter = (
    ref: React.RefObject<HTMLElement>,
    clickOutFunction: (event: Event) => void,
) => {
    useEffect(() => {
        function handleClickOutside(event: Event) {
            const target = event.target as Node;

WillyAntunez

/* react */
import { useRef, useState } from 'react';
/* third party libraries */
import { Box, Button, Divider, Grid, Typography } from '@mui/material';
/* custom components */
import { StyledMenu } from './StyledMenu';
import { Small } from './Typography';
/* icons */
import FilterAltIcon from '@mui/icons-material/FilterAlt';
import CloseIcon from '@mui/icons-material/Close';