Skip to content

Commit be4d776

Browse files
committed
[DDW-788] Restore develop
1 parent c0e7eab commit be4d776

File tree

3 files changed

+263
-154
lines changed

3 files changed

+263
-154
lines changed

source/renderer/app/App.js

Lines changed: 32 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import { SimpleDefaults } from 'react-polymorph/lib/themes/simple';
77
import DevTools from 'mobx-react-devtools';
88
import { Router } from 'react-router-dom';
99
import { IntlProvider } from 'react-intl';
10-
import { ChakraProvider, extendTheme } from '@chakra-ui/react';
1110
import { Routes } from './Routes';
1211
import { daedalusTheme } from './themes/daedalus';
1312
import { themeOverrides } from './themes/overrides';
@@ -22,29 +21,6 @@ import type { StoresMap } from './stores/index';
2221
import type { ActionsMap } from './actions/index';
2322
import NewsFeedContainer from './containers/news/NewsFeedContainer';
2423

25-
const theme = extendTheme({
26-
fonts: {
27-
body: 'NotoSans-Regular, NotoSansCJKjp-Regular',
28-
heading: 'NotoSans-Regular, NotoSansCJKjp-Regular',
29-
mono: 'NotoSans-Regular, NotoSansCJKjp-Regular',
30-
},
31-
components: {
32-
Text: {
33-
baseStyle: {
34-
fontFamily: 'NotoSans-Regular, NotoSansCJKjp-Regular',
35-
},
36-
},
37-
},
38-
colors: {
39-
stakePoolSaturation: {
40-
green: '--theme-staking-stake-pool-saturation-green-color',
41-
orange: '--theme-staking-stake-pool-saturation-orange-color',
42-
red: '--theme-staking-stake-pool-saturation-red-color',
43-
yellow: '--theme-staking-stake-pool-saturation-yellow-color',
44-
},
45-
},
46-
});
47-
4824
@observer
4925
export default class App extends Component<{
5026
stores: StoresMap,
@@ -72,46 +48,40 @@ export default class App extends Component<{
7248
!isNodeStopping && // Daedalus is not shutting down
7349
!isNodeStopped; // Daedalus is not shutting down
7450

75-
if (document.documentElement) {
76-
document.documentElement.lang = locale;
77-
}
78-
7951
return (
80-
<ChakraProvider theme={theme}>
81-
<Fragment>
82-
<ThemeManager variables={themeVars} />
83-
<Provider stores={stores} actions={actions}>
84-
<ThemeProvider
85-
theme={daedalusTheme}
86-
skins={SimpleSkins}
87-
variables={SimpleDefaults}
88-
themeOverrides={themeOverrides}
52+
<Fragment>
53+
<ThemeManager variables={themeVars} />
54+
<Provider stores={stores} actions={actions}>
55+
<ThemeProvider
56+
theme={daedalusTheme}
57+
skins={SimpleSkins}
58+
variables={SimpleDefaults}
59+
themeOverrides={themeOverrides}
60+
>
61+
<IntlProvider
62+
{...{ locale, key: locale, messages: translations[locale] }}
8963
>
90-
<IntlProvider
91-
{...{ locale, key: locale, messages: translations[locale] }}
92-
>
93-
<Fragment>
94-
<Router history={history}>
95-
<Routes />
96-
</Router>
97-
{mobxDevTools}
98-
{[
99-
isActiveDialog(ABOUT) && <AboutDialog key="aboutDialog" />,
100-
isActiveDialog(DAEDALUS_DIAGNOSTICS) && (
101-
<DaedalusDiagnosticsDialog key="daedalusDiagnosticsDialog" />
102-
),
103-
<NotificationsContainer key="notificationsContainer" />,
104-
]}
105-
{canShowNews && [
106-
<NewsFeedContainer key="newsFeedList" />,
107-
<NewsOverlayContainer key="newsFeedOverlay" />,
108-
]}
109-
</Fragment>
110-
</IntlProvider>
111-
</ThemeProvider>
112-
</Provider>
113-
</Fragment>
114-
</ChakraProvider>
64+
<Fragment>
65+
<Router history={history}>
66+
<Routes />
67+
</Router>
68+
{mobxDevTools}
69+
{[
70+
isActiveDialog(ABOUT) && <AboutDialog key="aboutDialog" />,
71+
isActiveDialog(DAEDALUS_DIAGNOSTICS) && (
72+
<DaedalusDiagnosticsDialog key="daedalusDiagnosticsDialog" />
73+
),
74+
<NotificationsContainer key="notificationsContainer" />,
75+
]}
76+
{canShowNews && [
77+
<NewsFeedContainer key="newsFeedList" />,
78+
<NewsOverlayContainer key="newsFeedOverlay" />,
79+
]}
80+
</Fragment>
81+
</IntlProvider>
82+
</ThemeProvider>
83+
</Provider>
84+
</Fragment>
11585
);
11686
}
11787
}

