From 5eff7eef60c5eb1b81c7c23aae253e0a4e0121bc Mon Sep 17 00:00:00 2001 From: mohandast52 Date: Tue, 23 Jul 2024 16:29:47 +0530 Subject: [PATCH 1/3] feat: Update NotifyRewards component name --- frontend/components/Main/MainRewards.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/components/Main/MainRewards.tsx b/frontend/components/Main/MainRewards.tsx index 8f775b163..50ef32f30 100644 --- a/frontend/components/Main/MainRewards.tsx +++ b/frontend/components/Main/MainRewards.tsx @@ -65,7 +65,7 @@ const DisplayRewards = () => { const SHARE_TEXT = `I just earned my first reward through the Operate app powered by #olas!\n\nDownload the Pearl app:`; const OPERATE_URL = 'https://olas.network/operate?pearl=first-reward'; -const NotifyRewards = () => { +const NotifyRewardsModal = () => { const { isEligibleForRewards, availableRewardsForEpochEth } = useReward(); const { totalOlasBalance } = useBalance(); const { showNotification, store } = useElectronApi(); @@ -179,6 +179,6 @@ const NotifyRewards = () => { export const MainRewards = () => ( <> - + ); From 34d0eb6769c2a86e5d3b6165e5bb1dc3e0406b9a Mon Sep 17 00:00:00 2001 From: mohandast52 Date: Tue, 23 Jul 2024 17:45:01 +0530 Subject: [PATCH 2/3] feat: Add agent eviction alert to MainOlasBalance component --- electron/store.js | 1 + frontend/components/Main/MainOlasBalance.tsx | 84 ++++++++++++++++++-- frontend/components/Main/MainRewards.tsx | 3 + frontend/types/ElectronApi.ts | 1 + 4 files changed, 81 insertions(+), 8 deletions(-) diff --git a/electron/store.js b/electron/store.js index 5577decff..afbc7f62d 100644 --- a/electron/store.js +++ b/electron/store.js @@ -4,6 +4,7 @@ const defaultSchema = { isInitialFunded: { type: 'boolean', default: false }, firstStakingRewardAchieved: { type: 'boolean', default: false }, firstRewardNotificationShown: { type: 'boolean', default: false }, + agentEvictionAlertShown: { type: 'boolean', default: false }, }; const setupStoreIpc = async (ipcChannel, mainWindow, storeInitialValues) => { diff --git a/frontend/components/Main/MainOlasBalance.tsx b/frontend/components/Main/MainOlasBalance.tsx index f51cf2ef9..2595a15bf 100644 --- a/frontend/components/Main/MainOlasBalance.tsx +++ b/frontend/components/Main/MainOlasBalance.tsx @@ -1,17 +1,20 @@ import { InfoCircleOutlined } from '@ant-design/icons'; -import { Flex, Skeleton, Tooltip, Typography } from 'antd'; +import { Button, Flex, Skeleton, Tooltip, Typography } from 'antd'; import { useMemo } from 'react'; import styled from 'styled-components'; +import { Alert } from '@/components/Alert'; import { COLOR } from '@/constants/colors'; import { UNICODE_SYMBOLS } from '@/constants/symbols'; import { useBalance } from '@/hooks/useBalance'; +import { useElectronApi } from '@/hooks/useElectronApi'; import { useReward } from '@/hooks/useReward'; +import { useStore } from '@/hooks/useStore'; import { balanceFormat } from '@/utils/numberFormatters'; import { CardSection } from '../styled/CardSection'; -const { Text } = Typography; +const { Text, Title } = Typography; const Balance = styled.span` letter-spacing: -2px; margin-right: 4px; @@ -103,6 +106,68 @@ const CurrentBalance = () => { ); }; +// const AvoidSuspensionAlert = styled(Alert)` +// .anticon.ant-alert-icon { +// height: 20px; +// width: 20px; +// svg { +// width: 100%; +// height: 100%; +// } +// } +// `; +const AvoidSuspensionAlert = () => { + const { store } = useElectronApi(); + + return ( + + + Avoid suspension! + + + Run your agent for at least half an hour a day to make sure it hits + its targets. If it misses its targets 2 days in a row, it’ll be + suspended. You won’t be able to run it or earn rewards for several + days. + + + + } + style={{ marginBottom: 8 }} + /> + ); +}; + +const AvoidSuspension = () => { + const { storeState } = useStore(); + + // console.log(storeState); + + // If first reward notification is shown BUT + // agent eviction alert is not shown, show this alert + const isAvoidSuspensionAlertShown = + storeState?.firstRewardNotificationShown && + !storeState?.agentEvictionAlertShown; + + if (!isAvoidSuspensionAlertShown) { + return ; + } + + return null; +}; + export const MainOlasBalance = () => { const { isBalanceLoaded, totalOlasBalance } = useBalance(); @@ -113,14 +178,17 @@ export const MainOlasBalance = () => { return ( + {isBalanceLoaded ? ( <> - - - {UNICODE_SYMBOLS.OLAS} - {balance} - OLAS - +
+ + + {UNICODE_SYMBOLS.OLAS} + {balance} + OLAS + +
) : ( diff --git a/frontend/components/Main/MainRewards.tsx b/frontend/components/Main/MainRewards.tsx index 50ef32f30..bb022d1ec 100644 --- a/frontend/components/Main/MainRewards.tsx +++ b/frontend/components/Main/MainRewards.tsx @@ -101,6 +101,9 @@ const NotifyRewardsModal = () => { // once the notification is closed, set the flag to true store?.set?.('firstRewardNotificationShown', true); + + // and show the eviction educate information to the user + // store?.set?.('agentEvictionAlertShown', true); }, [store]); const onTwitterShare = useCallback(() => { diff --git a/frontend/types/ElectronApi.ts b/frontend/types/ElectronApi.ts index 2f586a0d9..df0456a47 100644 --- a/frontend/types/ElectronApi.ts +++ b/frontend/types/ElectronApi.ts @@ -3,6 +3,7 @@ export type ElectronStore = { isInitialFunded?: boolean; firstStakingRewardAchieved?: boolean; firstRewardNotificationShown?: boolean; + agentEvictionAlertShown?: boolean; }; export type ElectronTrayIconStatus = 'low-gas' | 'running' | 'paused'; From 8b59c2a2e0cb89ed4066d1aa82ba21abaf16abbb Mon Sep 17 00:00:00 2001 From: mohandast52 Date: Tue, 23 Jul 2024 17:54:17 +0530 Subject: [PATCH 3/3] feat: Refactor AvoidSuspensionAlert in MainOlasBalance component --- frontend/components/Main/MainOlasBalance.tsx | 121 +++++++++---------- frontend/components/Main/MainRewards.tsx | 3 - 2 files changed, 59 insertions(+), 65 deletions(-) diff --git a/frontend/components/Main/MainOlasBalance.tsx b/frontend/components/Main/MainOlasBalance.tsx index 2595a15bf..38e358350 100644 --- a/frontend/components/Main/MainOlasBalance.tsx +++ b/frontend/components/Main/MainOlasBalance.tsx @@ -106,70 +106,69 @@ const CurrentBalance = () => { ); }; -// const AvoidSuspensionAlert = styled(Alert)` -// .anticon.ant-alert-icon { -// height: 20px; -// width: 20px; -// svg { -// width: 100%; -// height: 100%; -// } -// } -// `; +const AvoidSuspensionAlertContainer = styled.div` + .ant-alert-info { + margin-bottom: 8px; + .anticon.ant-alert-icon { + height: 20px; + width: 20px; + svg { + width: 100%; + height: 100%; + } + } + } +`; + const AvoidSuspensionAlert = () => { const { store } = useElectronApi(); return ( - - - Avoid suspension! - - - Run your agent for at least half an hour a day to make sure it hits - its targets. If it misses its targets 2 days in a row, it’ll be - suspended. You won’t be able to run it or earn rewards for several - days. - - - - } - style={{ marginBottom: 8 }} - /> + + + + Avoid suspension! + + + Run your agent for at least half an hour a day to make sure it + hits its targets. If it misses its targets 2 days in a row, it’ll + be suspended. You won’t be able to run it or earn rewards for + several days. + + + + } + /> + ); }; -const AvoidSuspension = () => { +export const MainOlasBalance = () => { const { storeState } = useStore(); - - // console.log(storeState); + const { isBalanceLoaded, totalOlasBalance } = useBalance(); // If first reward notification is shown BUT - // agent eviction alert is not shown, show this alert - const isAvoidSuspensionAlertShown = - storeState?.firstRewardNotificationShown && - !storeState?.agentEvictionAlertShown; - - if (!isAvoidSuspensionAlertShown) { - return ; - } + // agent eviction alert is NOT yet shown, show this alert. + const canShowAvoidSuspensionAlert = useMemo(() => { + if (!storeState) return false; - return null; -}; - -export const MainOlasBalance = () => { - const { isBalanceLoaded, totalOlasBalance } = useBalance(); + return ( + storeState.firstRewardNotificationShown && + !storeState.agentEvictionAlertShown + ); + }, [storeState]); const balance = useMemo(() => { if (totalOlasBalance === undefined) return '--'; @@ -178,17 +177,15 @@ export const MainOlasBalance = () => { return ( - + {canShowAvoidSuspensionAlert ? : null} {isBalanceLoaded ? ( <> -
- - - {UNICODE_SYMBOLS.OLAS} - {balance} - OLAS - -
+ + + {UNICODE_SYMBOLS.OLAS} + {balance} + OLAS + ) : ( diff --git a/frontend/components/Main/MainRewards.tsx b/frontend/components/Main/MainRewards.tsx index bb022d1ec..50ef32f30 100644 --- a/frontend/components/Main/MainRewards.tsx +++ b/frontend/components/Main/MainRewards.tsx @@ -101,9 +101,6 @@ const NotifyRewardsModal = () => { // once the notification is closed, set the flag to true store?.set?.('firstRewardNotificationShown', true); - - // and show the eviction educate information to the user - // store?.set?.('agentEvictionAlertShown', true); }, [store]); const onTwitterShare = useCallback(() => {