OneSignal-Benachrichtigung aktivieren/deaktivieren

Guten Abend,
wir verwenden OneSignal, um unsere Besucher am aktuellsten Stand zu halten.

Standardmäßig läuft es hier so ab, dass beim ersten Besuch der Seite die Frage kommt, ob man über Neuigkeiten informiert werden möchte (Beispiel: https://files.readme.io/94b280b-Slidedown_PrePermission_Message.png).

Klickt man hier auf „Allow“, kommt nochmal die selbe Frage, in größerer Form (Beispiel: https://i.imgur.com/KuQcvEV.png). Dieses Fenster möchte ich aber eigentlich nicht mehr anzeigen, da es nur eine Wiederholung zum Vorherigen ist.

Als letztes muss man noch dies noch im Browser akzeptieren, was sich eh nicht vermeiden lässt (Beispiel: https://files.readme.io/7757068-Screen_Shot_2019-09-10_at_5.26.34_PM.png).

Auf dieser Basis möchte ich nun dem Benutzer auch die Chance geben, diese zu einem späteren Zeitpunkt bewusst zu aktivieren oder zu deaktivieren. Leider funktioniert mein bisheriger Code nur bedingt, da der Aktiveren/Deaktivieren-Button nur dann angezeigt wird, wenn man vorher (beim ersten Besuch) schon auf „Allow“ geklickt hat.

<script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async=""></script>
<script>
    var OneSignal = window.OneSignal || [];
    var useragentid = null;

    //Firstly this will check user id 
    OneSignal.push(function() {
        OneSignal.getUserId().then(function(userId) {                
            if(userId == null){
                document.getElementById('deactivate').style.display = 'none';
            }
            else{
                useragentid = userId;
                document.getElementById('deactivate').style.display = '';
                OneSignal.push(["getNotificationPermission", function(permission){
                }]);
                OneSignal.isPushNotificationsEnabled(function(isEnabled) {
                    if (isEnabled){
                        document.getElementById('deactivate').style.display = '';
                        document.getElementById('activate').style.display = 'none';
                    }
                    else{
                      document.getElementById('deactivate').style.display = 'none';
                      document.getElementById('activate').style.display = '';
                    }
                });
            }
        });
    });
    //Secondly this will check when subscription changed
    OneSignal.push(function() {
        OneSignal.on('subscriptionChange', function (isSubscribed) {
            if(isSubscribed==true){
                OneSignal.getUserId().then(function(userId) {
                    useragentid = userId;
                }).then(function(){
                 // this is custom function
                // here you can send post request to php file as well.
                    OneSignalUserSubscription(useragentid);
                });
                document.getElementById('deactivate').style.display = '';
                document.getElementById('activate').style.display = 'none';
            }
            else if(isSubscribed==false){
                OneSignal.getUserId().then(function(userId) {
                    useragentid = userId;
                });
                document.getElementById('deactivate').style.display = 'none';
                document.getElementById('activate').style.display = '';
            }
            else{
                console.log('Die Anfrage kann nicht verarbeitet werden');
            }
        });
    });
    function subscribeOneSignal(){
        OneSignal.setSubscription(true);
    }
    function unSubscribeOneSignal(){
        OneSignal.setSubscription(false);
    }
</script>
<div id="div-home-top" class="clearfix">
<button id="activate" class="button" style="display: none;" onclick="subscribeOneSignal()">Aktivieren </button>
<button id="deactivate" class="button" style="display: none;" onclick="unSubscribeOneSignal()">Deaktivieren </button>
</div>
<style>
#activate #deactivate {
    background-color: #dd3333;border: none;color: white;text-align: center;text-decoration: none;display: inline-block;font-size: 16px;cursor: pointer;
}
#div-home-top {
    margin-top: -10px;
}
</style>

Kann mir hier jemand helfen, dieses Problem zu lösen?
Das zweite unerwünschte Frage-Popup hätte ich versucht, mit folgenden Code auszublenden, aber das hat nicht wirklich etwas geholfen.

OneSignal.registerForPushNotifications({
  modalPrompt: true
});

Danke schon im Voraus für die Antworten.

Bilderquellen: https://documentation.onesignal.com/docs/permission-requests