Skip to content

Commit 60d0397

Browse files
JamieRudermanJamieRuderman
committed
feat: hide billing/plans links in Android app using MobileUI wrapper
1 parent 83d5b31 commit 60d0397

File tree

10 files changed

+90
-43
lines changed

10 files changed

+90
-43
lines changed

‎.github/workflows/build-android.yml‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -129,9 +129,8 @@ jobs:
129129
packageName: com.remoteit
130130
releaseFiles: ./android/app/build/outputs/bundle/release/app-release.aab
131131
track: internal
132-
status: inProgress
132+
status: completed
133133
inAppUpdatePriority: 0
134-
userFraction: 0.2
135134
changesNotSentForReview: true
136135
# whatsNewDirectory: distribution/whatsnew
137136
# mappingFile: app/build/outputs/mapping/release/mapping.txt

‎frontend/src/components/LicensingNoticeDisplay.tsx‎

Lines changed: 28 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { Timestamp } from './Timestamp'
88
import { Notice } from './Notice'
99
import { Link } from './Link'
1010
import { Icon } from './Icon'
11+
import { MobileUI } from './MobileUI'
1112

1213
type Props = {
1314
noticeType: string
@@ -29,11 +30,13 @@ export const LicensingNoticeDisplay: React.FC<Props> = ({ noticeType, license, s
2930

3031
const UpgradeButton = (
3132
<>
32-
<Link to="/account/plans">
33-
<Button color="primary" variant="contained" size="small">
34-
Upgrade
35-
</Button>
36-
</Link>
33+
<MobileUI android hide>
34+
<Link to="/account/plans">
35+
<Button color="primary" variant="contained" size="small">
36+
Upgrade
37+
</Button>
38+
</Link>
39+
</MobileUI>
3740
<Tooltip title="Close">
3841
<IconButton onClick={onClose}>
3942
<Icon name="times" size="md" color="primary" />
@@ -49,7 +52,10 @@ export const LicensingNoticeDisplay: React.FC<Props> = ({ noticeType, license, s
4952
<Notice severity="warning" button={UpgradeButton}>
5053
{title} has expired.
5154
<em>
52-
Please upgrade your license. <Link to="/account/plans">Learn more.</Link>
55+
Please upgrade your license.{' '}
56+
<MobileUI android hide>
57+
<Link to="/account/plans">Learn more.</Link>
58+
</MobileUI>
5359
</em>
5460
</Notice>
5561
)
@@ -59,7 +65,10 @@ export const LicensingNoticeDisplay: React.FC<Props> = ({ noticeType, license, s
5965
<Notice severity="error">
6066
{title} is past due.
6167
<em>
62-
Please update your payment method. <Link to="/account/plans">Learn more.</Link>
68+
Please update your payment method.{' '}
69+
<MobileUI android hide>
70+
<Link to="/account/plans">Learn more.</Link>
71+
</MobileUI>
6372
</em>
6473
</Notice>
6574
)
@@ -70,7 +79,11 @@ export const LicensingNoticeDisplay: React.FC<Props> = ({ noticeType, license, s
7079
<Notice severity="warning">
7180
{title} is incomplete.
7281
<em>
73-
Please <Link to="/account/plans">update your payment information </Link> to continue service.
82+
Please{' '}
83+
<MobileUI android hide>
84+
<Link to="/account/plans">update your payment information </Link>
85+
</MobileUI>{' '}
86+
to continue service.
7487
</em>
7588
</Notice>
7689
)
@@ -80,7 +93,10 @@ export const LicensingNoticeDisplay: React.FC<Props> = ({ noticeType, license, s
8093
<Notice severity="warning" button={UpgradeButton}>
8194
{title} has been canceled.
8295
<em>
83-
Please please check. <Link to="/account/plans">Learn more.</Link>
96+
Please please check.{' '}
97+
<MobileUI android hide>
98+
<Link to="/account/plans">Learn more.</Link>
99+
</MobileUI>
84100
</em>
85101
</Notice>
86102
)
@@ -91,7 +107,9 @@ export const LicensingNoticeDisplay: React.FC<Props> = ({ noticeType, license, s
91107
{title} <LicensingTitle count={serviceLimit?.value} />
92108
<em>
93109
You have exceeded your limit by {serviceLimit?.actual - serviceLimit?.value}.{' '}
94-
<Link to="/account/plans">Learn more.</Link>
110+
<MobileUI android hide>
111+
<Link to="/account/plans">Learn more.</Link>
112+
</MobileUI>
95113
</em>
96114
</Notice>
97115
)

‎frontend/src/components/LicensingServiceNotice.tsx‎

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { useSelector } from 'react-redux'
66
import { Button } from '@mui/material'
77
import { Notice } from './Notice'
88
import { Link } from './Link'
9+
import { MobileUI } from './MobileUI'
910

1011
type Props = { device?: IDevice; license?: ILicense }
1112

@@ -25,17 +26,21 @@ export const LicensingServiceNotice: React.FC<Props> = props => {
2526
<Notice
2627
severity="warning"
2728
button={
28-
<Link to="/account/plans">
29-
<Button color="primary" variant="contained" size="small">
30-
Upgrade
31-
</Button>
32-
</Link>
29+
<MobileUI android hide>
30+
<Link to="/account/plans">
31+
<Button color="primary" variant="contained" size="small">
32+
Upgrade
33+
</Button>
34+
</Link>
35+
</MobileUI>
3336
}
3437
>
3538
{title} <LicensingTitle count={serviceLimit?.value} />
3639
<em>
3740
This service will be accessible for {humanizeDays(evaluationLimit?.value)}, unless you upgrade your license.
38-
<Link to="/account/plans">Learn more.</Link>
41+
<MobileUI android hide>
42+
<Link to="/account/plans">Learn more.</Link>
43+
</MobileUI>
3944
</em>
4045
</Notice>
4146
)

‎frontend/src/components/MobileUI.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ type Props = {
1313
export const MobileUI: React.FC<Props> = ({ ios, android, hide, children }) => {
1414
let mobile = useMediaQuery(`(max-width:${MOBILE_WIDTH}px)`)
1515

16-
if (android) mobile = mobile && browser.isAndroid
17-
if (ios) mobile = mobile && browser.isIOS
16+
if (android) mobile = mobile || browser.isAndroid
17+
if (ios) mobile = mobile || browser.isIOS
1818
if (hide) mobile = !mobile
1919

2020
return mobile ? <>{children}</> : null

‎frontend/src/components/PlanActionChip.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { selectRemoteitLicense } from '../selectors/organizations'
1111
import { State } from '../store'
1212
import { ColorChip, Props as ChipProps } from './ColorChip'
1313
import { useHistory } from 'react-router-dom'
14+
import { MobileUI } from './MobileUI'
1415

1516
export const PlanActionChip: React.FC<ChipProps> = ({ ...props }) => {
1617
const license = useSelector((state: State) => selectRemoteitLicense(state))
@@ -36,5 +37,9 @@ export const PlanActionChip: React.FC<ChipProps> = ({ ...props }) => {
3637
return null
3738
}
3839

39-
return <ColorChip {...props} size="small" onClick={() => history.push('/account/plans')} />
40+
return (
41+
<MobileUI android hide>
42+
<ColorChip {...props} size="small" onClick={() => history.push('/account/plans')} />
43+
</MobileUI>
44+
)
4045
}

‎frontend/src/components/UpgradeBanner.tsx‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { useSelector } from 'react-redux'
66
import { ColorChip } from './ColorChip'
77
import { Notice } from './Notice'
88
import { Box } from '@mui/material'
9+
import { MobileUI } from './MobileUI'
910

1011
export const UpgradeBanner: React.FC = () => {
1112
const plan = useSelector(selectPlan)
@@ -14,9 +15,11 @@ export const UpgradeBanner: React.FC = () => {
1415
<Notice gutterBottom>
1516
Access premium features & support
1617
<Box marginTop={1.4}>
17-
<Link to="/account/plans">
18-
<ColorChip size="small" variant="contained" color="primary" label="Upgrade Plan" />
19-
</Link>
18+
<MobileUI android hide>
19+
<Link to="/account/plans">
20+
<ColorChip size="small" variant="contained" color="primary" label="Upgrade Plan" />
21+
</Link>
22+
</MobileUI>
2023
</Box>
2124
</Notice>
2225
)

‎frontend/src/components/UpgradeNotice.tsx‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { selectLimits } from '../selectors/organizations'
77
import { useSelector, useDispatch } from 'react-redux'
88
import { State, Dispatch } from '../store'
99
import { Pre } from './Pre'
10+
import { MobileUI } from './MobileUI'
1011

1112
const oneWeek = 1000 * 60 * 60 * 24 * 7
1213

@@ -32,11 +33,13 @@ export const UpgradeNotice: React.FC<React.HTMLAttributes<HTMLDivElement>> = ()
3233
severity="warning"
3334
onClose={() => dispatch.ui.setPersistent({ updateNoticeCleared: Date.now() })}
3435
button={
35-
<Link to="/account/plans">
36-
<Button variant="contained" color="warning" size="small">
37-
Upgrade
38-
</Button>
39-
</Link>
36+
<MobileUI android hide>
37+
<Link to="/account/plans">
38+
<Button variant="contained" color="warning" size="small">
39+
Upgrade
40+
</Button>
41+
</Link>
42+
</MobileUI>
4043
}
4144
>
4245
{message}

‎frontend/src/pages/CustomerPage.tsx‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { FormDisplay } from '../components/FormDisplay'
1010
import { Container } from '../components/Container'
1111
import { Avatar } from '../components/Avatar'
1212
import { Title } from '../components/Title'
13+
import { MobileUI } from '../components/MobileUI'
1314

1415
export const CustomerPage: React.FC = () => {
1516
const { userID = '' } = useParams<{ userID: string }>()
@@ -44,9 +45,11 @@ export const CustomerPage: React.FC = () => {
4445
>
4546
<Typography variant="subtitle1" marginRight={3}>
4647
<Title>License</Title>
47-
<Button to={`/organization/customer/${userID}/plans`} size="small" variant="contained" component={Link}>
48-
Update Plan
49-
</Button>
48+
<MobileUI android hide>
49+
<Button to={`/organization/customer/${userID}/plans`} size="small" variant="contained" component={Link}>
50+
Update Plan
51+
</Button>
52+
</MobileUI>
5053
</Typography>
5154
<LicensingSetting licenses={license ? [{ ...license, limits }] : []} />
5255
<FormDisplay

‎frontend/src/pages/OrganizationAddPage.tsx‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import { ColorChip } from '../components/ColorChip'
1313
import { Gutters } from '../components/Gutters'
1414
import { Notice } from '../components/Notice'
1515
import { Title } from '../components/Title'
16+
import { MobileUI } from '../components/MobileUI'
1617

1718
export const OrganizationAddPage = () => {
1819
const organization = useSelector(selectOrganization)
@@ -74,9 +75,17 @@ export const OrganizationAddPage = () => {
7475
<Notice
7576
severity="warning"
7677
button={
77-
<Link to="/account/plans">
78-
<ColorChip sx={{ marginTop: 1.4 }} size="small" variant="contained" color="warning" label="Upgrade" />
79-
</Link>
78+
<MobileUI android hide>
79+
<Link to="/account/plans">
80+
<ColorChip
81+
sx={{ marginTop: 1.4 }}
82+
size="small"
83+
variant="contained"
84+
color="warning"
85+
label="Upgrade"
86+
/>
87+
</Link>
88+
</MobileUI>
8089
}
8190
fullWidth
8291
>

‎frontend/src/pages/OrganizationRolesPage.tsx‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -43,14 +43,16 @@ export const OrganizationRolesPage: React.FC = () => {
4343
{!limits.roles && (
4444
<Notice severity="info" gutterTop>
4545
Upgrade your plan to Business to add custom roles.
46-
<Button
47-
variant="contained"
48-
size="small"
49-
onClick={() => history.push('/account/plans')}
50-
sx={{ display: 'block', marginTop: 1, marginBottom: 1 }}
51-
>
52-
Upgrade
53-
</Button>
46+
<MobileUI android hide>
47+
<Button
48+
variant="contained"
49+
size="small"
50+
onClick={() => history.push('/account/plans')}
51+
sx={{ display: 'block', marginTop: 1, marginBottom: 1 }}
52+
>
53+
Upgrade
54+
</Button>
55+
</MobileUI>
5456
</Notice>
5557
)}
5658
<Typography variant="subtitle1">

0 commit comments

Comments
 (0)