Merge pull request #444 from poap-xyz/release/v1.22.0

Release v1.22.0
poap-xyz · Dec 20, 2024 · e1b5511 · e1b5511
2 parents b093327 + 754a8c2
commit e1b5511
Show file tree

Hide file tree

Showing 24 changed files with 286 additions and 666 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@poap-xyz/poap-family",
-  "version": "1.21.0",
+  "version": "1.22.0",
   "author": {
     "name": "POAP",
     "url": "https://poap.xyz"
@@ -43,7 +43,8 @@
   "main": "src/index.js",
   "scripts": {
     "start": "react-scripts start",
-    "build": "react-scripts build"
+    "build": "react-scripts build",
+    "type-check": "tsc --noEmit"
   },
   "packageManager": "[email protected]",
   "engines": {

diff --git a/src/components/AddressOwner.tsx b/src/components/AddressOwner.tsx
@@ -62,7 +62,7 @@ function AddressOwner({
                 ? (
                     <TokenImage
                       key={eventId}
-                      event={events[eventId]}
+                      drop={events[eventId]}
                       size={18}
                       resize={true}
                     />

diff --git a/src/components/AddressProfile.tsx b/src/components/AddressProfile.tsx
@@ -127,7 +127,7 @@ function AddressProfile({
                 token.id && token.event && (
                   <TokenImage
                     key={token.id}
-                    event={token.event}
+                    drop={token.event}
                     size={18}
                     resize={true}
                   />
@@ -159,7 +159,7 @@ function AddressProfile({
                 eventId in events && (
                   <TokenImage
                     key={eventId}
-                    event={events[eventId]}
+                    drop={events[eventId]}
                     size={18}
                     resize={true}
                   />

diff --git a/src/components/CachedEventList.tsx b/src/components/CachedEventList.tsx
@@ -42,7 +42,7 @@ function CachedEventList({
           <div className="cached-event">
             <div className="cached-event-card">
               <TokenImageZoom
-                event={cachedEvent}
+                drop={cachedEvent}
                 zoomSize={512}
                 size={tokenImageSize}
               />

diff --git a/src/components/EventHeader.tsx b/src/components/EventHeader.tsx
@@ -13,7 +13,7 @@ function EventHeader({
   return (
     <div className="event-header">
       <div className="event-header-image">
-        <TokenImageZoom event={event} zoomSize={512} size={size} />
+        <TokenImageZoom drop={event} zoomSize={512} size={size} />
       </div>
       <div className="event-header-details">
         <Link to={`/event/${event.id}`} className="event-id">#{event.id}</Link>

diff --git a/src/components/EventInfo.tsx b/src/components/EventInfo.tsx
@@ -11,22 +11,22 @@ import ExternalLink from 'components/ExternalLink'
 import 'styles/event-info.css'
 
 function EventInfo({
-  event,
+  drop,
   children,
 }: {
-  event: Drop
+  drop: Drop
   children?: ReactNode
 }) {
   const [extraOpen, setExtraOpen] = useState<boolean>(false)
 
   return (
     <div className="event-info-header">
-      {event.description && (
+      {drop.description && (
         <div className={clsx('event-info-extra', extraOpen ? 'open' : 'close')}>
           <div className="event-info-extra-card">
             {extraOpen && (
               <div className="event-info-extra-content">
-                {event.description.split('\n').map(
+                {drop.description.split('\n').map(
                   (p, i) => (
                     <p key={`p${i}`}>
                       {linkify(p, ExternalLink).map(
@@ -54,13 +54,13 @@ function EventInfo({
       >
         <div className="event-info">
           <div className="event-image">
-            <TokenImageZoom event={event} zoomSize={512} size={128} />
+            <TokenImageZoom drop={drop} zoomSize={512} size={128} />
           </div>
           <div className="event-data">
-            <h1>{event.name}</h1>
-            <div className="event-date">{formatDate(event.start_date)}</div>
-            {event.city && event.country && (
-              <div className="place">{event.city}, {event.country}</div>
+            <h1>{drop.name}</h1>
+            <div className="event-date">{formatDate(drop.start_date)}</div>
+            {drop.city && drop.country && (
+              <div className="place">{drop.city}, {drop.country}</div>
             )}
             {children}
           </div>

diff --git a/src/components/EventPower.tsx b/src/components/EventPower.tsx
@@ -13,7 +13,7 @@ function EventPower({
 }) {
   return (
     <div className="event-power">
-      <TokenImage event={event} size={size} />
+      <TokenImage drop={event} size={size} />
       <span className="power">{count}</span>
     </div>
   )

diff --git a/src/components/EventStats.tsx b/src/components/EventStats.tsx
@@ -1,18 +1,15 @@
 import { Drop, DropMetrics } from 'models/drop'
 import { POAP_MOMENTS_URL } from 'models/poap'
 import { formatStat } from 'utils/number'
-import { formatDateAgo } from 'utils/date'
 import Stats from 'components/Stats'
 
 function EventStats({
-  event,
+  drop,
   collectors,
-  cachedTs,
   metrics,
 }: {
-  event: Drop
+  drop: Drop
   collectors: number
-  cachedTs?: number
   metrics?: DropMetrics
 }) {
   const stats = {
@@ -22,18 +19,15 @@ function EventStats({
         }
       : {
           text: formatStat(collectors),
-          title: cachedTs != null ? `Cached ${formatDateAgo(cachedTs)}` : undefined,
         },
   }
 
   if (metrics && metrics.emailReservations > 0) {
     stats['mints'] = {
       text: formatStat(collectors),
-      title: cachedTs != null ? `Cached ${formatDateAgo(cachedTs)}` : undefined,
     }
     stats['reservations'] = {
       text: formatStat(metrics.emailReservations),
-      title: metrics.ts ? `Cached ${formatDateAgo(metrics.ts)}` : undefined,
     }
   }
 
@@ -53,8 +47,8 @@ function EventStats({
   if (metrics && metrics.momentsUploaded > 0) {
     stats['moments'] = {
       text: formatStat(metrics.momentsUploaded),
-      title: `View uploaded moments on ${event.name}`,
-      href: `${POAP_MOMENTS_URL}/drop/${event.id}`,
+      title: `View uploaded moments on ${drop.name}`,
+      href: `${POAP_MOMENTS_URL}/drop/${drop.id}`,
       external: true,
     }
   }

diff --git a/src/components/EventsPowers.tsx b/src/components/EventsPowers.tsx
@@ -48,7 +48,7 @@ function EventsPowers({
             }}
           >
             {perfectPower === power
-              ? <TokenImage event={events[eventId]} size={size} />
+              ? <TokenImage drop={events[eventId]} size={size} />
               : <EventPower
                 event={events[eventId]}
                 count={power}

diff --git a/src/components/SearchResultEvent.tsx b/src/components/SearchResultEvent.tsx
@@ -21,7 +21,7 @@ function SearchResultEvent({
       <div className="drop-info">
         <div className="drop-image">
           <Link to={`/event/${event.id}`} className="drop-link">
-            <TokenImage event={event} size={18} />
+            <TokenImage drop={event} size={18} />
           </Link>
         </div>
         <div className="drop-name">

diff --git a/src/components/TokenImage.tsx b/src/components/TokenImage.tsx
@@ -4,23 +4,23 @@ import { resizeTokenImageUrl } from 'models/poap'
 import 'styles/token-image.css'
 
 function TokenImage({
-  event,
+  drop,
   size,
   imgSize,
   resize = true,
   imgix = false,
   original = false,
 }: {
-  event: Drop | CachedEvent
+  drop: Drop | CachedEvent
   size: number
   imgSize?: number
   resize?: boolean
   imgix?: boolean
   original?: boolean
 }) {
-  let imageUrl = original && 'original_url' in event
-    ? event.original_url ?? event.image_url
-    : event.image_url
+  let imageUrl = original && 'original_url' in drop
+    ? drop.original_url ?? drop.image_url
+    : drop.image_url
 
   if (resize) {
     imageUrl = resizeTokenImageUrl(imageUrl, size, imgix)
@@ -29,8 +29,8 @@ function TokenImage({
   return (
     <img
       src={imageUrl}
-      alt={event.name}
-      title={event.name}
+      alt={drop.name}
+      title={drop.name}
       className="token-image"
       style={{
         width: `${imgSize ?? size}px`,

diff --git a/src/components/TokenImageZoom.tsx b/src/components/TokenImageZoom.tsx
@@ -10,8 +10,8 @@ import ButtonClose from 'components/ButtonClose'
 import Loading from 'components/Loading'
 import 'styles/token-image-zoom.css'
 
-function TokenImageZoom({ event, size = 128, zoomSize = 512 }: {
-  event: Drop | CachedEvent
+function TokenImageZoom({ drop, size = 128, zoomSize = 512 }: {
+  drop: Drop | CachedEvent
   size?: number
   zoomSize?: number
 }) {
@@ -23,16 +23,16 @@ function TokenImageZoom({ event, size = 128, zoomSize = 512 }: {
         onClick={() => setShowModal((show) => !show)}
         className="token-image-zoom-in-button"
       >
-        <TokenImage event={event} size={size} resize={true} />
+        <TokenImage drop={drop} size={size} resize={true} />
       </button>
       <Modal
         show={showModal}
         onClose={() => setShowModal(false)}
-        title={event.name}
+        title={drop.name}
       >
         <LazyImage
-          src={event.image_url}
-          alt={event.name}
+          src={drop.image_url}
+          alt={drop.name}
           placeholder={({ imageProps, ref }) => (
             <div className="token-image-zoom-modal token-image-zoom-placeholder" ref={ref}>
               <Card>
@@ -42,7 +42,7 @@ function TokenImageZoom({ event, size = 128, zoomSize = 512 }: {
                   className="token-image-zoom-out-button"
                 >
                   <TokenImage
-                    event={event}
+                    drop={drop}
                     size={size}
                     imgSize={zoomSize}
                     resize={true}
@@ -61,7 +61,7 @@ function TokenImageZoom({ event, size = 128, zoomSize = 512 }: {
                   className="token-image-zoom-out-button"
                 >
                   <TokenImage
-                    event={event}
+                    drop={drop}
                     size={zoomSize}
                     resize={false}
                     original={true}
@@ -80,7 +80,7 @@ function TokenImageZoom({ event, size = 128, zoomSize = 512 }: {
                   className="token-image-zoom-out-button"
                 >
                   <TokenImage
-                    event={event}
+                    drop={drop}
                     size={size}
                     imgSize={zoomSize}
                     resize={true}