theme-switch-funcions.tsx

const splashScreenState = (mode:boolean) => {
    const splashScreen = document.getElementById('splash-screen');
    if(mode){
      document.body.classList.add('page-loading')
      splashScreen?.style.setProperty('display', 'flex')
    } else {
      document.body.classList.remove('page-loading')
      splashScreen?.style.setProperty('display', 'none')
    }
  }

  const setRtlMode = () => {
    splashScreenState(true);
    var link = document.getElementById("main-css");
    if(link){
      link.setAttribute("href", link.getAttribute("href")!.replace("style.bundle.css", "style.bundle.rtl.css"));
      document.documentElement.setAttribute("dir", "rtl");
      document.documentElement.setAttribute("direction", "rtl");
      document.documentElement.setAttribute("style", "direction:rtl");
      setTimeout(() => {
        splashScreenState(false);
      }, 1000);
    }
  };
   
  const setLtrMode = () => {
    splashScreenState(true);
      var link = document.getElementById("main-css");
      if(link){
        document.documentElement.removeAttribute("dir");
        document.documentElement.removeAttribute("direction");
        document.documentElement.removeAttribute("style");
        link.setAttribute("href", link.getAttribute("href")!.replace("style.bundle.rtl.css", "style.bundle.css"));
        setTimeout(() => {
          splashScreenState(false);
        }, 1000);
      }
  }