@financial-times/cp-content-pipeline-schema 1.8.4 → 1.8.6

package/queries/article.graphql

@@ -0,0 +1,606 @@
+fragment Concept on Concept {
+  id
+  prefLabel
+  types
+  type
+  directType
+  isPackageBrand
+  predicate
+  url(vanity: $useVanities)
+  relativeUrl: url(relative: true, vanity: $useVanities)
+}
+
+fragment StructuredTree on StructuredContent {
+  tree
+}
+
+fragment MetaLink on MetaLink {
+  ... on Concept {
+    id
+    url
+    relativeUrl: url(relative: true)
+    prefLabel
+  }
+  ... on ContentPackage {
+    id
+    url
+    relativeUrl: url(relative: true)
+    prefLabel: title
+  }
+}
+
+fragment Teaser on Teaser {
+  title
+  id
+  url
+  relativeUrl: url(relative: true)
+  type
+  publishedDate
+  firstPublishedDate
+  metaPrefixText
+  metaSuffixText
+  metaLink {
+    ...MetaLink
+  }
+  metaAltLink {
+    ...MetaLink
+  }
+  image {
+    url
+    width
+    height
+    altText
+  }
+  indicators {
+    accessLevel
+    isOpinion
+    isColumn
+    isPodcast
+    isEditorsChoice
+    isExclusive
+    isScoop
+  }
+}
+
+fragment ImageSource on ImageSource {
+  dpr
+  width
+  url
+}
+
+fragment Intro on RichText {
+  source
+  structured {
+    ...StructuredTree
+  }
+}
+
+fragment Topper on Topper {
+  __typename
+  headline
+  backgroundColour
+  backgroundBox
+  textShadow
+  followButtonVariant
+
+  intro {
+    ...Intro
+  }
+
+  displayConcept {
+    ...Concept
+  }
+
+  genreConcept {
+    ...Concept
+  }
+
+  ... on TopperWithBrand {
+    brandConcept {
+      ...Concept
+    }
+  }
+
+  ... on TopperWithImages {
+    fallbackImage {
+      sourceSet(width: 1440) {
+        ...ImageSource
+      }
+      ...Image
+    }
+
+    images {
+      ...Image
+    }
+  }
+
+  ... on SplitTextTopper {
+    images {
+      ... on ImageSquare {
+        sourceSet(width: 490) {
+          ...ImageSource
+        }
+      }
+      ... on ImageStandard {
+        sourceSet(width: 800) {
+          ...ImageSource
+        }
+      }
+      ... on ImageWide {
+        normal: sourceSet(width: 1220) {
+          ...ImageSource
+        }
+        widest: sourceSet(width: 1440) {
+          ...ImageSource
+        }
+      }
+    }
+  }
+  ... on FullBleedTopper {
+    images {
+      ... on ImageSquare {
+        sourceSet(width: 490) {
+          ...ImageSource
+        }
+      }
+      ... on ImageStandard {
+        sourceSet(width: 800) {
+          ...ImageSource
+        }
+      }
+      ... on ImageWide {
+        normal: sourceSet(width: 1220) {
+          ...ImageSource
+        }
+        wide: sourceSet(width: 1440) {
+          ...ImageSource
+        }
+        wideL: sourceSet(width: 1920) {
+          ...ImageSource
+        }
+        wideXL: sourceSet(width: 3840) {
+          ...ImageSource
+        }
+      }
+    }
+  }
+  ... on OpinionTopper {
+    headshot(dpr: 2, width: 150)
+    columnist {
+      ...Concept
+    }
+  }
+  ... on PodcastTopper {
+    headshot(dpr: 2, width: 150)
+  }
+  ... on TopperWithTheme {
+    isLargeHeadline
+    layout
+  }
+  ... on TopperWithPackage {
+    design
+  }
+  ... on DeepPortraitTopper {
+    images {
+      ... on ImagePortrait {
+        small: sourceSet(width: 490) {
+          ...ImageSource
+        }
+        normal: sourceSet(width: 740) {
+          ...ImageSource
+        }
+        wide: sourceSet(width: 1067) {
+          ...ImageSource
+        }
+      }
+    }
+  }
+  ... on DeepLandscapeTopper {
+    images {
+      ... on ImageLandscape {
+        normal: sourceSet(width: 1440) {
+          ...ImageSource
+        }
+        wide: sourceSet(width: 1920) {
+          ...ImageSource
+        }
+      }
+      ... on ImagePortrait {
+        small: sourceSet(width: 490) {
+          ...ImageSource
+        }
+        tablets: sourceSet(width: 980) {
+          ...ImageSource
+        }
+      }
+    }
+  }
+}
+
+fragment Image on Image {
+  __typename
+  height
+  width
+  caption
+  credit
+  format
+  url
+  id
+}
+
+fragment PictureFields on Picture {
+  __typename
+  alt
+  caption
+  credit
+  imageType
+  layoutWidth
+
+  fallbackImage {
+    ...Image
+  }
+}
+
+fragment Picture on Picture {
+  ...PictureFields
+
+  images {
+    ...Image
+  }
+
+  ... on PictureStandard {
+    images {
+      ... on ImageStandard {
+        sourceSet(width: 700) {
+          ...ImageSource
+        }
+      }
+      ... on ImageStandardInline {
+        sourceSet(width: 700) {
+          ...ImageSource
+        }
+      }
+      ... on ImageMobile {
+        sourceSet(width: 490) {
+          ...ImageSource
+        }
+      }
+    }
+  }
+  ... on PictureInline {
+    images {
+      ... on ImageStandardInline {
+        sourceSet(width: 350) {
+          ...ImageSource
+        }
+      }
+    }
+  }
+  ... on PictureFullBleed {
+    images {
+      ... on ImageMobile {
+        sourceSet(width: 490) {
+          ...ImageSource
+        }
+      }
+      ... on ImageDesktop {
+        sourceSet(width: 1200) {
+          ...ImageSource
+        }
+      }
+    }
+  }
+}
+
+fragment MainImage on MainImage {
+  picture {
+    ...Picture
+  }
+}
+
+fragment ImageSet on ImageSet {
+  picture {
+    ...Picture
+  }
+}
+
+fragment Clip on Clip {
+  __typename
+  format
+  dataSource {
+    audioCodec
+    binaryUrl
+    duration
+    mediaType
+    pixelHeight
+    pixelWidth
+    videoCodec
+  }
+  poster
+}
+
+fragment ClipSet on ClipSet {
+  type
+  autoplay
+  loop
+  muted
+  dataLayout
+  id
+  noAudio
+  caption
+  credits
+  description
+  displayTitle
+  contentWarning
+  source
+  subtitle
+  publishedDate
+  clips {
+    ...Clip
+  }
+  accessibility {
+    captions {
+      url
+      mediaType
+    }
+    transcript
+  }
+}
+
+fragment LayoutImage on LayoutImage {
+  picture {
+    ...Picture
+  }
+}
+
+fragment Recommended on Recommended {
+  teaser {
+    ...Teaser
+  }
+}
+
+fragment Tweet on Tweet {
+  html
+}
+
+fragment Video on VideoReference {
+  title
+  id
+}
+
+fragment Flourish on Flourish {
+  fallbackImage {
+    url
+    height
+    width
+  }
+}
+
+fragment RawImage on RawImage {
+  image {
+    ...Image
+  }
+}
+
+fragment ScrollyImage on ScrollyImage {
+  picture {
+    ...PictureFields
+
+    images {
+      ...Image
+
+      ... on ImageDesktop {
+        s: sourceSet(width: 740) {
+          ...ImageSource
+        }
+        m: sourceSet(width: 980) {
+          ...ImageSource
+        }
+        l: sourceSet(width: 1220) {
+          ...ImageSource
+        }
+        xl: sourceSet(width: 1920) {
+          ...ImageSource
+        }
+        xxl: sourceSet(width: 3840) {
+          ...ImageSource
+        }
+      }
+
+      ... on ImageMobile {
+        s: sourceSet(width: 490) {
+          ...ImageSource
+        }
+        m: sourceSet(width: 600) {
+          ...ImageSource
+        }
+        l: sourceSet(width: 800) {
+          ...ImageSource
+        }
+        xl: sourceSet(width: 1200) {
+          ...ImageSource
+        }
+      }
+    }
+  }
+}
+
+fragment Design on Design {
+  theme
+  layout
+}
+
+fragment Media on Media {
+  url
+  mediaType
+}
+
+fragment PinnedPost on Content {
+  __typename
+  id
+  title
+  publishedDate
+  body {
+    structured {
+      ...StructuredContent
+    }
+  }
+  publishedDate
+  mainImage {
+    ...Image
+  }
+  altTitle {
+    promotionalTitle
+  }
+  byline(vanity: $useVanities) {
+    tree
+  }
+  accessLevel
+  canBeSyndicated
+  commentsEnabled
+}
+
+fragment ArticleReferences on Reference {
+  type
+  ...Recommended
+  ...ImageSet
+  ...ClipSet
+  ...LayoutImage
+  ...Tweet
+  ...Video
+  ...Flourish
+  ...RawImage
+  ...MainImage
+  ...ScrollyImage
+}
+
+fragment StructuredContent on StructuredContent {
+  ...StructuredTree
+
+  references {
+    ...ArticleReferences
+  }
+  text
+}
+
+fragment Content on Content {
+  __typename
+  id
+  title
+  publishedDate
+  firstPublishedDate
+  standfirst
+  topper {
+    ...Topper
+  }
+  body {
+    structured {
+      ...StructuredContent
+    }
+  }
+  publishedDate
+  mainImage {
+    ...Image
+  }
+  altTitle {
+    promotionalTitle
+  }
+  byline(vanity: $useVanities) {
+    tree
+  }
+  annotations {
+    ...Concept
+  }
+  accessLevel
+  canBeSyndicated
+  instantAlertConcept {
+    id
+    prefLabel
+  }
+  originatingParty
+  commentsEnabled
+  editorialDesk
+  design {
+    ...Design
+  }
+}
+
+fragment PackageContainer on Content {
+  ...Content
+  url(vanity: $useVanities)
+  topper {
+    ... on TopperWithBrand {
+      genreConcept {
+        ...Concept
+      }
+    }
+  }
+  ... on ContentPackage {
+    containsLength
+    contains(fromId: $uuid, surroundingArticles: 7) {
+      ...Teaser
+      standfirst
+    }
+    tableOfContents {
+      labelType
+      sequence
+    }
+  }
+}
+
+fragment ArticleFields on Content {
+  ...Content
+  url
+  ... on Article {
+    containedIn {
+      ...PackageContainer
+    }
+  }
+  ... on Placeholder {
+    containedIn {
+      ...PackageContainer
+    }
+  }
+  ... on LiveBlogPost {
+    containedIn {
+      ...PackageContainer
+    }
+  }
+  ... on LiveBlogPackage {
+    liveBlogPosts(includePinned: false) {
+      ...Content
+      url
+    }
+    pinnedPost {
+      ...PinnedPost
+    }
+    realtime
+  }
+  ... on ContentPackage {
+    contains {
+      ...Teaser
+      standfirst
+    }
+  }
+  ... on Audio {
+    media {
+      ...Media
+    }
+  }
+}
+
+query Article($uuid: String!, $useVanities: Boolean!) {
+  content(uuid: $uuid) {
+    ...ArticleFields
+  }
+}
+
+query ArticleFromJSON(
+  $content: JSON!
+  $useVanities: Boolean!
+  $uuid: String = null
+) {
+  contentFromJSON(content: $content) {
+    ...ArticleFields
+  }
+}

