diff --git a/packages/skin-museum-client/src/SkinTable.js b/packages/skin-museum-client/src/SkinTable.js index 3ba05074..07e1fd4b 100644 --- a/packages/skin-museum-client/src/SkinTable.js +++ b/packages/skin-museum-client/src/SkinTable.js @@ -18,6 +18,7 @@ const SkinTable = ({ getSkinData, searchQuery, loadingSearchQuery, + searchResultsError, }) => { function itemKey({ columnIndex, rowIndex }) { const { requestToken, data: skin } = getSkinData({ @@ -90,7 +91,7 @@ const SkinTable = ({ paddingTop: 40, }} > - No skins matching "{searchQuery}" + {searchResultsError ?? `No skins matching "${searchQuery}"`} )} @@ -103,6 +104,7 @@ const mapStateToProps = (state) => ({ getSkinData: Selectors.getSkinDataGetter(state), searchQuery: Selectors.getSearchQuery(state), loadingSearchQuery: Selectors.getLoadingSearchQuery(state), + searchResultsError: Selectors.getSearchResultsError(state), }); const mapDispatchToProps = (dispatch) => ({ diff --git a/packages/skin-museum-client/src/redux/actionCreators.js b/packages/skin-museum-client/src/redux/actionCreators.js index 2753a7d8..53d1ae2a 100644 --- a/packages/skin-museum-client/src/redux/actionCreators.js +++ b/packages/skin-museum-client/src/redux/actionCreators.js @@ -35,6 +35,10 @@ export function gotNewMatchingSkins(skins) { return { type: "GOT_NEW_MATCHING_SKINS", skins }; } +export function gotSearchError() { + return { type: "GOT_SEARCH_ERROR" }; +} + export function gotSkinData(hash, data) { return { type: "GOT_SKIN_DATA", hash, data }; } diff --git a/packages/skin-museum-client/src/redux/epics.js b/packages/skin-museum-client/src/redux/epics.js index be17f00c..f59a7663 100644 --- a/packages/skin-museum-client/src/redux/epics.js +++ b/packages/skin-museum-client/src/redux/epics.js @@ -157,6 +157,9 @@ const searchEpic = (actions) => nsfw: hit.nsfw === true || hit.nsfw === 1, })); return Actions.gotNewMatchingSkins(matchingSkins); + }), + catchError((e) => { + return of(Actions.gotSearchError()); }) ); }) diff --git a/packages/skin-museum-client/src/redux/reducer.js b/packages/skin-museum-client/src/redux/reducer.js index 75429e9d..0bdc9f9c 100644 --- a/packages/skin-museum-client/src/redux/reducer.js +++ b/packages/skin-museum-client/src/redux/reducer.js @@ -3,6 +3,7 @@ import { CHUNK_SIZE, UPLOAD_PAGE } from "../constants"; const defaultState = { searchQuery: null, loadingSearchResults: false, + searchResultsError: null, selectedSkinPosition: null, matchingSkins: null, defaultSkins: [], @@ -216,11 +217,21 @@ export default function reducer(state = defaultState, action) { return { ...state, loadingSearchResults: true, + searchResultsError: null, searchQuery: action.query, selectedSkinHash: null, selectedSkinPosition: null, focusedSkinFile: null, }; + case "GOT_SEARCH_ERROR": { + return { + ...state, + loadingSearchResults: false, + searchResultsError: + "Error: We likely exceeded our search quota. Please try again later.", + matchingSkins: [], + }; + } case "GOT_NEW_MATCHING_SKINS": let newSkins = state.skins; if (action.skins != null) { @@ -235,6 +246,7 @@ export default function reducer(state = defaultState, action) { return { ...state, loadingSearchResults: false, + searchResultsError: null, matchingSkins: action.skins, skins: newSkins, }; diff --git a/packages/skin-museum-client/src/redux/selectors.js b/packages/skin-museum-client/src/redux/selectors.js index 165b7912..b5885f5e 100644 --- a/packages/skin-museum-client/src/redux/selectors.js +++ b/packages/skin-museum-client/src/redux/selectors.js @@ -31,6 +31,10 @@ export function getLoadingSearchQuery(state) { return state.loadingSearchResults; } +export function getSearchResultsError(state) { + return state.searchResultsError; +} + export function getMatchingSkins(state) { return state.matchingSkins; }