add lead to news articles

dnscms/news/migrations/0011_newspage_lead.py

@@ -0,0 +1,19 @@
+# Generated by Django 5.0.7 on 2024-07-13 21:22
+
+import wagtail.fields
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('news', '0010_alter_newspage_body'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='newspage',
+            name='lead',
+            field=wagtail.fields.RichTextField(blank=True),
+        ),
+    ]

dnscms/news/models.py

@@ -30,6 +30,7 @@ class NewsPage(Page):
     show_in_menus = False
 
     excerpt = models.TextField(max_length=512, blank=False)
+    lead = RichTextField(features=["bold", "italic", "link"], blank=True)
     body = CommonStreamField
     featured_image = models.ForeignKey(
         "images.CustomImage",
@@ -47,14 +48,20 @@ class NewsPage(Page):
         FieldPanel(
             "excerpt",
             heading="Utdrag",
-            help_text="En veldig kort oppsummering av innholdet nedenfor. Brukes på forsiden og i artikkeloversikten.",
+            help_text="En veldig kort oppsummering av innholdet i artikkelen. Brukes på forsiden og i artikkeloversikten.",
         ),
         FieldPanel("featured_image"),
+        FieldPanel(
+            "lead",
+            heading="Ingress",
+            help_text="Et kortfattet, innledende avsnitt som oppsummerer hovedinnholdet i artikkelen.",
+        ),
         FieldPanel("body"),
     ]
 
     graphql_fields = [
         GraphQLString("excerpt"),
+        GraphQLRichText("lead"),
         GraphQLStreamfield("body"),
         GraphQLImage("featured_image"),
     ]

web/src/app/aktuelt/[slug]/page.tsx

@@ -55,6 +55,9 @@ export default async function Page({ params }: { params: { slug: string } }) {
           Nyhet — {formatDate(news.firstPublishedAt, "d. MMMM yyyy")}
         </p>
         <h1 className="news-title">{news.title}</h1>
+        {news.lead && (
+          <p className="lead" dangerouslySetInnerHTML={{ __html: news.lead }} />
+        )}
         {featuredImage && (
           <ImageFigure
             src={featuredImage.url}

web/src/gql/gql.ts

@@ -39,7 +39,7 @@ const documents = {
     "\n  fragment ContactEntity on ContactEntity {\n    id\n    name\n    contactType\n    title\n    email\n    phoneNumber\n    image {\n      ...Image\n    }\n  }\n": types.ContactEntityFragmentDoc,
     "\n  fragment Event on EventPage {\n    __typename\n    id\n    slug\n    title\n    body {\n      id\n      blockType\n      field\n      ... on RichTextBlock {\n        rawValue\n        value\n      }\n    }\n    featuredImage {\n      ...Image\n    }\n    pig\n    facebookUrl\n    ticketUrl\n    free\n    priceRegular\n    priceMember\n    priceStudent\n    categories {\n      ... on EventCategory {\n        name\n        slug\n        pig\n      }\n    }\n    occurrences {\n      ... on EventOccurrence {\n        __typename\n        id\n        start\n        end\n        venue {\n          __typename\n          id\n          slug\n          title\n          preposition\n          url\n        }\n      }\n    }\n    organizers {\n      ... on EventOrganizer {\n        id\n        name\n        slug\n        externalUrl\n        association {\n          ... on AssociationPage {\n            url\n          }\n        }\n      }\n    }\n  }\n": types.EventFragmentDoc,
     "\n  query futureEvents {\n    events: eventIndex {\n      ... on EventIndex {\n        futureEvents {\n          ... on EventPage {\n            ...Event\n          }\n        }\n      }\n    }\n    eventCategories: eventCategories {\n      ... on EventCategory {\n        name\n        slug\n        showInFilters\n      }\n    }\n    eventOrganizers: eventOrganizers {\n      ... on EventOrganizer {\n        id\n        name\n        slug\n        externalUrl\n        association {\n          ... on AssociationPage {\n            url\n          }\n        }\n      }\n    }\n    venues: pages(contentType: \"venues.VenuePage\") {\n      ... on VenuePage {\n        id\n        title\n        slug\n        preposition\n      }\n    }\n  }\n": types.FutureEventsDocument,
-    "\n  fragment News on NewsPage {\n    __typename\n    id\n    slug\n    title\n    firstPublishedAt\n    excerpt\n    featuredImage {\n      ...Image\n    }\n    body {\n      ...Blocks\n    }\n  }\n": types.NewsFragmentDoc,
+    "\n  fragment News on NewsPage {\n    __typename\n    id\n    slug\n    title\n    firstPublishedAt\n    excerpt\n    lead\n    featuredImage {\n      ...Image\n    }\n    body {\n      ...Blocks\n    }\n  }\n": types.NewsFragmentDoc,
     "\n  fragment NewsIndex on NewsIndex {\n    __typename\n    id\n    slug\n    title\n    lead\n  }\n": types.NewsIndexFragmentDoc,
     "\n  query news {\n    index: newsIndex {\n      ... on NewsIndex {\n        ...NewsIndex\n      }\n    }\n    news: pages(contentType: \"news.NewsPage\", order: \"-first_published_at\") {\n      ... on NewsPage {\n        ...News\n      }\n    }\n  }\n": types.NewsDocument,
     "\n  query openingHoursSets {\n    openingHoursSets {\n      ...OpeningHoursSetFragment\n    }\n  }\n": types.OpeningHoursSetsDocument,
@@ -169,7 +169,7 @@ export function graphql(source: "\n  query futureEvents {\n    events: eventInde
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
-export function graphql(source: "\n  fragment News on NewsPage {\n    __typename\n    id\n    slug\n    title\n    firstPublishedAt\n    excerpt\n    featuredImage {\n      ...Image\n    }\n    body {\n      ...Blocks\n    }\n  }\n"): (typeof documents)["\n  fragment News on NewsPage {\n    __typename\n    id\n    slug\n    title\n    firstPublishedAt\n    excerpt\n    featuredImage {\n      ...Image\n    }\n    body {\n      ...Blocks\n    }\n  }\n"];
+export function graphql(source: "\n  fragment News on NewsPage {\n    __typename\n    id\n    slug\n    title\n    firstPublishedAt\n    excerpt\n    lead\n    featuredImage {\n      ...Image\n    }\n    body {\n      ...Blocks\n    }\n  }\n"): (typeof documents)["\n  fragment News on NewsPage {\n    __typename\n    id\n    slug\n    title\n    firstPublishedAt\n    excerpt\n    lead\n    featuredImage {\n      ...Image\n    }\n    body {\n      ...Blocks\n    }\n  }\n"];
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */

web/src/lib/news.ts

@@ -11,6 +11,7 @@ const NewsFragmentDefinition = graphql(`
     title
     firstPublishedAt
     excerpt
+    lead
     featuredImage {
       ...Image
     }