challenge listing

.circleci/config.yml

@@ -343,6 +343,7 @@ workflows:
             branches:
               only:
                 - develop
+                - new-challenge-listing
       # This is alternate dev env for parallel testing
       - "build-test":
           context : org-global      

__tests__/shared/components/SortingSelectBar.jsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import Renderer from 'react-test-renderer/shallow';
-import TU from 'react-dom/test-utils';
 import SortingSelectBar from 'components/SortingSelectBar';
 
 const mockData = {
@@ -30,21 +29,3 @@ test('Matches shallow shapshot', () => {
   ));
   expect(renderer.getRenderOutput()).toMatchSnapshot();
 });
-
-class Wrapper extends React.Component {
-  componentDidMount() {}
-
-  render() {
-    return <SortingSelectBar {...this.props} />;
-  }
-}
-
-const instance = TU.renderIntoDocument((<Wrapper {...mockData} />));
-
-test('Render properly', () => {
-  const dropdown = TU.findAllInRenderedTree(instance, item => item && item.className && item.className.match('Select-control'));
-  TU.Simulate.touchEnd(dropdown[0]);
-  const options = TU.findAllInRenderedTree(instance, item => item && item.className && item.className.match('Select-option'));
-  expect(options).toHaveLength(1);
-  TU.Simulate.click(options[0]);
-});

__tests__/shared/components/__snapshots__/SortingSelectBar.jsx.snap

@@ -12,44 +12,10 @@ exports[`Matches shallow shapshot 1`] = `
   <div
     className="src-shared-components-SortingSelectBar-___style__view-options-toggle-container___1N4rY"
   >
-    <p
-      className="src-shared-components-SortingSelectBar-___style__view-options-toggle-container-label___1bC9s"
-    >
-      Sort by:
-    </p>
     <Select
       arrowRenderer={[Function]}
-      autosize={true}
-      backspaceRemoves={true}
-      backspaceToRemoveMessage="Press backspace to remove {label}"
-      clearAllText="Clear all"
-      clearRenderer={[Function]}
-      clearValueText="Clear value"
       clearable={false}
-      closeOnSelect={true}
-      deleteRemoves={true}
-      delimiter=","
-      disabled={false}
-      escapeClearsValue={true}
-      filterOptions={[Function]}
-      ignoreAccents={true}
-      ignoreCase={true}
-      inputProps={Object {}}
-      isLoading={false}
-      joinValues={false}
-      labelKey="label"
-      matchPos="any"
-      matchProp="any"
-      menuBuffer={0}
-      menuRenderer={[Function]}
-      multi={false}
-      noResultsText="No results found"
-      onBlurResetsInput={true}
       onChange={[Function]}
-      onCloseResetsInput={true}
-      onSelectResetsInput={true}
-      openOnClick={true}
-      optionComponent={[Function]}
       options={
         Array [
           Object {
@@ -58,19 +24,10 @@ exports[`Matches shallow shapshot 1`] = `
           },
         ]
       }
-      pageSize={5}
       placeholder="Select an option"
-      removeSelected={true}
-      required={false}
-      rtl={false}
-      scrollMenuIntoView={true}
       searchable={false}
-      simpleValue={false}
-      tabSelectsValue={true}
-      trimFilter={true}
+      selectRef={[Function]}
       value={null}
-      valueComponent={[Function]}
-      valueKey="value"
     />
   </div>
 </div>

__tests__/shared/components/challenge-listing/Filters/__snapshots__/ChallengeSearchBar.jsx.snap

@@ -25,9 +25,10 @@ exports[`Matches shallow shapshot 1`] = `
       >
         <ZoomIcon
           className="src-shared-components-challenge-listing-Filters-ChallengeSearchBar-___style__zoomIcon___3d_cL"
-          height="16"
-          viewBox="0 0 16 16"
-          width="16"
+          fill="none"
+          height="12"
+          viewBox="0 0 12 12"
+          width="12"
           xmlns="http://www.w3.org/2000/svg"
         />
       </span>
@@ -61,9 +62,10 @@ exports[`Matches shallow shapshot 2`] = `
       >
         <ZoomIcon
           className="src-shared-components-challenge-listing-Filters-ChallengeSearchBar-___style__zoomIcon___3d_cL"
