Merge branch 'main' into feature/fe-be-mozfest-hero-updates

copy-db.js

@@ -1,7 +1,7 @@
 const fs = require("fs");
 const { execSync } = require(`child_process`);
 
-const keepDatabase = process.argv.includes(`--keep`);
+const deleteDatabase = process.argv.includes(`--delete`);
 const silent = { stdio: [`ignore`, `ignore`, `ignore`] };
 const PROD_APP = `foundation-mozilla-org`;
 const STAGE_APP = `foundation-mofostaging-net`;
@@ -105,21 +105,19 @@ console.log(`Importing snapshot...`);
 run(`docker cp ${DUMP_FILE} ${IMAGE_NAMES.POSTGRES}:/`);
 postgres(`pg_restore ${DB_FLAGS} -dwagtail ${DUMP_FILE}`);
 
+console.log(`Migrating database...`);
+run(`docker exec ${IMAGE_NAMES.BACKEND} ./dockerpythonvenv/bin/python network-api/manage.py migrate`);
+
+console.log(`Updating site bindings...`);
+run(`inv manage fix_local_site_bindings`, true, silent);
+
 console.log(`Creating admin:admin superuser account...`);
-run(
-  [
-    `docker exec ${IMAGE_NAMES.BACKEND}`,
-    `./dockerpythonvenv/bin/python network-api/manage.py shell -c`,
-    `"from django.contrib.auth.models import User; User.objects.create_superuser('admin', 'admin@example.com', 'admin')"`,
-  ].join(` `),
-  true,
-  silent
-);
+run(`inv createsuperuser`, true, silent);
 
 console.log(`Stopping docker images...`);
 run(`docker-compose down`, true, silent);
 
-if (!keepDatabase) {
+if (deleteDatabase) {
   console.log(`Running cleanup`);
   fs.unlinkSync(DUMP_FILE);
 }

esbuild.config.js

@@ -22,6 +22,7 @@ const outDir = `./network-api/networkapi/frontend/_js/`;
 const sources = {
   main: `main.js`,
   mozfest: `foundation/pages/mozfest/index.js`,
+  "callpower": `foundation/pages/callpower.js`,
   "directory-listing-filters": `foundation/pages/directory-listing-filters.js`,
   "bg-main": `buyers-guide/bg-main.js`,
   polyfills: `polyfills.js`,

network-api/networkapi/management/commands/fix_local_site_bindings.py

@@ -0,0 +1,15 @@
+from django.core.management.base import BaseCommand
+from wagtail.core.models import Site
+
+
+class Command(BaseCommand):
+    help = 'Ensure site bindings are for localhost (e.g. for after a db copy)'
+
+    def handle(self, *args, **options):
+        for site in Site.objects.all():
+            if site.is_default_site:
+                site.hostname = 'localhost'
+            else:
+                site.hostname = 'mozfest.localhost'
+            site.port = 8000
+            site.save()

network-api/networkapi/wagtailpages/migrations/0038_cta_refactor_1.py

@@ -0,0 +1,40 @@
+# Generated by Django 3.1.11 on 2021-09-23 17:45
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+def copy_cta_to_petition_cta(apps, schema_editor):
+    models = [
+        apps.get_model("wagtailpages", "CampaignPage"),
+        apps.get_model("wagtailpages", "BanneredCampaignPage"),
+    ]
+
+    for Model in models:
+        for page in Model.objects.all():
+            if page.cta:
+                page.petition_cta = page.cta
+                page.save()
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('wagtailpages', '0037_auto_20211013_1538'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='banneredcampaignpage',
+            name='petition_cta',
+            field=models.ForeignKey(blank=True, help_text='Choose an existing, or create a new, pettition form', null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='banner_page_for_petition', to='wagtailpages.petition'),
+        ),
+        migrations.AddField(
+            model_name='campaignpage',
+            name='petition_cta',
+            field=models.ForeignKey(blank=True, help_text='Choose existing or create new sign-up form', null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='campaign_page_for_petition', to='wagtailpages.petition'),
+        ),
+        migrations.RunPython(
+            code=copy_cta_to_petition_cta
+        ),
+    ]

network-api/networkapi/wagtailpages/migrations/0039_cta_refactor_2.py

@@ -0,0 +1,21 @@
+# Generated by Django 3.1.11 on 2021-09-23 18:14
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('wagtailpages', '0038_cta_refactor_1'),
+    ]
+
+    operations = [
+        migrations.RemoveField(
+            model_name='banneredcampaignpage',
+            name='cta',
+        ),
+        migrations.RemoveField(
+            model_name='campaignpage',
+            name='cta',
+        ),
+    ]

