feat(SW-365): Added focal point to imagevault typings and to image component

types/components/image.ts

@@ -1,9 +1,34 @@
-export type ApiImage = {
+import type { ImageProps as NextImageProps } from "next/image"
+
+import type { ImageVaultAsset } from "./imageVault"
+
+export interface FocalPoint {
+  x: number
+  y: number
+}
+
+export interface Dimensions {
+  width: number
+  height: number
+  aspectRatio: number
+}
+
+export interface Meta {
+  alt: string | undefined | null
+  caption: string | undefined | null
+}
+
+export interface ApiImage {
   id: string
   url: string
   title: string
-  meta: {
-    alt: string
-    caption: string
-  }
+  meta: Meta
+  dimensions?: Dimensions
+  focalPoint?: FocalPoint
 }
+
+export interface ImageProps extends NextImageProps {
+  focalPoint?: FocalPoint
+}
+
+export type ImageType = ImageVaultAsset | ApiImage

types/components/imageVault.ts

@@ -11,6 +11,8 @@ import { z } from "zod"
 
 import { imageVaultAssetSchema } from "@/server/routers/contentstack/schemas/imageVault"
 
+import type { FocalPoint } from "./image"
+
 export type ImageVaultAssetResponse = z.infer<typeof imageVaultAssetSchema>
 
 export type ImageVaultAsset = {
@@ -23,4 +25,5 @@ export type ImageVaultAsset = {
     aspectRatio: number
   }
   meta: { alt: string | undefined | null; caption: string | undefined | null }
+  focalPoint: FocalPoint
 }