General developer forum

<?=
function theme_celene4boost_user_preferences(): array {
    return [
        'theme_celene4boost_mode' => [
            'type' => PARAM_ALPHA,
            'null' => NULL_NOT_ALLOWED,
            'default' => false,
            'permissioncallback' => [core_user::class, 'is_current_user'],
        ]
    ];
}

I removed those calls on drawer.php :

<?=
// user_preference_allow_ajax_update('theme_celene4boost_mode', PARAM_ALPHA);
// $this->user->ajax_updatable_user_prefs["theme_celene4boost_mode"] = PARAM_TEXT;
// user_preference_allow_ajax_update("theme_celene4boost_mode", PARAM_ALPHA);

Finally on the JS file where i want to initialize different option such as dark mode :

import {setUserPreference} from 'core_user/repository';

const letThereBeLight = (e) =>{
    e.preventDefault();
    let userPref = (UserRepository)=>{UserRepository.getUserPreferences()};
    console.log(userPref);
    const navbar = document.getElementsByClassName('navbar-light');
    const htmlElement = document.getElementsByTagName("html")[0];

    let prefValue;
    const preference = "theme_celene4boost_mode";

    if (htmlElement.classList.contains('dark')) {
        htmlElement.classList.remove('dark');
        for (let i = 0; i < navbar.length; i++) {
            if (navbar[i] && navbar[i].classList.contains('bg-dark')) {
                navbar[i].classList.remove('bg-dark');
            }
            navbar[i].classList.add('bg-white');
        }
        prefValue="";
    } else {
        htmlElement.classList.add('dark');
        for (let i = 0; i < navbar.length; i++) {
            if (navbar[i] && !navbar[i].classList.contains('bg-dark')) {
                if (navbar[i].classList.contains('bg-white')) {
                    navbar[i].classList.remove('bg-white');
                }
                navbar[i].classList.add('bg-dark');
            }
        }
        prefValue = "dark";
    }
    return setUserPreference(preference, prefValue);
};