Gui kit components

.circleci/config.yml

@@ -230,14 +230,15 @@ workflows:
           filters:
             branches:
               only:
-                - milestone-20200917
+                - milestone-20200924
                 - develop
       # This is alternate dev env for parallel testing
       - "build-test":
           context : org-global      
           filters:
             branches:
               only:                
+                - hot-fix-ad-code
                 - feature-contentful
       # This is alternate dev env for parallel testing
       - "build-qa":
@@ -260,7 +261,7 @@ workflows:
           filters:
             branches:
               only:
-                - feature-contentful
+                - develop
       # Production builds are exectuted 
       # when PR is merged to the master
       # Don't change anything in this configuration

__tests__/shared/__snapshots__/index.jsx.snap

@@ -19,6 +19,10 @@ exports[`Snapshot match 1`] = `
       href="/challenges/manifest.json"
       rel="manifest"
     />
+    <script
+      async={true}
+      src="https://43d132d5dbff47c59d9d53ad448f93c2.js.ubembed.com"
+    />
   </HelmetWrapper>
   <withRouter(Connect(Routes)) />
   <Connect(ErrorMessageContainer) />
@@ -53,6 +57,10 @@ exports[`Snapshot match 2`] = `
       href="/challenges/manifest.json"
       rel="manifest"
     />
+    <script
+      async={true}
+      src="https://43d132d5dbff47c59d9d53ad448f93c2.js.ubembed.com"
+    />
   </HelmetWrapper>
   <withRouter(Connect(Routes)) />
   <Connect(ErrorMessageContainer) />

__tests__/shared/components/ChallengeTile/__snapshots__/index.jsx.snap

@@ -202,12 +202,15 @@ exports[`renders marathon 1`] = `
       className="src-shared-components-ChallengeTile-___style__completed-challenge___3w5tT"
     >
       <header>
-        <a
+        <Link
           className="src-shared-components-ChallengeTile-___style__name___1jF7j"
-          href="https://community.topcoder.com/longcontest/stats/?module=ViewOverview&rd=17153"
+          replace={false}
+          to="/challenges/15404"
         >
-          2018 TCO Marathon
-        </a>
+          <span>
+            2018 TCO Marathon
+          </span>
+        </Link>
         <p
           className="src-shared-components-ChallengeTile-___style__subtrack-color___2AJaw"
         >

__tests__/shared/components/GUIKit/Checkbox/__snapshots__/index.jsx.snap

@@ -0,0 +1,24 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Default render 1`] = `
+<label
+  className="src-shared-components-GUIKit-Checkbox-___style__container___2a1GZ src-shared-components-GUIKit-Checkbox-___style__smSize___3aux-"
+>
+  <input
+    checked={false}
+    onChange={[Function]}
+    type="checkbox"
+  />
+  <div
+    className="src-shared-components-GUIKit-Checkbox-___style__checkmark___1xdsj"
+  >
+    <IconCheckSolid
+      className="src-shared-components-GUIKit-Checkbox-___style__after___2rEBg"
+      height={13}
+      viewBox="0 0 15 13"
+      width={13}
+      xmlns="http://www.w3.org/2000/svg"
+    />
+  </div>
+</label>
+`;

__tests__/shared/components/GUIKit/Checkbox/index.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import Renderer from 'react-test-renderer/shallow';
+
+import Checkbox from 'components/GUIKit/Checkbox';
+
+
+const rnd = new Renderer();
+
+it('Default render', () => {
+  rnd.render((<Checkbox />));
+  expect(rnd.getRenderOutput()).toMatchSnapshot();
+});

__tests__/shared/components/GUIKit/Datepicker/__snapshots__/index.jsx.snap