network-api/networkapi/wagtailpages/migrations/0040_cta_refactor_3.py

@@ -0,0 +1,42 @@
+# Generated by Django 3.1.11 on 2021-09-23 18:23
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+def copy_petition_cta_to_cta(apps, schema_editor):
+    CTA = apps.get_model("wagtailpages", "CTA")
+
+    models = [
+        apps.get_model("wagtailpages", "CampaignPage"),
+        apps.get_model("wagtailpages", "BanneredCampaignPage"),
+    ]
+
+    for Model in models:
+        for page in Model.objects.all():
+            if page.petition_cta:
+                page.cta = CTA.objects.get(
+                    pk=page.petition_cta.pk,
+                )
+                page.save()
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('wagtailpages', '0039_cta_refactor_2'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='banneredcampaignpage',
+            name='cta',
+            field=models.ForeignKey(blank=True, help_text='Choose an existing, or create a new, pettition form', null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='banner_page_for_cta', to='wagtailpages.cta'),
+        ),
+        migrations.AddField(
+            model_name='campaignpage',
+            name='cta',
+            field=models.ForeignKey(blank=True, help_text='Choose existing or create new sign-up form', null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='campaign_page_for_cta', to='wagtailpages.cta'),
+        ),
+        migrations.RunPython(
+            code=copy_petition_cta_to_cta
+        )
+    ]

network-api/networkapi/wagtailpages/migrations/0041_cta_refactor_4.py

@@ -0,0 +1,21 @@
+# Generated by Django 3.1.11 on 2021-09-23 19:25
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('wagtailpages', '0040_cta_refactor_3'),
+    ]
+
+    operations = [
+        migrations.RemoveField(
+            model_name='banneredcampaignpage',
+            name='petition_cta',
+        ),
+        migrations.RemoveField(
+            model_name='campaignpage',
+            name='petition_cta',
+        ),
+    ]

network-api/networkapi/wagtailpages/migrations/0042_add_callpower_cta.py

@@ -0,0 +1,45 @@
+# Generated by Django 3.1.11 on 2021-10-19 21:33
+
+from django.db import migrations, models
+import django.db.models.deletion
+import uuid
+import wagtail.core.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('wagtailcore', '0062_comment_models_and_pagesubscription'),
+        ('wagtailpages', '0041_cta_refactor_4'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='banneredcampaignpage',
+            name='cta',
+            field=models.ForeignKey(blank=True, help_text='Choose one of our call-to-action snippets, or create a new one.', null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='banner_page_for_cta', to='wagtailpages.cta'),
+        ),
+        migrations.AlterField(
+            model_name='campaignpage',
+            name='cta',
+            field=models.ForeignKey(blank=True, help_text='Choose one of our call-to-action snippets, or create a new one.', null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='campaign_page_for_cta', to='wagtailpages.cta'),
+        ),
+        migrations.CreateModel(
+            name='Callpower',
+            fields=[
+                ('cta_ptr', models.OneToOneField(auto_created=True, on_delete=django.db.models.deletion.CASCADE, parent_link=True, primary_key=True, serialize=False, to='wagtailpages.cta')),
+                ('translation_key', models.UUIDField(default=uuid.uuid4, editable=False)),
+                ('campaign_id', models.CharField(help_text='Which Callpower campaign identifier should this CTA be tied to?', max_length=20)),
+                ('call_button_label', models.CharField(default='Make the call', help_text='The call button label (defaults to "Make the call")', max_length=20)),
+                ('success_heading', models.CharField(default='Thank you for calling', help_text='The heading users will see after clicking the call button (defaults to "Thank you for calling")', max_length=50)),
+                ('success_text', wagtail.core.fields.RichTextField(blank=True, help_text='The text users will see after clicking the call button')),
+                ('locale', models.ForeignKey(editable=False, on_delete=django.db.models.deletion.PROTECT, related_name='+', to='wagtailcore.locale')),
+            ],
+            options={
+                'verbose_name': 'callpower snippet',
+                'abstract': False,
+                'unique_together': {('translation_key', 'locale')},
+            },
+            bases=('wagtailpages.cta', models.Model),
+        ),
+    ]

