Personalización de páginas del plugin de suscripción

[pfaffman (Jay Pfaffman)]

Me estoy acercando a tener PfaffManager como un producto. Mi MVP consiste simplemente en que Discourse reemplace https://www.literatecomputing.com/discourse-installation-packages/ para que las personas puedan comprar una instalación (como lo hacen ahora a través de WordPress), lo cual iniciará la instalación en Discourse (funciona), donde además podrán obtener actualizaciones en tiempo real sobre el proceso de instalación (funciona), y también poder hacer clic en un botón para iniciar una reconstrucción (funciona) durante cierto período de tiempo.

Utilicé un add_model_callback(GroupUser, :after_save) para verificar que, cuando un usuario se agrega al grupo CreateServer, se cree el servidor (en el modelo que agrega mi plugin) y se elimine al usuario del grupo (para que, teóricamente, puedan comprar otra instalación de servidor). Creo que esta técnica podría utilizarse para convertir discourse-subscriptions en un sistema de pagos bastante de propósito general.

Así que ahora tengo esto:

Un par de cosas que veo en este momento:

• el título <h1> y el botón comparten la misma clave discourse_subscriptions.subscribe.title. Me gustaría que el <h1> dijera algo como “Comprar una instalación o servicio” para el encabezado y algo como “Pagar ahora” para el botón.
• si el <h1> tuviera una clase subscription-title, podría usar CSS para ocultar el título existente y reemplazarlo con un ::before, lo cual podría resolver el problema anterior.
• Me gustaría agregar una navegación a /pfaffmanager/servers en algún lugar de esta página, ya sea en un encabezado o pie de página, y no veo ninguna forma de hacerlo. Intenté agregar algo como {{~raw-plugin-outlet name="subscription-header-before"~}} a la plantilla s.hbs, pero no es tan sencillo.

Creo que es razonable esperar un poco más de funcionalidad específica para suscripciones en el plugin de suscripciones, pero todavía soy bastante malo con CSS, así que no estoy exactamente seguro de si tengo razón o cómo debería verse.

¡Ah! En lugar de desear salidas de plugin en el plugin de suscripciones, ¿tal vez debería idear mi propia plantilla que aún llame a las funciones de Stripe del plugin de suscripciones? ¿Tendría eso sentido?

[justin (Justin DiRose)]

@pfaffman

• El título <h1> y el botón comparten la misma clave discourse_subscriptions.subscribe.title. Me gustaría que el <h1> dijera algo como “Comprar una instalación o servicio” para el encabezado y que el botón dijera “Pagar ahora”.
• Si el <h1> tuviera una clase subscription-title, podría usar CSS para ocultar el título existente y reemplazarlo con un ::before, lo que podría resolver el problema anterior.

Aceptaría una PR para estos cambios. Son bastante sencillos.

@pfaffman

Me gustaría agregar una navegación a /pfaffmanager/servers en algún lugar de esta página, ya sea en el encabezado o en el pie de página, y no veo ninguna forma de hacerlo. Intenté agregar algo como {{~raw-plugin-outlet name="subscription-header-before"~}} a la plantilla s.hbs, pero no es tan sencillo.

Deberías poder agregar un {{plugin-outlet}} en ese archivo. También aceptaría una PR si hay un caso razonable para ello. Los puntos de acceso de complementos son lo suficientemente ligeros. Sin embargo, un punto de acceso de complemento sin procesar no funcionará, ya que no es un archivo sin procesar.

[pfaffman (Jay Pfaffman)]

@justin

{{plugin-outlet}} en ese archivo

¡Oh! ¡Así que puedo! ¡Puedo!!!

@justin

Un plugin outlet sin procesar no funcionará, ya que no es un archivo sin procesar.

¡Doh!

Vale, algo así como

       <div class="product-purchase">
          {{#if product.subscribed}}
            <span class="purchased">&#x2713; {{i18n 'discourse_subscriptions.subscribe.purchased'}}</span>
            {{#link-to "user.billing.subscriptions" currentUser.username class="billing-link"}}
              {{i18n 'discourse_subscriptions.subscribe.go_to_billing'}}
            {{/link-to}}
            {{plugin-outlet name="after-go-to-billing" args=(hash product=product)}}
          {{else}}
            {{#link-to "s.show" product.id disabled=product.subscribed class="btn btn-primary"}}
              {{i18n 'discourse_subscriptions.subscribe.title'}}
            {{/link-to}}
            {{plugin-outlet name="after-subscribe-title" args=(hash product=product)}}
          {{/if}}
        </div>

Y luego puedo hacer algo como

<script type="text/x-handlebars" data-template-name="/connectors/after-go-to-billing/foobar">
    <div class="pfaffmanager-product"> quizás un enlace usando {{product.id}}</div>
</script>

O incluso podrías ocultar y reemplazar casi todos esos bloques de productos.

Al final, quizás acabe entendiendo los plugin outlets.

Cambios en CSS

Así que simplemente envuelve toda la plantilla s.hbs en un <div class="subscription">, y luego podrías hacer cosas como

.subscription 
  {
    h1 {
    content: "Hello, world";
    background-color: yellow;
  }
}

¿Eso tiene sentido? Si no hay nada realmente estúpido aquí, creo que voy por buen camino para poder hacer una PR sensata.

[pfaffman (Jay Pfaffman)]

¡Hola @justin! ¿Se ve esto bastante bien?

Pronto volveré a revisar esto y enviaré un PR.

[justin (Justin DiRose)]

Sí, creo que se ve bastante bien. ¡Gracias, Jay!

[pfaffman (Jay Pfaffman)]

Gracias. Espero “terminar” este asunto actual y luego ver cómo añadir esos o similares puntos de salida para complementos.

Y creo que, con eso en su lugar, un componente de tema podría (con un poco de trabajo técnico) añadir los enlaces por suscripción que deseo.