feat(IEX-910): Add drop image property to drop

poap-xyz · Mar 6, 2024 · 6c45526 · 6c45526
1 parent 2fd8076
commit 6c45526
Show file tree

Hide file tree

Showing 5 changed files with 127 additions and 35 deletions.
diff --git a/packages/drops/package.json b/packages/drops/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@poap-xyz/drops",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "Drops module for the poap.js library",
   "main": "dist/cjs/index.cjs",
   "module": "dist/esm/index.mjs",

diff --git a/packages/drops/src/DropsClient.ts b/packages/drops/src/DropsClient.ts
@@ -4,7 +4,11 @@ import {
   DropResponse,
 } from '@poap-xyz/providers';
 import { Drop } from './domain/Drop';
-import { PaginatedDropsResponse, PAGINATED_DROPS_QUERY } from './queries';
+import {
+  PaginatedDropsResponse,
+  PAGINATED_DROPS_QUERY,
+  DropImageResponse,
+} from './queries';
 import { CreateDropsInput, FetchDropsInput, UpdateDropsInput } from './types';
 import {
   PaginatedResult,
@@ -15,6 +19,7 @@ import {
   createFilter,
   createInFilter,
 } from '@poap-xyz/utils';
+import { DropImage } from './types/dropImage';
 
 /**
  * Represents a client for working with POAP drops.
@@ -72,39 +77,45 @@ export class DropsClient {
       variables,
     );
 
-    const drops = data.drops.map(
-      (drop) =>
-        new Drop({
-          id: Number(drop.id),
-          fancyId: drop.fancy_id,
-          name: drop.name,
-          description: drop.description,
-          city: drop.city,
-          country: drop.country,
-          channel: drop.channel,
-          platform: drop.platform,
-          locationType: drop.location_type,
-          dropUrl: drop.drop_url,
-          imageUrl: drop.image_url,
-          animationUrl: drop.animation_url,
-          year: Number(drop.year),
-          startDate: new Date(drop.start_date),
-          timezone: drop.timezone,
-          private: drop.private,
-          createdDate: new Date(drop.created_date),
-          poapCount: drop.stats_by_chain_aggregate.aggregate.sum
-            ? Number(drop.stats_by_chain_aggregate.aggregate.sum.poap_count)
-            : 0,
-          transferCount: drop.stats_by_chain_aggregate.aggregate.sum
-            ? Number(drop.stats_by_chain_aggregate.aggregate.sum.transfer_count)
-            : 0,
-          emailReservationCount: drop.email_claims_stats
-            ? Number(drop.email_claims_stats.total)
-            : 0,
-          expiryDate: new Date(drop.expiry_date),
-          endDate: new Date(drop.end_date),
-        }),
-    );
+    const drops = data.drops.map((drop) => {
+      const dropImage = this.mapDropImage(drop.drop_image);
+      const imageUrl =
+        dropImage?.cropped?.url || dropImage?.original?.url || drop.image_url;
+      const originalImageUrl = dropImage?.original?.url || drop.image_url;
+
+      return new Drop({
+        id: Number(drop.id),
+        fancyId: drop.fancy_id,
+        name: drop.name,
+        description: drop.description,
+        city: drop.city,
+        country: drop.country,
+        channel: drop.channel,
+        platform: drop.platform,
+        locationType: drop.location_type,
+        dropUrl: drop.drop_url,
+        imageUrl,
+        originalImageUrl,
+        animationUrl: drop.animation_url,
+        year: Number(drop.year),
+        startDate: new Date(drop.start_date),
+        timezone: drop.timezone,
+        private: drop.private,
+        createdDate: new Date(drop.created_date),
+        poapCount: drop.stats_by_chain_aggregate.aggregate.sum
+          ? Number(drop.stats_by_chain_aggregate.aggregate.sum.poap_count)
+          : 0,
+        transferCount: drop.stats_by_chain_aggregate.aggregate.sum
+          ? Number(drop.stats_by_chain_aggregate.aggregate.sum.transfer_count)
+          : 0,
+        emailReservationCount: drop.email_claims_stats
+          ? Number(drop.email_claims_stats.total)
+          : 0,
+        expiryDate: new Date(drop.expiry_date),
+        endDate: new Date(drop.end_date),
+        dropImage,
+      });
+    });
 
     return new PaginatedResult<Drop>(
       drops,
@@ -182,6 +193,7 @@ export class DropsClient {
       locationType: drop.location_type,
       dropUrl: drop.event_url,
       imageUrl: drop.image_url,
+      originalImageUrl: drop.image_url,
       animationUrl: drop.animation_url,
       year: drop.year,
       startDate: new Date(drop.start_date),
@@ -195,4 +207,20 @@ export class DropsClient {
       emailReservationCount: 0,
     });
   }
+
+  private mapDropImage(response?: DropImageResponse): DropImage | undefined {
+    if (!response) return response;
+
+    const images = response.gateways.reduce(
+      (acc, gateway) => ({ ...acc, [gateway.type.toLowerCase()]: gateway }),
+      {},
+    );
+
+    return {
+      id: response.id,
+      publicId: response.public_id,
+      mimeType: response.mime_type,
+      ...images,
+    };
+  }
 }
diff --git a/packages/drops/src/domain/Drop.ts b/packages/drops/src/domain/Drop.ts
@@ -1,3 +1,5 @@
+import { DropImage } from '../types/dropImage';
+
 /* eslint-disable max-statements */
 export class Drop {
   id: number;
@@ -11,6 +13,7 @@ export class Drop {
   locationType: string;
   dropUrl: string;
   imageUrl: string;
+  originalImageUrl: string;
   animationUrl: string;
   year: number;
   timezone: string;
@@ -22,6 +25,7 @@ export class Drop {
   poapCount: number;
   transferCount: number;
   emailReservationCount: number;
+  dropImage?: DropImage;
 
   constructor(properties: DropProperties) {
     this.id = properties.id;
@@ -35,6 +39,7 @@ export class Drop {
     this.locationType = properties.locationType;
     this.dropUrl = properties.dropUrl;
     this.imageUrl = properties.imageUrl;
+    this.originalImageUrl = properties.originalImageUrl;
     this.animationUrl = properties.animationUrl;
     this.year = properties.year;
     this.startDate = properties.startDate;
@@ -46,6 +51,7 @@ export class Drop {
     this.emailReservationCount = properties.emailReservationCount;
     this.expiryDate = properties.expiryDate;
     this.endDate = properties.endDate;
+    this.dropImage = properties.dropImage;
   }
 
   public getTotalMinted(): number {
@@ -65,6 +71,7 @@ export class Drop {
       locationType: this.locationType,
       dropUrl: this.dropUrl,
       imageUrl: this.imageUrl,
+      originalImageUrl: this.originalImageUrl,
       animationUrl: this.animationUrl,
       year: this.year,
       timezone: this.timezone,
@@ -76,6 +83,7 @@ export class Drop {
       emailReservationCount: this.emailReservationCount,
       expiryDate: this.expiryDate.toISOString(),
       endDate: this.endDate.toISOString(),
+      dropImage: this.dropImage,
     };
   }
 }
@@ -92,6 +100,7 @@ export interface SerializableDrop {
   locationType: string;
   dropUrl: string;
   imageUrl: string;
+  originalImageUrl: string;
   animationUrl: string;
   year: number;
   timezone: string;
@@ -103,6 +112,7 @@ export interface SerializableDrop {
   emailReservationCount: number;
   expiryDate: string; // ISO String representation of Date
   endDate: string; // ISO String representation of Date
+  dropImage?: DropImage;
 }
 
 export interface DropProperties {
@@ -117,6 +127,7 @@ export interface DropProperties {
   locationType: string;
   dropUrl: string;
   imageUrl: string;
+  originalImageUrl: string;
   animationUrl: string;
   year: number;
   timezone: string;
@@ -128,4 +139,5 @@ export interface DropProperties {
   poapCount: number;
   transferCount: number;
   emailReservationCount: number;
+  dropImage?: DropImage;
 }
diff --git a/packages/drops/src/queries/PaginatedDrop.ts b/packages/drops/src/queries/PaginatedDrop.ts
@@ -1,3 +1,5 @@
+import { DropImageGatewayType } from '../types/dropImage';
+
 export const PAGINATED_DROPS_QUERY = `
   query PaginatedDrops(
     $limit: Int!
@@ -36,10 +38,39 @@ export const PAGINATED_DROPS_QUERY = `
       email_claims_stats {
         total
       }
+      drop_image {
+        id
+        public_id
+        mime_type
+        gateways {
+          id
+          image_id
+          type
+          url
+          filename
+          mime_type
+        }
+      }
     }
   }
 `;
 
+export interface DropImageGatewayResponse {
+  id: number;
+  image_id: string;
+  type: DropImageGatewayType;
+  url: string;
+  filename: string;
+  mime_type: string;
+}
+
+export interface DropImageResponse {
+  id: number;
+  public_id: string;
+  mime_type: string;
+  gateways: Array<DropImageGatewayResponse>;
+}
+
 export interface DropResponse {
   id: number;
   fancy_id: string;
@@ -71,6 +102,7 @@ export interface DropResponse {
   email_claims_stats: {
     total: number;
   };
+  drop_image?: DropImageResponse;
 }
 
 export interface PaginatedDropsResponse {

diff --git a/packages/drops/src/types/dropImage.ts b/packages/drops/src/types/dropImage.ts
@@ -0,0 +1,20 @@
+export enum DropImageGatewayType {
+  CROP = 'CROP',
+  ORIGINAL = 'ORIGINAL',
+}
+
+export interface DropImageGateway {
+  id: number;
+  imageId: string;
+  url: string;
+  filename: string;
+  mimeType: string;
+}
+
+export interface DropImage {
+  id: number;
+  publicId: string;
+  mimeType: string;
+  original?: DropImageGateway;
+  cropped?: DropImageGateway;
+}