network-api/networkapi/wagtailpages/pagemodels/campaigns.py

@@ -23,6 +23,7 @@
 )
 
 
+@register_snippet
 class CTA(models.Model):
     name = models.CharField(
         default='',
@@ -54,6 +55,44 @@ class Meta:
         verbose_name_plural = 'CTA'
 
 
+@register_snippet
+class Callpower(TranslatableMixin, CTA):
+    campaign_id = models.CharField(
+        max_length=20,
+        help_text='Which Callpower campaign identifier should this CTA be tied to?',
+    )
+
+    call_button_label = models.CharField(
+        max_length=20,
+        default='Make the call',
+        help_text='The call button label (defaults to "Make the call")',
+    )
+
+    success_heading = models.CharField(
+        max_length=50,
+        default='Thank you for calling',
+        help_text='The heading users will see after clicking the call button (defaults to "Thank you for calling")',
+    )
+
+    success_text = RichTextField(
+        help_text='The text users will see after clicking the call button',
+        blank=True
+    )
+
+    translatable_fields = [
+        # Fields from the CTA model
+        TranslatableField('header'),
+        TranslatableField('description'),
+        # Callpower fields
+        TranslatableField('call_button_label'),
+        TranslatableField('success_heading'),
+        TranslatableField('success_text'),
+    ]
+
+    class Meta(TranslatableMixin.Meta):
+        verbose_name = 'callpower snippet'
+
+
 @register_snippet
 class Signup(TranslatableMixin, CTA):
     campaign_id = models.CharField(
@@ -218,12 +257,12 @@ class CampaignPage(MiniSiteNameSpace):
     these pages come with sign-a-petition CTAs
     """
     cta = models.ForeignKey(
-        'Petition',
-        related_name='page',
+        'CTA',
+        related_name='campaign_page_for_cta',
         blank=True,
         null=True,
         on_delete=models.SET_NULL,
-        help_text='Choose existing or create new sign-up form'
+        help_text='Choose one of our call-to-action snippets, or create a new one.'
     )
 
     def get_donation_modal_json(self):
@@ -284,12 +323,12 @@ class BanneredCampaignPage(PrimaryPage):
     # Note that this is a different related_name, as the `page`
     # name is already taken as back-referenced to CampaignPage.
     cta = models.ForeignKey(
-        'Petition',
-        related_name='bcpage',
+        'CTA',
+        related_name='banner_page_for_cta',
         blank=True,
         null=True,
         on_delete=models.SET_NULL,
-        help_text='Choose an existing, or create a new, pettition form'
+        help_text='Choose one of our call-to-action snippets, or create a new one.'
     )
 
     signup = models.ForeignKey(

network-api/networkapi/wagtailpages/templates/wagtailpages/bannered_campaign_page.html

@@ -55,7 +55,7 @@
         <a href="#cta-anchor" class="btn btn-primary d-block">{% trans "TAKE ACTION" context "Sticky button in mobile view on campaign pages" %}</a>
       </div>
     {% endif %}
-    <div class="sticky-cta">
+    <div class="tw-sticky tw-top-[5rem] tw-overflow-hidden tw-z-[1018]">
       <div id="cta-anchor">
         <div class="mt-5 mt-md-0">
           {% cta page %}

network-api/networkapi/wagtailpages/templates/wagtailpages/tags/cta.html

@@ -1,9 +1,15 @@
-{% load wagtailcore_tags mini_site_tags %}
+{{ cta.type }}
 
-{% if cta_type == 'Petition' %}
+{% if cta_type == 'petition' %}
 	{% include './cta/petition.html' %}
 {% endif %}
 
-{% if cta_type == 'Signup' %}
+
+{% if cta_type == 'signup' %}
 	{% include './cta/signup.html' %}
 {% endif %}
+
+
+{% if cta_type == 'callpower' %}
+	{% include './cta/callpower.html' %}
+{% endif %}

network-api/networkapi/wagtailpages/templates/wagtailpages/tags/cta/callpower.html

@@ -0,0 +1,46 @@
+{% load i18n static %}
+
+<div class="callpower-cta">
+  <form class="cta-form">
+    <h5 class="h5-heading">{{ cta.header }}</h5>
+    <p>{{ cta.description | safe }}</p>
+    <div>
+      <input type="hidden" name="campaignId" value="{{ cta.campaign_id }}">
+      {% with inputclass="tw-w-full tw-transition-colors tw-px-3 tw-py-4 tw-my-1 tw-text-xl tw-text-black tw-font-sans tw-border tw-border-solid tw-border-gray-20 focus:tw-border-[#80bdff] tw-outline-none" %}
+
+      <input type="text" name="userPhone" placeholder="{% trans "Your phone number" %}" class="{{ inputclass }}"
+        data-pattern="^\d{10}$" aria-label="{% trans "Please enter a ten digit US phone number" %}">
+      <p class="body-small tw-text-red-dark tw-hidden">{% trans "Please enter a ten digit US phone number" %}</p>
+
+      <input type="text" name="userZipCode" placeholder="{% trans "Your zipcode" %}" class="{{ inputclass }}"
+      data-pattern="^\d{5}$" aria-label="{% trans "Please enter a five digit US zip code" %}">
+      <p class="body-small tw-text-red-dark tw-hidden">{% trans "Please enter a five digit US zip code" %}</p>
+
+      {% endwith %}
+    </div>
+    <p class="tw-text-red-dark error-400 tw-hidden tw-mt-5">
+      {% trans "We’re sorry, we can’t call that number. Please check that it is the right number, or try a different one." %}
+    </p>
+    <button class="make-the-call btn btn-primary tw-w-full tw-mt-5" disabled>{{ cta.call_button_label }}</button>
+  </form>
+
+  <div class="callpower-cta success tw-hidden">
+    <h5>{{ cta.success_heading }}</h5>
+    <p>{{ cta.success_text | safe }}</p>
+    <div class="share-button-group-wrapper d-print-none" data-layout="stacked"
+      data-share-text="{% blocktrans with title=page.title %}{{ title }} by @mozilla{% endblocktrans %}"
+      data-link="{{ request.scheme }}://{{ request.get_host }}{{ request.get_full_path }}"></div>
+  </div>
+
+  <div class="callpower-cta unknown error-section tw-hidden">
+    <h5>{% trans "Something went wrong…" %}</h5>
+    <p>{% trans "We’re sorry, we seem to be having some trouble. Please try again later." %}</p>
+  </div>
+
+  <div class="callpower-cta limit error-section tw-hidden">
+    <h5>{% trans "Thank you for all your calls!" %}</h5>
+    <p>{% trans "Unfortunately, it looks like you’ve reached the hourly limit. Please try again in an hour." %}</p>
+  </div>
+</div>
+
+<script src='{% static "_js/callpower.compiled.js" %}'' async defer></script>