@@ -0,0 +1,118 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Default render 1`] = `
+<div
+  className="datepickerContainer src-shared-components-GUIKit-Datepicker-___style__container___Sl58X"
+>
+  <withStyles(SingleDatePicker)
+    anchorDirection="left"
+    appendToBody={false}
+    block={false}
+    calendarInfoPosition="bottom"
+    customCloseIcon={null}
+    customInputIcon={
+      <IconCalendar
+        height="16"
+        viewBox="0 0 16 16"
+        width="16"
+        xmlns="http://www.w3.org/2000/svg"
+      />
+    }
+    date={null}
+    daySize={53}
+    disableScroll={false}
+    disabled={false}
+    displayFormat="MMM DD, YYYY"
+    enableOutsideDays={true}
+    firstDayOfWeek={1}
+    focused={false}
+    hideKeyboardShortcutsPanel={true}
+    horizontalMargin={0}
+    horizontalMonthPadding={13}
+    id="null----false"
+    initialVisibleMonth={null}
+    inputIconPosition="after"
+    isDayBlocked={[Function]}
+    isDayHighlighted={[Function]}
+    isOutsideRange={[Function]}
+    isRTL={false}
+    keepFocusOnInput={false}
+    keepOpenOnDateSelect={false}
+    monthFormat="MMMM YYYY"
+    navNext={
+      <IconNext
+        height="16"
+        viewBox="0 0 10 16"
+        width="10"
+        xmlns="http://www.w3.org/2000/svg"
+      />
+    }
+    navPrev={
+      <IconPrev
+        height="16"
+        viewBox="0 0 10 16"
+        width="10"
+        xmlns="http://www.w3.org/2000/svg"
+      />
+    }
+    noBorder={false}
+    numberOfMonths={1}
+    onClose={[Function]}
+    onDateChange={[Function]}
+    onFocusChange={[Function]}
+    onNextMonthClick={[Function]}
+    onPrevMonthClick={[Function]}
+    openDirection="down"
+    orientation="horizontal"
+    phrases={
+      Object {
+        "calendarLabel": "Calendar",
+        "chooseAvailableDate": [Function],
+        "clearDate": "Clear Date",
+        "closeDatePicker": "Close",
+        "dateIsSelected": [Function],
+        "dateIsUnavailable": [Function],
+        "enterKey": "Enter key",
+        "escape": "Escape key",
+        "hideKeyboardShortcutsPanel": "Close the shortcuts panel.",
+        "homeEnd": "Home and end keys",
+        "jumpToNextMonth": "Move forward to switch to the next month.",
+        "jumpToPrevMonth": "Move backward to switch to the previous month.",
+        "keyboardNavigationInstructions": "Press the down arrow key to interact with the calendar and
+  select a date. Press the question mark key to get the keyboard shortcuts for changing dates.",
+        "keyboardShortcuts": "Keyboard Shortcuts",
+        "leftArrowRightArrow": "Right and left arrow keys",
+        "moveFocusByOneDay": "Move backward (left) and forward (right) by one day.",
+        "moveFocusByOneMonth": "Switch months.",
+        "moveFocusByOneWeek": "Move backward (up) and forward (down) by one week.",
+        "moveFocustoStartAndEndOfWeek": "Go to the first or last day of a week.",
+        "openThisPanel": "Open this panel.",
+        "pageUpPageDown": "page up and page down keys",
+        "questionMark": "Question mark",
+        "returnFocusToInput": "Return to the date input field.",
+        "selectFocusedDate": "Select the date in focus.",
+        "showKeyboardShortcutsPanel": "Open the keyboard shortcuts panel.",
+        "upArrowDownArrow": "up and down arrow keys",
+      }
+    }
+    placeholder=""
+    readOnly={false}
+    regular={false}
+    renderCalendarInfo={null}
+    renderDayContents={[Function]}
+    renderMonthElement={null}
+    renderMonthText={null}
+    reopenPickerOnClearDate={false}
+    required={false}
+    screenReaderInputMessage=""
+    showClearDate={false}
+    showDefaultInputIcon={false}
+    small={false}
+    verticalHeight={null}
+    verticalSpacing={22}
+    weekDayFormat="ddd"
+    withFullScreenPortal={false}
+    withPortal={false}
+  />
+</div>
+`;

__tests__/shared/components/GUIKit/Datepicker/index.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import Renderer from 'react-test-renderer/shallow';
+
+import Datepicker from 'components/GUIKit/Datepicker';
+
+
+const rnd = new Renderer();
+
+it('Default render', () => {
+  rnd.render((<Datepicker />));
+  expect(rnd.getRenderOutput()).toMatchSnapshot();
+});

__tests__/shared/components/GUIKit/Dropdown/__snapshots__/index.jsx.snap

@@ -0,0 +1,77 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Default render 1`] = `
+<div
+  className="dropdownContainer src-shared-components-GUIKit-Dropdown-___style__container___1qhm8 src-shared-components-GUIKit-Dropdown-___style__lgSize___1fYu0 src-shared-components-GUIKit-Dropdown-___style__haveValue___1b1qb"
+  onBlurCapture={[Function]}
+  onFocusCapture={[Function]}
+>
+  <div
+    className="src-shared-components-GUIKit-Dropdown-___style__relative___1Yq0F"
+  >
+    <Select
+      arrowRenderer={[Function]}
+      autoBlur={true}
+      autosize={false}
+      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 {
+            "label": "dropdownLable",
+            "value": "dropdownLable",
+          },
+        ]
+      }
+      pageSize={5}
+      placeholder=""
+      removeSelected={true}
+      required={false}
+      rtl={false}
+      scrollMenuIntoView={true}
+      searchable={true}
+      simpleValue={false}
+      tabSelectsValue={true}
+      trimFilter={true}
+      value="dropdownLable"
+      valueComponent={[Function]}
+      valueKey="value"
+    />
+    <img
+      alt="dropdown-arraow-icon"
+      className="src-shared-components-GUIKit-Dropdown-___style__iconDropdown___2bPox"
+      height="9"
+      src="/community-app-assets/images/e740c51bb099110dff2900fa4fc94d72.png"
+      width="15"
+    />
+  </div>
+</div>
+`;

__tests__/shared/components/GUIKit/Dropdown/index.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import Renderer from 'react-test-renderer/shallow';
+
+import Dropdown from 'components/GUIKit/Dropdown';
+
+
+const rnd = new Renderer();
+
+it('Default render', () => {
+  rnd.render((<Dropdown options={[{ label: 'dropdownLable', selected: true }]} />));
+  expect(rnd.getRenderOutput()).toMatchSnapshot();
+});