-          height="16"
-          viewBox="0 0 16 16"
-          width="16"
+          fill="none"
+          height="12"
+          viewBox="0 0 12 12"
+          width="12"
           xmlns="http://www.w3.org/2000/svg"
         />
       </span>

__tests__/shared/components/challenge-listing/Filters/__snapshots__/FiltersPanel.jsx.snap

@@ -1,21 +1,18 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Matches shallow shapshot 1`] = `
-<div
+<Button
   className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__filter-btn___1f3VV"
+  disabled={false}
+  isInverted={false}
+  isPrimary={false}
   onClick={[Function]}
   onKeyDown={[Function]}
   role="button"
   tabIndex={0}
 >
-  <FiltersIcon
-    className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__FiltersIcon___taLss"
-    height="16"
-    viewBox="0 0 16 16"
-    width="16"
-  />
-   More Filters
-</div>
+  More Filters
+</Button>
 `;
 
 exports[`Matches shallow shapshot 2`] = `
@@ -47,6 +44,31 @@ exports[`Matches shallow shapshot 2`] = `
   <div
     className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__filters___3um3W"
   >
+    <div
+      className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__filter-row___2Vfd_"
+    >
+      <div
+        className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__search-bar___15MSx"
+      >
+        <Connect(Container)
+          setFilterState={[MockFunction]}
+        />
+      </div>
+    </div>
+    <div
+      className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__filter-row___2Vfd_"
+    >
+      <div
+        className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__bucket-selector-mobile___JbE2n"
+      >
+        <BucketSelector
+          disabled={false}
+          expanding={false}
+          isAuth={false}
+          past={false}
+        />
+      </div>
+    </div>
     <div
       className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__filter-row___2Vfd_"
     >
@@ -56,7 +78,7 @@ exports[`Matches shallow shapshot 2`] = `
         <span
           className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__label___3W9TU"
         >
-          Track
+          Challenge Category
         </span>
         <div
           className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__switches___10Wrx"
@@ -70,8 +92,8 @@ exports[`Matches shallow shapshot 2`] = `
               composeAdhocTheme="deeply"
               composeContextTheme="softly"
               enabled={false}
-              labelAfter=""
-              labelBefore="Design"
+              labelAfter="Design"
+              labelBefore=""
               mapThemrProps={[Function]}
               onSwitch={[Function]}
               themePriority="adhoc-context-default"
@@ -86,8 +108,8 @@ exports[`Matches shallow shapshot 2`] = `
               composeAdhocTheme="deeply"
               composeContextTheme="softly"
               enabled={false}
-              labelAfter=""
-              labelBefore="Development"
+              labelAfter="Development"
+              labelBefore=""
               mapThemrProps={[Function]}
               onSwitch={[Function]}
               themePriority="adhoc-context-default"
@@ -102,8 +124,8 @@ exports[`Matches shallow shapshot 2`] = `
               composeAdhocTheme="deeply"
               composeContextTheme="softly"
               enabled={false}
-              labelAfter=""
-              labelBefore="Data Science"
+              labelAfter="Data Science"
+              labelBefore=""
               mapThemrProps={[Function]}
               onSwitch={[Function]}
               themePriority="adhoc-context-default"
@@ -118,8 +140,8 @@ exports[`Matches shallow shapshot 2`] = `
               composeAdhocTheme="deeply"
               composeContextTheme="softly"
               enabled={false}
-              labelAfter=""
-              labelBefore="QA"
+              labelAfter="QA"
+              labelBefore=""
               mapThemrProps={[Function]}
               onSwitch={[Function]}
               themePriority="adhoc-context-default"
