Safari rendering blank page but chrome/firefox working fine


My website on github was working fine across all browsers until I added a toggle theme function. Now it renders a blank page on safari. But if you open the website link from messenger on ios, then it renders ok.

These are how I added the toggle functionality

// useDarkMode.js
import { useEffect, useState } from 'react';
import { blueTheme, darkTheme } from '../../theme';

export const useDarkMode = () => {
  const (theme, setTheme) = useState('dark');
  const (componentMounted, setComponentMounted) = useState(false);
  const setMode = mode => {
    window.localStorage.setItem('theme', mode)
    setTheme(mode)
  };

  const toggleTheme = () => {
    if (theme === 'light') {
      setMode('dark')
    } else {
      setMode('light')
    }
  };

  useEffect(() => {
    const localTheme = window.localStorage.getItem('theme');
    console.log(localTheme);
    window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches && !localTheme ?
      setMode('dark') :
      localTheme ?
        setTheme(localTheme) :
        setMode('light');
    setComponentMounted(true);
  }, ());

  return (theme, toggleTheme, componentMounted)
};
const Toggle = ({ theme, toggleTheme }) => {
  const isLight = theme === 'light';
  return (
    <ToggleContainer onClick={toggleTheme} >
      <SunIcon />
      <MoonIcon />
    </ToggleContainer>
  );
};

Toggle.propTypes = {
  theme: string.isRequired,
  toggleTheme: func.isRequired,
}

export default Toggle;
function App() {
  console.log("starting");
  const (theme, toggleTheme, componentMounted) = useDarkMode();

  const themeMode = theme === 'light' ? blueTheme : darkTheme;
  console.log(themeMode);


  if (!componentMounted) {
    return <div />
  };


  return (
    <ThemeProvider theme={themeMode}>
      <>
        <GlobalStyles />
        <div>
          <Main theme={themeMode} />
        </div>
        <Toggle theme={theme} toggleTheme={toggleTheme} />
        <Footer theme={themeMode} />
      </>
    </ThemeProvider>
  );
}

This is my website : https://tasin5541.github.io/portfolio/#/home