From 6d2c2f32af77f01beef385b1179f2180419b2cc1 Mon Sep 17 00:00:00 2001
From: Maks <41080668+Maks19@users.noreply.github.com>
Date: Fri, 12 Jul 2024 14:03:11 +0300
Subject: [PATCH] update referral progress ui (#1158)

---
 .../CurrentReferralPanelContainer.tsx         |  9 ---
 .../ReferralSettingsContainer.tsx             |  4 +-
 .../components/CurrentReferralPanel.tsx       |  9 ---
 .../components/ReferralSettings.tsx           | 56 +++++++++----------
 4 files changed, 29 insertions(+), 49 deletions(-)
 delete mode 100644 packages/web-app/src/modules/account-views/referral-views/CurrentReferralPanelContainer.tsx
 delete mode 100644 packages/web-app/src/modules/account-views/referral-views/components/CurrentReferralPanel.tsx

diff --git a/packages/web-app/src/modules/account-views/referral-views/CurrentReferralPanelContainer.tsx b/packages/web-app/src/modules/account-views/referral-views/CurrentReferralPanelContainer.tsx
deleted file mode 100644
index 3a6f71d76..000000000
--- a/packages/web-app/src/modules/account-views/referral-views/CurrentReferralPanelContainer.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import { connect } from '../../../connect'
-import type { RootStore } from '../../../Store'
-import { CurrentReferralPanel } from './components/CurrentReferralPanel'
-
-const mapStoreToProps = (store: RootStore): any => ({
-  referral: store.referral.currentReferral,
-})
-
-export const CurrentReferralPanelContainer = connect(mapStoreToProps, CurrentReferralPanel)
diff --git a/packages/web-app/src/modules/account-views/referral-views/ReferralSettingsContainer.tsx b/packages/web-app/src/modules/account-views/referral-views/ReferralSettingsContainer.tsx
index 294b6e8fa..b7feb3826 100644
--- a/packages/web-app/src/modules/account-views/referral-views/ReferralSettingsContainer.tsx
+++ b/packages/web-app/src/modules/account-views/referral-views/ReferralSettingsContainer.tsx
@@ -2,6 +2,8 @@ import { connect } from '../../../connect'
 import type { RootStore } from '../../../Store'
 import { ReferralSettings } from './components/ReferralSettings'
 
-const mapStoreToProps = (_store: RootStore): any => ({})
+const mapStoreToProps = (store: RootStore): any => ({
+  referral: store.referral.currentReferral,
+})
 
 export const ReferralSettingsContainer = connect(mapStoreToProps, ReferralSettings)
diff --git a/packages/web-app/src/modules/account-views/referral-views/components/CurrentReferralPanel.tsx b/packages/web-app/src/modules/account-views/referral-views/components/CurrentReferralPanel.tsx
deleted file mode 100644
index 90fc1bb23..000000000
--- a/packages/web-app/src/modules/account-views/referral-views/components/CurrentReferralPanel.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import type { Referral } from '../../../referral/models'
-import { CurrentReferralProgress } from './CurrentReferralProgress'
-
-interface Props {
-  referral?: Referral
-}
-
-export const CurrentReferralPanel = ({ referral }: Props) =>
-  referral?.referralDefinition && <CurrentReferralProgress referral={referral} />
diff --git a/packages/web-app/src/modules/account-views/referral-views/components/ReferralSettings.tsx b/packages/web-app/src/modules/account-views/referral-views/components/ReferralSettings.tsx
index 522485e7b..731aee23f 100644
--- a/packages/web-app/src/modules/account-views/referral-views/components/ReferralSettings.tsx
+++ b/packages/web-app/src/modules/account-views/referral-views/components/ReferralSettings.tsx
@@ -1,17 +1,15 @@
 import classnames from 'classnames'
-import type { ReactNode } from 'react'
-import { Component } from 'react'
 import type { WithStyles } from 'react-jss'
 import withStyles from 'react-jss'
-import { Divider, Head, SectionHeader } from '../../../../components'
 import type { SaladTheme } from '../../../../SaladTheme'
+import { Divider, Head, SectionHeader } from '../../../../components'
 import { withLogin } from '../../../auth-views'
 import type { Referral } from '../../../referral/models'
-import { CurrentReferralPanelContainer } from '../CurrentReferralPanelContainer'
 import { ReferralCodeContainer } from '../ReferralCodeContainer'
 import { ReferralListContainer } from '../ReferralListContainer'
 import { ReferralStatsContainer } from '../ReferralStatsContainer'
 import { SendReferralContainer } from '../SendReferralContainer'
+import { CurrentReferralProgress } from './CurrentReferralProgress'
 import { ReferralDescription } from './ReferralDescription'
 
 const styles = (theme: SaladTheme) => ({
@@ -36,35 +34,33 @@ const styles = (theme: SaladTheme) => ({
 })
 
 interface Props extends WithStyles<typeof styles> {
-  referrals?: Referral[]
+  referral: Referral
 }
 
-class _ReferralSettings extends Component<Props> {
-  public override render(): ReactNode {
-    const { classes } = this.props
-
-    return (
-      <div className={classnames(classes.container)}>
-        <Head title="Referrals" />
-        <div className={classnames(classes.content)}>
-          <div className={classes.column}>
-            <CurrentReferralPanelContainer />
+const _ReferralSettings = ({ classes, referral }: Props) => (
+  <div className={classnames(classes.container)}>
+    <Head title="Referrals" />
+    <div className={classnames(classes.content)}>
+      <div className={classes.column}>
+        {referral && (
+          <>
+            <CurrentReferralProgress referral={referral} />
             <Divider />
-            <SectionHeader>Your Code</SectionHeader>
-            <ReferralCodeContainer />
-            <SectionHeader>Send Referral</SectionHeader>
-            <SendReferralContainer />
-            <Divider />
-            <ReferralDescription />
-          </div>
-          <div className={classes.column}>
-            <ReferralStatsContainer />
-            <ReferralListContainer />
-          </div>
-        </div>
+          </>
+        )}
+        <SectionHeader>Your Code</SectionHeader>
+        <ReferralCodeContainer />
+        <SectionHeader>Send Referral</SectionHeader>
+        <SendReferralContainer />
+        <Divider />
+        <ReferralDescription />
       </div>
-    )
-  }
-}
+      <div className={classes.column}>
+        <ReferralStatsContainer />
+        <ReferralListContainer />
+      </div>
+    </div>
+  </div>
+)
 
 export const ReferralSettings = withLogin(withStyles(styles)(_ReferralSettings))