@@ -137,7 +159,7 @@ exports[`Matches shallow shapshot 2`] = `
         <span
           className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__label___3W9TU"
         >
-          Type
+          Challenge Type
         </span>
         <div
           className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__checkboxes___3ukXp"
@@ -154,12 +176,13 @@ exports[`Matches shallow shapshot 2`] = `
           className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__label___3W9TU"
           htmlFor="community-select"
         >
-          Sub community
+          Sub communities
           <input
             type="hidden"
           />
         </label>
         <Select
+          arrowRenderer={[Function]}
           autoBlur={true}
           clearable={false}
           id="community-select"
@@ -187,29 +210,21 @@ exports[`Matches shallow shapshot 2`] = `
   <div
     className="src-shared-components-challenge-listing-Filters-FiltersPanel-___style__buttons___2r3xW"
   >
-    <ThemedButton
-      active={false}
-      composeAdhocTheme="deeply"
+    <Button
       composeContextTheme="softly"
       disabled={false}
-      enforceA={false}
-      mapThemrProps={[Function]}
+      isInverted={false}
+      isPrimary={false}
       onClick={[Function]}
-      onMouseDown={null}
-      openNewTab={false}
-      replace={false}
-      size="sm"
       theme={
         Object {
           "button": undefined,
         }
       }
       themePriority="adhoc-default-context"
-      to={null}
-      type="button"
     >
-      Clear filters
-    </ThemedButton>
+      RESET FILTERS
+    </Button>
   </div>
 </div>
 `;

__tests__/shared/components/challenge-listing/Sidebar/__snapshots__/index.jsx.snap

@@ -4,29 +4,10 @@ exports[`Matches shallow shapshot 1`] = `
 <div
   className="src-shared-components-challenge-listing-Sidebar-___style__SideBarFilters___3XfDi"
 >
-  <ul
-    className="src-shared-components-challenge-listing-Sidebar-___style__StatusBar___3d-0u"
-  >
-    <li
-      className="src-shared-components-challenge-listing-Sidebar-___style__Status___2_KAp src-shared-components-challenge-listing-Sidebar-___style__active___2oOZN"
-      onClick={[Function]}
-      onKeyDown={[Function]}
-      role="presentation"
-    >
-      Active
-    </li>
-    <li
-      className="src-shared-components-challenge-listing-Sidebar-___style__Status___2_KAp"
-      onClick={[Function]}
-      onKeyDown={[Function]}
-      role="presentation"
-    >
-      Past Challenges
-    </li>
-  </ul>
   <div
     className="src-shared-components-challenge-listing-Sidebar-___style__FilterBox___2Fea8"
   >
+    <Connect(Container) />
     <BucketSelector
       activeBucket="activeBucket"
       disabled={false}
@@ -43,29 +24,10 @@ exports[`Matches shallow shapshot 2`] = `
 <div
   className="src-shared-components-challenge-listing-Sidebar-___style__SideBarFilters___3XfDi"
 >
-  <ul
-    className="src-shared-components-challenge-listing-Sidebar-___style__StatusBar___3d-0u"
-  >
-    <li
-      className="src-shared-components-challenge-listing-Sidebar-___style__Status___2_KAp src-shared-components-challenge-listing-Sidebar-___style__active___2oOZN"
-      onClick={[Function]}
-      onKeyDown={[Function]}
-      role="presentation"
-    >
-      Active
-    </li>
-    <li
-      className="src-shared-components-challenge-listing-Sidebar-___style__Status___2_KAp"
-      onClick={[Function]}
-      onKeyDown={[Function]}
-      role="presentation"
-    >
-      Past Challenges
-    </li>
-  </ul>
   <div
     className="src-shared-components-challenge-listing-Sidebar-___style__FilterBox___2Fea8"
   >
+    <Connect(Container) />
     <BucketSelector
       activeBucket="activeBucket"
       disabled={false}

__tests__/shared/components/challenge-listing/__snapshots__/LeaderboardAvatar.jsx.snap

@@ -30,7 +30,6 @@ exports[`Matches shallow shapshot 1`] = `
       }
     }
     onClick={null}
-    plusOne={false}
     url="url"
   />
 </Router>