package/src/index.ts

@@ -4,6 +4,7 @@ import type { Logger } from '@dotcom-reliability-kit/logger'
 import { loadSchemaSync } from '@graphql-tools/load'
 import { GraphQLFileLoader } from '@graphql-tools/graphql-file-loader'
 import * as path from 'path'
+import { readFileSync } from 'fs'
 
 interface Metrics {
   count(metric: string | string[], count?: number): void
@@ -23,6 +24,11 @@ export interface QueryContext {
   }
 }
 
+export const articleDocumentQuery = readFileSync(
+  require.resolve('../queries/article.graphql'),
+  'utf-8'
+)
+
 export const typeDefs = loadSchemaSync(
   path.join(__dirname, '../typedefs/**/*.graphql'),
   {

package/src/model/Topper.ts

@@ -227,15 +227,6 @@ export class Topper {
 
     const brandConcept = this.brandConcept()
     const displayConcept = this.capiResponse.getDisplayConcept()
-
-    if (this.capiResponse.isOpinion()) {
-      return brandConcept ?? displayConcept ?? null
-    }
-
-    if (displayConcept) {
-      return displayConcept
-    }
-
     const aboutAnnotation = this.capiResponse
       .annotations()
       ?.find(
@@ -244,6 +235,14 @@ export class Topper {
           'http://www.ft.com/ontology/annotation/about'
       )
 
+    if (this.capiResponse.isOpinion() && brandConcept) {
+      return brandConcept
+    }
+
+    if (displayConcept) {
+      return displayConcept
+    }
+
     return aboutAnnotation ?? null
   }
 

package/src/resolvers/content-tree/Workarounds.ts

@@ -83,12 +83,6 @@ export interface OldClip extends ContentTree.Node {
   credits: string
 }
 
-export interface CustomCodeComponent extends ContentTree.Node {
-  type: 'custom-code-component'
-  path: string
-  version: string
-  dataComponentProps: string
-}
 // this type is used for bodyXML transformation ONLY in tagMappings
 export interface ClipSet extends ContentTree.Node {
   type: 'clip-set'
@@ -191,7 +185,6 @@ export type AnyNode =
   | TableRow
   | TableCell
   | Video
-  | CustomCodeComponent
   | YoutubeVideo
   | MainImage
   | MainImageRaw

package/src/resolvers/content-tree/tagMappings.ts

@@ -153,13 +153,7 @@ const commonTagMappings: TagMappings = {
     type: 'tweet',
     id: $el.attr('href') || '',
   }),
-  '[data-asset-type="custom-code-component"]': ($el, traverse) => ({
-    type: 'custom-code-component',
-    path: $el.attr('path') || '',
-    version: $el.attr('version') || '',
-    dataComponentProps: $el.attr('data-component-props') || '',
-    children: traverse(),
-  }),
+
   'h4,h5,h6': ($el, traverse, context) => ({
     type: 'heading',
     level: 'label',
@@ -387,7 +381,7 @@ const commonTagMappings: TagMappings = {
       tableChildren = [caption, ...tableChildren]
     }
 
-    if (footer) {
+    if (footer?.children && footer.children.length > 0) {
       tableChildren = [...tableChildren, footer]
     }