Skip to content

Commit bd386f6

Browse files
brunolemosbrunolemos
committed
[Landing] Fix double login popup
1 parent e8051ed commit bd386f6

11 files changed

Lines changed: 38 additions & 22 deletions

File tree

‎landing/pages/purchase.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import { activePaidPlans } from '@brunolemos/devhub-core'
21
import { NextPage } from 'next'
32
import { useRouter } from 'next/router'
43
import qs from 'qs'
54
import { useEffect } from 'react'
65

6+
import { getPurchaseOrSubscribeRoute } from '../src/helpers'
77
import SubscribePage from '../src/pages/SubscribePage'
88

99
export interface SubscribePageProps {}
@@ -12,10 +12,11 @@ const Purchase: NextPage<SubscribePageProps> = () => {
1212
const Router = useRouter()
1313

1414
useEffect(() => {
15-
if (!activePaidPlans.some(p => !!p.interval)) return
15+
const route = getPurchaseOrSubscribeRoute()
16+
if (route === 'purchase') return
1617

1718
Router.replace(
18-
`/subscribe${qs.stringify(Router.query, { addQueryPrefix: true })}`,
19+
`/${route}${qs.stringify(Router.query, { addQueryPrefix: true })}`,
1920
)
2021
}, [])
2122

‎landing/pages/subscribe.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import { activePaidPlans } from '@brunolemos/devhub-core'
21
import { NextPage } from 'next'
32
import { useRouter } from 'next/router'
43
import qs from 'qs'
54
import { useEffect } from 'react'
65

6+
import { getPurchaseOrSubscribeRoute } from '../src/helpers'
77
import SubscribePage from '../src/pages/SubscribePage'
88

99
export interface SubscribePageProps {}
@@ -12,10 +12,11 @@ const Buy: NextPage<SubscribePageProps> = () => {
1212
const Router = useRouter()
1313

1414
useEffect(() => {
15-
if (activePaidPlans.some(p => !!p.interval)) return
15+
const route = getPurchaseOrSubscribeRoute()
16+
if (route === 'subscribe') return
1617

1718
Router.replace(
18-
`/purchase${qs.stringify(Router.query, { addQueryPrefix: true })}`,
19+
`/${route}${qs.stringify(Router.query, { addQueryPrefix: true })}`,
1920
)
2021
}, [])
2122

‎landing/src/components/sections/CTAButtons.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
import classNames from 'classnames'
99

1010
import { useAuth } from '../../context/AuthContext'
11-
import { getSystemLabel } from '../../helpers'
11+
import { getPurchaseOrSubscribeRoute, getSystemLabel } from '../../helpers'
1212
import { useLocalizedPlanDetails } from '../../hooks/use-localized-plan-details'
1313
import { useSystem } from '../../hooks/use-system'
1414
import Button from '../common/buttons/Button'
@@ -55,15 +55,15 @@ export default function CTAButtons(props: CTAButtonsProps) {
5555
activePaidPlans[0].amount ? (
5656
<Button
5757
className="mb-2 mr-2"
58-
href={authData.appToken ? '/purchase' : '/purchase?autologin'}
58+
href={authData.appToken ? `/${getPurchaseOrSubscribeRoute()}` : `/${getPurchaseOrSubscribeRoute()}?autologin`}
5959
type="primary"
6060
>
6161
{`Purchase${priceLabel ? ` for ${priceLabel}` : ''}`}
6262
</Button>
6363
) : activePaidPlans.length === 1 && activePaidPlans[0] ? (
6464
<Button
6565
type="primary"
66-
href="/purchase"
66+
href={`/${getPurchaseOrSubscribeRoute()}`}
6767
target="_top"
6868
className="mb-2 mr-2"
6969
>

‎landing/src/components/sections/login/GitHubLoginButton.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,8 @@ export default function GitHubLoginButton(props: GitHubLoginButtonProps) {
2222
const { category } = useSystem()
2323

2424
const isAlreadyLoggedRef = useDynamicRef(!!(authData && authData.appToken))
25+
const isExecutingOAuthRef = useDynamicRef(isExecutingOAuth)
26+
2527
const autologin = 'autologin' in Router.query
2628
useEffect(() => {
2729
if (!autologin) return
@@ -35,8 +37,9 @@ export default function GitHubLoginButton(props: GitHubLoginButtonProps) {
3537
)
3638

3739
if (isAlreadyLoggedRef.current) return
40+
if (isExecutingOAuthRef.current) return
3841
startOAuth('oauth')
39-
}, [autologin, category])
42+
}, [autologin, !category || category === 'mobile'])
4043

4144
function login() {
4245
startOAuth(method)

‎landing/src/components/sections/pricing/PricingPlanBlock.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import qs from 'qs'
1010
import React from 'react'
1111

1212
import { useAuth } from '../../../context/AuthContext'
13+
import { getPurchaseOrSubscribeRoute } from '../../../helpers'
1314
import { useLocalizedPlanDetails } from '../../../hooks/use-localized-plan-details'
1415
import Button from '../../common/buttons/Button'
1516
import CheckLabel from '../../common/CheckLabel'
@@ -228,7 +229,7 @@ export function PricingPlanBlock(props: PricingPlanBlockProps) {
228229
localizedPlan.type === 'team' ? (
229230
<Button
230231
type="primary"
231-
href={`/purchase${qs.stringify(
232+
href={`/${getPurchaseOrSubscribeRoute()}${qs.stringify(
232233
{ localizedPlan: userPlan && userPlan.id },
233234
{ addQueryPrefix: true },
234235
)}`}

‎landing/src/components/sections/pricing/PricingPlans.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { activePlans, PlanType } from '@brunolemos/devhub-core'
22
import React, { Fragment, useMemo, useState } from 'react'
33

44
import { useAuth } from '../../../context/AuthContext'
5+
import { getPurchaseOrSubscribeRoute } from '../../../helpers'
56
import { Tabs } from '../../common/Tabs'
67
import { PricingPlanBlock } from './PricingPlanBlock'
78

@@ -38,7 +39,7 @@ export function PricingPlans(_props: PricingPlansProps) {
3839
<PricingPlanBlock
3940
key={`pricing-plan-${plan.id}`}
4041
banner={plan.banner}
41-
buttonLink={`/purchase?plan=${plan.cannonicalId}${
42+
buttonLink={`/${getPurchaseOrSubscribeRoute()}?plan=${plan.cannonicalId}${
4243
'' // plan.paddleProductId ? '&autostart' : ''
4344
}${!(authData && authData.appToken) ? '&autologin' : ''}`}
4445
plan={plan}

‎landing/src/helpers/index.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import {
2+
activePaidPlans,
23
constants,
34
DevHubHeaders,
45
OS,
@@ -134,3 +135,7 @@ export function toKebabCase(str: string) {
134135

135136
return matches.map(s => s.toLowerCase()).join('-')
136137
}
138+
139+
export function getPurchaseOrSubscribeRoute() {
140+
return activePaidPlans.some(p => !!p.interval) ? 'subscribe' : 'purchase'
141+
}

‎landing/src/hooks/use-oauth.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,10 @@ export function useOAuth() {
1919
gitHubAppType: GitHubAppType | 'both',
2020
options: { appToken?: string; scope?: string[] | undefined } = {},
2121
) {
22+
if (isExecutingOAuth) return
23+
24+
setIsExecutingOAuth(true)
25+
2226
const { appToken, scope = constants.DEFAULT_GITHUB_OAUTH_SCOPES } = options
2327

2428
const platform = getPlatform()
@@ -40,7 +44,6 @@ export function useOAuth() {
4044
)
4145

4246
setPopupWindow(popup)
43-
setIsExecutingOAuth(true)
4447
}
4548

4649
useWindowEvent(

‎landing/src/pages/AccountPage.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import { LogoHead } from '../components/common/LogoHead'
1414
import LandingLayout from '../components/layouts/LandingLayout'
1515
import GitHubLoginButton from '../components/sections/login/GitHubLoginButton'
1616
import { useAuth } from '../context/AuthContext'
17-
import { getTrialTimeLeftLabel } from '../helpers'
17+
import { getPurchaseOrSubscribeRoute, getTrialTimeLeftLabel } from '../helpers'
1818

1919
export interface AccountPageProps {}
2020

@@ -164,7 +164,7 @@ export default function AccountPage(_props: AccountPageProps) {
164164
{activePaidPlans.some(p => !p.interval) &&
165165
(!!(!freeTrialDays && authData.plan.interval) ? (
166166
<Link
167-
href={`/purchase${qs.stringify(
167+
href={`/${getPurchaseOrSubscribeRoute()}${qs.stringify(
168168
{
169169
plan: activePaidPlans.find(p => !p.interval)!
170170
.cannonicalId,
@@ -176,7 +176,7 @@ export default function AccountPage(_props: AccountPageProps) {
176176
</Link>
177177
) : (
178178
<Link
179-
href={`/purchase${qs.stringify(
179+
href={`/${getPurchaseOrSubscribeRoute()}${qs.stringify(
180180
{
181181
plan: activePaidPlans.find(p => !p.interval)!
182182
.cannonicalId,
@@ -215,7 +215,7 @@ export default function AccountPage(_props: AccountPageProps) {
215215
authData.plan.transformUsage.divideBy > 1))
216216
) && (
217217
<Link
218-
href={`/purchase${qs.stringify(
218+
href={`/${getPurchaseOrSubscribeRoute()}${qs.stringify(
219219
{
220220
action: 'update_seats',
221221
plan:
@@ -234,7 +234,7 @@ export default function AccountPage(_props: AccountPageProps) {
234234

235235
{!!(authData.plan && authData.plan.interval) && (
236236
<Link
237-
href={`/purchase${qs.stringify(
237+
href={`/${getPurchaseOrSubscribeRoute()}${qs.stringify(
238238
{
239239
action: 'update_card',
240240
plan:
@@ -270,7 +270,7 @@ export default function AccountPage(_props: AccountPageProps) {
270270
) : (
271271
<>
272272
{activePaidPlans.length === 1 && activePaidPlans[0] ? (
273-
<Link href="/purchase">
273+
<Link href={`/${getPurchaseOrSubscribeRoute()}`}>
274274
<a className="text-default">
275275
{freeTrialDays
276276
? 'Start free trial'

‎landing/src/pages/SuccessPage.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import Button from '../components/common/buttons/Button'
1111
import { LogoHead } from '../components/common/LogoHead'
1212
import LandingLayout from '../components/layouts/LandingLayout'
1313
import { useAuth } from '../context/AuthContext'
14+
import { getPurchaseOrSubscribeRoute } from '../helpers'
1415

1516
export interface SuccessPageProps {}
1617

@@ -109,7 +110,7 @@ export default function SuccessPage(_props: SuccessPageProps) {
109110
))}{' '}
110111
(
111112
<Link
112-
href={`/purchase${qs.stringify(
113+
href={`/${getPurchaseOrSubscribeRoute()}${qs.stringify(
113114
{
114115
action: 'update_seats',
115116
plan:
@@ -161,7 +162,7 @@ export default function SuccessPage(_props: SuccessPageProps) {
161162
</>
162163
) : authData.plan.type === 'team' ? (
163164
<Link
164-
href={`/purchase${qs.stringify(
165+
href={`/${getPurchaseOrSubscribeRoute()}${qs.stringify(
165166
{
166167
action: 'update_seats',
167168
plan:

0 commit comments

Comments
 (0)