From 214a20b029afc32b1be885533cb56f21377b2375 Mon Sep 17 00:00:00 2001
From: "Dr. Sergey Pogodin" <dr.pogodin@gmail.com>
Date: Fri, 16 Jun 2017 15:40:26 +0200
Subject: [PATCH 1/6] Misc fixes related to challenge listing

---
 .../__snapshots__/index.jsx.snap              | 15 ++++---
 .../components/TopcoderHeader/index.jsx       |  4 ++
 .../__snapshots__/Header.jsx.snap             |  2 +
 .../__snapshots__/TopcoderHeader.jsx.snap     |  1 +
 .../__snapshots__/Page.jsx.snap               |  1 +
 __tests__/shared/reducers/topcoder_header.js  |  4 +-
 src/shared/actions/topcoder_header.js         | 15 +++++++
 src/shared/components/{Select => }/Select.jsx |  0
 src/shared/components/Select/index.js         |  3 --
 .../desktop/SubMenu/Item/index.jsx            | 12 +++++-
 .../desktop/SubMenu/Item/style.scss           |  4 ++
 .../TopcoderHeader/desktop/SubMenu/index.jsx  | 17 +++++++-
 .../components/TopcoderHeader/index.jsx       | 42 +++++++++++--------
 .../components/TopcoderHeader/style.scss      | 15 ++++---
 .../ChallengeStatus/index.jsx                 |  4 +-
 .../Filters/ChallengeFilters.jsx              |  3 +-
 .../Filters/ChallengeSearchBar/style.scss     |  7 ++++
 .../Filters/FiltersPanel/index.jsx            |  7 ++--
 .../Filters/FiltersPanel/style.scss           |  4 ++
 .../challenge-listing/Icons/ForumIcon.jsx     | 23 ----------
 .../challenge-listing/Icons/forum.svg         | 13 ++++++
 .../components/challenge-listing/index.jsx    |  3 +-
 .../containers/ChallengeListing/index.jsx     | 15 ++++++-
 src/shared/reducers/topcoder_header.js        | 24 +++++++----
 24 files changed, 162 insertions(+), 76 deletions(-)
 rename src/shared/components/{Select => }/Select.jsx (100%)
 delete mode 100644 src/shared/components/Select/index.js
 delete mode 100644 src/shared/components/challenge-listing/Icons/ForumIcon.jsx
 create mode 100644 src/shared/components/challenge-listing/Icons/forum.svg

diff --git a/__tests__/shared/components/TopcoderHeader/__snapshots__/index.jsx.snap b/__tests__/shared/components/TopcoderHeader/__snapshots__/index.jsx.snap
index 07e3b90777..370135a53c 100644
--- a/__tests__/shared/components/TopcoderHeader/__snapshots__/index.jsx.snap
+++ b/__tests__/shared/components/TopcoderHeader/__snapshots__/index.jsx.snap
@@ -12,8 +12,8 @@ exports[`Default render 1`] = `
       href="https://www.topcoder-dev.com"
     >
       <LogoTopcoderWithName
-        height={54}
-        width={156}
+        height={53}
+        width={135}
       />
     </a>
     <ul
@@ -71,6 +71,7 @@ exports[`Default render 1`] = `
   </div>
   <SubMenu
     closeMenu={[Function]}
+    currentSubMenuTitle=""
     menu={null}
     trigger={null}
   />
@@ -194,8 +195,8 @@ exports[`Render with open menu 1`] = `
       href="https://www.topcoder-dev.com"
     >
       <LogoTopcoderWithName
-        height={54}
-        width={156}
+        height={53}
+        width={135}
       />
     </a>
     <ul
@@ -253,6 +254,7 @@ exports[`Render with open menu 1`] = `
   </div>
   <SubMenu
     closeMenu={[Function]}
