diff --git a/src/constants.js b/src/constants.js index fb1fbae7..34038002 100644 --- a/src/constants.js +++ b/src/constants.js @@ -9,3 +9,4 @@ export const SKIN_CDN = "https://cdn.webampskins.org"; export const API_URL = "https://api.webampskins.org"; export const SHOW_UPLOAD = window.location.hash.includes("upload"); export const HEADING_HEIGHT = 46; +export const CHUNK_SIZE = 100; diff --git a/src/redux/epics.js b/src/redux/epics.js index c7f731ce..eddc0e35 100644 --- a/src/redux/epics.js +++ b/src/redux/epics.js @@ -17,7 +17,7 @@ import { } from "rxjs/operators"; import { search } from "../algolia"; import queryParser from "../queryParser"; -import { API_URL } from "../constants"; +import { API_URL, CHUNK_SIZE } from "../constants"; import * as UploadUtils from "../uploadUtils"; const urlChangedEpic = (actions) => @@ -150,15 +150,14 @@ const unloadedSkinEpic = (actions, states) => actions.pipe( filter((action) => action.type === "REQUEST_UNLOADED_SKIN"), mergeMap(async ({ index }) => { - const chunkSize = 100; - const chunk = Math.floor(index / (chunkSize - 1)); + const chunk = Math.floor(index / (CHUNK_SIZE - 1)); if (chunkState[chunk] != null) { - return EMPTY; + return null; } chunkState[chunk] = "fetching"; const response = await fetch( - `${API_URL}/skins?offset=${chunk * chunkSize}&first=${chunkSize}` + `${API_URL}/skins?offset=${chunk * CHUNK_SIZE}&first=${CHUNK_SIZE}` ); const body = await response.json(); diff --git a/src/redux/reducer.js b/src/redux/reducer.js index d4fb26e6..d1cc4731 100644 --- a/src/redux/reducer.js +++ b/src/redux/reducer.js @@ -1,4 +1,4 @@ -import { ABOUT_PAGE } from "../constants"; +import { ABOUT_PAGE, CHUNK_SIZE } from "../constants"; const defaultState = { searchQuery: null, @@ -13,7 +13,6 @@ const defaultState = { activeContentPage: null, totalNumberOfSkins: null, scale: 0.5, - skinChunkData: { chunkSize: 100, numberOfSkins: 64381, chunkFileNames: [] }, skins: {}, showNsfw: false, fileUploads: {}, @@ -173,7 +172,7 @@ export default function reducer(state = defaultState, action) { // TODO: Get chunk size from state // TODO: validate the chunk number is in bounds // TODO: validate that we don't alredy have this chunk - newDefaultSkins[action.chunk * 100 + i] = skin.md5; + newDefaultSkins[action.chunk * CHUNK_SIZE + i] = skin.md5; }); return { ...state,