URL genérica a la página de facturación del usuario en Javascript no funciona

Ya sé que /my/billing/subscriptions es una forma de vincular al usuario actual con su propio perfil de usuario, en particular, la sección de facturación que viene con Discourse Subscriptions. Sin embargo, esto no parece funcionar en mi código a continuación, con la expresión dentro de la instrucción if. En concreto, estoy intentando que un botón aparezca solo en la página de facturación del usuario. De hecho, parece no funcionar para ninguna URL del tipo /my, ya sea facturación, preferencias, actividad o cualquier otra cosa. ¿Estoy haciendo algo mal? ¿Qué debería usar? (Ten en cuenta que esto solo no funciona en la instrucción if. De lo contrario, usar /my ha funcionado y funciona bien.)

<script type="text/discourse-plugin" version="0.8">
api.registerConnectorClass("above-user-profile", "back-button", {
    setupComponent(args, component) {
    api.onPageChange((url) => {

        if (url === "/my/billing/subscriptions" ) { 
          document.querySelector("html").classList.add("custom-homepage"); 
          component.set("displayCustomHomepage", true); 
        } else {  
          document.querySelector("html").classList.remove("custom-homepage"); 
          component.set("displayCustomHomepage", false); 
        }
    });
    }
});

</script>

<script type="text/x-handlebars" data-template-name="/connectors/above-user-profile/back-button">
  {{#if displayCustomHomepage}} 
    <a href="https://mathbymiles.com/my/preferences" class="btn btn-default">
        <span class="d-button-label">
            ¡Volver a la configuración!
        </span>
    </a>
  {{/if}}
</script>
1 me gusta

¿No es porque los usuarios nunca están en las URLs /my/* ya que son simplemente redirecciones inteligentes?

Por ejemplo, /my/preferences me redirigirá a /u/falco/preferences, por lo que nunca estaré en la página /my/preferences para que se active el if en tu código.

2 Me gusta

Veo, tienes razón. Entiendo por qué no sería apropiado para un if, ya que nunca sería verdadero. Entonces, ¿qué puedo hacer?

Intenté hacer lo siguiente en el if:

url === "/u/" + user.username + "/billing/subscriptions"

donde

const user = api.getCurrentUser(),

pero eso tampoco pareció funcionar…

EDIT: Así que, usando console.log, pude descubrir que, en general, este enfoque funciona bien. Por ejemplo, si simplemente pongo el código

const user = api.getCurrentUser()
console.log("/u/" + user.username + "/billing/subscriptions")

en un script, obtengo la salida deseada /u/Miles/billing/subscriptions.

Sin embargo, el problema ocurre cuando intento poner esto dentro de setupComponent(args, component) {}. Una vez que lo hago, console.log ya no muestra nada. Todavía no estoy seguro de qué estoy haciendo mal…

¿Tienes acceso al objeto api en el método setupComponent? Me pregunto si esa sea la razón de tus problemas.

Pensé lo mismo, porque ya se está ejecutando correctamente el uso de api.onPageChange(url). Ten en cuenta que estoy adaptando el código de aquí, por lo que parece ser cierto que tengo acceso al objeto api dentro del método setupComponent.

Solo para mayor claridad, esto es lo que he logrado hasta ahora:

Con el código

<script type="text/discourse-plugin" version="0.8">
    const user = api.getCurrentUser();
    console.log("/u/" + user.username + "/billing/subscriptions");

    api.registerConnectorClass("above-user-profile", "back-button", {
    setupComponent(args, component) {

    api.onPageChange((url) => {

        if (url === "/u/" + user.username + "/billing/subscriptions" ){ 
          document.querySelector("html").classList.add("custom-homepage"); 
          component.set("displayCustomHomepage", true); 
        } else {  
          document.querySelector("html").classList.remove("custom-homepage"); 
          component.set("displayCustomHomepage", false); 
        }
    });
    }
});

obtengo la salida correcta /u/Miles/billing/subscriptions en la consola. Pero cuando hago esto:

<script type="text/discourse-plugin" version="0.8">
    

    api.registerConnectorClass("above-user-profile", "back-button", {
    setupComponent(args, component) {

    const user = api.getCurrentUser();
    console.log("/u/" + user.username + "/billing/subscriptions");

    api.onPageChange((url) => {

        if (url === "/u/" + user.username + "/billing/subscriptions" ){ 
          document.querySelector("html").classList.add("custom-homepage"); 
          component.set("displayCustomHomepage", true); 
        } else {  
          document.querySelector("html").classList.remove("custom-homepage"); 
          component.set("displayCustomHomepage", false); 
        }
    });
    }
});

no se encuentra ninguna salida…