Update `Spotlight` homepage posts to `Ideas`, including cta link text (#12663)

* Update `Spotlight` homepage posts to `Ideas`, including cta link text * Update migration to reflect new section name in model, fields, styles and factories
2024-09-10 14:42:54 -06:00 · 2024-09-10 14:42:54 -06:00 · 94daaaa44d
--- a/network-api/networkapi/wagtailpages/factory/homepage.py
+++ b/network-api/networkapi/wagtailpages/factory/homepage.py
@ -32,8 +32,8 @@ class WagtailHomepageFactory(PageFactory):
    quote_source_job_title = Faker("text", max_nb_chars=50)
    partner_background_image = SubFactory(ImageFactory)
    partner_intro_text = Faker("text", max_nb_chars=80)
-    spotlight_headline = Faker("text", max_nb_chars=100)
-    spotlight_image = SubFactory(ImageFactory)
+    ideas_headline = Faker("text", max_nb_chars=100)
+    ideas_image = SubFactory(ImageFactory)


 def generate(seed):
--- a/network-api/networkapi/wagtailpages/factory/homepage_features.py
+++ b/network-api/networkapi/wagtailpages/factory/homepage_features.py
@ -5,7 +5,7 @@ from networkapi.wagtailpages.models import (
    BlogPage,
    FocusArea,
    HomepageFocusAreas,
-    HomepageSpotlightPosts,
+    HomepageIdeasPosts,
 )


@ -24,13 +24,12 @@ def generate(seed):

    HomepageFocusAreas.objects.create(page=home_page, area=FocusArea.objects.get(name="Shape the Agenda"))

-    NUM_SPOTLIGHT_POSTS = 3
+    NUM_IDEAS_POSTS = 3

    all_blogs = list(BlogPage.objects.all())

-    home_page.spotlight_posts = [
-        HomepageSpotlightPosts.objects.create(page=home_page, blog=choice(all_blogs))
-        for i in range(NUM_SPOTLIGHT_POSTS)
+    home_page.ideas_posts = [
+        HomepageIdeasPosts.objects.create(page=home_page, blog=choice(all_blogs)) for i in range(NUM_IDEAS_POSTS)
    ]

    home_page.save()
--- a/network-api/networkapi/wagtailpages/migrations/0160_homepageideasposts_and_more.py
+++ b/network-api/networkapi/wagtailpages/migrations/0160_homepageideasposts_and_more.py
@ -0,0 +1,41 @@
+import django.db.models.deletion
+import modelcluster.fields
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("wagtailcore", "0089_log_entry_data_json_null_to_object"),
+        ("wagtailimages", "0025_alter_image_file_alter_rendition_file"),
+        ("wagtailpages", "0159_update_bgcta_with_linkblock"),
+    ]
+
+    operations = [
+        migrations.RenameModel(
+            old_name="HomepageSpotlightPosts",
+            new_name="HomepageIdeasPosts",
+        ),
+        migrations.RenameField(
+            model_name="homepage",
+            old_name="spotlight_headline",
+            new_name="ideas_headline",
+        ),
+        migrations.RenameField(
+            model_name="homepage",
+            old_name="spotlight_image",
+            new_name="ideas_image",
+        ),
+        migrations.AddField(
+            model_name="homepageideasposts",
+            name="cta",
+            field=models.CharField(default="Read more", max_length=50),
+        ),
+        migrations.AlterField(
+            model_name="homepageideasposts",
+            name="page",
+            field=modelcluster.fields.ParentalKey(
+                on_delete=django.db.models.deletion.CASCADE, related_name="ideas_posts", to="wagtailpages.homepage"
+            ),
+        ),
+    ]
--- a/network-api/networkapi/wagtailpages/migrations/0161_alter_homepage_ideas_headline_and_more.py
+++ b/network-api/networkapi/wagtailpages/migrations/0161_alter_homepage_ideas_headline_and_more.py
@ -0,0 +1,31 @@
+# Generated by Django 4.2.15 on 2024-09-09 19:16
+
+import django.db.models.deletion
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("wagtailimages", "0025_alter_image_file_alter_rendition_file"),
+        ("wagtailpages", "0160_homepageideasposts_and_more"),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name="homepage",
+            name="ideas_headline",
+            field=models.CharField(blank=True, max_length=140),
+        ),
+        migrations.AlterField(
+            model_name="homepage",
+            name="ideas_image",
+            field=models.ForeignKey(
+                blank=True,
+                null=True,
+                on_delete=django.db.models.deletion.SET_NULL,
+                related_name="ideas_image",
+                to="wagtailimages.image",
+            ),
+        ),
+    ]
--- a/network-api/networkapi/wagtailpages/models.py
+++ b/network-api/networkapi/wagtailpages/models.py
@ -5,8 +5,8 @@ from .pagemodels.base import (
    FoundationMetadataPageMixin,
    Homepage,
    HomepageFocusAreas,
+    HomepageIdeasPosts,
    HomepageNewsYouCanUse,
-    HomepageSpotlightPosts,
    InitiativesPage,
    ParticipateHighlights,
    ParticipateHighlights2,
--- a/network-api/networkapi/wagtailpages/pagemodels/base.py
+++ b/network-api/networkapi/wagtailpages/pagemodels/base.py
@ -443,14 +443,16 @@ class Styleguide(PrimaryPage):
    ]


