Merge pull request #594 from gnosis/develop

Bump release `v0.2.0`
gnosis · Nov 11, 2020 · 990d022 · 990d022
2 parents a4a750f + 56622db
commit 990d022
Show file tree

Hide file tree

Showing 52 changed files with 1,793 additions and 800 deletions.
diff --git a/RELEASES.md b/RELEASES.md
@@ -0,0 +1,86 @@
+Version 0.2.0 (2020-11-10)
+==========================
+
+- [Confirmation message to delete outcomes is not visible when there too many outcomes in the partition section.][575]
+- [UI - CONDITION\'S SPLIT POSITIONS section has a double bottom border when it is empty.][576]
+- [Cannot merge 3 or more positions of a deeper level.][484]
+- [\[Prod/Dev\] 404 error appears when open condition details from a position detail (when there are \>1 conditions).][580]
+- [\[FE\] Impossible to merge positions of a \'deeper\' level (collateral USDC).][362]
+- [\[FE\] Balance of a position is not cleared out after a merge.][365]
+- [\[FE\] Redeem positions: Incorrect field\'s values for the RESOLVED CONDITION ID/ REDEEMED POSITION PREVIEW.][313]
+- [\[UI/UX\] Mobile version: UI issues to fix and discuss.][330]
+- [Select positions list is blinking when search for a position.][396]
+- [\[FE\] Select position list blinking / flashing.][391]
+- [UI: Warning pop-up with an error \"expands\" Select position pop-up.][388]
+- [\[FE\] Crash when splitting from a condition with many outcomes.][490]
+- [Given 2 positions A and B\|C their merge preview is wrong.][487]
+- [\[FE\] Crash when splitting from a condition with more than 31 outcomes.][261]
+- [When disconnected, the app use default Rinkeby for the Network: it causes errors with filtering.][555]
+- [Nothing happens when click on the Ok button on the \'Are you sure you want to leave this page?\' pop-up when navigate to the same page.][552]
+- [Empty Condition Id Preview section appears when prepare an omen condition as a not logged in user.][559]
+- [Impossible to open a duplicated conditions by the left click on the Duplicated Condition warning.][522]
+- [Prepare condition: \'working..\' pop-up hangs when connect a wallet after pressing on the \'Prepare\' button.][561]
+- [Redeem Positions heading is missing.][545]
+- [Disable sorting by Reporter/Oracle in the Conditions list.][562]
+- [\[FE\] Improve pagination in the condition list section.][123]
+- [Display oracle = realit.io for a position when it belongs to an omen condition.][538]
+- [Link to oracle if it is known.][540]
+- [Omen Condition: Prepare button remains disabled until open and reselect a category.][486]
+- [Collateral symbol search: Add a possibility to search by all the words that start with a symbol.][524]
+- [Positions list: cDAI icon is blinking when open Collateral filter in mainnet.][525]
+- [Add a link to the docs.][548]
+- [Render question text, rather than ID, for Omen/Reality.eth conditions and positions.][541]
+- [\[FE\] Implement a warning pop-up to prevent data loss when leaving a page.][211]
+- [UI/UX: issues with search/filters on the Positions and Conditions pages.][440]
+- [UI issues with Positions/Conditions grids.][499]
+- [\[FE\] Split Position Result Modal window appears when transaction is failed.][276]
+- [Add a possibility to search by a custom collateral symbol.][504]
+
+Version 0.1.0 (2020-10-28)
+==========================
+
+Position list, search, and filter features
+------------------------------------------
+- [\[FE\] Position List Search Items, improvements for searching in the subgraph.][507]
+- [Positions list: Search query hags eternally when switch search options.][506]
+- [Positions/Conditions list: Pagination is not reset to the 1st page after filters applying.][505]
+- [Add a possibility to search by a custom collateral symbol.][504]
+- [Creation date: validation message is displayed when clear out any filter field.][503]
+- [\[FE\] Move \'Custom Token\' option to the bottom in the Collateral filter.][501]
+- [UI issues with Positions/Conditions grids.][499]
+- [UI: Custom collateral icons are loaded with a delay on Positions list.][496]
+- [Creation date filter: No validation message when From date to date (1 day difference).][481]
+- [\[FE\] Positions List Filters.][411]
+- [\[FE\] Positions List Search Items.][413]
+
+Condition list, search, and filter features
+-------------------------------------------
+- [\[FE\] Remove Kleros from the filters][475]
+- [\[FE\] Conditions list: Search returns no results when a creation date filter is filled with To=From date.][469]
+- [\[FE\] Search results are not refreshed when clear out values in the > \'Number of outcomes\' and \'Created date\' filters.][468]
+- [\[FE\] Search returns an odd GraphQL error when search by numbers.][467]
+- [\[FE\] Filters are not applied when the user connects.][460]
+- [\[UI / UX\] Column names overlap each other when filter is opened.][459]
+- [\[FE\] Disable report payout option when a condition is resolved.][458]
+- [\[FE\] Condition List Search Items, improvements for searching in the subgraph.][447]
+- [UI/UX: issues with search/filters on the Positions and Conditions pages.][440]
+- [\[FE - UI/UX\] New Search Feature.][403]
+- [\[FE - UI/UX\] New Filters Feature.][404]
+
+Split positions
+---------------
+- [Increase a click area in the Split positions pop-up for navigation icon.][482]
+- [Change column title from in the Select Condition pop-up.][480]
+
+Prepare Condition
+-----------------
+- [\[FE\] Make Kleros the default arbitrator for Omen Conditions.][474]
+- [Resolved in Realit.io condition is displayed like an Open one in CTEAF app.][466]
+- [\[FE\] Edit / Remove outcomes is not working.][451]
+- [Prepare Omen condition: issues with the Resolution date field.][434]
+
+Redeem Positions
+----------------
+
+- [Redeem positions: select position pop-up hangs (eternally) when click on the Position field \>3 times.][398]
+
diff --git a/VERSION b/VERSION
@@ -0,0 +1 @@
+0.2.0
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "conditional-tokens-factory",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "private": true,
   "dependencies": {
     "@apollo/react-hooks": "^3.1.5",

diff --git a/public/index.html b/public/index.html
@@ -95,6 +95,7 @@
         background-repeat: no-repeat;
         background-size: cover;
         content: '';
+        display: block;
         flex-grow: 0;
         flex-shrink: 0;
         height: 50px;

diff --git a/src/components/filters/CollateralFilterDropdown/index.tsx b/src/components/filters/CollateralFilterDropdown/index.tsx
@@ -1,4 +1,5 @@
 import React from 'react'
+import styled from 'styled-components'
 
 import { ButtonSelectLight } from 'components/buttons/ButtonSelectLight'
 import { DropdownItem, DropdownPosition } from 'components/common/Dropdown'
@@ -8,12 +9,14 @@ import { FilterTitle } from 'components/pureStyledComponents/FilterTitle'
 import { useWeb3ConnectedOrInfura } from 'contexts/Web3Context'
 import { CollateralFilterOptions, Token } from 'util/types'
 
+const Wrapper = styled.div``
+
 interface Props {
   onClick: (symbol: string, address: Maybe<string[]>) => void
   value: string
 }
 
-export const CollateralFilterDropdown = ({ onClick, value }: Props) => {
+export const CollateralFilterDropdown = ({ onClick, value, ...restProps }: Props) => {
   const { networkConfig } = useWeb3ConnectedOrInfura()
   const tokensList = networkConfig
     ? [
@@ -51,7 +54,7 @@ export const CollateralFilterDropdown = ({ onClick, value }: Props) => {
   ]
 
   return (
-    <>
+    <Wrapper {...restProps}>
       <FilterTitle>Collateral</FilterTitle>
       <FilterDropdown
         currentItem={tokenItems.findIndex((tokenItem) => tokenItem.value === value)}
@@ -67,6 +70,6 @@ export const CollateralFilterDropdown = ({ onClick, value }: Props) => {
           </DropdownItem>
         ))}
       />
-    </>
+    </Wrapper>
   )
 }
diff --git a/src/components/filters/DateFilter/index.tsx b/src/components/filters/DateFilter/index.tsx
@@ -11,6 +11,8 @@ import { getLogger } from 'util/logger'
 
 const Wrapper = styled.div``
 
+const Rows = styled.div``
+
 const Row = styled.div`
   align-items: flex-end;
   column-gap: 8px;
@@ -41,6 +43,7 @@ const Date = styled(Textfield)`
   height: 32px;
   padding-left: 6px;
   padding-right: 6px;
+  position: relative;
 `
 
 interface Props {
@@ -53,7 +56,7 @@ interface Props {
 const logger = getLogger('DateFilter')
 
 export const DateFilter: React.FC<Props> = (props) => {
-  const { onChangeFrom, onChangeTo, onSubmit, title } = props
+  const { onChangeFrom, onChangeTo, onSubmit, title, ...restProps } = props
   const toDate = useRef<HTMLInputElement>(null)
   const fromDate = useRef<HTMLInputElement>(null)
 
@@ -107,13 +110,20 @@ export const DateFilter: React.FC<Props> = (props) => {
 
   const fromGreaterThanToError = React.useMemo(
     () =>
-      to && from && to < from ? <ErrorMessage>To should be greater than From</ErrorMessage> : null,
+      to && from && to < from ? (
+        <ErrorMessage>
+          <i>To</i> must be greater than <i>From</i>
+        </ErrorMessage>
+      ) : null,
     [from, to]
   )
+
   const datesValidityError = React.useMemo(
     () =>
       !validToDate || !validFromDate ? (
-        <ErrorMessage>{`Invalid date or out of range. Valid dates are from ${MIN_DATE} to ${MAX_DATE}`}</ErrorMessage>
+        <ErrorMessage>{`Date must be between ${moment(MIN_DATE).format('L')} and ${moment(
+          MAX_DATE
+        ).format('L')}`}</ErrorMessage>
       ) : null,
     [validToDate, validFromDate]
   )
@@ -141,37 +151,39 @@ export const DateFilter: React.FC<Props> = (props) => {
   }, [from, to, onSubmit])
 
   return (
-    <Wrapper>
+    <Wrapper {...restProps}>
       <FilterTitle>{title}</FilterTitle>
-      <Row>
-        <FieldWrapper>
-          <Label>From:</Label>
-          <Date
-            max={MAX_DATE}
-            min={MIN_DATE}
-            name="dateFrom"
-            onChange={onChangeFromInternal}
-            onKeyUp={onPressEnter}
-            ref={fromDate}
-            type="date"
-          />
-        </FieldWrapper>
-      </Row>
-      <Row>
-        <FieldWrapper>
-          <Label>To:</Label>
-          <Date
-            max={MAX_DATE}
-            min={MIN_DATE}
-            name="dateTo"
-            onChange={onChangeToInternal}
-            onKeyUp={onPressEnter}
-            ref={toDate}
-            type="date"
-          />
-        </FieldWrapper>
-        <ButtonFilterSubmit disabled={submitDisabled} onClick={onSubmitInternal} />
-      </Row>
+      <Rows className="dateFilterRows">
+        <Row className="dateFilterRow">
+          <FieldWrapper>
+            <Label>From:</Label>
+            <Date
+              max={MAX_DATE}
+              min={MIN_DATE}
+              name="dateFrom"
+              onChange={onChangeFromInternal}
+              onKeyUp={onPressEnter}
+              ref={fromDate}
+              type="date"
+            />
+          </FieldWrapper>
+        </Row>
+        <Row className="dateFilterRow">
+          <FieldWrapper>
+            <Label>To:</Label>
+            <Date
+              max={MAX_DATE}
+              min={MIN_DATE}
+              name="dateTo"
+              onChange={onChangeToInternal}
+              onKeyUp={onPressEnter}
+              ref={toDate}
+              type="date"
+            />
+          </FieldWrapper>
+          <ButtonFilterSubmit disabled={submitDisabled} onClick={onSubmitInternal} />
+        </Row>
+      </Rows>
       {(!!datesValidityError || !!fromGreaterThanToError) && (
         <ErrorContainer>
           {datesValidityError}

diff --git a/src/components/filters/WrappedCollateralFilterDropdown/index.tsx b/src/components/filters/WrappedCollateralFilterDropdown/index.tsx
@@ -1,18 +1,21 @@
 import React from 'react'
+import styled from 'styled-components'
 
 import { ButtonSelectLight } from 'components/buttons/ButtonSelectLight'
 import { DropdownItem, DropdownPosition } from 'components/common/Dropdown'
 import { FilterDropdown } from 'components/pureStyledComponents/FilterDropdown'
 import { FilterTitle } from 'components/pureStyledComponents/FilterTitle'
 import { WrappedCollateralOptions } from 'util/types'
 
+const Wrapper = styled.div``
+
 interface Props {
   onClick: (value: WrappedCollateralOptions) => void
   value: string
 }
 
 export const WrappedCollateralFilterDropdown: React.FC<Props> = (props) => {
-  const { onClick, value } = props
+  const { onClick, value, ...restProps } = props
 
   const dropdownItems = [
     {
@@ -39,7 +42,7 @@ export const WrappedCollateralFilterDropdown: React.FC<Props> = (props) => {
   ]
 
   return (
-    <>
+    <Wrapper {...restProps}>
       <FilterTitle>Wrapped Collateral</FilterTitle>
       <FilterDropdown
         currentItem={dropdownItems.findIndex((item) => item.value === value)}
@@ -55,6 +58,6 @@ export const WrappedCollateralFilterDropdown: React.FC<Props> = (props) => {
           </DropdownItem>
         ))}
       />
-    </>
+    </Wrapper>
   )
 }
diff --git a/src/components/form/ConditionsDropdown/index.tsx b/src/components/form/ConditionsDropdown/index.tsx
@@ -0,0 +1,86 @@
+import React from 'react'
+import styled from 'styled-components'
+
+import { ButtonSelect } from 'components/buttons/ButtonSelect'
+import { Dropdown, DropdownItem, DropdownPosition } from 'components/common/Dropdown'
+import { TitleValue } from 'components/text/TitleValue'
+
+const Button = styled(ButtonSelect)``
+
+const ButtonText = styled.span`
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+`
+
+const IdsDropdown = styled(Dropdown)`
+  .dropdownItems {
+    width: 100%;
+  }
+`
+
+interface Props {
+  conditions: Maybe<Array<string>>
+  isLoading?: boolean
+  onClick: (conditionId: string) => void
+  title?: string
+  value: Maybe<string>
+}
+
+export const ConditionsDropdown: React.FC<Props> = (props) => {
+  const { conditions, isLoading, onClick, title = 'Condition ID', value, ...restProps } = props
+
+  const dropdownItems =
+    conditions && conditions.length
+      ? [
+          ...conditions.map((item) => {
+            return {
+              onClick: () => onClick(item),
+              value: item,
+            }
+          }),
+        ]
+      : undefined
+
+  const currentIndex =
+    value && dropdownItems && dropdownItems.length
+      ? dropdownItems.findIndex((item) => item.value === value)
+      : 0
+
+  return (
+    <TitleValue
+      title={title}
+      value={
+        <IdsDropdown
+          currentItem={currentIndex}
+          disabled={!dropdownItems || isLoading}
+          dropdownButtonContent={
+            <Button
+              content={
+                dropdownItems && dropdownItems.length ? (
+                  <ButtonText>{dropdownItems[currentIndex].value}</ButtonText>
+                ) : isLoading ? (
+                  'Loading...'
+                ) : (
+                  'No conditions available for positions...'
+                )
+              }
+            />
+          }
+          dropdownPosition={DropdownPosition.center}
+          items={
+            dropdownItems
+              ? dropdownItems.map((item, index) => (
+                  <DropdownItem key={index} onClick={item.onClick}>
+                    {item.value}
+                  </DropdownItem>
+                ))
+              : []
+          }
+          {...restProps}
+        />
+      }
+    />
+  )
+}
diff --git a/src/components/form/DisplayTableHashes/index.tsx b/src/components/form/DisplayTableHashes/index.tsx
@@ -39,7 +39,7 @@ export const DisplayTableHashes = (props: Props) => {
 
   return (
     <DataTable
-      className="outerTableWrapper inlineTable"
+      className="outerTableWrapper condensedTable"
       columns={getColumns()}
       customStyles={customStyles}
       data={hashes || []}