Почему не вешается event listener?

Question

[Дамир Шаниязов]

Добрый день!
Есть вот такой кусок кода. Проверяется, авторизован пользователь или нет. Если авторизован, то выводим Dashboard. В Dashboard есть Navbar с кнопкой, которая открывает модальное окно. Но есть проблема - модальное окно не открывается, почему то не вешается прослушиватель. Если убрать условные операторы и выводить только Dashboard, то всё прекрасно работает. Пользуюсь этим примером

function App() {
    const {verifyAuthentication} = useActions()
    const authData = useTypedSelector(state => state.auth)
    const [status, setStatus] = useState('no')
    const [auth, setAuth] = useState(false)
 
    if (localStorage.getItem('token') && !auth) {
        verifyAuthentication()
        setAuth(true) // todo fix
    }
 
    useEffect(() => {
        if (authData.loading && !authData.authResponse) setStatus('loading')
        if (!authData.loading && authData.authResponse?.user) setStatus('yes')
        if (!authData.loading && !authData.authResponse) setStatus('no')
    }, [authData])
 
    if (status === 'loading') return <FullWindowSpinner/>
    if (status === 'yes')     return <Dashboard/>
    if (status === 'no')      return <Authentication/>
 
}

Comments

[wonderingpeanut]

залей полный код компонента в какой-нибудь codesandbox

[Дамир Шаниязов]

wonderingpeanut, пытался создать, но там почему - то не работает.

Если в консоли браузера набрать, то модальное окно открывается

const modal = new Modal(document.getElementById('defaultModal'), null).show();

А у меня, не получается и я получаю ошибку
Uncaught ReferenceError: Modal is not defined

https://codesandbox.io/embed/charming-river-10zduc...
https://10zduc.csb.app/

update:
const modal = new Modal(document.getElementById('defaultModal'), null).show(); не факт что определяет работает или нет

[wonderingpeanut]

Дамир Шаниязов, нужон код компонента и класса Modal