+    currentSubMenuTitle=""
     menu={
       Object {
         "items": Array [
@@ -387,8 +389,8 @@ exports[`Render with specified profile 1`] = `
       href="https://www.topcoder-dev.com"
     >
       <LogoTopcoderWithName
-        height={54}
-        width={156}
+        height={53}
+        width={135}
       />
     </a>
     <ul
@@ -459,6 +461,7 @@ exports[`Render with specified profile 1`] = `
   </div>
   <SubMenu
     closeMenu={[Function]}
+    currentSubMenuTitle=""
     menu={null}
     trigger={null}
   />
diff --git a/__tests__/shared/components/TopcoderHeader/index.jsx b/__tests__/shared/components/TopcoderHeader/index.jsx
index caabc9b25f..d69b9c0fb0 100644
--- a/__tests__/shared/components/TopcoderHeader/index.jsx
+++ b/__tests__/shared/components/TopcoderHeader/index.jsx
@@ -32,6 +32,7 @@ test('Default render', () => {
       closeMenu={_.noop}
       closeMobileMenu={_.noop}
       closeSearch={_.noop}
+      currentNav={{}}
       openMenu={_.noop}
       openMobileMenu={_.noop}
       openSearch={_.noop}
@@ -46,6 +47,7 @@ test('Render with open menu', () => {
       closeMenu={_.noop}
       closeMobileMenu={_.noop}
       closeSearch={_.noop}
+      currentNav={{}}
       openMenu={_.noop}
       openedMenu={{
         title: 'Menu Title',
@@ -68,6 +70,7 @@ test('Render with specified profile', () => {
       closeMenu={_.noop}
       closeMobileMenu={_.noop}
       closeSearch={_.noop}
+      currentNav={{}}
       openMenu={_.noop}
       openMobileMenu={_.noop}
       openSearch={_.noop}
@@ -91,6 +94,7 @@ describe('User input handling', () => {
         closeMenu={mockCloseMenu}
         closeMobileMenu={_.noop}
         closeSearch={mockCloseSearch}
+        currentNav={{}}
         openMenu={mockOpenMenu}
         openMobileMenu={_.noop}
         openSearch={mockOpenSearch}
diff --git a/__tests__/shared/components/tc-communities/__snapshots__/Header.jsx.snap b/__tests__/shared/components/tc-communities/__snapshots__/Header.jsx.snap
index d0ee089c78..4e561f33e4 100644
--- a/__tests__/shared/components/tc-communities/__snapshots__/Header.jsx.snap
+++ b/__tests__/shared/components/tc-communities/__snapshots__/Header.jsx.snap
@@ -89,6 +89,7 @@ exports[`Snapshot match 1`] = `
   </header>
   <SubMenu
     closeMenu={undefined}
+    currentSubMenuTitle=""
     menu={null}
     trigger={null}
   />
@@ -233,6 +234,7 @@ exports[`Snapshot match 2`] = `
   </header>
   <SubMenu
     closeMenu={undefined}
+    currentSubMenuTitle=""
     menu={null}
     trigger={null}
   />
diff --git a/__tests__/shared/containers/__snapshots__/TopcoderHeader.jsx.snap b/__tests__/shared/containers/__snapshots__/TopcoderHeader.jsx.snap
index 91ce379be8..09c27ed7a3 100644
--- a/__tests__/shared/containers/__snapshots__/TopcoderHeader.jsx.snap
+++ b/__tests__/shared/containers/__snapshots__/TopcoderHeader.jsx.snap
@@ -13,6 +13,7 @@ exports[`Matches shallow snapshot 1`] = `
   openedMenu={null}
   profile={Object {}}
   searchOpened={false}
+  setCurrentNav={[Function]}
   store={
     Object {
       "dispatch": [Function],
diff --git a/__tests__/shared/containers/tc-communities/__snapshots__/Page.jsx.snap b/__tests__/shared/containers/tc-communities/__snapshots__/Page.jsx.snap
index d6ba0a6071..e6ab954e4c 100644
--- a/__tests__/shared/containers/tc-communities/__snapshots__/Page.jsx.snap
+++ b/__tests__/shared/containers/tc-communities/__snapshots__/Page.jsx.snap
@@ -73,6 +73,7 @@ exports[`Matches shapshot 1`] = `
       ],
     }
   }
+  setCurrentNav={[Function]}
   store={
     Object {
       "dispatch": [Function],
diff --git a/__tests__/shared/reducers/topcoder_header.js b/__tests__/shared/reducers/topcoder_header.js
index 5a238b0e8f..4fa54db287 100644
--- a/__tests__/shared/reducers/topcoder_header.js
+++ b/__tests__/shared/reducers/topcoder_header.js
@@ -79,6 +79,8 @@ function testReducer(reducer, istate) {
 }
 
 describe('Default reducer', () =>
-  testReducer(reducers.default, {}),
+  testReducer(reducers.default, {
+    currentNav: {},
+  }),
 );
 
diff --git a/src/shared/actions/topcoder_header.js b/src/shared/actions/topcoder_header.js
index 7e1660ca7e..dc7a115bfd 100644
--- a/src/shared/actions/topcoder_header.js
+++ b/src/shared/actions/topcoder_header.js
@@ -29,6 +29,19 @@ function openSearch(triggerNode) {
   return openMenu(undefined, triggerNode);
 }
 
+/**
+ * The corresponding action sets current menu and submenu options to mark them
+ * with special hightlighting in the header.
+ * @param {String} menuTitle
+ * @param {String} subMenuTitle
+ */
+function setCurrentNav(menuTitle, subMenuTitle) {
+  return {
+    menuTitle,
+    subMenuTitle,
+  };
+}
+
 export default createActions({
   TOPCODER_HEADER: {
     /* Closes the currently opened menu, if any. */
@@ -41,5 +54,7 @@ export default createActions({
     OPEN_MENU: openMenu,
     OPEN_MOBILE_MENU: _.noop,
     OPEN_SEARCH: openSearch,
+
+    SET_CURRENT_NAV: setCurrentNav,
   },
 });
diff --git a/src/shared/components/Select/Select.jsx b/src/shared/components/Select.jsx
similarity index 100%
rename from src/shared/components/Select/Select.jsx
rename to src/shared/components/Select.jsx
diff --git a/src/shared/components/Select/index.js b/src/shared/components/Select/index.js
deleted file mode 100644
index 17d6bdad8e..0000000000
--- a/src/shared/components/Select/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import Select from './Select';
-
-export default Select;
diff --git a/src/shared/components/TopcoderHeader/desktop/SubMenu/Item/index.jsx b/src/shared/components/TopcoderHeader/desktop/SubMenu/Item/index.jsx
index 8b61bf0afb..3746ebc13f 100644
--- a/src/shared/components/TopcoderHeader/desktop/SubMenu/Item/index.jsx
+++ b/src/shared/components/TopcoderHeader/desktop/SubMenu/Item/index.jsx
@@ -7,9 +7,16 @@ import React from 'react';
 
 import './style.scss';
 
-export default function Item({ icon, link, title }) {
+export default function Item({
+  currentSubMenuTitle,
+  icon,
+  link,
+  title,
+}) {
+  let styleName = 'item';
+  if (currentSubMenuTitle === title) styleName += ' current';
   return (
-    <li styleName="item">
+    <li styleName={styleName}>
       <a href={link}>
         {icon}
         {title}
@@ -19,6 +26,7 @@ export default function Item({ icon, link, title }) {
 }
 
 Item.propTypes = {
+  currentSubMenuTitle: PT.string.isRequired,
   icon: PT.node.isRequired,
   link: PT.string.isRequired,
   title: PT.string.isRequired,
diff --git a/src/shared/components/TopcoderHeader/desktop/SubMenu/Item/style.scss b/src/shared/components/TopcoderHeader/desktop/SubMenu/Item/style.scss
index c3a182fc8a..f50573964b 100644
--- a/src/shared/components/TopcoderHeader/desktop/SubMenu/Item/style.scss
+++ b/src/shared/components/TopcoderHeader/desktop/SubMenu/Item/style.scss
@@ -15,6 +15,10 @@
   vertical-align: top;
   width: 150px;
 
+  &.current {
+    background: fade-out($tc-dark-blue-90, 0.66);
+  }
+
   svg {
     display: block;
     height: 36px;
diff --git a/src/shared/components/TopcoderHeader/desktop/SubMenu/index.jsx b/src/shared/components/TopcoderHeader/desktop/SubMenu/index.jsx
index 992888f328..89d0def2d6 100644
--- a/src/shared/components/TopcoderHeader/desktop/SubMenu/index.jsx
+++ b/src/shared/components/TopcoderHeader/desktop/SubMenu/index.jsx
@@ -7,10 +7,21 @@ import React from 'react';
 import Item from './Item';
 import './style.scss';
 
-export default function SubMenu({ closeMenu, menu, trigger }) {
+export default function SubMenu({
+  closeMenu,
+  currentSubMenuTitle,
+  menu,
+  trigger,
+}) {
   let items;
   if (menu) {
-    items = menu.items.map(item => <Item key={item.title} {...item} />);
+    items = menu.items.map(item => (
+      <Item
+        currentSubMenuTitle={currentSubMenuTitle}
+        key={item.title}
+        {...item}
+      />
+    ));
   }
   return (
     <ul
@@ -31,12 +42,14 @@ export default function SubMenu({ closeMenu, menu, trigger }) {
 }
 
 SubMenu.defaultProps = {
+  currentSubMenuTitle: '',
   menu: null,
   trigger: null,
 };
 
 SubMenu.propTypes = {
   closeMenu: PT.func.isRequired,
+  currentSubMenuTitle: PT.string,
   menu: PT.shape({
     items: PT.arrayOf(PT.shape({
       title: PT.string.isRequired,
diff --git a/src/shared/components/TopcoderHeader/index.jsx b/src/shared/components/TopcoderHeader/index.jsx
index c525bff20d..018bfb0e0b 100644
--- a/src/shared/components/TopcoderHeader/index.jsx
+++ b/src/shared/components/TopcoderHeader/index.jsx
@@ -115,6 +115,7 @@ export default function TopcoderHeader({
   closeMenu,
   closeMobileMenu,
   closeSearch,
+  currentNav,
   mobileMenuOpened,
   openedMenu,
   openMenu,
@@ -123,22 +124,24 @@ export default function TopcoderHeader({
   profile,
   searchOpened,
 }) {
-  const mainMenu = MENU.map(item => (
-    <li
-      className={openedMenu && openedMenu.title === item.title ? 'opened' : ''}
-      key={item.title}
-      onMouseEnter={event => openMenu(item, event.target)}
-      onMouseLeave={(event) => {
-        /* False when mouse cursor leaves from the main menu element to the
-         * sub-menu. In that case we keep the sub-menu opened, and responsible
-         * for further tracking of the mouse cursor. */
-        if (1 + event.pageY < activeTrigger.bottom) closeMenu();
-      }}
-      styleName="main-menu-item"
-    >
-      {item.title}
-    </li>
-  ));
+  const mainMenu = MENU.map((item) => {
+    let styleName = 'main-menu-item';
+    if (openedMenu && openedMenu.title === item.title) styleName += ' opened';
+    if (item.title === currentNav.menuTitle) styleName += ' current';
+    return (
+      <li
+        key={item.title}
+        onMouseEnter={event => openMenu(item, event.target)}
+        onMouseLeave={(event) => {
+          /* False when mouse cursor leaves from the main menu element to the
+          * sub-menu. In that case we keep the sub-menu opened, and responsible
+          * for further tracking of the mouse cursor. */
+          if (1 + event.pageY < activeTrigger.bottom) closeMenu();
+        }}
+        styleName={styleName}
+      >{item.title}</li>
+    );
+  });
 
   let authButtons;
   let userAvatar;
@@ -227,7 +230,7 @@ export default function TopcoderHeader({
     <div styleName="header">
       <div styleName="main-desktop-header">
         <a href={BASE_URL} styleName="logo">
-          <LogoTopcoderWithName height={54} width={156} />
+          <LogoTopcoderWithName height={53} width={135} />
         </a>
         <ul styleName="main-menu">
           {mainMenu}
@@ -247,6 +250,7 @@ export default function TopcoderHeader({
       </div>
       <DesktopSubMenu
         closeMenu={closeMenu}
+        currentSubMenuTitle={currentNav.subMenuTitle}
         menu={openedMenu}
         trigger={activeTrigger}
       />
@@ -305,6 +309,10 @@ TopcoderHeader.propTypes = {
   closeMenu: PT.func.isRequired,
   closeMobileMenu: PT.func.isRequired,
   closeSearch: PT.func.isRequired,
+  currentNav: PT.shape({
+    menuTitle: PT.string,
+    subMenuTitle: PT.string,
+  }).isRequired,
   mobileMenuOpened: PT.bool,
   openedMenu: SUB_MENU_SHAPE,
   openMenu: PT.func.isRequired,
diff --git a/src/shared/components/TopcoderHeader/style.scss b/src/shared/components/TopcoderHeader/style.scss
index 8b7bdda8b3..cabb3e6c73 100644
--- a/src/shared/components/TopcoderHeader/style.scss
+++ b/src/shared/components/TopcoderHeader/style.scss
@@ -40,6 +40,8 @@
 
 .logo {
   position: absolute;
+  padding-left: 11px;
+  padding-top: 1px;
 }
 
 .main-menu {
@@ -53,12 +55,16 @@
   display: inline-block;
   font-size: 14px;
   line-height: 54px;
-  margin: 0 20px;
-  padding: 0 20px;
+  margin: 0;
+  padding: 0 40px;
   position: relative;
   text-transform: uppercase;
 
-  &:global.opened {
+  &.current {
+    box-shadow: inset 0 -4px 0 -1px $tc-dark-blue-90;
+  }
+
+  &.opened {
     color: $tc-dark-blue-90;
 
     /* TODO: This code for downward blue arrow is used also
@@ -179,10 +185,9 @@
   display: inline-block;
   font-size: 15px;
   height: 54px;
-  padding: 20px 0;
+  padding: 23px 0;
   vertical-align: bottom;
   position: relative;
-  top: -2px;
 }
 
 @media only screen and (max-width: 1024px) {
diff --git a/src/shared/components/challenge-listing/ChallengeStatus/index.jsx b/src/shared/components/challenge-listing/ChallengeStatus/index.jsx
index 5f46242ab7..e1941bab62 100644
--- a/src/shared/components/challenge-listing/ChallengeStatus/index.jsx
+++ b/src/shared/components/challenge-listing/ChallengeStatus/index.jsx
@@ -9,7 +9,7 @@ import RegistrantsIcon from '../Icons/RegistrantsIcon';
 import SubmissionsIcon from '../Icons/SubmissionsIcon';
 import Tooltip from '../Tooltips/Tooltip';
 import UserAvatarTooltip from '../Tooltips/UserAvatarTooltip';
-import ForumIcon from '../Icons/ForumIcon';
+import ForumIcon from '../Icons/forum.svg';
 import './style.scss';
 
 // Constants
@@ -141,7 +141,7 @@ class ChallengeStatus extends Component {
 
     const CHALLENGE_URL = `${props.MAIN_URL}/challenge-details/`;
     const DS_CHALLENGE_URL = `https:${props.config.COMMUNITY_URL}/longcontest/stats/?module=ViewOverview&rd=`;
-    const FORUM_URL = `https:${props.config.FORUMS_APP_URL}/?module=Category&categoryID=`;
+    const FORUM_URL = `${config.URL.FORUMS}/?module=Category&categoryID=`;
     this.state = {
       winners: '',
       CHALLENGE_URL,
diff --git a/src/shared/components/challenge-listing/Filters/ChallengeFilters.jsx b/src/shared/components/challenge-listing/Filters/ChallengeFilters.jsx
index f591989b1d..27d1c96306 100644
--- a/src/shared/components/challenge-listing/Filters/ChallengeFilters.jsx
+++ b/src/shared/components/challenge-listing/Filters/ChallengeFilters.jsx
@@ -264,6 +264,7 @@ const TagShape = PT.shape({
 });
 
 ChallengeFilters.defaultProps = {
+  communityName: null,
   filter: new ChallengeFilter(),
   isCardTypeSet: '',
   searchQuery: '',
@@ -275,7 +276,7 @@ ChallengeFilters.defaultProps = {
 
 ChallengeFilters.propTypes = {
   challengeGroupId: PT.string.isRequired,
-  communityName: PT.string.isRequired,
+  communityName: PT.string,
   filter: PT.instanceOf(ChallengeFilter),
   isCardTypeSet: PT.string,
   searchQuery: PT.string,
diff --git a/src/shared/components/challenge-listing/Filters/ChallengeSearchBar/style.scss b/src/shared/components/challenge-listing/Filters/ChallengeSearchBar/style.scss
index a733ffaf7e..5f5b4c391d 100644
--- a/src/shared/components/challenge-listing/Filters/ChallengeSearchBar/style.scss
+++ b/src/shared/components/challenge-listing/Filters/ChallengeSearchBar/style.scss
@@ -16,6 +16,8 @@ $search-input-width: '100% - 56px';
   display: inline-block;
   vertical-align: middle;
   margin-right: 40px;
+  position: relative;
+  top: 1px;
 
   @include xs-to-sm {
     display: none;
@@ -43,6 +45,10 @@ $search-input-width: '100% - 56px';
       text-transform: none;
       opacity: 1;
     }
+
+    &:hover {
+      border: 1px solid $tc-gray-40;
+    }
   }
 
   .SearchButton {
@@ -52,6 +58,7 @@ $search-input-width: '100% - 56px';
     padding: $challenge-space-10 + 1 $challenge-space-20 $challenge-space-10 - 2;
     border-radius: 0 $challenge-radius-4 $challenge-radius-4 0;
     vertical-align: middle;
+    height: 40px;
 
     &.active,
     &:hover {
diff --git a/src/shared/components/challenge-listing/Filters/FiltersPanel/index.jsx b/src/shared/components/challenge-listing/Filters/FiltersPanel/index.jsx
index ff93961cda..50c86747dc 100644
--- a/src/shared/components/challenge-listing/Filters/FiltersPanel/index.jsx
+++ b/src/shared/components/challenge-listing/Filters/FiltersPanel/index.jsx
@@ -126,7 +126,7 @@ class FiltersPanel extends React.Component {
         <div styleName={`filters ${this.props.challengeGroupId ? 'inGroup' : ''}`}>
           <div styleName="filter-row">
             <div styleName="filter keywords">
-              <label htmlFor="keyword-select">Keywords</label>
+              <label htmlFor="keyword-select" styleName="left-label">Keywords</label>
               <Select
                 id="keyword-select"
                 multi
@@ -158,7 +158,7 @@ class FiltersPanel extends React.Component {
           </div>
           <div styleName="filter-row">
             <div styleName="filter track">
-              <label htmlFor="track-select">Subtrack</label>
+              <label htmlFor="track-select" styleName="left-label">Subtrack</label>
               <Select
                 id="track-select"
                 multi
@@ -201,6 +201,7 @@ class FiltersPanel extends React.Component {
 }
 
 FiltersPanel.defaultProps = {
+  communityName: null,
   filter: new FilterPanelFilter(),
   hidden: false,
   onClearFilters: _.noop,
@@ -218,7 +219,7 @@ const SelectOptions = PT.arrayOf(
 
 FiltersPanel.propTypes = {
   challengeGroupId: PT.string.isRequired,
-  communityName: PT.string.isRequired,
+  communityName: PT.string,
   filter: PT.instanceOf(FilterPanelFilter),
   hidden: PT.bool,
   onClearFilters: PT.func,
diff --git a/src/shared/components/challenge-listing/Filters/FiltersPanel/style.scss b/src/shared/components/challenge-listing/Filters/FiltersPanel/style.scss
index 17f907b1d0..ab3181202f 100644
--- a/src/shared/components/challenge-listing/Filters/FiltersPanel/style.scss
+++ b/src/shared/components/challenge-listing/Filters/FiltersPanel/style.scss
@@ -150,6 +150,10 @@ $panel-radius-4: $corner-radius * 2;
       margin-right: $panel-space-15;
       min-width: 96px;
       text-align: right;
+
+      &.left-label {
+        min-width: 58px;
+      }
     }
 
     :global(.Select) {
diff --git a/src/shared/components/challenge-listing/Icons/ForumIcon.jsx b/src/shared/components/challenge-listing/Icons/ForumIcon.jsx
deleted file mode 100644
index 57dab7fe0f..0000000000
--- a/src/shared/components/challenge-listing/Icons/ForumIcon.jsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import React from 'react'
-
-const ForumIcon = ({ width, height, fill }) => {
-  const f = (fill || '#C3C3C8')
-  return (
-    <svg xmlns="http://www.w3.org/2000/svg" width={ width || '16' } height={ height || '16' } viewBox="0 0 16 16" xmlns="http://www.w3.org/1999/xlink">
-      <defs>
-        <path id="a" d="M15,0 L1,0 C0.4,0 0,0.4 0,1 L0,12 C0,12.6 0.4,13 1,13 L4.6,13 L7.3,15.7 C7.5,15.9 7.7,16 8,16 C8.3,16 8.5,15.9 8.7,15.7 L11.4,13 L15,13 C15.6,13 16,12.6 16,12 L16,1 C16,0.4 15.6,0 15,0 L15,0 Z"/>
-        <mask id="b" width={ width || '16' } height={ width || '16' } x="0" y="0" fill="white">
-          <use href="#a"/>
-        </mask>
-      </defs>
-      <g fill="none" fill-rule="evenodd">
-        <use fill="#FFFFFF" stroke={ f } strokeWidth="4" mask="url(#b)" href="#a"/>
-        <rect width="8" height="2" x="4" y="4" fill={ f }/>
-        <rect width="4" height="2" x="4" y="7" fill={ f }/>
-      </g>
-    </svg>
-
-  )
-}
-
-export default ForumIcon
diff --git a/src/shared/components/challenge-listing/Icons/forum.svg b/src/shared/components/challenge-listing/Icons/forum.svg
new file mode 100644
index 0000000000..9fb22a9f35
--- /dev/null
+++ b/src/shared/components/challenge-listing/Icons/forum.svg
@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/1999/xlink">
+  <defs>
+    <path id="a" d="M15,0 L1,0 C0.4,0 0,0.4 0,1 L0,12 C0,12.6 0.4,13 1,13 L4.6,13 L7.3,15.7 C7.5,15.9 7.7,16 8,16 C8.3,16 8.5,15.9 8.7,15.7 L11.4,13 L15,13 C15.6,13 16,12.6 16,12 L16,1 C16,0.4 15.6,0 15,0 L15,0 Z"/>
+    <mask id="b" width="16" height="16" x="0" y="0" fill="white">
+      <use href="#a"/>
+    </mask>
+  </defs>
+  <g fill="none" fill-rule="evenodd">
+    <use fill="#FFFFFF" stroke="#C3C3C8" stroke-width="4" mask="url(#b)" href="#a"/>
+    <rect width="8" height="2" x="4" y="4" fill="#C3C3C8"/>
+    <rect width="4" height="2" x="4" y="7" fill="#C3C3C8"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/shared/components/challenge-listing/index.jsx b/src/shared/components/challenge-listing/index.jsx
index 758af315ae..872a9c50e6 100755
--- a/src/shared/components/challenge-listing/index.jsx
+++ b/src/shared/components/challenge-listing/index.jsx
@@ -423,6 +423,7 @@ class ChallengeFiltersExample extends React.Component {
 
 ChallengeFiltersExample.defaultProps = {
   challengeGroupId: '',
+  communityName: null,
   config: {
     API_URL_V2: config.API.V2,
     API_URL: config.API.V3,
@@ -442,7 +443,7 @@ ChallengeFiltersExample.propTypes = {
   })).isRequired,
   challengeSubtracks: PT.arrayOf(PT.string).isRequired,
   challengeTags: PT.arrayOf(PT.string).isRequired,
-  communityName: PT.string.isRequired,
+  communityName: PT.string,
   filter: PT.string.isRequired,
   getChallenges: PT.func.isRequired,
   getMarathonMatches: PT.func.isRequired,
diff --git a/src/shared/containers/ChallengeListing/index.jsx b/src/shared/containers/ChallengeListing/index.jsx
index 78ba8bbd22..26d6bc3d47 100644
--- a/src/shared/containers/ChallengeListing/index.jsx
+++ b/src/shared/containers/ChallengeListing/index.jsx
@@ -11,6 +11,7 @@
 
 import _ from 'lodash';
 import actions from 'actions/challenge-listing';
+import headerActions from 'actions/topcoder_header';
 import logger from 'utils/logger';
 import React from 'react';
 import PT from 'prop-types';
@@ -47,6 +48,8 @@ class ChallengeListingPageContainer extends React.Component {
   componentDidMount() {
     const { challengeListing: cl } = this.props;
 
+    this.props.markHeaderMenu();
+
     if (mounted) {
       logger.error('Attempt to mount multiple instances of ChallengeListingPageContainer at the same time!');
     } else mounted = true;
@@ -243,6 +246,7 @@ class ChallengeListingPageContainer extends React.Component {
 
 ChallengeListingPageContainer.defaultProps = {
   challengeGroupId: '',
+  communityName: null,
   listingOnly: false,
   match: null,
   tag: null,
@@ -254,11 +258,12 @@ ChallengeListingPageContainer.propTypes = {
     filter: PT.string.isRequired,
     pendingRequests: PT.shape({}).isRequired,
   }).isRequired,
-  communityName: PT.string.isRequired,
+  communityName: PT.string,
   getChallenges: PT.func.isRequired,
   getChallengeSubtracks: PT.func.isRequired,
   getChallengeTags: PT.func.isRequired,
   getMarathonMatches: PT.func.isRequired,
+  markHeaderMenu: PT.func.isRequired,
   setFilter: PT.func.isRequired,
 
   /* OLD PROPS BELOW */
@@ -284,7 +289,10 @@ ChallengeListingPageContainer.propTypes = {
 
 const mapStateToProps = state => ({
   auth: state.auth,
-  challengeListing: state.challengeListing,
+  challengeListing: {
+    ...state.challengeListing,
+    filter: decodeURIComponent(state.challengeListing.filter),
+  },
 });
 
 /**
@@ -322,6 +330,7 @@ function getMarathonMatches(dispatch, filters, ...rest) {
 
 function mapDispatchToProps(dispatch) {
   const a = actions.challengeListing;
+  const ah = headerActions.topcoderHeader;
   return {
     getChallenges: (...rest) => getChallenges(dispatch, ...rest),
     getChallengeSubtracks: () => {
@@ -335,6 +344,8 @@ function mapDispatchToProps(dispatch) {
     getMarathonMatches: (...rest) => getMarathonMatches(dispatch, ...rest),
     reset: () => dispatch(a.reset()),
     setFilter: f => dispatch(a.setFilter(f)),
+    markHeaderMenu: () =>
+      dispatch(ah.setCurrentNav('Compete', 'All Challenges')),
   };
 }
 
diff --git a/src/shared/reducers/topcoder_header.js b/src/shared/reducers/topcoder_header.js
index 1798f9a218..fd58425b51 100644
--- a/src/shared/reducers/topcoder_header.js
+++ b/src/shared/reducers/topcoder_header.js
@@ -3,6 +3,7 @@
  * related to the standard Topcoder header.
  */
 
+import _ from 'lodash';
 import actions from 'actions/topcoder_header';
 import { handleActions } from 'redux-actions';
 
@@ -11,43 +12,50 @@ import { handleActions } from 'redux-actions';
  * @param {Object} initialState Optional. Initial state.
  * @return Reducer.
  */
-function create(initialState) {
+function create(initialState = {}) {
+  const a = actions.topcoderHeader;
   return handleActions({
-    [actions.topcoderHeader.closeMenu](state) {
+    [a.closeMenu](state) {
       return {
         ...state,
         openedMenu: null,
       };
     },
-    [actions.topcoderHeader.closeMobileMenu](state) {
+    [a.closeMobileMenu](state) {
       return {
         ...state,
         mobileMenuOpened: false,
       };
     },
-    [actions.topcoderHeader.closeSearch](state) {
+    [a.closeSearch](state) {
       return {
         ...state,
         searchOpened: false,
       };
     },
-    [actions.topcoderHeader.openMenu](state, action) {
+    [a.openMenu](state, action) {
       return {
         ...state,
         openedMenu: action.payload.menu,
         activeTrigger: action.payload.trigger,
       };
     },
-    [actions.topcoderHeader.openMobileMenu]: state => ({
+    [a.openMobileMenu]: state => ({
       ...state,
       mobileMenuOpened: true,
     }),
-    [actions.topcoderHeader.openSearch]: (state, action) => ({
+    [a.openSearch]: (state, action) => ({
       ...state,
       searchOpened: true,
       activeTrigger: action.payload.trigger,
     }),
-  }, initialState || {});
+    [a.setCurrentNav]: (state, { payload }) => ({
+      ...state,
+      currentNav: payload,
+    }),
+  }, _.defaults(_.clone(initialState), {
+    currentNav: {},
+  }));
 }
 
 /* Default reducer with empty initial state. */

From 3b70c61c949c7265a2e3558370225265e0098534 Mon Sep 17 00:00:00 2001
From: "Dr. Sergey Pogodin" <dr.pogodin@gmail.com>
Date: Fri, 16 Jun 2017 16:25:39 +0200
Subject: [PATCH 2/6] Challenge listing: Optimization of challenge loading

It turns out, when a challenge belongs to at least some group, its data
object will include groupIds array. Thus, we don't need to make separate
calls to get challenges belonging to a group.
---
 .../containers/ChallengeListing/index.jsx     | 43 -------------------
 src/shared/reducers/challenge-listing.js      | 31 +++++++------
 2 files changed, 15 insertions(+), 59 deletions(-)

diff --git a/src/shared/containers/ChallengeListing/index.jsx b/src/shared/containers/ChallengeListing/index.jsx
index 26d6bc3d47..9569905615 100644
--- a/src/shared/containers/ChallengeListing/index.jsx
+++ b/src/shared/containers/ChallengeListing/index.jsx
@@ -85,75 +85,32 @@ class ChallengeListingPageContainer extends React.Component {
 
   loadChallenges() {
     const { tokenV3, user } = this.props.auth;
-    const groupIds = this.props.challengeGroupId || undefined;
-
-    /* Initial loading of the challenges. Later we'll add some extra
-      conditions to prevent loading when data are up-to-date because
-      of server-side rendering, or because we have been at this page
-      recently. */
 
     /* Active challenges. */
     this.props.getChallenges({
-      groupIds,
       status: 'ACTIVE',
     }, {}, tokenV3, 'active');
     this.props.getMarathonMatches({
-      groupIds,
       status: 'ACTIVE',
     }, {}, tokenV3, 'activeMM');
 
     /* My active challenges. */
     if (user) {
       this.props.getChallenges({
-        groupIds,
         status: 'ACTIVE',
       }, {}, tokenV3, 'myActive', user.handle);
       this.props.getMarathonMatches({
-        groupIds,
         status: 'ACTIVE',
       }, {}, tokenV3, 'myActiveMM', user.handle);
     }
 
     /* Past challenges. */
     this.props.getChallenges({
-      groupIds,
       status: 'COMPLETED',
     }, {}, tokenV3, 'past');
     this.props.getMarathonMatches({
-      groupIds,
       status: 'PAST',
     }, {}, tokenV3, 'pastMM');
-
-    /* In case we are inside a group, we still need to load all challenges,
-     * to be able to use All / Group challenges filter. */
-    if (groupIds) {
-      /* Active challenges. */
-      this.props.getChallenges({
-        status: 'ACTIVE',
-      }, {}, tokenV3, 'active');
-      this.props.getMarathonMatches({
-        status: 'ACTIVE',
-      }, {}, tokenV3, 'activeMM');
-
-      /* My active challenges. */
-      if (user) {
-        this.props.getChallenges({
-          status: 'ACTIVE',
-        }, {}, tokenV3, 'myActive', user.handle);
-        this.props.getMarathonMatches({
-          groupIds,
-          status: 'ACTIVE',
-        }, {}, tokenV3, 'myActiveMM', user.handle);
-      }
-
-      /* Past challenges. */
-      this.props.getChallenges({
-        status: 'COMPLETED',
-      }, {}, tokenV3, 'past');
-      this.props.getMarathonMatches({
-        status: 'PAST',
-      }, {}, tokenV3, 'pastMM');
-    }
   }
 
   /**
diff --git a/src/shared/reducers/challenge-listing.js b/src/shared/reducers/challenge-listing.js
index 7aa223efa2..c800eeb54c 100644
--- a/src/shared/reducers/challenge-listing.js
+++ b/src/shared/reducers/challenge-listing.js
@@ -51,8 +51,15 @@ export function normalizeChallenge(challenge) {
   const registrationOpen = challenge.allPhases.filter(d =>
     d.phaseType === 'Registration',
   )[0].phaseStatus === 'Open' ? 'Yes' : 'No';
+  const groups = {};
+  if (challenge.groupIds) {
+    challenge.groupIds.forEach((id) => {
+      groups[id] = true;
+    });
+  }
   return _.defaults(_.clone(challenge), {
     communities: new Set([COMMUNITY[challenge.track]]),
+    groups,
     platforms: '',
     registrationOpen,
     technologies: '',
@@ -77,6 +84,12 @@ export function normalizeMarathonMatch(challenge) {
     phaseStatus: endTimestamp > Date.now() ? 'Open' : 'Close',
     scheduledEndTime: challenge.endDate,
   }];
+  const groups = {};
+  if (challenge.groupIds) {
+    challenge.groupIds.forEach((id) => {
+      groups[id] = true;
+    });
+  }
   return _.defaults(_.clone(challenge), {
     challengeCommunity: 'Data',
     challengeType: 'Marathon',
@@ -84,6 +97,7 @@ export function normalizeMarathonMatch(challenge) {
     currentPhases: allphases.filter(phase => phase.phaseStatus === 'Open'),
     communities: new Set([COMMUNITY.DATA_SCIENCE]),
     currentPhaseName: endTimestamp > Date.now() ? 'Registration' : '',
+    groups,
     numRegistrants: challenge.numRegistrants ? challenge.numRegistrants[0] : 0,
     numSubmissions: challenge.userIds ? challenge.userIds.length : 0,
     platforms: '',
@@ -175,31 +189,16 @@ function onGetDone(state, { payload }, normalizer) {
   });
   payload.challenges.forEach((item) => {
     const it = _.defaults(normalizer(item), {
-      groups: {},
       users: {},
     });
 
-    /* Challenge objects returned from the backend do not have list of
-      groups they belong to (to keep private groups secret). We know about
-      challenge - group associations because we specify groupIds filter in
-      the request. So, we add groups information, known to us, to the
-      challenge objects. */
-    if (_.get(payload, 'filters.groupIds')) {
-      payload.filters.groupIds.split(',').forEach((g) => {
-        it.groups[g] = true;
-      });
-    }
-
     /* Similarly it happens with users participating in the challenges. */
     if (payload.user) it.users[payload.user] = true;
 
     /* If we already had some data about this challenge loaded, we should
       properly merge-in the known information about groups and users. */
     const old = challenges[it.id];
-    if (old) {
-      _.merge(it.groups, old.groups);
-      _.merge(it.users, old.users);
-    }
+    if (old) _.merge(it.users, old.users);
 
     challenges[it.id] = it;
   });

From 0859cdc65f3d0084b6e99025b5e61ddc9d44076e Mon Sep 17 00:00:00 2001
From: "Dr. Sergey Pogodin" <dr.pogodin@gmail.com>
Date: Wed, 21 Jun 2017 13:32:10 +0200
Subject: [PATCH 3/6] Fix: Server-side rendering of images

Fixes #79
---
 .babelrc                  | 2 +-
 config/webpack/default.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/.babelrc b/.babelrc
index 196fefcbe3..f77494f79e 100644
--- a/.babelrc
+++ b/.babelrc
@@ -22,7 +22,7 @@
     }],
     ["transform-assets", {
       "extensions": ["gif", "jpeg", "jpg", "png"],
-      "name": "[hash].[ext]"
+      "name": "/images/[hash].[ext]"
     }]
   ]
 }
diff --git a/config/webpack/default.js b/config/webpack/default.js
index a673cf230f..1e2593e707 100644
--- a/config/webpack/default.js
+++ b/config/webpack/default.js
@@ -59,7 +59,7 @@ module.exports = {
       loader: 'file-loader',
       options: {
         outputPath: '/images/',
-        publicPath: '/images/../',
+        publicPath: '',
       },
     }, {
       test: /\.scss$/,

From 4c0f340c027960a678c1fbe5ccc258e427d14b20 Mon Sep 17 00:00:00 2001
From: "Dr. Sergey Pogodin" <dr.pogodin@gmail.com>
Date: Wed, 21 Jun 2017 21:58:21 +0200
Subject: [PATCH 4/6] Update of the Leaderboard to match the new format of API
 response

Fixes #80
---
 .../__snapshots__/LeaderboardTable.jsx.snap   | 72 ++++++-------------
 .../__snapshots__/PodiumSpot.jsx.snap         | 10 +--
 .../__snapshots__/LoadingIndicator.jsx.snap   |  2 +-
 src/server/tc-communities/wipro/metadata.json |  2 +-
 .../Leaderboard/LeaderboardTable/index.jsx    | 63 ++++++++--------
 .../components/Leaderboard/Podium/index.jsx   |  8 +--
 .../Leaderboard/PodiumSpot/index.jsx          | 23 +++---
 7 files changed, 77 insertions(+), 103 deletions(-)

diff --git a/__tests__/shared/components/Leaderboard/__snapshots__/LeaderboardTable.jsx.snap b/__tests__/shared/components/Leaderboard/__snapshots__/LeaderboardTable.jsx.snap
index 24eddc608c..517010a300 100644
--- a/__tests__/shared/components/Leaderboard/__snapshots__/LeaderboardTable.jsx.snap
+++ b/__tests__/shared/components/Leaderboard/__snapshots__/LeaderboardTable.jsx.snap
@@ -53,7 +53,7 @@ exports[`Matches shallow shapshot 1`] = `
                 "avatar": "src-shared-components-Leaderboard-___avatarStyles__default___1bHTz",
               }
             }
-            url="some.fake.string"
+            url={null}
           />
         </span>
       </td>
@@ -61,33 +61,25 @@ exports[`Matches shallow shapshot 1`] = `
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-handle___3Sr8G"
       >
         <a
-          href="https://www.topcoder-dev.com/members/overachieving.mofo/"
-        >
-          overachieving.mofo
-        </a>
+          href="https://www.topcoder-dev.com/members/undefined/"
+        />
         <div
           className="src-shared-components-Leaderboard-LeaderboardTable-___styles__winnings-info___1Fiyn"
         >
           <span>
-            9999999999
              points
           </span>
           <span>
-            99999
              challenges
           </span>
         </div>
       </td>
       <td
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-challenges___29htm"
-      >
-        99999
-      </td>
+      />
       <td
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-points___10Lis"
-      >
-        9999999999
-      </td>
+      />
     </tr>
     <tr>
       <td
@@ -110,7 +102,7 @@ exports[`Matches shallow shapshot 1`] = `
                 "avatar": "src-shared-components-Leaderboard-___avatarStyles__default___1bHTz",
               }
             }
-            url="some.fake.string"
+            url={null}
           />
         </span>
       </td>
@@ -118,33 +110,25 @@ exports[`Matches shallow shapshot 1`] = `
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-handle___3Sr8G"
       >
         <a
-          href="https://www.topcoder-dev.com/members/overachieving.mofo/"
-        >
-          overachieving.mofo
-        </a>
+          href="https://www.topcoder-dev.com/members/undefined/"
+        />
         <div
           className="src-shared-components-Leaderboard-LeaderboardTable-___styles__winnings-info___1Fiyn"
         >
           <span>
-            9999999999
              points
           </span>
           <span>
-            99999
              challenges
           </span>
         </div>
       </td>
       <td
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-challenges___29htm"
-      >
-        99999
-      </td>
+      />
       <td
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-points___10Lis"
-      >
-        9999999999
-      </td>
+      />
     </tr>
     <tr>
       <td
@@ -167,7 +151,7 @@ exports[`Matches shallow shapshot 1`] = `
                 "avatar": "src-shared-components-Leaderboard-___avatarStyles__default___1bHTz",
               }
             }
-            url="some.fake.string"
+            url={null}
           />
         </span>
       </td>
@@ -175,33 +159,25 @@ exports[`Matches shallow shapshot 1`] = `
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-handle___3Sr8G"
       >
         <a
-          href="https://www.topcoder-dev.com/members/overachieving.mofo/"
-        >
-          overachieving.mofo
-        </a>
+          href="https://www.topcoder-dev.com/members/undefined/"
+        />
         <div
           className="src-shared-components-Leaderboard-LeaderboardTable-___styles__winnings-info___1Fiyn"
         >
           <span>
-            9999999999
              points
           </span>
           <span>
-            99999
              challenges
           </span>
         </div>
       </td>
       <td
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-challenges___29htm"
-      >
-        99999
-      </td>
+      />
       <td
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-points___10Lis"
-      >
-        9999999999
-      </td>
+      />
     </tr>
     <tr>
       <td
@@ -224,7 +200,7 @@ exports[`Matches shallow shapshot 1`] = `
                 "avatar": "src-shared-components-Leaderboard-___avatarStyles__default___1bHTz",
               }
             }
-            url="some.fake.string"
+            url={null}
           />
         </span>
       </td>
@@ -232,33 +208,25 @@ exports[`Matches shallow shapshot 1`] = `
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-handle___3Sr8G"
       >
         <a
-          href="https://www.topcoder-dev.com/members/overachieving.mofo/"
-        >
-          overachieving.mofo
-        </a>
+          href="https://www.topcoder-dev.com/members/undefined/"
+        />
         <div
           className="src-shared-components-Leaderboard-LeaderboardTable-___styles__winnings-info___1Fiyn"
         >
           <span>
-            9999999999
              points
           </span>
           <span>
-            99999
              challenges
           </span>
         </div>
       </td>
       <td
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-challenges___29htm"
-      >
-        99999
-      </td>
+      />
       <td
         className="src-shared-components-Leaderboard-LeaderboardTable-___styles__col-points___10Lis"
-      >
-        9999999999
-      </td>
+      />
     </tr>
   </tbody>
 </table>
diff --git a/__tests__/shared/components/Leaderboard/__snapshots__/PodiumSpot.jsx.snap b/__tests__/shared/components/Leaderboard/__snapshots__/PodiumSpot.jsx.snap
index 4100443571..6bf9267b7c 100644
--- a/__tests__/shared/components/Leaderboard/__snapshots__/PodiumSpot.jsx.snap
+++ b/__tests__/shared/components/Leaderboard/__snapshots__/PodiumSpot.jsx.snap
@@ -16,7 +16,7 @@ exports[`Matches shallow shapshot 1`] = `
           "avatar": "src-shared-components-Leaderboard-___avatarStyles__gold___1KUGN",
         }
       }
-      url="some.fake.string"
+      url={null}
     />
   </span>
   <div
@@ -27,20 +27,16 @@ exports[`Matches shallow shapshot 1`] = `
   <div>
     <a
       className="src-shared-components-Leaderboard-PodiumSpot-___styles__profile-link___n7nJB"
-      href="https://www.topcoder-dev.com/members/overachieving.mofo/"
-    >
-      overachieving.mofo
-    </a>
+      href="https://www.topcoder-dev.com/members/undefined/"
+    />
   </div>
   <div
     className="src-shared-components-Leaderboard-PodiumSpot-___styles__winnings-info___2_pZP"
   >
     <span>
-      9999999999
        points
     </span>
     <span>
-      99999
        challenges
     </span>
   </div>
diff --git a/__tests__/shared/components/__snapshots__/LoadingIndicator.jsx.snap b/__tests__/shared/components/__snapshots__/LoadingIndicator.jsx.snap
index 8697bcffcf..f10b10e905 100644
--- a/__tests__/shared/components/__snapshots__/LoadingIndicator.jsx.snap
+++ b/__tests__/shared/components/__snapshots__/LoadingIndicator.jsx.snap
@@ -4,6 +4,6 @@ exports[`renders correctly 1`] = `
 <img
   alt="Loading..."
   className="src-shared-components-LoadingIndicator-___styles__style___3RNHL"
-  src="2f402d440d802a10b7672b75897c47a5.gif"
+  src="/images/2f402d440d802a10b7672b75897c47a5.gif"
 />
 `;
diff --git a/src/server/tc-communities/wipro/metadata.json b/src/server/tc-communities/wipro/metadata.json
index a47bb864f1..9b85750043 100644
--- a/src/server/tc-communities/wipro/metadata.json
+++ b/src/server/tc-communities/wipro/metadata.json
@@ -18,7 +18,7 @@
     "redirect": "https://ios.topcoder.com/",
     "value": "3"
   }],
-  "leaderboardApiUrl": "https://api.topcoder.com/v4/looks/0/run/json/",
+  "leaderboardApiUrl": "https://api.topcoder.com/v4/looks/458/run/json/",
   "logos": [
     "/themes/wipro/wipro-logo.png",
     "/themes/wipro/logo_topcoder_with_name.svg"
diff --git a/src/shared/components/Leaderboard/LeaderboardTable/index.jsx b/src/shared/components/Leaderboard/LeaderboardTable/index.jsx
index 467ca9560c..b6ab008318 100644
--- a/src/shared/components/Leaderboard/LeaderboardTable/index.jsx
+++ b/src/shared/components/Leaderboard/LeaderboardTable/index.jsx
@@ -30,32 +30,37 @@ export default function LeaderboardTable(props) {
   const {
     competitors,
   } = props;
-
   const renderTableRows = comps => (
-    comps.map(competitor => (
-      <tr key={competitor.rank}>
-        <td styleName="styles.col-rank">{competitor.rank}</td>
-        <td styleName="styles.col-avatar">
-          <span styleName="styles.leaderboard-avatar">
-            <Avatar
-              theme={{
-                avatar: avatarStyles.default,
-              }}
-              url={competitor.photourl}
-            />
-          </span>
-        </td>
-        <td styleName="styles.col-handle">
-          <a href={`${config.URL.BASE}/members/${competitor['user.handle']}/`}>{competitor['user.handle']}</a>
-          <div styleName="styles.winnings-info">
-            <span>{competitor['project_result.final_score']} points</span>
-            <span>{competitor['challenge.count']} challenges</span>
-          </div>
-        </td>
-        <td styleName="styles.col-challenges">{competitor['challenge.count']}</td>
-        <td styleName="styles.col-points">{competitor['project_result.final_score']}</td>
-      </tr>
-    ))
+    comps.map((competitor) => {
+      let photoUrl = competitor['challenge_stats.photo_url'];
+      if (photoUrl && (photoUrl[0] === '/')) {
+        photoUrl = config.URL.BASE + photoUrl;
+      }
+      return (
+        <tr key={competitor.rank}>
+          <td styleName="styles.col-rank">{competitor.rank}</td>
+          <td styleName="styles.col-avatar">
+            <span styleName="styles.leaderboard-avatar">
+              <Avatar
+                theme={{
+                  avatar: avatarStyles.default,
+                }}
+                url={photoUrl}
+              />
+            </span>
+          </td>
+          <td styleName="styles.col-handle">
+            <a href={`${config.URL.BASE}/members/${competitor['challenge_stats.winner_handle']}/`}>{competitor['challenge_stats.winner_handle']}</a>
+            <div styleName="styles.winnings-info">
+              <span>{competitor.points} points</span>
+              <span>{competitor['challenge_stats.count']} challenges</span>
+            </div>
+          </td>
+          <td styleName="styles.col-challenges">{competitor['challenge_stats.count']}</td>
+          <td styleName="styles.col-points">{competitor.points}</td>
+        </tr>
+      );
+    })
   );
 
   return (
@@ -78,10 +83,10 @@ export default function LeaderboardTable(props) {
 
 const CompetitorShape = PT.shape({
   rank: PT.number.isRequired,
-  photourl: PT.string,
-  'user.handle': PT.string.isRequired,
-  'challenge.count': PT.number.isRequired,
-  'project_result.final_score': PT.number.isRequired,
+  'challenge_stats.photo_url': PT.string,
+  'challenge_stats.winner_handle': PT.string.isRequired,
+  'challenge_stats.count': PT.number.isRequired,
+  points: PT.number.isRequired,
 });
 
 LeaderboardTable.propTypes = {
diff --git a/src/shared/components/Leaderboard/Podium/index.jsx b/src/shared/components/Leaderboard/Podium/index.jsx
index e31f15345a..deecd42ad2 100644
--- a/src/shared/components/Leaderboard/Podium/index.jsx
+++ b/src/shared/components/Leaderboard/Podium/index.jsx
@@ -63,10 +63,10 @@ export default function Podium(props) {
 
 const CompetitorShape = PT.shape({
   rank: PT.number.isRequired,
-  photourl: PT.string,
-  'user.handle': PT.string.isRequired,
-  'challenge.count': PT.number.isRequired,
-  'project_result.final_score': PT.number.isRequired,
+  'challenge_stats.photo_url': PT.string,
+  'challenge_stats.winner_handle': PT.string.isRequired,
+  'challenge_stats.count': PT.number.isRequired,
+  points: PT.number.isRequired,
 });
 
 Podium.propTypes = {
diff --git a/src/shared/components/Leaderboard/PodiumSpot/index.jsx b/src/shared/components/Leaderboard/PodiumSpot/index.jsx
index 9dd3ae837b..7e1f0b457f 100644
--- a/src/shared/components/Leaderboard/PodiumSpot/index.jsx
+++ b/src/shared/components/Leaderboard/PodiumSpot/index.jsx
@@ -62,6 +62,11 @@ export default function PodiumSpot(props) {
     competitor,
   } = props;
 
+  let photoUrl = competitor['challenge_stats.photo_url'];
+  if (photoUrl && (photoUrl[0] === '/')) {
+    photoUrl = config.URL.BASE + photoUrl;
+  }
+
   return (
     <div styleName={`styles.PodiumSpot styles.PodiumSpot--${PODIUM_ITEM_MODIFIER[competitor.rank]}`}>
       <span styleName="styles.leaderboard-avatar">
@@ -69,18 +74,18 @@ export default function PodiumSpot(props) {
           theme={{
             avatar: CUSTOM_STYLES[competitor.rank],
           }}
-          url={competitor.photourl}
+          url={photoUrl}
         />
       </span>
       <div styleName="styles.ranking">{DISPLAY_RANKING[competitor.rank]}</div>
       <div>
-        <a styleName="styles.profile-link" href={`${config.URL.BASE}/members/${competitor['user.handle']}/`}>
-          {competitor['user.handle']}
+        <a styleName="styles.profile-link" href={`${config.URL.BASE}/members/${competitor['challenge_stats.winner_handle']}/`}>
+          {competitor['challenge_stats.winner_handle']}
         </a>
       </div>
       <div styleName="styles.winnings-info">
-        <span>{competitor['project_result.final_score']} points</span>
-        <span>{competitor['challenge.count']} challenges</span>
+        <span>{competitor.points} points</span>
+        <span>{competitor['challenge_stats.count']} challenges</span>
       </div>
     </div>
   );
@@ -88,10 +93,10 @@ export default function PodiumSpot(props) {
 
 const CompetitorShape = PT.shape({
   rank: PT.number.isRequired,
-  photourl: PT.string,
-  'user.handle': PT.string.isRequired,
-  'challenge.count': PT.number.isRequired,
-  'project_result.final_score': PT.number.isRequired,
+  'challenge_stats.photo_url': PT.string,
+  'challenge_stats.winner_handle': PT.string.isRequired,
+  'challenge_stats.count': PT.number.isRequired,
+  points: PT.number.isRequired,
 });
 
 PodiumSpot.propTypes = {

From 2f58b52d715892f7eacf234052a9ff785766cd35 Mon Sep 17 00:00:00 2001
From: TonyJ <tjefts@topcoder.com>
Date: Thu, 22 Jun 2017 14:05:08 -0400
Subject: [PATCH 5/6] modified route for my submissions page

---
 src/shared/reducers/challenge.js | 2 +-
 src/shared/routes/index.jsx      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/shared/reducers/challenge.js b/src/shared/reducers/challenge.js
index d6b082a886..049bb654db 100644
--- a/src/shared/reducers/challenge.js
+++ b/src/shared/reducers/challenge.js
@@ -74,7 +74,7 @@ function create(initialState) {
  */
 export function factory(req) {
   /* Server-side rendering of Submission Management Page. */
-  if (req && req.url.match(/^\/challenge\/\d+\/my-submissions/)) {
+  if (req && req.url.match(/^\/challenges\/\d+\/my-submissions/)) {
     const tokens = {
       tokenV2: req.cookies.tcjwt,
       tokenV3: req.cookies.v3jwt,
diff --git a/src/shared/routes/index.jsx b/src/shared/routes/index.jsx
index 2375a3f784..99bf30b2e7 100644
--- a/src/shared/routes/index.jsx
+++ b/src/shared/routes/index.jsx
@@ -65,7 +65,7 @@ function Routes({ subdomains }) {
         <Route exact path="/" component={Content} />
         <Route exact path="/examples" component={Content} />
         <Route path="/examples" component={Examples} />
-        <Route path="/challenge/:challengeId/my-submissions" component={SubmissionManagement} />
+        <Route path="/challenges/:challengeId/my-submissions" component={SubmissionManagement} />
         <Route
           path="/community-challenge-listing/:keyword"
           render={props => <ChallengeListing listingOnly {...props} />}

From 090e004691215f2f4de9eaefc47a199a2c48cf37 Mon Sep 17 00:00:00 2001
From: TonyJ <tjefts@topcoder.com>
Date: Thu, 22 Jun 2017 14:25:31 -0400
Subject: [PATCH 6/6] config leaderboard for tc-prod-dev

---
 src/server/tc-communities/tc-prod-dev/metadata.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/server/tc-communities/tc-prod-dev/metadata.json b/src/server/tc-communities/tc-prod-dev/metadata.json
index acf61983cf..cb12877d64 100644
--- a/src/server/tc-communities/tc-prod-dev/metadata.json
+++ b/src/server/tc-communities/tc-prod-dev/metadata.json
@@ -33,5 +33,5 @@
       "url": "leaderboard"
     }
   ],
-  "leaderboardApiUrl": "https://api.topcoder.com/v4/looks/412/run/json/"
+  "leaderboardApiUrl": "https://api.topcoder.com/v4/looks/458/run/json/"
 }