Feature/fix multiple event load (#139)

* Rename POAPs limit constant * Rename store tokenId by eventId * Fetch event data the first page of tokens * Remove unused constants
poap-xyz · Jan 30, 2023 · 3b5cc93 · 3b5cc93
1 parent 7d6c6f2
commit 3b5cc93
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 12 deletions.
diff --git a/src/pages/event.js b/src/pages/event.js
@@ -38,7 +38,7 @@ import { Spinner } from '../components/spinner';
 import { collectionlLinks, externalLinkSetter } from '../utilities/utilities';
 import { POAP_APP_URL } from '../store/api';
 
-const GRAPH_LIMIT = 300;
+const FETCH_POAPS_LIMIT = 300;
 const CSV_STATUS = {
   DownloadingData: 'DownloadingData',
   DownloadingLastDataChunk: 'DownloadingLastDataChunk',
@@ -119,16 +119,16 @@ export function Event() {
       dispatch(
         fetchEventPageData({
           eventId,
-          first: GRAPH_LIMIT,
-          skip: GRAPH_LIMIT * pageIndex,
+          first: FETCH_POAPS_LIMIT,
+          skip: FETCH_POAPS_LIMIT * pageIndex,
         })
       );
     }
   }, [dispatch, eventId, pageIndex]);
 
   useEffect(() => {
     // Call next batch of tokens (if there is more), then load the new tokens data
-    const totalPages = Math.ceil(event.tokenCount / GRAPH_LIMIT);
+    const totalPages = Math.ceil(event.tokenCount / FETCH_POAPS_LIMIT);
     const hasMorePages = pageIndex < totalPages;
     const hasTokens = tokens && tokens.length > 0;
     if (event && hasTokens && hasMorePages) {

diff --git a/src/store/api.js b/src/store/api.js
@@ -1,9 +1,6 @@
-export const XDAI_SUBGRAPH_URL = process.env.REACT_APP_XDAI_SUBGRAPH_URL;
-export const MAINNET_SUBGRAPH_URL = process.env.REACT_APP_MAINNET_SUBGRAPH_URL;
 export const POAP_API_URL = process.env.REACT_APP_POAP_API_URL;
 export const POAP_API_API_KEY = process.env.REACT_APP_POAP_API_API_KEY;
 export const POAP_APP_URL = process.env.REACT_APP_POAP_APP_URL;
-export const ZERO_ADDRESS = '0x0000000000000000000000000000000000000000';
 export const OrderType = {
   id: {
     name: 'Id',

diff --git a/src/store/index.js b/src/store/index.js
@@ -9,6 +9,7 @@ import {
   getIndexPageData,
   getEventPageData,
   getActivityPageData,
+  getEventTokenData,
 } from './mutations';
 
 export const FETCH_INFO_STATUS = {
@@ -36,7 +37,7 @@ const initialEventsState = {
   eventStatus: FETCH_EVENT_PAGE_INFO_STATUS.IDLE,
   eventError: null,
   tokens: [],
-  tokenId: null,
+  eventId: null,
   apiSkip: 0,
   totalResults: 0,
   page: 0,
@@ -49,7 +50,13 @@ export const fetchIndexData = createAsyncThunk(
 );
 export const fetchEventPageData = createAsyncThunk(
   'events/fetchEventPageData',
-  async ({ eventId, first, skip }) => getEventPageData(eventId, first, skip)
+  async ({ eventId, first, skip }) => {
+    if (skip === 0) {
+      return getEventPageData(eventId, first, skip);
+    } else {
+      return getEventTokenData(eventId, first, skip);
+    }
+  }
 );
 export const fetchActivityPageData = createAsyncThunk(
   'events/fetchActivityPageData',
@@ -92,14 +99,17 @@ const eventsSlice = createSlice({
       state.eventStatus = FETCH_EVENT_PAGE_INFO_STATUS.LOADING;
     },
     [fetchEventPageData.fulfilled]: (state, action) => {
-      if (state.tokenId === action.payload.id) {
+      if (state.eventId === action.payload.id) {
         state.tokens = current(state.tokens).concat(action.payload.tokens);
       } else {
         state.tokens = action.payload.tokens;
       }
 
-      state.tokenId = action.payload.id;
-      state.event = action.payload.event;
+      state.eventId = action.payload.id;
+      if (action.payload.event) {
+        // Event data is only retrieved the first page of tokens.
+        state.event = action.payload.event;
+      }
       state.eventStatus = FETCH_EVENT_PAGE_INFO_STATUS.SUCCEEDED;
     },
     [fetchEventPageData.rejected]: (state, action) => {

diff --git a/src/store/mutations.js b/src/store/mutations.js
@@ -121,3 +121,9 @@ export async function getEventPageData(eventId, first, skip) {
     }),
   };
 }
+
+export async function getEventTokenData(eventId, first, skip) {
+  const eventTokens = await getEventTokens(eventId, first, skip);
+  const { tokens } = eventTokens;
+  return { id: eventId, tokens };
+}