-class HomepageSpotlightPosts(TranslatableMixin, WagtailOrderable):
+class HomepageIdeasPosts(TranslatableMixin, WagtailOrderable):
    page = ParentalKey(
        "wagtailpages.Homepage",
-        related_name="spotlight_posts",
+        related_name="ideas_posts",
    )
    blog = models.ForeignKey("BlogPage", on_delete=models.CASCADE, related_name="+")
+    cta = models.CharField(max_length=50, default="Read more")
    panels = [
        FieldPanel("blog"),
+        FieldPanel("cta", heading="CTA Link Text"),
    ]

    class Meta(TranslatableMixin.Meta, WagtailOrderable.Meta):
@ -762,17 +764,16 @@ class Homepage(FoundationMetadataPageMixin, Page):

    hero_button_url = models.URLField(blank=True)

-    spotlight_image = models.ForeignKey(
+    ideas_image = models.ForeignKey(
        "wagtailimages.Image",
        null=True,
        blank=True,
        on_delete=models.SET_NULL,
-        related_name="spotlight_image",
+        related_name="ideas_image",
    )

-    spotlight_headline = models.CharField(
+    ideas_headline = models.CharField(
        max_length=140,
-        help_text="Spotlight headline",
        blank=True,
    )

@ -880,11 +881,11 @@ class Homepage(FoundationMetadataPageMixin, Page):
        ),
        MultiFieldPanel(
            [
-                FieldPanel("spotlight_image"),
-                FieldPanel("spotlight_headline"),
-                InlinePanel("spotlight_posts", label="Posts", min_num=3, max_num=3),
+                FieldPanel("ideas_image"),
+                FieldPanel("ideas_headline"),
+                InlinePanel("ideas_posts", label="Posts", min_num=3, max_num=3),
            ],
-            heading="spotlight",
+            heading="Ideas",
            classname="collapsible",
        ),
        MultiFieldPanel(
@ -932,8 +933,8 @@ class Homepage(FoundationMetadataPageMixin, Page):
        SynchronizedField("hero_image"),
        TranslatableField("hero_button_text"),
        SynchronizedField("hero_button_url"),
-        SynchronizedField("spotlight_image"),
-        TranslatableField("spotlight_headline"),
+        SynchronizedField("ideas_image"),
+        TranslatableField("ideas_headline"),
        TranslatableField("cause_statement"),
        TranslatableField("cause_statement_link_text"),
        TranslatableField("cause_statement_link_page"),
@ -950,7 +951,7 @@ class Homepage(FoundationMetadataPageMixin, Page):
        TranslatableField("focus_areas"),
        TranslatableField("take_action_cards"),
        TranslatableField("partner_logos"),
-        TranslatableField("spotlight_posts"),
+        TranslatableField("ideas_posts"),
        TranslatableField("news_you_can_use"),
    ]

--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/ideas_posts.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/ideas_posts.html
@ -0,0 +1,28 @@
+{% load wagtailimages_tags i18n %}
+
+<div class="row section-ideas section-padding">
+
+    <div class="col-12">
+        <h2 class="capsule-label mb-0 ml-md-4">{% trans "Ideas" %}</h2>
+    </div>
+    <div class="col-12 col-lg-6 mb-md-4 mb-lg-0 tw-dark">
+        <div class="ideas-banner d-flex align-items-end full-bleed-xs p-3 p-md-4" style="background-image: linear-gradient(180deg, rgba(238,238,238,0) 14%, #000000 100%), url({% image_url page.ideas_image "width-540" %});">
+            <h3 class="tw-h2-heading ideas-headline mb-0">{{ page.ideas_headline }}</h3>
+        </div>
+    </div>
+
+    <div class="col-12 col-lg-6">
+        {% for post in page.ideas_posts.all %}
+            {% with localized=post.blog.localized %}
+                <div class="ideas-post">
+                    <h4 class="mb-2 tw-h5-heading">
+                        <a href="{{ localized.url }}">{{ localized.title }}</a>
+                    </h4>
+                    {% include "./blog_authors.html" with blog_page=localized %}
+                    <a href="{{ localized.url }}" class="tw-cta-link d-inline-block tw-mt-2">{{ post.cta }}</a>
+                </div>
+            {% endwith %}
+        {% endfor %}
+    </div>
+
+</div>
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/spotlight_posts.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/spotlight_posts.html
@ -1,27 +0,0 @@
-{% load wagtailimages_tags i18n %}
-
-<div class="row section-spotlight section-padding">
-
-    <div class="col-12">
-        <h2 class="capsule-label mb-0 ml-md-4">{% trans "Spotlight" %}</h2>
-    </div>
-    <div class="col-12 col-lg-6 mb-md-4 mb-lg-0 tw-dark">
-        <div class="spotlight-banner d-flex align-items-end full-bleed-xs p-3 p-md-4" style="background-image: linear-gradient(180deg, rgba(238,238,238,0) 14%, #000000 100%), url({% image_url page.spotlight_image "width-540" %});">
-            <h3 class="tw-h2-heading spotlight-headline mb-0">{{ page.spotlight_headline }}</h3>
-        </div>
-    </div>
-
-    <div class="col-12 col-lg-6">
-        {% for post in page.spotlight_posts.all %}
-            {% with localized=post.blog.localized %}
-                <div class="spotlight-post">
-                    <h4 class="mb-2 tw-h5-heading">
-                        <a href="{{ localized.url }}">{{ localized.title }}</a>
-                    </h4>
-                    {% include "./blog_authors.html" with blog_page=localized %}
-                </div>
-            {% endwith %}
-        {% endfor %}
-    </div>
-
-</div>
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/homepage.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/homepage.html
@ -43,7 +43,7 @@
    </div>

    <div class="container">
-        {% include "./fragments/spotlight_posts.html" %}
+        {% include "./fragments/ideas_posts.html" %}
    </div>

    <div class="tw-bg-gray-05">
--- a/source/sass/views/home.scss
+++ b/source/sass/views/home.scss
@ -28,7 +28,7 @@
    }
  }

-  .section-spotlight {
+  .section-ideas {
    .capsule-label {
      font-size: 14px;
      line-height: calc(16 / 14);
@ -45,7 +45,7 @@
      bottom: -50%;
    }

-    .spotlight-banner {
+    .ideas-banner {
      background-size: cover;
      background-position: center;
      @apply tw-h-120;
@ -55,15 +55,15 @@
      }

      @media (min-width: $bp-lg) {
-        height: 400px;
+        height: 100%;
      }
    }

-    .spotlight-headline {
+    .ideas-headline {
      font-weight: 700;
    }

-    .spotlight-post {
+    .ideas-post {
      $vertical-spacing: 1.5rem;

      &:first-child {