@financial-times/cp-content-pipeline-schema 3.5.0 → 3.5.2

package/lib/resolvers/content-tree/references/index.d.ts

@@ -1,6 +1,6 @@
 import type { ContentTree } from '@financial-times/content-tree';
 import type { CapiResponse } from '../../../model/CapiResponse';
-import { FlourishResolvers, ImageSetResolvers, ClipSetResolvers, CustomCodeComponentResolvers, LayoutImageResolvers, RawImageResolvers, RecommendedResolvers, ReferenceResolvers, ScrollyImageResolvers, TweetResolvers, VideoReferenceResolvers, CaptionResolvers, AccessibilityResolvers, FlourishFallbackResolvers, AuthorReferenceResolvers } from '../../../generated';
+import { FlourishResolvers, ImageSetResolvers, ClipSetResolvers, CustomCodeComponentResolvers, LayoutImageResolvers, RawImageResolvers, RecommendedResolvers, ReferenceResolvers, ScrollyImageResolvers, TweetResolvers, VideoReferenceResolvers, CaptionResolvers, AccessibilityResolvers, AuthorReferenceResolvers, FlourishSourceResolvers } from '../../../generated';
 export type ReferenceWithCAPIData<ReferenceType = ContentTree.Node> = {
     reference: ReferenceType;
     contentApiData?: CapiResponse;
@@ -13,6 +13,7 @@ export declare const resolvers: {
     CustomCodeComponent: CustomCodeComponentResolvers;
     VideoReference: VideoReferenceResolvers;
     Flourish: FlourishResolvers;
+    FlourishSource: FlourishSourceResolvers;
     Recommended: RecommendedResolvers;
     LayoutImage: LayoutImageResolvers;
     RawImage: RawImageResolvers;
@@ -20,7 +21,6 @@ export declare const resolvers: {
     MainImage: ImageSetResolvers;
     Caption: CaptionResolvers;
     Accessibility: AccessibilityResolvers;
-    FlourishFallback: FlourishFallbackResolvers;
     AuthorReference: AuthorReferenceResolvers;
 };
 export declare const mapNodeToReference: {

package/lib/resolvers/content-tree/references/index.js

@@ -21,6 +21,7 @@ exports.resolvers = {
     CustomCodeComponent: CustomCodeComponent_1.CustomCodeComponent,
     VideoReference: Video_1.Video,
     Flourish: Flourish_1.Flourish,
+    FlourishSource: Flourish_1.FlourishSource,
     Recommended: Recommended_1.Recommended,
     LayoutImage: LayoutImage_1.LayoutImage,
     RawImage: RawImage_1.RawImage,
@@ -28,7 +29,6 @@ exports.resolvers = {
     MainImage: ImageSet_1.ImageSet,
     Caption: ClipSet_1.Caption,
     Accessibility: ClipSet_1.Accessibility,
-    FlourishFallback: Flourish_1.FlourishFallback,
     AuthorReference: Author_1.Author,
 };
 exports.mapNodeToReference = {

package/lib/resolvers/content-tree/references/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/resolvers/content-tree/references/index.ts"],"names":[],"mappings":";;;AAGA,2CAAuC;AAEvC,mCAA+B;AAC/B,yCAAqC;AACrC,uCAA2D;AAC3D,+DAA2D;AAC3D,mCAA+B;AAC/B,yCAAuD;AACvD,+CAA2C;AAC3C,+CAA2C;AAC3C,yCAAqC;AACrC,iDAA6C;AAmB7C,qCAAiC;AAOpB,QAAA,SAAS,GAiBlB;IACF,SAAS,EAAT,qBAAS;IACT,KAAK,EAAL,aAAK;IACL,QAAQ,EAAR,mBAAQ;IACR,OAAO,EAAP,iBAAO;IACP,mBAAmB,EAAnB,yCAAmB;IACnB,cAAc,EAAE,aAAK;IACrB,QAAQ,EAAR,mBAAQ;IACR,WAAW,EAAX,yBAAW;IACX,WAAW,EAAX,yBAAW;IACX,QAAQ,EAAR,mBAAQ;IACR,YAAY,EAAZ,2BAAY;IACZ,SAAS,EAAE,mBAAQ;IACnB,OAAO,EAAP,iBAAO;IACP,aAAa,EAAb,uBAAa;IACb,gBAAgB,EAAhB,2BAAgB;IAChB,eAAe,EAAE,eAAM;CACxB,CAAA;AAEY,QAAA,kBAAkB,GAAG;IAChC,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,OAAO;IACd,WAAW,EAAE,UAAU;IACvB,UAAU,EAAE,SAAS;IACrB,IAAI,EAAE,SAAS;IACf,uBAAuB,EAAE,qBAAqB;IAC9C,KAAK,EAAE,gBAAgB;IACvB,WAAW,EAAE,aAAa;IAC1B,cAAc,EAAE,aAAa;IAC7B,eAAe,EAAE,cAAc;IAC/B,WAAW,EAAE,UAAU;IACvB,YAAY,EAAE,WAAW;IACzB,gBAAgB,EAAE,UAAU;IAC5B,MAAM,EAAE,iBAAiB;CACkD,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/resolvers/content-tree/references/index.ts"],"names":[],"mappings":";;;AAGA,2CAAuC;AAEvC,mCAA+B;AAC/B,yCAAqC;AACrC,uCAA2D;AAC3D,+DAA2D;AAC3D,mCAA+B;AAC/B,yCAAqD;AACrD,+CAA2C;AAC3C,+CAA2C;AAC3C,yCAAqC;AACrC,iDAA6C;AAmB7C,qCAAiC;AAOpB,QAAA,SAAS,GAiBlB;IACF,SAAS,EAAT,qBAAS;IACT,KAAK,EAAL,aAAK;IACL,QAAQ,EAAR,mBAAQ;IACR,OAAO,EAAP,iBAAO;IACP,mBAAmB,EAAnB,yCAAmB;IACnB,cAAc,EAAE,aAAK;IACrB,QAAQ,EAAR,mBAAQ;IACR,cAAc,EAAd,yBAAc;IACd,WAAW,EAAX,yBAAW;IACX,WAAW,EAAX,yBAAW;IACX,QAAQ,EAAR,mBAAQ;IACR,YAAY,EAAZ,2BAAY;IACZ,SAAS,EAAE,mBAAQ;IACnB,OAAO,EAAP,iBAAO;IACP,aAAa,EAAb,uBAAa;IACb,eAAe,EAAE,eAAM;CACxB,CAAA;AAEY,QAAA,kBAAkB,GAAG;IAChC,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,OAAO;IACd,WAAW,EAAE,UAAU;IACvB,UAAU,EAAE,SAAS;IACrB,IAAI,EAAE,SAAS;IACf,uBAAuB,EAAE,qBAAqB;IAC9C,KAAK,EAAE,gBAAgB;IACvB,WAAW,EAAE,aAAa;IAC1B,cAAc,EAAE,aAAa;IAC7B,eAAe,EAAE,cAAc;IAC/B,WAAW,EAAE,UAAU;IACvB,YAAY,EAAE,WAAW;IACzB,gBAAgB,EAAE,UAAU;IAC5B,MAAM,EAAE,iBAAiB;CACkD,CAAA"}

package/lib/resolvers/index.d.ts

@@ -14,7 +14,7 @@ declare const resolvers: {
         type: (flourish: import("../model/LeadFlourish").LeadFlourish) => string;
         id: (flourish: import("../model/LeadFlourish").LeadFlourish) => string | null;
         description: (flourish: import("../model/LeadFlourish").LeadFlourish) => string;
-        fallbackImage: (flourish: import("../model/LeadFlourish").LeadFlourish) => Promise<import("../model/FlourishSource").FlourishSource>;
+        fallbackImage: (flourish: import("../model/LeadFlourish").LeadFlourish) => Promise<import("../model/FlourishSource").FlourishSource | null>;
     };
     FlourishSource: {
         id: (parent: import("../model/FlourishSource").FlourishSource) => string;
@@ -290,7 +290,6 @@ declare const resolvers: {
     MainImage: import("../generated").ImageSetResolvers;
     Caption: import("../generated").CaptionResolvers;
     Accessibility: import("../generated").AccessibilityResolvers;
-    FlourishFallback: import("../generated").FlourishFallbackResolvers;
     AuthorReference: import("../generated").AuthorReferenceResolvers;
     Picture: {
         __resolveType: import("../generated").TypeResolveFn<"PictureFullBleed" | "PictureInline" | "PictureStandard", import("../model/Picture").Picture, import("..").QueryContext>;

package/lib/resolvers/leadFlourish.d.ts

@@ -3,7 +3,7 @@ declare const resolvers: {
         type: (flourish: import("../model/LeadFlourish").LeadFlourish) => string;
         id: (flourish: import("../model/LeadFlourish").LeadFlourish) => string | null;
         description: (flourish: import("../model/LeadFlourish").LeadFlourish) => string;
-        fallbackImage: (flourish: import("../model/LeadFlourish").LeadFlourish) => Promise<import("../model/FlourishSource").FlourishSource>;
+        fallbackImage: (flourish: import("../model/LeadFlourish").LeadFlourish) => Promise<import("../model/FlourishSource").FlourishSource | null>;
     };
     FlourishSource: {
         id: (parent: import("../model/FlourishSource").FlourishSource) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@financial-times/cp-content-pipeline-schema",
-  "version": "3.5.0",
+  "version": "3.5.2",
   "description": "",
   "main": "lib/index.js",
   "scripts": {

package/src/generated/index.ts

@@ -694,20 +694,11 @@ export type Design = {
 
 export type Flourish = Reference & {
   /** The fallback image to be used if the flourish graphics cannot be loaded. */
-  readonly fallbackImage?: Maybe<FlourishFallback>;
+  readonly fallbackImage?: Maybe<FlourishSource>;
   /** The type of the reference, eg. 'flourish'. */
   readonly type: Scalars['String']['output'];
 };
 
-export type FlourishFallback = {
-  /** The height in pixels of the fallback image. */
-  readonly height?: Maybe<Scalars['Int']['output']>;
-  /** The url of the fallback image. */
-  readonly url?: Maybe<Scalars['String']['output']>;
-  /** The width in pixels of the fallback image. */
-  readonly width?: Maybe<Scalars['Int']['output']>;
-};
-
 export type FlourishSource = {
   /** The format of the source, eg. 'standard'. */
   readonly format: Scalars['ImageFormat']['output'];
@@ -1075,7 +1066,7 @@ export type LayoutImage = Reference & {
 export type LeadFlourish = {
   /** The description of the Flourish chart. */
   readonly description?: Maybe<Scalars['String']['output']>;
-  readonly fallbackImage: FlourishSource;
+  readonly fallbackImage?: Maybe<FlourishSource>;
   /** The id of the Flourish chart. */
   readonly id?: Maybe<Scalars['String']['output']>;
   /** The type of the chart, eg. 'visualisation'. */
@@ -2026,7 +2017,6 @@ export type ResolversTypes = ResolversObject<{
   Design: ResolverTypeWrapper<Design>;
   Float: ResolverTypeWrapper<Scalars['Float']['output']>;
   Flourish: ResolverTypeWrapper<ReferenceWithCAPIData<ContentTree.Flourish>>;
-  FlourishFallback: ResolverTypeWrapper<FlourishFallback>;
   FlourishSource: ResolverTypeWrapper<FlourishSourceModel>;
   FollowButtonVariant: ResolverTypeWrapper<Scalars['FollowButtonVariant']['output']>;
   FullBleedTopper: ResolverTypeWrapper<TopperModel>;
@@ -2128,7 +2118,6 @@ export type ResolversParentTypes = ResolversObject<{
   Design: Design;
   Float: Scalars['Float']['output'];
   Flourish: ReferenceWithCAPIData<ContentTree.Flourish>;
-  FlourishFallback: FlourishFallback;
   FlourishSource: FlourishSourceModel;
   FollowButtonVariant: Scalars['FollowButtonVariant']['output'];
   FullBleedTopper: TopperModel;
@@ -2543,18 +2532,11 @@ export type DesignResolvers<ContextType = QueryContext, ParentType extends Resol
 }>;
 
 export type FlourishResolvers<ContextType = QueryContext, ParentType extends ResolversParentTypes['Flourish'] = ResolversParentTypes['Flourish']> = ResolversObject<{
-  fallbackImage: Resolver<Maybe<ResolversTypes['FlourishFallback']>, ParentType, ContextType>;
+  fallbackImage: Resolver<Maybe<ResolversTypes['FlourishSource']>, ParentType, ContextType>;
   type: Resolver<ResolversTypes['String'], ParentType, ContextType>;
   __isTypeOf?: IsTypeOfResolverFn<ParentType, ContextType>;
 }>;
 
-export type FlourishFallbackResolvers<ContextType = QueryContext, ParentType extends ResolversParentTypes['FlourishFallback'] = ResolversParentTypes['FlourishFallback']> = ResolversObject<{
-  height: Resolver<Maybe<ResolversTypes['Int']>, ParentType, ContextType>;
-  url: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
-  width: Resolver<Maybe<ResolversTypes['Int']>, ParentType, ContextType>;
-  __isTypeOf?: IsTypeOfResolverFn<ParentType, ContextType>;
-}>;
-
 export type FlourishSourceResolvers<ContextType = QueryContext, ParentType extends ResolversParentTypes['FlourishSource'] = ResolversParentTypes['FlourishSource']> = ResolversObject<{
   format: Resolver<ResolversTypes['ImageFormat'], ParentType, ContextType>;
   height: Resolver<ResolversTypes['Int'], ParentType, ContextType>;
@@ -2769,7 +2751,7 @@ export type LayoutImageResolvers<ContextType = QueryContext, ParentType extends
 
 export type LeadFlourishResolvers<ContextType = QueryContext, ParentType extends ResolversParentTypes['LeadFlourish'] = ResolversParentTypes['LeadFlourish']> = ResolversObject<{
   description: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
-  fallbackImage: Resolver<ResolversTypes['FlourishSource'], ParentType, ContextType>;
+  fallbackImage: Resolver<Maybe<ResolversTypes['FlourishSource']>, ParentType, ContextType>;
   id: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
   type: Resolver<Maybe<ResolversTypes['String']>, ParentType, ContextType>;
   __isTypeOf?: IsTypeOfResolverFn<ParentType, ContextType>;
@@ -3259,7 +3241,6 @@ export type Resolvers<ContextType = QueryContext> = ResolversObject<{
   DeepPortraitTopper: DeepPortraitTopperResolvers<ContextType>;
   Design: DesignResolvers<ContextType>;
   Flourish: FlourishResolvers<ContextType>;
-  FlourishFallback: FlourishFallbackResolvers<ContextType>;
   FlourishSource: FlourishSourceResolvers<ContextType>;
   FollowButtonVariant: GraphQLScalarType;
   FullBleedTopper: FullBleedTopperResolvers<ContextType>;

package/src/model/FlourishSource.test.ts

@@ -45,7 +45,7 @@ describe('FlourishSource', () => {
 
   it('should return the correct flourishUrl', () => {
     expect(flourishSource.flourishUrl()).toBe(
-      'https://public.flourish.studio/test-type/1234/thumbnail?cacheBuster=5717196'
+      'https://public.flourish.studio/test-type/1234/thumbnail?cacheBuster=952866'
     )
   })
 
@@ -70,9 +70,9 @@ describe('FlourishSource', () => {
     expect(decodeURIComponent(url)).toMatch(flourishImageUrlRegex)
   })
 
-  it('should bust the cache of the fallback image every five minutes', async () => {
-    const oldCacheBuster = '5717196'
-    const newCacheBuster = '5717197'
+  it('should bust the cache of the fallback image every thirty minutes', async () => {
+    const oldCacheBuster = '952866'
+    const newCacheBuster = '952867'
 
     expect(flourishSource.flourishUrl()).toBe(
       `https://public.flourish.studio/test-type/1234/thumbnail?cacheBuster=${oldCacheBuster}`
@@ -85,7 +85,7 @@ describe('FlourishSource', () => {
     )
 
     newFlourishSource = new FlourishSource(mockFlourishData, context)
-    jest.spyOn(Date, 'now').mockImplementation(() => 1715159100000) // 8 May 2024 09:05:00
+    jest.spyOn(Date, 'now').mockImplementation(() => 1715160840000) // 8 May 2024 09:34:00
     expect(newFlourishSource.flourishUrl()).toBe(
       `https://public.flourish.studio/test-type/1234/thumbnail?cacheBuster=${newCacheBuster}`
     )

package/src/model/FlourishSource.ts

@@ -8,19 +8,37 @@ type ImageMetadata = {
   height: number
 }
 
-type FlourishData =
-  | {
-      id: string
-      type?: string
-      description?: string
-    }
-  | null
-  | undefined
+type FlourishData = {
+  id: string
+  type?: string
+  description?: string
+  width?: number
+  height?: number
+}
+
+const DEFAULT_WIDTH = 2626
+const DEFAULT_HEIGHT = 1459
 
 export class FlourishSource {
   #systemCode: string
   private imageMetadata?: ImageMetadata
 
+  static async createWithMetadata(data: FlourishData, context: QueryContext) {
+    const { width, height } = await FlourishSource.getImageMetadata(
+      data,
+      context
+    )
+
+    return new FlourishSource(
+      {
+        ...data,
+        width,
+        height,
+      },
+      context
+    )
+  }
+
   constructor(
     private flourishData: FlourishData,
     private context: QueryContext
@@ -29,11 +47,11 @@ export class FlourishSource {
   }
 
   id() {
-    return this.flourishData?.id || ''
+    return this.flourishData.id
   }
 
   type() {
-    return this.flourishData?.type || 'flourish'
+    return this.flourishData.type ?? 'flourish'
   }
 
   format() {
@@ -41,63 +59,63 @@ export class FlourishSource {
   }
 
   flourishUrl() {
-    // Timestamp rounded to the nearest 5 minutes to bust the cache every five minutes
-    const cacheBusterTimestamp = Math.floor(Date.now() / (5 * 60 * 1000))
-
-    return `https://public.flourish.studio/${this.type()}/${this.id()}/thumbnail?cacheBuster=${cacheBusterTimestamp}`
+    return FlourishSource.fallbackUrl(this.flourishData)
   }
 
-  private async getImageMetadata(): Promise<ImageMetadata> {
-    const DEFAULT_WIDTH = 2626
-    const DEFAULT_HEIGHT = 1459
+  private static fallbackUrl(data: FlourishData) {
+    // Timestamp rounded to the nearest 30 minutes to bust the cache every half an hour
+    const cacheBusterTimestamp = Math.floor(Date.now() / (30 * 60 * 1000))
 
-    if (this.imageMetadata) {
-      return this.imageMetadata
-    }
+    return `https://public.flourish.studio/${data.type ?? 'flourish'}/${
+      data.id
+    }/thumbnail?cacheBuster=${cacheBusterTimestamp}`
+  }
+
+  static async getImageMetadata(
+    data: FlourishData,
+    context: QueryContext
+  ) {
+    const url = FlourishSource.fallbackUrl(data)
 
     try {
-      const metadata = await this.context.dataSources.origami.getImageMetadata(
-        this.flourishUrl()
-      )
-      this.imageMetadata = {
+      const metadata = await context.dataSources.origami.getImageMetadata(url)
+
+      return {
         width: metadata?.width || DEFAULT_WIDTH,
         height: metadata?.height || DEFAULT_HEIGHT,
       }
     } catch (error) {
       if (isError(error)) {
-        this.context.logger.warn({
+        context.logger.warn({
           event: 'RECOVERABLE_ERROR',
           error: new OperationalError({
             code: 'FLOURISH_IMAGE_METADATA_ERROR',
-            message: `Error getting image dimensions for Flourish fallback image ${this.flourishUrl()}`,
+            message: `Error getting image dimensions for Flourish fallback image ${url}`,
             cause: error,
           }),
         })
       }
-      this.imageMetadata = {
+
+      return {
         width: DEFAULT_WIDTH,
         height: DEFAULT_HEIGHT,
       }
     }
-    return this.imageMetadata
   }
-  async width() {
-    const imageMetadata = await this.getImageMetadata()
-    return imageMetadata.width
+
+  width() {
+    return this.flourishData.width ?? DEFAULT_WIDTH
   }
 
-  async height() {
-    const imageMetadata = await this.getImageMetadata()
-    return imageMetadata.height
+  height() {
+    return this.flourishData.height ?? DEFAULT_HEIGHT
   }
 
-  async url() {
-    const width = await this.width()
-    const imageServiceWrappedUrl = imageServiceUrl({
+  url() {
+    return imageServiceUrl({
       url: this.flourishUrl(),
       systemCode: 'cp-content-pipeline',
-      width,
+      width: this.width(),
     })
-    return imageServiceWrappedUrl
   }
 }

package/src/model/Image.test.ts

@@ -1,10 +1,8 @@
 import { CAPIImage } from './Image'
-import { jest } from '@jest/globals'
+import logger from '@dotcom-reliability-kit/logger'
 import type { QueryContext } from '..'
 import { Image } from './schemas/capi/internal-content'
-import { OrigamiImageDataSource } from '../datasources/origami-image'
 import { MAX_IMAGE_WIDTH } from '../helpers/imageService'
-import type { ImageSource } from '../generated'
 
 describe('Image', () => {
   const mockImage = {
@@ -13,6 +11,8 @@ describe('Image', () => {
     title: 'title',
     description: 'description',
     binaryUrl: 'cloudfront.com/image',
+    pixelWidth: 5000,
+    pixelHeight: 1000,
   }
 
   const graphic = {
@@ -20,34 +20,17 @@ describe('Image', () => {
     type: 'http://www.ft.com/ontology/content/Graphic' as const,
   }
 
-  const getImageMetadata = jest.fn<OrigamiImageDataSource['getImageMetadata']>()
-
   const context = {
-    dataSources: {
-      origami: {
-        getImageMetadata,
-      },
-      capi: {},
-      vanityUrls: {},
-    },
+    logger,
     systemCode: 'image-test',
   } as unknown as QueryContext
 
-  beforeEach(() => {
-    getImageMetadata.mockReset()
-  })
-
   describe('sourceSet', () => {
     describe('An image that is provided with a high resolution', () => {
-      let sourceSet: ImageSource[]
-
-      beforeAll(async () => {
-        getImageMetadata.mockResolvedValue({ width: 5000, height: 1000 })
+      it('transforms the URL to use the Origami Image Service', async () => {
         const model = new CAPIImage(mockImage, context)
-        sourceSet = await model.sourceSet({ width: 1000 })
-      })
+        const sourceSet = await model.sourceSet({ width: 1000 })
 
-      it('transforms the URL to use the Origami Image Service', () => {
         expect(
           sourceSet.every((source) =>
             source.url.startsWith(
@@ -57,7 +40,10 @@ describe('Image', () => {
         ).toBeTruthy()
       })
 
-      it('resizes the image to the requested width', () => {
+      it('resizes the image to the requested width', async () => {
+        const model = new CAPIImage(mockImage, context)
+        const sourceSet = await model.sourceSet({ width: 1000 })
+
         expect(
           sourceSet.every(
             (source) =>
@@ -66,7 +52,9 @@ describe('Image', () => {
         ).toBeTruthy()
       })
 
-      it('includes sourceSet for all the possible resolutions we can display the image at, given the requested width and the original source width', () => {
+      it('includes sourceSet for all the possible resolutions we can display the image at, given the requested width and the original source width', async () => {
+        const model = new CAPIImage(mockImage, context)
+        const sourceSet = await model.sourceSet({ width: 1000 })
         expect(sourceSet.length).toEqual(5)
         expect(sourceSet[0]?.dpr).toEqual(1)
         expect(sourceSet[0]?.url).toMatch(/dpr=1/)
@@ -77,8 +65,10 @@ describe('Image', () => {
 
     describe("An image that that isn't wide enough to generate high-resolution sourceSet for", () => {
       it('returns an array with a single resolution iamge service UR', async () => {
-        getImageMetadata.mockResolvedValue({ width: 1500, height: 500 })
-        const model = new CAPIImage(mockImage, context)
+        const model = new CAPIImage(
+          { ...mockImage, pixelWidth: 1500, pixelHeight: 500 },
+          context
+        )
         const sourceSet = await model.sourceSet({ width: 1000 })
         expect(sourceSet.length).toEqual(1)
         expect(sourceSet[0]).toEqual({
@@ -91,8 +81,10 @@ describe('Image', () => {
 
     describe('An image that that is smaller than the width that was requested', () => {
       it('returns the image at the same width as the original', async () => {
-        getImageMetadata.mockResolvedValue({ width: 500, height: 500 })
-        const model = new CAPIImage(mockImage, context)
+        const model = new CAPIImage(
+          { ...mockImage, pixelWidth: 500, pixelHeight: 500 },
+          context
+        )
         const sourceSet = await model.sourceSet({ width: 1000 })
         expect(sourceSet.length).toEqual(1)
         expect(sourceSet[0]).toEqual({
@@ -105,8 +97,10 @@ describe('Image', () => {
 
     describe('An image that that is bigger than the maximum width that was requested', () => {
       it('returns the image at the same width as the maximum width', async () => {
-        getImageMetadata.mockResolvedValue({ width: 4000, height: 4000 })
-        const model = new CAPIImage(mockImage, context)
+        const model = new CAPIImage(
+          { ...mockImage, pixelWidth: 4000, pixelHeight: 4000 },
+          context
+        )
         const sourceSet = await model.sourceSet({ width: MAX_IMAGE_WIDTH })
         expect(sourceSet.length).toEqual(1)
         expect(sourceSet[0]?.width).toEqual(MAX_IMAGE_WIDTH)
@@ -115,8 +109,10 @@ describe('Image', () => {
 
     describe('A large image with the maxDpr argumet passed', () => {
       it('only returns sourceSet up to and including the maxDpr', async () => {
-        getImageMetadata.mockResolvedValue({ width: 5000, height: 500 })
-        const model = new CAPIImage(mockImage, context)
+        const model = new CAPIImage(
+          { ...mockImage, pixelWidth: 5000, pixelHeight: 500 },
+          context
+        )
         const sourceSet = await model.sourceSet({ width: 1000, maxDpr: 2 })
         expect(sourceSet.length).toEqual(2)
         expect(sourceSet[0]?.dpr).toEqual(1)
@@ -137,26 +133,6 @@ describe('Image', () => {
         await expect(
           model.sourceSet({ width: 1000, maxDpr: 2 })
         ).rejects.toThrow('not-a-uuid is not a valid Content API Image ID')
-        expect(getImageMetadata).not.toHaveBeenCalled()
-      })
-    })
-
-    describe('When the image service fails to return metadata', () => {
-      let sourceSet: ImageSource[]
-      beforeEach(async () => {
-        getImageMetadata.mockRejectedValue(null)
-        const model = new CAPIImage(mockImage, context)
-        sourceSet = await model.sourceSet({ width: 3000 })
-      })
-      it('passes the requested width to the image service', async () => {
-        expect(sourceSet.length).toEqual(1)
-        expect(sourceSet[0]?.width).toEqual(3000)
-        expect(sourceSet[0]?.url).toMatch(/width=3000/)
-      })
-      it('falls back to a single DPR source', async () => {
-        expect(sourceSet.length).toEqual(1)
-        expect(sourceSet[0]?.dpr).toEqual(1)
-        expect(sourceSet[0]?.url).toMatch(/dpr=1/)
       })
     })
   })
@@ -235,17 +211,18 @@ describe('Image', () => {
   })
 
   describe('width/height', () => {
-    it('returns the original width and height from the image service metadata', async () => {
-      getImageMetadata.mockResolvedValue({ width: 100, height: 200 })
+    it('returns the original width and height from capi data', async () => {
       const model = new CAPIImage(mockImage, context)
       const { width, height } = (await model.dimensions()) || {}
-      expect(width).toEqual(100)
-      expect(height).toEqual(200)
+      expect(width).toEqual(5000)
+      expect(height).toEqual(1000)
     })
 
-    it('returns null if the image service metadata call fails', async () => {
-      getImageMetadata.mockRejectedValue(null)
-      const model = new CAPIImage(mockImage, context)
+    it('returns null if no width and height in capi data', async () => {
+      const model = new CAPIImage(
+        { ...mockImage, pixelHeight: undefined, pixelWidth: undefined },
+        context
+      )
       const dimensions = await model.dimensions()
       expect(dimensions).toEqual(null)
     })

package/src/model/Image.ts

@@ -11,8 +11,7 @@ import {
   validLiteralUnionValue,
 } from '../resolvers/literal-union'
 import { ImageFormat, ImageType } from '../resolvers/scalars'
-import isError from '../helpers/isError'
-import { BaseError, OperationalError } from '@dotcom-reliability-kit/errors'
+import { BaseError } from '@dotcom-reliability-kit/errors'
 import type { ImageSource } from '../generated'
 
 export type ImageSourceArgs = {
@@ -126,7 +125,7 @@ export class CAPIImage implements Image {
           args.maxDpr || Infinity,
           Math.floor(dimensions.width / maxAllowedWidth)
         )
-      : 1
+      : 2
 
     const resolutions = [...Array(maxDpr + 1).keys()].slice(1)
 
@@ -157,25 +156,18 @@ export class CAPIImage implements Image {
         height: this.capiImage.pixelHeight,
       }
     }
-    try {
-      const imageMetadata = await this.#dataSources.origami.getImageMetadata(
-        this.capiImage.binaryUrl
-      )
-      return imageMetadata
-    } catch (error) {
-      if (isError(error)) {
-        this.context.logger.warn({
-          event: 'RECOVERABLE_ERROR',
-          error: new OperationalError({
-            code: 'IMAGE_DIMENSIONS_ERROR',
-            message: `Failed to get dimensions for ${this.capiImage.binaryUrl}`,
-            url: this.capiImage.binaryUrl,
-            cause: error,
-          }),
-        })
-      }
-      return null
-    }
+
+    // HACK:KB:20241029 graphics and images in layouts don't have pixelWidth/
+    // pixelHeight because of reasons. we want to avoid calling Image Service
+    // to improve performance. skip calling Image Service for the time being
+    this.context.logger.warn({
+      event: 'SKIPPING_IMAGE_DIMENSIONS',
+      message: 'Not calling Image Service to get graphics dimensions',
+      url: this.capiImage.binaryUrl,
+      type: this.type(),
+    })
+
+    return null
   }
 
   credit() {

package/src/model/LeadFlourish.test.ts

@@ -7,18 +7,13 @@ import cloneDeep from 'clone-deep'
 
 const context = {} as unknown as QueryContext
 
-jest.mock('./FlourishSource', () => {
-  return {
-    FlourishSource: jest.fn().mockImplementation(() => ({})),
-  }
-})
-
 const leadFlourishData = {
   id: 'test-id',
   description: 'test-description',
   type: 'test-type',
 }
 
+
 describe('LeadFlourish', () => {
   let leadFlourish: LeadFlourish
 
@@ -30,15 +25,17 @@ describe('LeadFlourish', () => {
       layoutWidth: 'full-width',
       backgroundColour: 'paper',
     }
+    jest.spyOn(FlourishSource, 'getImageMetadata').mockResolvedValue({
+      width: 800,
+      height: 600
+    })
     const capiResponse = new CapiResponse(clonedBase, context)
     leadFlourish = new LeadFlourish(capiResponse, context)
   })
 
   describe('fallbackImage', () => {
     it('should instantiate a new FlourishSource', async () => {
-      await leadFlourish.fallbackImage()
-
-      expect(FlourishSource).toHaveBeenCalledWith(leadFlourishData, context)
+      await expect(leadFlourish.fallbackImage()).resolves.toBeInstanceOf(FlourishSource)
     })
   })
 

package/src/model/LeadFlourish.ts

@@ -13,7 +13,11 @@ export class LeadFlourish {
 
   async fallbackImage() {
     const flourishData = this.capiResponse.leadFlourish()
-    return new FlourishSource(flourishData, this.context)
+    if (!flourishData) {
+      return null
+    }
+
+    return FlourishSource.createWithMetadata(flourishData, this.context)
   }
 
   id() {

package/src/model/schemas/capi/base-schema.ts

@@ -147,7 +147,7 @@ export const ClipSet = z.object({
 const DataSource = z.object({
   binaryUrl: z.string(),
   duration: z.number(),
-  filesize: z.number(),
+  filesize: z.number().optional(),
   mediaType: z.string(),
 })