Tengo 2 archivos javascript y quiero combinarlos. Uno es para el modo oscuro y el otro es para el botón de cambio de modo oscuro. Por separado, funcionan bien, pero cuando se combinan, el modo oscuro funciona como debería, pero el lugar del botón de cambio no se guarda después de actualizar la página. ¿Qué puedo hacer para arreglar eso?

 /* DARK-MODE */ function myFunction() { var element = document.body; element.classList.toggle("dark-mode"); } (function() { let onpageLoad = localStorage.getItem("theme") || ""; let element = document.body; element.classList.add(onpageLoad); document.getElementById("theme").textContent = "DarkMode"; localStorage.getItem("theme") || "light"; })(); function themeToggle() { let element = document.body; element.classList.toggle("dark-mode"); let theme = localStorage.getItem("theme"); if (theme && theme === "dark-mode") { localStorage.setItem("theme", ""); } else { localStorage.setItem("theme", "dark-mode"); } document.getElementById("theme").textContent = localStorage.getItem("theme"); }; /* DM-BUTTON */ function App() {} App.prototype.setState = function(state) { localStorage.setItem('checked', state); } App.prototype.getState = function() { return localStorage.getItem('checked'); } function init() { var app = new App(); var state = app.getState(); var checkbox = document.querySelector('#toggle'); if (state == 'true') { checkbox.checked = true; } checkbox.addEventListener('click', function() { app.setState(checkbox.checked); }); } init();

 <div class="toggle1"> <input type="checkbox" onclick="themeToggle()" class="dmbtn" id="toggle"> <label for="toggle"></label> </div>