From 355045542a6517558e104b1500bffa076a9ae140 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= Date: Thu, 1 Apr 2021 16:12:58 -0300 Subject: [PATCH 1/9] Add Loader from SRC on Settings --- src/routes/safe/components/Settings/index.tsx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/routes/safe/components/Settings/index.tsx b/src/routes/safe/components/Settings/index.tsx index e3b2f703bd..a5fbcedde9 100644 --- a/src/routes/safe/components/Settings/index.tsx +++ b/src/routes/safe/components/Settings/index.tsx @@ -1,4 +1,5 @@ -import { IconText } from '@gnosis.pm/safe-react-components' +import { IconText, Loader } from '@gnosis.pm/safe-react-components' +import { LoadingContainer } from 'src/components/LoaderContainer' import Badge from '@material-ui/core/Badge' import { makeStyles } from '@material-ui/core/styles' import cn from 'classnames' @@ -15,7 +16,6 @@ import ThresholdSettings from './ThresholdSettings' import RemoveSafeIcon from './assets/icons/bin.svg' import { styles } from './style' -import Loader from 'src/components/Loader' import Block from 'src/components/layout/Block' import ButtonLink from 'src/components/layout/ButtonLink' import Col from 'src/components/layout/Col' @@ -60,7 +60,9 @@ const Settings: React.FC = () => { const { menuOptionIndex, showRemoveSafe } = state return !owners ? ( - + + + ) : ( <> From a188ff2fdac3a1e03f02a7159ff8c14360916667 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= Date: Thu, 1 Apr 2021 16:17:58 -0300 Subject: [PATCH 2/9] Add Loader from SRC on Routes --- src/routes/index.tsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/routes/index.tsx b/src/routes/index.tsx index 6f038e12aa..b36bde6528 100644 --- a/src/routes/index.tsx +++ b/src/routes/index.tsx @@ -4,10 +4,11 @@ import { Redirect, Route, Switch, useLocation, useRouteMatch } from 'react-route import { LOAD_ADDRESS, OPEN_ADDRESS, SAFELIST_ADDRESS, SAFE_PARAM_ADDRESS, WELCOME_ADDRESS } from './routes' -import Loader from 'src/components/Loader' +import { Loader } from '@gnosis.pm/safe-react-components' import { defaultSafeSelector } from 'src/logic/safe/store/selectors' import { useAnalytics } from 'src/utils/googleAnalytics' import { DEFAULT_SAFE_INITIAL_STATE } from 'src/logic/safe/store/reducer/safe' +import { LoadingContainer } from 'src/components/LoaderContainer' const Welcome = React.lazy(() => import('./welcome/container')) @@ -60,7 +61,11 @@ const Routes = (): React.ReactElement => { } if (defaultSafe === DEFAULT_SAFE_INITIAL_STATE) { - return + return ( + + + + ) } if (defaultSafe) { From 789b8b4a2699e04ee5803f5cdcb5788091dd1d22 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= Date: Thu, 1 Apr 2021 16:22:09 -0300 Subject: [PATCH 3/9] Add Loader from SRC on Root --- src/components/Root/index.tsx | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/src/components/Root/index.tsx b/src/components/Root/index.tsx index 4c5937d0bd..0e2a904812 100644 --- a/src/components/Root/index.tsx +++ b/src/components/Root/index.tsx @@ -1,4 +1,4 @@ -import { theme as styledTheme } from '@gnosis.pm/safe-react-components' +import { theme as styledTheme, Loader } from '@gnosis.pm/safe-react-components' import { MuiThemeProvider } from '@material-ui/core/styles' import { ConnectedRouter } from 'connected-react-router' import React from 'react' @@ -6,7 +6,7 @@ import { Provider } from 'react-redux' import { ThemeProvider } from 'styled-components' import * as Sentry from '@sentry/react' -import Loader from 'src/components/Loader' +import { LoadingContainer } from 'src/components/LoaderContainer' import App from 'src/components/App' import GlobalErrorBoundary from 'src/components/GlobalErrorBoundary' import AppRoutes from 'src/routes' @@ -23,7 +23,14 @@ const Root = (): React.ReactElement => ( - {wrapInSuspense(, )} + + {wrapInSuspense( + , + + + , + )} + From ed08ba423ccc597ee2d0d679eb4164d2a00b6830 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= Date: Thu, 1 Apr 2021 16:22:38 -0300 Subject: [PATCH 4/9] Delete old Loader component --- src/components/Loader/index.tsx | 16 ---------------- 1 file changed, 16 deletions(-) delete mode 100644 src/components/Loader/index.tsx diff --git a/src/components/Loader/index.tsx b/src/components/Loader/index.tsx deleted file mode 100644 index 03147bae83..0000000000 --- a/src/components/Loader/index.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import CircularProgress from '@material-ui/core/CircularProgress' -import * as React from 'react' - -import Page from 'src/components/layout/Page' - -const centerStyle = { - margin: 'auto 0', -} - -const Loader = () => ( - - - -) - -export default Loader From 0c151d0c42d3b8344b89fb60bceee92b4459e207 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= Date: Tue, 6 Apr 2021 11:28:04 -0300 Subject: [PATCH 5/9] Table: replace CircularProgress compontent --- src/components/Table/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Table/index.tsx b/src/components/Table/index.tsx index 3505792b91..f7af3ad51a 100644 --- a/src/components/Table/index.tsx +++ b/src/components/Table/index.tsx @@ -1,4 +1,4 @@ -import CircularProgress from '@material-ui/core/CircularProgress' +import { Loader } from '@gnosis.pm/safe-react-components' import Table from '@material-ui/core/Table' import TableBody from '@material-ui/core/TableBody' import TablePagination from '@material-ui/core/TablePagination' @@ -168,7 +168,7 @@ class GnoTable extends React.Component { )} {isEmpty && ( - + )} {!disablePagination && ( From 466e36e3b580600d67f1b9f7c4189822c0a3c772 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= Date: Tue, 6 Apr 2021 11:29:28 -0300 Subject: [PATCH 6/9] ScanQR: replace CircularProgress component --- src/components/ScanQRModal/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/ScanQRModal/index.tsx b/src/components/ScanQRModal/index.tsx index 737ea4e2a2..3abaa4bb4d 100644 --- a/src/components/ScanQRModal/index.tsx +++ b/src/components/ScanQRModal/index.tsx @@ -1,4 +1,4 @@ -import CircularProgress from '@material-ui/core/CircularProgress' +import { Loader } from '@gnosis.pm/safe-react-components' import IconButton from '@material-ui/core/IconButton' import { makeStyles } from '@material-ui/core/styles' import Close from '@material-ui/icons/Close' @@ -83,7 +83,7 @@ export const ScanQRModal = ({ isOpen, onClose, onScan }: Props): React.ReactElem {error} {useWebcam === null ? ( - + ) : ( Date: Tue, 6 Apr 2021 13:41:00 -0300 Subject: [PATCH 7/9] Send Modal: replace CircularProgress component --- src/routes/safe/components/Balances/SendModal/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/routes/safe/components/Balances/SendModal/index.tsx b/src/routes/safe/components/Balances/SendModal/index.tsx index c90f1690d0..65e614b2c6 100644 --- a/src/routes/safe/components/Balances/SendModal/index.tsx +++ b/src/routes/safe/components/Balances/SendModal/index.tsx @@ -1,4 +1,4 @@ -import CircularProgress from '@material-ui/core/CircularProgress' +import { Loader } from '@gnosis.pm/safe-react-components' import { makeStyles } from '@material-ui/core/styles' import React, { Suspense, useEffect, useState } from 'react' @@ -114,7 +114,7 @@ const SendModal = ({ - + } > From 107ac9c4f172988a3fa3cee6010a035b7aa458c1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= Date: Fri, 9 Apr 2021 16:22:19 -0300 Subject: [PATCH 8/9] infinite scroll loader fix (scroll bounce) --- src/routes/safe/components/Transactions/TxList/styled.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/routes/safe/components/Transactions/TxList/styled.tsx b/src/routes/safe/components/Transactions/TxList/styled.tsx index 9058bc8064..f7c80df32d 100644 --- a/src/routes/safe/components/Transactions/TxList/styled.tsx +++ b/src/routes/safe/components/Transactions/TxList/styled.tsx @@ -516,7 +516,7 @@ export const Centered = styled.div<{ padding?: number }>` export const HorizontallyCentered = styled(Centered)<{ isVisible: boolean }>` visibility: ${({ isVisible }) => (isVisible ? 'visible' : 'hidden')}; - height: auto; + height: 100px; ` export const StyledAccordionSummary = styled(AccordionSummary)` From 84cc9fbe7c6a4efa89c3cbc00ea1154d5aa297bf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= Date: Fri, 9 Apr 2021 16:26:48 -0300 Subject: [PATCH 9/9] update the SRC dependency and replace CircularProgress component with Loader --- package.json | 2 +- .../safe/components/Transactions/TxList/TxCollapsed.tsx | 5 ++--- yarn.lock | 4 ++-- 3 files changed, 5 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 4eaefeb1c0..0c5f517888 100644 --- a/package.json +++ b/package.json @@ -161,7 +161,7 @@ "@gnosis.pm/safe-apps-sdk": "1.0.3", "@gnosis.pm/safe-apps-sdk-v1": "npm:@gnosis.pm/safe-apps-sdk@0.4.2", "@gnosis.pm/safe-contracts": "1.1.1-dev.2", - "@gnosis.pm/safe-react-components": "https://github.com/gnosis/safe-react-components.git#2e427ee", + "@gnosis.pm/safe-react-components": "https://github.com/gnosis/safe-react-components.git#b281238", "@gnosis.pm/util-contracts": "2.0.6", "@ledgerhq/hw-transport-node-hid-singleton": "5.45.0", "@material-ui/core": "^4.11.0", diff --git a/src/routes/safe/components/Transactions/TxList/TxCollapsed.tsx b/src/routes/safe/components/Transactions/TxList/TxCollapsed.tsx index 4e12f10146..724393c9e1 100644 --- a/src/routes/safe/components/Transactions/TxList/TxCollapsed.tsx +++ b/src/routes/safe/components/Transactions/TxList/TxCollapsed.tsx @@ -1,6 +1,5 @@ -import { Dot, IconText as IconTextSrc, Text, Tooltip } from '@gnosis.pm/safe-react-components' +import { Dot, IconText as IconTextSrc, Loader, Text, Tooltip } from '@gnosis.pm/safe-react-components' import { ThemeColors } from '@gnosis.pm/safe-react-components/dist/theme' -import CircularProgress from '@material-ui/core/CircularProgress' import React, { ReactElement, useContext, useRef } from 'react' import styled from 'styled-components' @@ -171,7 +170,7 @@ export const TxCollapsed = ({
{transaction?.txStatus === 'PENDING' || transaction?.txStatus === 'PENDING_FAILED' ? ( - + ) : ( (transaction?.txStatus === 'AWAITING_EXECUTION' || transaction?.txStatus === 'AWAITING_CONFIRMATIONS') && ( diff --git a/yarn.lock b/yarn.lock index 79aa2e772b..9582523f3a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1596,9 +1596,9 @@ solc "0.5.14" truffle "^5.1.21" -"@gnosis.pm/safe-react-components@https://github.com/gnosis/safe-react-components.git#2e427ee": +"@gnosis.pm/safe-react-components@https://github.com/gnosis/safe-react-components.git#b281238": version "0.5.0" - resolved "https://github.com/gnosis/safe-react-components.git#2e427ee36694c7964301fc155b0c080101a34bed" + resolved "https://github.com/gnosis/safe-react-components.git#b2812381a265e9b0a17abbc11392986e6c1c74b8" dependencies: classnames "^2.2.6" react-media "^1.10.0"