billing: Add field to show billing frequency.

corporate/models.py

@@ -216,6 +216,10 @@ class CustomerPlan(models.Model):
 
     ANNUAL = 1
     MONTHLY = 2
+    BILLING_SCHEDULES = {
+        ANNUAL: "Annual",
+        MONTHLY: "Monthly",
+    }
     billing_schedule = models.SmallIntegerField()
 
     # The next date the billing system should go through ledger

corporate/views/billing_page.py

@@ -189,6 +189,7 @@ def billing_home(
                 stripe_email=stripe_customer.email,
                 CustomerPlan=CustomerPlan,
                 onboarding=onboarding,
+                billing_frequency=CustomerPlan.BILLING_SCHEDULES[plan.billing_schedule],
             )
 
     return render(request, "corporate/billing.html", context=context)

templates/corporate/billing.html

@@ -17,7 +17,7 @@
                 <input type="hidden" name="csrfmiddlewaretoken" value="{{ csrf_token }}" />
                 <div class="white-box">
                     <div id="overview">
-                        <div class="input-box no-validation">
+                        <div class="input-box billing-page-field no-validation">
                             <label for="org_current_plan" class="inline-block label-title">Your plan</label>
                             <div id="org_current_plan" class="not-editable-realm-field">
                                 {% if free_trial %}
@@ -27,6 +27,12 @@
                                 {% endif %}
                             </div>
                         </div>
+                        <div class="input-box billing-page-field no-validation">
+                            <label for="org_billing_freqency" class="inline-block label-title">Billing frequency</label>
+                            <div id="org_billing_freqency" class="not-editable-realm-field">
+                                {{ billing_frequency }}
+                            </div>
+                        </div>
                         <p>
                             You are using <strong>{{ seat_count }} of {{ licenses }} licenses</strong>.
                             {% if automanage_licenses %}

web/styles/portico/portico_signin.css

@@ -967,6 +967,7 @@ button#register_auth_button_gitlab {
             }
         }
 
+        &.billing-page-field,
         &.support-form-field,
         &.sponsorship-form-field {
             width: 450px;