Merge pull request #10958 from wellcomecollection/info-block-vs

Add `Infoblock` to visual stories and tidy up
wellcomecollection · Jun 26, 2024 · 714221d · 714221d
2 parents 52b36c0 + 11dfc5f
commit 714221d
Show file tree

Hide file tree

Showing 14 changed files with 50 additions and 72 deletions.
diff --git a/common/customtypes/visual-stories/index.json b/common/customtypes/visual-stories/index.json
@@ -40,6 +40,9 @@
         "fieldset": "Slice Zone",
         "config": {
           "choices": {
+            "infoBlock": {
+              "type": "SharedSlice"
+            },
             "textAndIcons": {
               "type": "SharedSlice"
             },

diff --git a/common/prismicio-types.d.ts b/common/prismicio-types.d.ts
@@ -5130,6 +5130,7 @@ export type TeamsDocument<Lang extends string = string> =
   prismic.PrismicDocumentWithoutUID<Simplify<TeamsDocumentData>, 'teams', Lang>;
 
 type VisualStoriesDocumentDataBodySlice =
+  | InfoBlockSlice
   | TextAndIconsSlice
   | TextAndImageSlice
   | EmbedSlice
@@ -6616,26 +6617,6 @@ export interface InfoBlockSliceDefaultPrimary {
    * - **Documentation**: https://prismic.io/docs/field#rich-text-title
    */
   text: prismic.RichTextField;
-
-  /**
-   * Button link field in *InfoBlock → Primary*
-   *
-   * - **Field Type**: Link
-   * - **Placeholder**: *None*
-   * - **API ID Path**: infoBlock.primary.link
-   * - **Documentation**: https://prismic.io/docs/field#link-content-relationship
-   */
-  link: prismic.LinkField;
-
-  /**
-   * Button text field in *InfoBlock → Primary*
-   *
-   * - **Field Type**: Text
-   * - **Placeholder**: *None*
-   * - **API ID Path**: infoBlock.primary.linkText
-   * - **Documentation**: https://prismic.io/docs/field#key-text
-   */
-  linkText: prismic.KeyTextField;
 }
 
 /**

diff --git a/common/views/slices/InfoBlock/mocks.json b/common/views/slices/InfoBlock/mocks.json
@@ -0,0 +1,36 @@
+[
+	{
+		"__TYPE__": "SharedSliceContent",
+		"variation": "default",
+		"primary": {
+			"title": {
+				"__TYPE__": "StructuredTextContent",
+				"value": [
+					{
+						"type": "heading2",
+						"content": {
+							"text": "Opinion"
+						}
+					}
+				]
+			},
+			"text": {
+				"__TYPE__": "StructuredTextContent",
+				"value": [
+					{
+						"type": "paragraph",
+						"content": {
+							"text": "Nisi ea adipisicing anim cillum. Aliquip qui duis voluptate aute culpa cupidatat laborum esse excepteur Lorem et et laboris commodo proident. Quis ex labore ullamco."
+						}
+					}
+				]
+			}
+		},
+		"items": [
+			{
+				"__TYPE__": "GroupItemContent",
+				"value": []
+			}
+		]
+	}
+]
diff --git a/common/views/slices/InfoBlock/model.json b/common/views/slices/InfoBlock/model.json
@@ -39,22 +39,9 @@
             "multi": "paragraph,hyperlink,strong,em,heading3,list-item",
             "label": "Text"
           }
-        },
-        "link": {
-          "type": "Link",
-          "config": {
-            "label": "Button link",
-            "select": "web",
-            "customtypes": []
-          }
-        },
-        "linkText": {
-          "type": "Text",
-          "config": {
-            "label": "Button text"
-          }
         }
-      }
+      },
+      "items": {}
     }
   ]
-}
+}
diff --git a/content/webapp/components/InfoBlock/InfoBlock.tsx b/content/webapp/components/InfoBlock/InfoBlock.tsx
@@ -2,10 +2,8 @@ import { FunctionComponent, ReactElement } from 'react';
 import styled from 'styled-components';
 import Space from '@weco/common/views/components/styled/Space';
 import PrismicHtmlBlock from '@weco/common/views/components/PrismicHtmlBlock/PrismicHtmlBlock';
-import Button from '@weco/common/views/components/Buttons';
 import { dasherize } from '@weco/common/utils/grammar';
 import * as prismic from '@prismicio/client';
-import { themeValues } from '@weco/common/views/themes/config';
 import { font } from '@weco/common/utils/classnames';
 
 const Wrapper = styled(Space).attrs({
@@ -17,15 +15,11 @@ const Wrapper = styled(Space).attrs({
 export type Props = {
   title: string;
   text: prismic.RichTextField;
-  linkText: string | null;
-  link?: string;
 };
 
 const InfoBlock: FunctionComponent<Props> = ({
   title,
   text,
-  linkText,
-  link,
 }: Props): ReactElement<Props> => {
   return (
     <Wrapper>
@@ -35,16 +29,6 @@ const InfoBlock: FunctionComponent<Props> = ({
       <div className="spaced-text body-text">
         <PrismicHtmlBlock html={text} />
       </div>
-      {link && linkText && (
-        <Space $v={{ size: 'l', properties: ['margin-top'] }}>
-          <Button
-            variant="ButtonSolidLink"
-            colors={themeValues.buttonColors.greenTransparentGreen}
-            link={link}
-            text={linkText}
-          />
-        </Space>
-      )}
     </Wrapper>
   );
 };

diff --git a/content/webapp/pages/index.tsx b/content/webapp/pages/index.tsx
@@ -106,7 +106,6 @@ export const getServerSideProps: GetServerSideProps<
     ]);
 
   // The homepage should always exist in Prismic.
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   const page = transformPage(pageDocument!);
 
   const articles = transformQuery(articlesQuery, transformArticle);

diff --git a/content/webapp/pages/whats-on/index.tsx b/content/webapp/pages/whats-on/index.tsx
@@ -190,7 +190,6 @@ const DateRange = ({ dateRange, period }: DateRangeProps) => {
 
             We could get this working in the type system, but it's a more invasive change.
           */}
-          {/* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */}
           <time dateTime={formatDate(end!)}>{formatDayName(end!)}</time>
         </>
       )}
