diff --git a/src/pages/Challanges/Challenges.js b/src/pages/Challanges/Challenges.js
index 142ba92..aba0c4e 100644
--- a/src/pages/Challanges/Challenges.js
+++ b/src/pages/Challanges/Challenges.js
@@ -1,19 +1,13 @@
import React from 'react';
-import { Body, H1 } from '../../utils/fonts';
-import { FlexColumn, FlexRow, Svg } from '../../utils/containers';
-import Search from '../../components/generic/Search';
-import Pager from '../../components/generic/Pager';
-import challengeSearchQueryHandler from './challengeSearchQueryHandler';
-import renderChallenges from './renderChallenges';
import Media from 'react-media';
import theme from '../../utils/theme';
-import cupIco from '../../assets/cup_ico.svg';
import getChallenges from '../../api/getChallenges';
-import { CALC_PAGES, CHALLENGES_STATUS_FILTER } from '../../utils/globals';
-import Loading from '../../components/generic/Loading';
-import ChallengesStyle from './ChallengesStyle';
+import { CHALLENGES_STATUS_FILTER } from '../../utils/globals';
import FiltersMenu from '../../components/challenges_list/FiltersMenu';
import statusFilter from './statusFilter';
+import ChallengesMobile from './ChallengesMobile';
+import ChallengesDesktop from './ChallengesDesktop';
+import challengeSearchQueryHandler from './challengeSearchQueryHandler';
const Challenges = () => {
const [pageNr, setPageNr] = React.useState(1);
@@ -79,85 +73,32 @@ const Challenges = () => {
);
};
- const mobileRender = () => {
- return (
- <>
- {filtersMenuRender(
- filtersMenu ? '0' : '100vw',
- filtersMenu ? '1' : '0',
- 'flex'
- )}
-
-
- Challenges
-
-
-
- {renderChallenges(pageNr, challengesFiltered)}
-
-
- {!loading && (
-
- )}
-
-
- );
- };
-
- const desktopRender = () => {
- return (
- <>
- {filtersMenuRender()}
-
-
-
-
- Challenges
-
- Increase your machine learning skills by competing in our
- exciting challenges.
-
-
-
-
-
-
-
- {renderChallenges(pageNr, challengesFiltered)}
-
-
- {!loading && (
-
- )}
-
-
- );
- };
-
return (
<>
- {mobileRender()}
- {desktopRender()}
+
+
+
+
+
+
);
};
diff --git a/src/pages/Challanges/ChallengesDesktop.js b/src/pages/Challanges/ChallengesDesktop.js
new file mode 100644
index 0000000..ac096b9
--- /dev/null
+++ b/src/pages/Challanges/ChallengesDesktop.js
@@ -0,0 +1,51 @@
+import React from 'react';
+import ChallengesStyle from './ChallengesStyle';
+import { FlexColumn, FlexRow } from '../../utils/containers';
+import Pager from '../../components/generic/Pager';
+import { H1, Body } from '../../utils/fonts';
+import Search from '../../components/generic/Search';
+import { CALC_PAGES } from '../../utils/globals';
+import renderChallenges from './renderChallenges';
+import Loading from '../../components/generic/Loading';
+import cupIco from '../../assets/cup_ico.svg';
+import { Svg } from '../../utils/containers';
+
+const ChallengesDesktop = (props) => {
+ return (
+ <>
+ {props.filtersMenuRender()}
+
+
+
+
+ Challenges
+
+ Increase your machine learning skills by competing in our
+ exciting challenges.
+
+
+
+
+
+
+
+ {renderChallenges(props.pageNr, props.challengesFiltered)}
+
+
+ {!props.loading && (
+
+ )}
+
+
+ );
+};
+
+export default ChallengesDesktop;
diff --git a/src/pages/Challanges/ChallengesMobile.js b/src/pages/Challanges/ChallengesMobile.js
new file mode 100644
index 0000000..fabd7d6
--- /dev/null
+++ b/src/pages/Challanges/ChallengesMobile.js
@@ -0,0 +1,48 @@
+import React from 'react';
+import ChallengesStyle from './ChallengesStyle';
+import { FlexColumn } from '../../utils/containers';
+import Pager from '../../components/generic/Pager';
+import { H1 } from '../../utils/fonts';
+import Search from '../../components/generic/Search';
+import { CALC_PAGES } from '../../utils/globals';
+import renderChallenges from './renderChallenges';
+import Loading from '../../components/generic/Loading';
+
+const ChallengesMobile = (props) => {
+ return (
+ <>
+ {props.filtersMenuRender(
+ props.filtersMenu ? '0' : '100vw',
+ props.filtersMenu ? '1' : '0',
+ 'flex'
+ )}
+
+
+ Challenges
+
+
+
+ {renderChallenges(props.pageNr, props.challengesFiltered)}
+
+
+ {!props.loading && (
+
+ )}
+
+
+ );
+};
+
+export default ChallengesMobile;