source/renderer/app/components/staking/widgets/ThumbPoolContent.js

Lines changed: 64 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
import BigNumber from 'bignumber.js';
33
import React, { Component } from 'react';
44
import { observer } from 'mobx-react';
5-
import { Box, Text, Center, Flex } from '@chakra-ui/react';
65
import clockIcon from '../../../assets/images/clock-corner.inline.svg';
76
import noDataDashBigImage from '../../../assets/images/no-data-dash-big.inline.svg';
87
import { getColorFromRange, getSaturationColor } from '../../../utils/colors';
@@ -13,7 +12,6 @@ import {
1312
} from '../../../config/stakingConfig';
1413
import adaIcon from '../../../assets/images/ada-symbol.inline.svg';
1514
import { formattedWalletAmount } from '../../../utils/formatters';
16-
import { AdaIcon, ClockIcon, NoDataDashIcon } from './ThumbPoolContent.styles';
1715

1816
type Props = {
1917
stakePool: StakePool,
@@ -54,100 +52,74 @@ export default class ThumbPoolContent extends Component<Props> {
5452
} = stakePool;
5553
const color = getColorFromRange(ranking, numberOfRankedStakePools);
5654

55+
const componentClassnames = classnames([
56+
styles.component,
57+
!IS_SATURATION_DATA_AVAILABLE ? styles.hideSaturation : null,
58+
]);
59+
60+
const saturationClassnames = classnames([
61+
styles.saturationBar,
62+
styles[getSaturationColor(saturation)],
63+
]);
64+
5765
return (
58-
<Flex
59-
h="16"
60-
w="20"
61-
flexDirection="column"
62-
pt={!IS_SATURATION_DATA_AVAILABLE ? '3' : '2'}
63-
pos="relative"
64-
>
65-
<Box h="full">
66-
<Center mb={!IS_SATURATION_DATA_AVAILABLE ? '1' : 'px'}>
67-
<Text
68-
fontWeight="semibold"
69-
fontSize="sm"
70-
sx={{ color: 'var(--theme-staking-stake-pool-ticker-color)' }}
71-
lineHeight="none"
72-
>
73-
{ticker}
74-
</Text>
75-
</Center>
76-
{isGridRewardsView &&
77-
(IS_RANKING_DATA_AVAILABLE && nonMyopicMemberRewards ? (
78-
<Center py="0.5" pos="relative" flex="1 1 auto">
79-
<Text fontSize="sm" fontWeight="semibold">
80-
{this.formattedRewards(potentialRewards)}
81-
</Text>
82-
<AdaIcon svg={adaIcon} />
83-
</Center>
84-
) : (
85-
<Center flex="1 1 auto">
86-
<NoDataDashIcon svg={noDataDashBigImage} />
87-
</Center>
88-
))}
89-
{!isGridRewardsView &&
90-
(IS_RANKING_DATA_AVAILABLE ? (
91-
<Center flex="1" style={{ color }} mt="1">
92-
<Text fontSize="xl" fontWeight="bold" lineHeight="none">
93-
{nonMyopicMemberRewards ? (
94-
ranking
95-
) : (
96-
<>
97-
{numberOfRankedStakePools + 1}
98-
<Text display="inline-block">*</Text>
99-
</>
100-
)}
101-
</Text>
102-
</Center>
103-
) : (
104-
<Center flex="1 1 auto">
105-
<NoDataDashIcon svg={noDataDashBigImage} />
106-
</Center>
107-
))}
108-
{IS_SATURATION_DATA_AVAILABLE && (
109-
<Center my="1">
110-
<Flex
111-
h="1"
112-
w="10"
113-
sx={{
114-
background:
115-
'var(--theme-staking-stake-pool-saturation-background-color)',
116-
}}
117-
borderRadius="sm"
118-
>
119-
<Box
120-
as="span"
121-
h="1"
122-
sx={{
123-
width: `${parseFloat(saturation).toFixed(2)}%`,
124-
}}
125-
bg={`stakePoolSaturation.${getSaturationColor(saturation)}`}
126-
/>
127-
</Flex>
128-
</Center>
129-
)}
130-
</Box>
131-
<Box alignSelf="flex-end" w="full">
132-
{IS_RANKING_DATA_AVAILABLE ? (
133-
<>
134-
{retiring && (
135-
<Box pos="absolute" right="0" top="0">
136-
<ClockIcon svg={clockIcon} />
137-
</Box>
66+
<div className={componentClassnames}>
67+
<div className={styles.ticker}>{ticker}</div>
68+
{isGridRewardsView &&
69+
(IS_RANKING_DATA_AVAILABLE && nonMyopicMemberRewards ? (
70+
<div className={styles.rewards}>
71+
{this.formattedRewards(potentialRewards)}
72+
<SVGInline svg={adaIcon} className={styles.adaIcon} />
73+
</div>
74+
) : (
75+
<div className={styles.noDataDash}>
76+
<SVGInline svg={noDataDashBigImage} />
77+
</div>
78+
))}
79+
{!isGridRewardsView &&
80+
(IS_RANKING_DATA_AVAILABLE ? (
81+
<div className={styles.ranking} style={{ color }}>
82+
{nonMyopicMemberRewards ? (
83+
ranking
84+
) : (
85+
<>
86+
{numberOfRankedStakePools + 1}
87+
<sup>*</sup>
88+
</>
13889
)}
139-
<Box h="1" w="full" sx={{ background: color }} flexShrink="0" />
140-
</>
90+
</div>
14191
) : (
142-
<Box
143-
h="1"
144-
w="full"
145-
sx={{ background: 'var(--theme-staking-stake-pool-grey-color)' }}
146-
flexShrink="0"
92+
<div className={styles.noDataDash}>
93+
<SVGInline svg={noDataDashBigImage} />
94+
</div>
95+
))}
96+
{IS_SATURATION_DATA_AVAILABLE && (
97+
<div className={saturationClassnames}>
98+
<span
99+
style={{
100+
width: `${parseFloat(saturation).toFixed(2)}%`,
101+
}}
102+
/>
103+
</div>
104+
)}
105+
{IS_RANKING_DATA_AVAILABLE ? (
106+
<>
107+
{retiring && (
108+
<div className={styles.clock}>
109+
<SVGInline svg={clockIcon} className={styles.clockIcon} />
110+
</div>
111+
)}
112+
<div
113+
className={styles.colorBand}
114+
style={{
115+
background: color,
116+
}}
147117
/>
148-
)}
149-
</Box>
150-
</Flex>
118+
</>
119+
) : (
120+
<div className={styles.greyColorBand} />
121+
)}
122+
</div>
151123
);
152124
}
153125
}

0 commit comments

Comments
 (0)