@@ -349,7 +348,6 @@ export const getServerSideProps: GetServerSideProps<
     whatsOnPagePromise,
   ]);
 
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   const whatsOnPage = transformPage(whatsOnPageDocument!);
 
   const tryTheseToo = getTryTheseTooPromos(whatsOnPage);

diff --git a/content/webapp/services/prismic/transformers/body.ts b/content/webapp/services/prismic/transformers/body.ts
@@ -90,7 +90,6 @@ export function transformTextAndImage(
     value: {
       type: 'image',
       text: slice.primary.text,
-      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       image: transformImage(slice.primary.image)!,
       isZoomable: slice.primary.isZoomable,
     },
@@ -105,7 +104,6 @@ export function transformTextAndIcons(
     value: {
       type: 'icons',
       text: slice.primary.text,
-      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       icons: slice.items.map(({ icon }) => transformImage(icon)!),
     },
   };
@@ -232,11 +230,6 @@ export function transformInfoBlockSlice(
     value: {
       title: asTitle(slice.primary.title),
       text: slice.primary.text,
-      linkText: slice.primary.linkText,
-      link:
-        'url' in slice.primary.link
-          ? transformLink(slice.primary.link)
-          : undefined,
     },
   };
 }
@@ -247,9 +240,7 @@ export function transformIframeSlice(
   return {
     type: 'iframe',
     value: {
-      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       src: slice.primary.iframeSrc!,
-      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       image: transformImage(slice.primary.previewImage)!,
     },
   };

diff --git a/content/webapp/services/prismic/transformers/events.ts b/content/webapp/services/prismic/transformers/events.ts
@@ -116,11 +116,9 @@ function transformBookingEnquiryTeam(
     ? {
         id: team.id,
         title: asText(team.data?.title) || '',
-        /* eslint-disable @typescript-eslint/no-non-null-assertion */
         email: team.data!.email!,
         phone: team.data!.phone!,
         url: team.data!.url!,
-        /* eslint-enable @typescript-eslint/no-non-null-assertion */
       }
     : undefined;
 }

diff --git a/content/webapp/services/prismic/transformers/exhibitions.ts b/content/webapp/services/prismic/transformers/exhibitions.ts
@@ -93,7 +93,6 @@ export function transformExhibition(
       transformExhibitionFormat(data.format as any)
     : undefined;
 
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   const start = transformTimestamp(data.start)!;
   const end = data.end ? transformTimestamp(data.end) : undefined;
   const statusOverride = asText(data.statusOverride);

diff --git a/content/webapp/services/prismic/transformers/pages.ts b/content/webapp/services/prismic/transformers/pages.ts
@@ -47,13 +47,12 @@ export function transformPage(document: RawPagesDocument): Page {
     ? transformSingleLevelGroup(data.parents, 'parent').map((parent, index) => {
         return {
           ...transformPage(parent as RawPagesDocument),
-          /* eslint-disable @typescript-eslint/no-non-null-assertion */
           order: data.parents[index].order!,
-          /* eslint-enable @typescript-eslint/no-non-null-assertion */
           type: parent.type,
         };
       })
     : [];
+
   // TODO (tagging): This is just for now, we will be implementing a proper site tagging
   // strategy for this later
   const siteSections = headerLinks.map(link => link.siteSection);

diff --git a/content/webapp/services/prismic/transformers/whats-on.ts b/content/webapp/services/prismic/transformers/whats-on.ts
@@ -30,9 +30,7 @@ export function getTryTheseTooPromos(
             id: item.id,
             url: `/pages/${item.id}`,
             title: item.title,
-            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
             image: item.promo!.image!,
-            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
             description: item.promo!.caption!,
           }
         : undefined

diff --git a/content/webapp/utils/works.ts b/content/webapp/utils/works.ts
@@ -11,7 +11,7 @@ import {
   PhysicalItem,
   RelatedWork,
 } from '@weco/content/services/wellcome/catalogue/types';
-import { DownloadOption, TransformedCanvas } from '../types/manifest';
+import { DownloadOption } from '../types/manifest';
 import { convertIiifImageUri } from '@weco/common/utils/convert-image-uri';
 import { Label } from '@weco/common/model/labels';
 import {

diff --git a/yarn.lock b/yarn.lock
@@ -10883,6 +10883,11 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-16.3.1.tgz#369034de7d7e5b120972693352a3bf112172cc3e"
   integrity sha512-IPzF4w4/Rd94bA9imS68tZBaYyBWSCE47V1RGuMrB94iyTOIEwRmVL2x/4An+6mETpLrKJ5hQkB8W4kFAadeIQ==
 
+dotenv@^16.4.5:
+  version "16.4.5"
+  resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-16.4.5.tgz#cdd3b3b604cb327e286b4762e13502f717cb099f"
+  integrity sha512-ZmdL2rui+eB2YwhsWzjInR8LldtZHGDoQ1ugH85ppHKwpUHL7j7rN0Ti9NCnGiQbhaZ11FpR+7ao1dNsmduNUg==
+
 dotenv@^8.0.0, dotenv@^8.2.0:
   version "8.6.0"
   resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-8.6.0.tgz#061af664d19f7f4d8fc6e4ff9b584ce237adcb8b"