From 5cca6d3f2788079010d195f497e168586f2e0d40 Mon Sep 17 00:00:00 2001 From: Nguyen Viet Date: Tue, 16 Nov 2021 18:37:42 +0700 Subject: [PATCH 01/18] issue #143 --- src/routers/challenge-list/index.jsx | 19 ++++++++++++++----- src/utils/lifeCycle.js | 14 +++++++++----- src/utils/url.js | 8 ++++++-- 3 files changed, 29 insertions(+), 12 deletions(-) diff --git a/src/routers/challenge-list/index.jsx b/src/routers/challenge-list/index.jsx index 49bcaa2..b0b593d 100644 --- a/src/routers/challenge-list/index.jsx +++ b/src/routers/challenge-list/index.jsx @@ -9,7 +9,7 @@ import { FeedbackButton, showMenu } from "@topcoder/micro-frontends-earn-app"; import actions from "../../actions"; import * as utils from "../../utils"; import store from "../../store"; -import { initialChallengeFilter } from "../..//reducers/filter"; +import { initialChallengeFilter } from "../../reducers/filter"; import _ from "lodash"; import "react-date-range/dist/theme/default.css"; @@ -29,10 +29,19 @@ const App = () => { useEffect(() => { if (!location.search) { - store.dispatch(actions.challenges.getChallengesInit()); - store.dispatch( - actions.challenges.getChallengesDone(initialChallengeFilter) - ); + const currentFilter = store.getState().filter.challenge; + const diff = !_.isEqual(initialChallengeFilter, currentFilter); + + if (diff) { + const params = utils.challenge.createChallengeParams(currentFilter); + utils.url.updateQuery(params, true); + } else { + store.dispatch(actions.challenges.getChallengesInit()); + store.dispatch( + actions.challenges.getChallengesDone(currentFilter) + ); + } + return; } diff --git a/src/utils/lifeCycle.js b/src/utils/lifeCycle.js index 735a9c3..538b41e 100644 --- a/src/utils/lifeCycle.js +++ b/src/utils/lifeCycle.js @@ -5,19 +5,23 @@ import * as utils from "../utils"; export default function appInit() { let initialQuery; let urlPath; + let firstMounted = true; function bootstrap() { return Promise.resolve().then(() => { initialQuery = window.location.search; - urlPath = window.location.pathname; + urlPath = utils.url.removeTrailingSlash(window.location.pathname); }); } function mount() { - if (initialQuery) { - const params = utils.url.parseUrlQuery(initialQuery); - const filter = utils.challenge.createChallengeFilter(params); - store.dispatch(action.initApp(filter)); + if (firstMounted) { + if (initialQuery && urlPath === '/earn/find/challenges') { + const params = utils.url.parseUrlQuery(initialQuery); + const filter = utils.challenge.createChallengeFilter(params); + store.dispatch(action.initApp(filter)); + } + firstMounted = false; } return Promise.resolve(); diff --git a/src/utils/url.js b/src/utils/url.js index 501c761..97844fd 100644 --- a/src/utils/url.js +++ b/src/utils/url.js @@ -31,12 +31,16 @@ export function parseUrlQuery(queryString) { return qs.parse(queryString, { ignoreQueryPrefix: true }); } -export function updateQuery(params) { +export function updateQuery(params, replace = false) { const oldQuery = decodeURIComponent(window.location.search); let query = buildQueryString(params); query = `?${query.substring(1).split("&").sort().join("&")}`; if (query !== oldQuery) { - window.history.pushState(window.history.state, "", query); + if (replace) { + window.history.replaceState(window.history.state, "", query); + } else { + window.history.pushState(window.history.state, "", query); + } } } From 3027d21cac9ff74659bf6c2d67cbc5fbc3ab90d5 Mon Sep 17 00:00:00 2001 From: yoution Date: Tue, 16 Nov 2021 23:20:22 +0800 Subject: [PATCH 02/18] fix: issue #76 --- src/containers/Challenges/Listing/index.jsx | 58 +++++++++++---------- src/containers/Challenges/index.jsx | 4 +- 2 files changed, 31 insertions(+), 31 deletions(-) diff --git a/src/containers/Challenges/Listing/index.jsx b/src/containers/Challenges/Listing/index.jsx index 17a0ec5..05381b4 100644 --- a/src/containers/Challenges/Listing/index.jsx +++ b/src/containers/Challenges/Listing/index.jsx @@ -3,6 +3,7 @@ import PT from "prop-types"; import _ from "lodash"; import moment from "moment"; import Panel from "../../../components/Panel"; +import ChallengeError from "../Listing/errors/ChallengeError"; import Pagination from "../../../components/Pagination"; import ChallengeItem from "./ChallengeItem"; import TextInput from "../../../components/TextInput"; @@ -101,38 +102,39 @@ const Listing = ({ - - {challenges.map((challenge, index) => ( -
- { - const filterChange = { tags: [tag] }; - updateFilter(filterChange); - }} - onClickTrack={(track) => { - const filterChange = { tracks: [track] }; + {challenges.length ? + + {challenges.map((challenge, index) => ( +
+ { + const filterChange = { tags: [tag] }; + updateFilter(filterChange); + }} + onClickTrack={(track) => { + const filterChange = { tracks: [track] }; + updateFilter(filterChange); + }} + isLoggedIn={isLoggedIn} + /> +
+ ))} +
+ { + const filterChange = { + page: utils.pagination.pageIndexToPage(event.pageIndex), + perPage: event.pageSize, + }; updateFilter(filterChange); }} - isLoggedIn={isLoggedIn} />
- ))} -
- { - const filterChange = { - page: utils.pagination.pageIndexToPage(event.pageIndex), - perPage: event.pageSize, - }; - updateFilter(filterChange); - }} - /> -
- + : } ); }; diff --git a/src/containers/Challenges/index.jsx b/src/containers/Challenges/index.jsx index cb1a484..deb1cfd 100644 --- a/src/containers/Challenges/index.jsx +++ b/src/containers/Challenges/index.jsx @@ -3,7 +3,6 @@ import PT from "prop-types"; import { connect } from "react-redux"; import Listing from "./Listing"; import actions from "../../actions"; -import ChallengeError from "./Listing/errors/ChallengeError"; // import ChallengeRecommendedError from "./Listing/errors/ChallengeRecommendedError"; import * as constants from "../../constants"; import IconListView from "../../assets/icons/list-view.svg"; @@ -70,8 +69,7 @@ const Challenges = ({ - {challenges.length === 0 && initialized && } - {challenges.length > 0 && ( + {initialized && ( <> {/*noRecommendedChallenges && */} Date: Tue, 16 Nov 2021 23:03:06 +0800 Subject: [PATCH 03/18] fix: issue #85 --- src/components/DropdownTerms/index.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/DropdownTerms/index.jsx b/src/components/DropdownTerms/index.jsx index 5b3ced8..c5ca31c 100644 --- a/src/components/DropdownTerms/index.jsx +++ b/src/components/DropdownTerms/index.jsx @@ -52,7 +52,7 @@ function DropdownTerms({ }, [focused, selectedOption]); useEffect(() => { setInternalTerms(terms); - }, [terms]); + }, [terms && terms.length]); const CustomReactSelectRow = React.forwardRef( ({ className, option, children, onSelect }, ref) => From 9d2b365f2f45bb1701a6c26b6576f6c43b2e72fd Mon Sep 17 00:00:00 2001 From: LieutenantRoger Date: Wed, 17 Nov 2021 01:51:20 +0800 Subject: [PATCH 04/18] ci:deploying --- .circleci/config.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.circleci/config.yml b/.circleci/config.yml index 4be26f9..eddbd3b 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -77,7 +77,7 @@ workflows: branches: only: - dev - - submission-page + - challenges-bug-bash # Production builds are exectuted only on tagged commits to the # master branch. From 119c77ece27d81344545a631da8f0bb3b3714fa8 Mon Sep 17 00:00:00 2001 From: Shivam Kumar Singh Date: Tue, 16 Nov 2021 20:41:03 +0530 Subject: [PATCH 05/18] Fixes #95 --- src/components/challenge-detail/Submissions/index.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/challenge-detail/Submissions/index.jsx b/src/components/challenge-detail/Submissions/index.jsx index 7317378..6c17173 100644 --- a/src/components/challenge-detail/Submissions/index.jsx +++ b/src/components/challenge-detail/Submissions/index.jsx @@ -206,8 +206,8 @@ class SubmissionsComponent extends React.Component { valueA = getFinalScore(a); valueB = getFinalScore(b); } else { - valueA = !_.isEmpty(a.review) && a.review[0].score; - valueB = !_.isEmpty(b.review) && b.review[0].score; + valueA = !_.isEmpty(a.review) ? a.review[0].score : 0; + valueB = !_.isEmpty(b.review) ? b.review[0].score : 0; } break; } From 6a346435580753be9bd71e7e35759dd710c4d23e Mon Sep 17 00:00:00 2001 From: Nguyen Viet Date: Wed, 17 Nov 2021 13:25:24 +0700 Subject: [PATCH 06/18] issue #75 --- src/components/Pagination/index.jsx | 80 ++++++++++++++--------------- 1 file changed, 39 insertions(+), 41 deletions(-) diff --git a/src/components/Pagination/index.jsx b/src/components/Pagination/index.jsx index 1d7835b..184b815 100644 --- a/src/components/Pagination/index.jsx +++ b/src/components/Pagination/index.jsx @@ -1,4 +1,4 @@ -import React, { useEffect, useRef, useState } from "react"; +import React, { useMemo, useRef } from "react"; import PT from "prop-types"; import Dropdown from "../Dropdown"; import { @@ -12,6 +12,20 @@ import "./styles.scss"; const N = PAGINATION_MAX_PAGE_DISPLAY; +const createDisplayPages = (p, n) => { + const pages = []; + for ( + let start = utils.clamp(p - N, 0, n), + end = utils.clamp(p + N, 0, n), + i = start; + i < end; + i += 1 + ) { + pages.push(i); + } + return pages.slice(-N); +}; + /** * Pagination with the first page index being as 0 and the last page index being as `total - 1` */ @@ -20,24 +34,6 @@ const Pagination = ({ length, pageIndex, pageSize, onChange }) => { const perPageOptions = utils.createDropdownOptions(PAGINATION_PER_PAGES); utils.setSelectedDropdownOption(perPageOptions, `${pageSize}`); - const createDisplayPages = (p, n) => { - const pages = []; - for ( - let start = utils.clamp(p - N, 0, n), - end = utils.clamp(p + N, 0, n), - i = start; - i < end; - i += 1 - ) { - pages.push(i); - } - return pages.slice(-N); - }; - - const [displayPages, setDisplayPages] = useState( - createDisplayPages(pageIndex, total) - ); - const onChangePageSize = (options) => { const selectedOption = utils.getSelectedDropdownOption(options); const newPageSize = +selectedOption.label; @@ -59,33 +55,35 @@ const Pagination = ({ length, pageIndex, pageSize, onChange }) => { } }; - const latestPropsRef = useRef(null); - latestPropsRef.current = { displayPages, pageIndex }; + const propsRef = useRef(); + propsRef.current = { pageIndex }; - useEffect(() => { + const displayPages = useMemo(() => { const newTotal = Math.ceil(length / pageSize); - const _pageIndex = latestPropsRef.current.pageIndex; - setDisplayPages(createDisplayPages(_pageIndex, newTotal)); + const initDisplayPages = createDisplayPages(propsRef.current.pageIndex, newTotal); + return initDisplayPages; }, [length, pageSize]); - useEffect(() => { - const _displayPages = latestPropsRef.current.displayPages; - const start = _displayPages[0]; - const end = _displayPages[_displayPages.length - 1]; - const updateDisplayPages = []; - if (pageIndex < start) { - for (let i = pageIndex; i < pageIndex + N; i += 1) { - updateDisplayPages.push(i); - } - setDisplayPages(updateDisplayPages); - } else if (pageIndex > end) { - for (let i = pageIndex; i > pageIndex - N; i -= 1) { - updateDisplayPages.unshift(i); + const updateDisplayPages = useMemo(() => { + const start = displayPages[0]; + const end = displayPages[displayPages.length - 1]; + + const _updateDisplayPages = []; + if (pageIndex < start) { + for (let i = pageIndex; i < pageIndex + N; i += 1) { + _updateDisplayPages.push(i); + } + } else if (pageIndex > end) { + for (let i = pageIndex; i > pageIndex - N; i -= 1) { + _updateDisplayPages.unshift(i); + } + } else { + _updateDisplayPages.push(...displayPages); } - setDisplayPages(updateDisplayPages); - } - }, [pageIndex]); + + return _updateDisplayPages; + }, [pageIndex, displayPages]); const formatPage = (p) => `${p + 1}`; @@ -107,7 +105,7 @@ const Pagination = ({ length, pageIndex, pageSize, onChange }) => { PREVIOUS - {displayPages.map((p) => ( + {updateDisplayPages.map((p) => (
    • - {updateDisplayPages.map((p) => ( + {displayPages.map((p) => (
    • - {challenges.length ? + {challenges.length ? {challenges.map((challenge, index) => (
    From 9ee11d156fba0d1cd023bd4ad983aa34609302fd Mon Sep 17 00:00:00 2001 From: Nguyen Viet Date: Tue, 16 Nov 2021 23:21:44 +0700 Subject: [PATCH 09/18] issue #97 --- .../Submission/Submit/Uploading/index.jsx | 18 ++++++++++++++++-- src/containers/challenge-detail/index.jsx | 13 +++++++++++++ 2 files changed, 29 insertions(+), 2 deletions(-) diff --git a/src/containers/Submission/Submit/Uploading/index.jsx b/src/containers/Submission/Submit/Uploading/index.jsx index 8c712dd..4f77bed 100644 --- a/src/containers/Submission/Submit/Uploading/index.jsx +++ b/src/containers/Submission/Submit/Uploading/index.jsx @@ -1,6 +1,6 @@ -import React from "react"; +import React, { useEffect, useRef } from "react"; import PT from "prop-types"; -import { Link } from "@reach/router"; +import { Link, navigate } from "@reach/router"; import { PrimaryButton, DefaultButton as Button } from "components/Buttons"; import { COMPETITION_TRACKS, CHALLENGES_URL } from "../../../../constants"; import RobotHappy from "assets/icons/robot-happy.svg"; @@ -20,6 +20,20 @@ const Uploading = ({ uploadProgress, back, }) => { + const propsRef = useRef(); + propsRef.current = { submitDone, challengeId }; + + useEffect(() => { + return () => { + if (propsRef.current.submitDone) { + const backUrl = window.location.pathname; + if (backUrl === `${CHALLENGES_URL}/${challengeId}`) { + navigate(`${CHALLENGES_URL}/${propsRef.current.challengeId}?reload=true`); + } + } + } + }, []); + return (
    diff --git a/src/containers/challenge-detail/index.jsx b/src/containers/challenge-detail/index.jsx index b2a17b1..8af2c34 100644 --- a/src/containers/challenge-detail/index.jsx +++ b/src/containers/challenge-detail/index.jsx @@ -221,6 +221,10 @@ class ChallengeDetailPageContainer extends React.Component { challenge, // loadingRecommendedChallengesUUID, history, + loadChallengeDetails, + loadFullChallengeDetails, + isLoadingChallenge, + isLoadingTerms, } = this.props; if ( @@ -247,6 +251,15 @@ class ChallengeDetailPageContainer extends React.Component { // getAllRecommendedChallenges(auth.tokenV3, recommendedTechnology); // } + const query = new URLSearchParams(history.location.search); + const isReloading = isLoadingChallenge || isLoadingTerms; + if (query.get('reload') && !isReloading) { + history.replace(history.location.pathname, history.state); + loadChallengeDetails(nextProps.auth, challengeId, loadFullChallengeDetails); + + return; + } + const { thriveArticles } = this.state; const userId = _.get(this, "props.auth.user.userId"); const nextUserId = _.get(nextProps, "auth.user.userId"); From e43a6cf86c49a3bd6c12a88e3991044858493ad7 Mon Sep 17 00:00:00 2001 From: M Fikri A Date: Tue, 16 Nov 2021 17:17:43 +0700 Subject: [PATCH 10/18] Reset Pagination to 1 When Choosing Filter --- .../Filter/ChallengeFilter/index.jsx | 23 +++++++++++++++---- 1 file changed, 19 insertions(+), 4 deletions(-) diff --git a/src/containers/Filter/ChallengeFilter/index.jsx b/src/containers/Filter/ChallengeFilter/index.jsx index d28ff5b..bdf2f16 100644 --- a/src/containers/Filter/ChallengeFilter/index.jsx +++ b/src/containers/Filter/ChallengeFilter/index.jsx @@ -90,7 +90,10 @@ const ChallengeFilter = ({ const newTypes = checked ? types.concat(type) : types.filter((i) => i !== type); - const filterChange = { types: newTypes }; + const filterChange = { + types: newTypes, + page: 1, + }; updateFilter(filterChange); }} /> @@ -111,7 +114,10 @@ const ChallengeFilter = ({ const newTracks = checked ? tracks.concat(track) : tracks.filter((i) => i !== track); - const filterChange = { tracks: newTracks }; + const filterChange = { + tracks: newTracks, + page: 1, + }; updateFilter(filterChange); }} /> @@ -132,6 +138,7 @@ const ChallengeFilter = ({ ); const filterChange = { tags: selectedTagOptions.map((tagOption) => tagOption.label), + page: 1, }; updateFilter(filterChange); }} @@ -164,6 +171,7 @@ const ChallengeFilter = ({ } const filterChange = { totalPrizesFrom: value, + page: 1, }; updateFilter(filterChange); }) @@ -196,6 +204,7 @@ const ChallengeFilter = ({ } const filterChange = { totalPrizesTo: value, + page: 1, }; updateFilter(filterChange); }) @@ -237,7 +246,10 @@ const ChallengeFilter = ({ event !== utils.challenge.getCommunityEvent(subCommunity) ); - filterChange = { events: newEvents }; + filterChange = { + events: newEvents, + page: 1, + }; } else { const newGroups = checked ? groups.concat( @@ -248,7 +260,10 @@ const ChallengeFilter = ({ group !== utils.challenge.getCommunityGroup(subCommunity) ); - filterChange = { groups: newGroups }; + filterChange = { + groups: newGroups, + page: 1, + }; } updateFilter(filterChange); From c5a1b0c7f5c65d18e364f526190744e216e1e1e2 Mon Sep 17 00:00:00 2001 From: M Fikri A Date: Tue, 16 Nov 2021 17:19:42 +0700 Subject: [PATCH 11/18] linter --- src/containers/Submission/Submit/Header/index.jsx | 6 ++++-- src/utils/index.js | 6 +++--- 2 files changed, 7 insertions(+), 5 deletions(-) diff --git a/src/containers/Submission/Submit/Header/index.jsx b/src/containers/Submission/Submit/Header/index.jsx index 946eef2..447268a 100644 --- a/src/containers/Submission/Submit/Header/index.jsx +++ b/src/containers/Submission/Submit/Header/index.jsx @@ -1,14 +1,16 @@ import React from "react"; import PT from "prop-types"; import { Link } from "@reach/router"; -import config from '../../../../../config' +import config from "../../../../../config"; import "./styles.scss"; const Header = ({ title, challengeId }) => { return (
    - + ‹

    Back to challenge

     diff --git a/src/utils/index.js b/src/utils/index.js index b3fc4e1..05f421f 100644 --- a/src/utils/index.js +++ b/src/utils/index.js @@ -170,11 +170,11 @@ export function parseTotalPrizes(s) { if (valid) return n; } -export function triggerDownload(fileName,blob) { +export function triggerDownload(fileName, blob) { const url = window.URL.createObjectURL(new Blob([blob])); - const link = document.createElement('a'); + const link = document.createElement("a"); link.href = url; - link.setAttribute('download', fileName); + link.setAttribute("download", fileName); document.body.appendChild(link); link.click(); link.parentNode.removeChild(link); From 8c3f401afcfb1498480e0a547b972dc3f5dcb37e Mon Sep 17 00:00:00 2001 From: Nguyen Viet Date: Tue, 16 Nov 2021 14:48:47 +0700 Subject: [PATCH 12/18] issue #145 --- config/dev.js | 4 ++++ config/prod.js | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/config/dev.js b/config/dev.js index 5ca5059..632f11b 100644 --- a/config/dev.js +++ b/config/dev.js @@ -139,4 +139,8 @@ module.exports = { process.env.FILESTACK_SUBMISSION_CONTAINER || "topcoder-dev-submissions-dmz", }, + /* Time in MS to wait before refreshing challenge details after register + * and unregister. Used to allow API sufficent time to update. + */ + CHALLENGE_DETAILS_REFRESH_DELAY: 3000, }; diff --git a/config/prod.js b/config/prod.js index ab93169..bb2f09b 100644 --- a/config/prod.js +++ b/config/prod.js @@ -134,4 +134,8 @@ module.exports = { process.env.FILESTACK_SUBMISSION_CONTAINER || "topcoder-dev-submissions-dmz", }, + /* Time in MS to wait before refreshing challenge details after register + * and unregister. Used to allow API sufficent time to update. + */ + CHALLENGE_DETAILS_REFRESH_DELAY: 3000, }; From 0cc1eaf3e7e06104af9365cb6aedd7201366cd70 Mon Sep 17 00:00:00 2001 From: M Fikri A Date: Wed, 17 Nov 2021 08:09:59 +0700 Subject: [PATCH 13/18] Implement Not Found Error --- src/components/NotFoundError/index.jsx | 20 ++++++++++++++++++ src/components/NotFoundError/styles.scss | 21 +++++++++++++++++++ ...topcoder-micro-frontends-challenges-app.js | 5 ++++- src/utils/lifeCycle.js | 16 +++++++------- 4 files changed, 53 insertions(+), 9 deletions(-) create mode 100644 src/components/NotFoundError/index.jsx create mode 100644 src/components/NotFoundError/styles.scss diff --git a/src/components/NotFoundError/index.jsx b/src/components/NotFoundError/index.jsx new file mode 100644 index 0000000..4803798 --- /dev/null +++ b/src/components/NotFoundError/index.jsx @@ -0,0 +1,20 @@ +import React from "react"; +import IconNotFound from "assets/icons/not-found.png"; + +import "./styles.scss"; + +const NotFoundError = ({ message }) => ( +
    +
    + not found +
    +

    + 404 Not found +

    +

    + Sorry, we couldn’t find that page +

    +
    +); + +export default NotFoundError; diff --git a/src/components/NotFoundError/styles.scss b/src/components/NotFoundError/styles.scss new file mode 100644 index 0000000..fb8a1d4 --- /dev/null +++ b/src/components/NotFoundError/styles.scss @@ -0,0 +1,21 @@ +@import "styles/variables"; + +.not-found-error { + padding: 16px 24px; + min-height: 136px; + margin-bottom: 35px; + font-size: $font-size-sm; + line-height: 22px; + text-align: center; + background: $white; + border-radius: $border-radius-lg; + + h1 { + padding: 15px 0 10px; + margin-bottom: 20px; + } + + p { + margin-bottom: 8px; + } +} diff --git a/src/topcoder-micro-frontends-challenges-app.js b/src/topcoder-micro-frontends-challenges-app.js index bee6e7e..7d4513e 100644 --- a/src/topcoder-micro-frontends-challenges-app.js +++ b/src/topcoder-micro-frontends-challenges-app.js @@ -4,6 +4,7 @@ import ReactDOM from "react-dom"; import singleSpaReact from "single-spa-react"; import Root from "./root.component"; import appInit from "./utils/lifeCycle"; +import NotFoundError from "./components/NotFoundError"; const appLifecycles = appInit(); @@ -13,7 +14,9 @@ const lifecycles = singleSpaReact({ rootComponent: Root, errorBoundary(err, info, props) { // Customize the root error boundary for your microfrontend here. - return null; + return ( + + ); }, }); diff --git a/src/utils/lifeCycle.js b/src/utils/lifeCycle.js index 538b41e..7eed6d4 100644 --- a/src/utils/lifeCycle.js +++ b/src/utils/lifeCycle.js @@ -5,26 +5,26 @@ import * as utils from "../utils"; export default function appInit() { let initialQuery; let urlPath; - let firstMounted = true; function bootstrap() { return Promise.resolve().then(() => { initialQuery = window.location.search; - urlPath = utils.url.removeTrailingSlash(window.location.pathname); + urlPath = window.location.pathname; }); } - function mount() { - if (firstMounted) { - if (initialQuery && urlPath === '/earn/find/challenges') { + async function mount() { + try { + if (initialQuery) { const params = utils.url.parseUrlQuery(initialQuery); const filter = utils.challenge.createChallengeFilter(params); store.dispatch(action.initApp(filter)); } - firstMounted = false; + } catch (error) { + console.error(error) + } finally { + return Promise.resolve(); } - - return Promise.resolve(); } function unmount() { From 38c915de9295f9db5d3fb6210fe882429bd0ed6f Mon Sep 17 00:00:00 2001 From: M Fikri A Date: Tue, 16 Nov 2021 19:43:01 +0700 Subject: [PATCH 14/18] Prevent Trigger Change On Date Picker Input --- src/components/DateRangePicker/DateInput/index.jsx | 8 +++++++- src/components/DateRangePicker/index.jsx | 3 ++- src/components/TextInput/index.jsx | 2 +- src/containers/Challenges/Listing/index.jsx | 1 + 4 files changed, 11 insertions(+), 3 deletions(-) diff --git a/src/components/DateRangePicker/DateInput/index.jsx b/src/components/DateRangePicker/DateInput/index.jsx index 1d62dfb..1c24b70 100644 --- a/src/components/DateRangePicker/DateInput/index.jsx +++ b/src/components/DateRangePicker/DateInput/index.jsx @@ -20,6 +20,7 @@ const DateInput = ({ onClickCalendarIcon, onStartEndDateChange, placeholder, + enterToSubmit }) => { const ref = useRef(null); const [focused, setFocused] = useState(false); @@ -125,7 +126,12 @@ const DateInput = ({ size="xs" value={rangeText} onChange={(value) => { - onChangeRangeTextDebounced.current(() => onChangeRangeText(value)); + if (!enterToSubmit) { + onChangeRangeTextDebounced.current(() => onChangeRangeText(value)); + } + }} + onEnterKey={(value) => { + onChangeRangeText(value) }} placeholder={placeholder} /> diff --git a/src/components/DateRangePicker/index.jsx b/src/components/DateRangePicker/index.jsx index 64b5f52..c8f363d 100644 --- a/src/components/DateRangePicker/index.jsx +++ b/src/components/DateRangePicker/index.jsx @@ -16,7 +16,7 @@ import { } from "./helpers"; function DateRangePicker(props) { - const { id, range, onChange, placeholder } = props; + const { id, range, onChange, placeholder, enterToSubmit = false } = props; const [rangeString, setRangeString] = useState({ startDateString: "", @@ -538,6 +538,7 @@ function DateRangePicker(props) { }} onStartEndDateChange={onStartEndDateChange} placeholder={placeholder} + enterToSubmit={enterToSubmit} />
    diff --git a/src/components/TextInput/index.jsx b/src/components/TextInput/index.jsx index e543b0a..4ccca63 100644 --- a/src/components/TextInput/index.jsx +++ b/src/components/TextInput/index.jsx @@ -55,7 +55,7 @@ function TextInput({ }} onKeyPress={(e) => { if (e.key === "Enter") { - onEnterKey(); + onEnterKey(e.target.value); } }} /> diff --git a/src/containers/Challenges/Listing/index.jsx b/src/containers/Challenges/Listing/index.jsx index 0a6e7fd..c60ad6e 100644 --- a/src/containers/Challenges/Listing/index.jsx +++ b/src/containers/Challenges/Listing/index.jsx @@ -85,6 +85,7 @@ const Listing = ({ }`} > { const d = range.endDate ? moment(range.endDate).toISOString() From 0b6303692ca44065208a16ed4d8d6c5086a18c31 Mon Sep 17 00:00:00 2001 From: Nguyen Viet Date: Wed, 17 Nov 2021 02:09:41 +0700 Subject: [PATCH 15/18] issue #132 --- src/components/DateRangePicker/index.jsx | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) diff --git a/src/components/DateRangePicker/index.jsx b/src/components/DateRangePicker/index.jsx index c8f363d..81a86ca 100644 --- a/src/components/DateRangePicker/index.jsx +++ b/src/components/DateRangePicker/index.jsx @@ -344,8 +344,17 @@ function DateRangePicker(props) { const onPreviewChange = (date) => { if (!(date instanceof Date)) { setPreview(null); - setActiveDate(null); - setFocusedRange([0, focusedRange[1]]); + + // --- + // workaround for fixing issue 132: + // - set the active range's background to transparent color + // to prevent the calendar auto focusing on the day of today by default when no + // start date nor end date are set. + // - does not set the end date of the selection range as default when mouse is out. + // --- + + // setActiveDate(null); + // setFocusedRange([0, focusedRange[1]]); return; } @@ -485,7 +494,7 @@ function DateRangePicker(props) { startDate: activeDate, endDate: activeDate, key: "active", - color: "#D8FDD8", + color: preview ? "#D8FDD8" : "#D8FDD800", }, ]; } From 6b3fb8547e06855d1acac94ead7a1deca8e3de39 Mon Sep 17 00:00:00 2001 From: Nguyen Viet Date: Wed, 17 Nov 2021 03:21:22 +0700 Subject: [PATCH 16/18] issue 132: focus selection range when having value --- src/components/DateRangePicker/index.jsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/DateRangePicker/index.jsx b/src/components/DateRangePicker/index.jsx index 81a86ca..2b74d17 100644 --- a/src/components/DateRangePicker/index.jsx +++ b/src/components/DateRangePicker/index.jsx @@ -350,11 +350,13 @@ function DateRangePicker(props) { // - set the active range's background to transparent color // to prevent the calendar auto focusing on the day of today by default when no // start date nor end date are set. - // - does not set the end date of the selection range as default when mouse is out. + // - does not set focus on the empty selection range when mouse leaves. // --- // setActiveDate(null); - // setFocusedRange([0, focusedRange[1]]); + if (range.startDate || range.endDate) { + setFocusedRange([0, focusedRange[1]]); + } return; } From 57e2caf91d0c6e082518a57ecfb92e8f9c13f1fc Mon Sep 17 00:00:00 2001 From: Nguyen Viet Date: Wed, 17 Nov 2021 04:00:34 +0700 Subject: [PATCH 17/18] issue 132: fixed duration of a week having 8 days --- src/components/DateRangePicker/helpers.js | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/src/components/DateRangePicker/helpers.js b/src/components/DateRangePicker/helpers.js index cef8582..73f55d5 100644 --- a/src/components/DateRangePicker/helpers.js +++ b/src/components/DateRangePicker/helpers.js @@ -50,39 +50,40 @@ const staticRangeHandler = { * @return {object[]} list of defined ranges */ export function createStaticRanges() { - const now = moment().utcOffset(0); - const pastWeek = now.clone().subtract(1, "week"); - const pastMonth = now.clone().subtract(1, "month"); - const past6Months = now.clone().subtract(6, "month"); - const pastYear = now.clone().subtract(1, "year"); + const today = moment(); + const endOfToday = today.set({ hour: 23, minute: 59, second: 59, millisecond: 999 }); + const pastWeek = endOfToday.clone().subtract(1, "week"); + const pastMonth = endOfToday.clone().subtract(1, "month"); + const past6Months = endOfToday.clone().subtract(6, "month"); + const pastYear = endOfToday.clone().subtract(1, "year"); const ranges = [ { label: "Past Week", range: () => ({ startDate: pastWeek.startOf("day").toDate(), - endDate: now.endOf("day").toDate(), + endDate: endOfToday.toDate(), }), }, { label: "Past Month", range: () => ({ startDate: pastMonth.startOf("day").toDate(), - endDate: now.endOf("day").toDate(), + endDate: endOfToday.toDate(), }), }, { label: "Past 6 Months", range: () => ({ startDate: past6Months.startOf("day").toDate(), - endDate: now.endOf("day").toDate(), + endDate: endOfToday.toDate(), }), }, { label: "Past Year", range: () => ({ startDate: pastYear.startOf("day").toDate(), - endDate: now.endOf("day").toDate(), + endDate: endOfToday.toDate(), }), }, ]; From 9517217207a5fd0465248672bdc0cba0276a597e Mon Sep 17 00:00:00 2001 From: Nguyen Viet Date: Wed, 17 Nov 2021 23:35:43 +0700 Subject: [PATCH 18/18] =resolve merge conflict --- src/utils/lifeCycle.js | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/src/utils/lifeCycle.js b/src/utils/lifeCycle.js index 7eed6d4..b363e48 100644 --- a/src/utils/lifeCycle.js +++ b/src/utils/lifeCycle.js @@ -5,20 +5,24 @@ import * as utils from "../utils"; export default function appInit() { let initialQuery; let urlPath; + let firstMounted = true; function bootstrap() { return Promise.resolve().then(() => { initialQuery = window.location.search; - urlPath = window.location.pathname; + urlPath = utils.url.removeTrailingSlash(window.location.pathname); }); } async function mount() { try { - if (initialQuery) { - const params = utils.url.parseUrlQuery(initialQuery); - const filter = utils.challenge.createChallengeFilter(params); - store.dispatch(action.initApp(filter)); + if (firstMounted) { + if (initialQuery && urlPath === '/earn/find/challenges') { + const params = utils.url.parseUrlQuery(initialQuery); + const filter = utils.challenge.createChallengeFilter(params); + store.dispatch(action.initApp(filter)); + } + firstMounted = false; } } catch (error) { console.error(error)