From 76d6cc4e4cee2c1400013d9802630e8424baa42e Mon Sep 17 00:00:00 2001 From: Guillaume Date: Mon, 17 Jun 2024 10:23:10 +0200 Subject: [PATCH] Improve plans buttons behavior --- components/plans.tsx | 1159 ++++++++++++++++---------------- models/user.model.ts | 43 -- package-lock.json | 87 ++- package.json | 1 + pages/account/subscription.tsx | 2 +- styles/_user-variables.scss | 1 + utils/queries.tsx | 3 +- 7 files changed, 651 insertions(+), 645 deletions(-) diff --git a/components/plans.tsx b/components/plans.tsx index bcfbb54c..b6680dc8 100644 --- a/components/plans.tsx +++ b/components/plans.tsx @@ -1,3 +1,4 @@ +import { Plans } from '@mockoon/cloud'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import Link from 'next/link'; import { useRouter } from 'next/router'; @@ -68,291 +69,262 @@ const suffixes = { YEARLY: 'yr' }; -const Plans: FunctionComponent<{ showFree: boolean; showTagline: boolean }> = - function ({ showFree, showTagline }) { - const auth = useAuth(); - const currentUser = useCurrentUser(); - const router = useRouter(); - const [planFrequency, setPlanFrequency] = useState('MONTHLY'); - const [seats, setSeats] = useState(1); - const [configurePlan, setConfigurePlan] = useState(null); - const discountLimit = - parseInt(process.env.NEXT_PUBLIC_DISCOUNT_TIME_LIMIT, 10) - 3600000; - const discountEnabled = new Date().getTime() < discountLimit; - const [countdownDays, countdownHours, countdownMinutes, countdownSeconds] = - useCountdown(discountLimit); - - const openCheckout = (planId: string) => { - // @ts-ignore - Paddle.Checkout.open({ - settings: { - theme: 'light', - locale: 'en' - }, - discountId: discountEnabled - ? discounts[planId][planFrequency] || null - : null, - items: [ - { - priceId: pricing[planId][planFrequency].priceId, - quantity: planId === 'SOLO' ? 1 : seats - } - ], - customer: { - email: auth.user.email - }, - customData: { - userId: auth.user.uid +const PlansView: FunctionComponent<{ + showFree: boolean; + showTagline: boolean; +}> = function ({ showFree, showTagline }) { + const auth = useAuth(); + const currentUser = useCurrentUser(); + const router = useRouter(); + const [planFrequency, setPlanFrequency] = useState('MONTHLY'); + const [seats, setSeats] = useState(1); + const [configurePlan, setConfigurePlan] = useState(null); + const discountLimit = + parseInt(process.env.NEXT_PUBLIC_DISCOUNT_TIME_LIMIT, 10) - 3600000; + const discountEnabled = new Date().getTime() < discountLimit; + const [countdownDays, countdownHours, countdownMinutes, countdownSeconds] = + useCountdown(discountLimit); + + const openCheckout = (planId: string) => { + // @ts-ignore + Paddle.Checkout.open({ + settings: { + theme: 'light', + locale: 'en' + }, + discountId: discountEnabled + ? discounts[planId][planFrequency] || null + : null, + items: [ + { + priceId: pricing[planId][planFrequency].priceId, + quantity: planId === 'SOLO' ? 1 : seats } - }); - }; - - const redirect = (planId: string) => { - if (!auth.isAuth) { - localStorage.setItem('redirect', '/account/subscribe/'); - window.location.href = `/signup/`; - return; - } - - if (auth.isAuth && currentUser.data?.plan !== 'FREE') { - router.push('/account/subscription/'); - return; - } - - if (planId === 'SOLO') { - setConfigurePlan(null); - setSeats(1); + ], + customer: { + email: auth.user.email + }, + customData: { + userId: auth.user.uid } + }); + }; - if (planId === 'TEAM' || planId === 'ENTERPRISE') { - setConfigurePlan(planId); - setSeats(pricing[planId].minSeats); - return; - } + const redirect = (planId: string) => { + if (!auth.isAuth) { + localStorage.setItem('redirect', '/account/subscribe/'); + window.location.href = `/signup/`; + return; + } + + if (auth.isAuth && currentUser.data?.plan !== 'FREE') { + router.push('/account/subscription/'); + return; + } + + if (planId === 'SOLO') { + setConfigurePlan(null); + setSeats(1); + } + + if (planId === 'TEAM' || planId === 'ENTERPRISE') { + setConfigurePlan(planId); + setSeats(pricing[planId].minSeats); + return; + } + + openCheckout(planId); + }; - openCheckout(planId); - }; - - return ( - <> - - -
-
- {discountEnabled && ( -
-
- 🤖 Cyber Monday! Get 50% off a new Solo - plan subscription!
(50% off the first year or first 6 - months, discount applied at checkout) -
- Remaining time:{' '} - {countdownDays > 0 && ( - - - {countdownDays} day{countdownDays > 1 ? 's' : ''} - - - )}{' '} - {countdownHours > 0 && ( - - - {countdownHours} hour{countdownHours > 1 ? 's' : ''} - - - )}{' '} - {countdownMinutes > 0 && ( - - - {countdownMinutes} minute - {countdownMinutes > 1 ? 's' : ''} - - - )} -
+ const subscribeBtn = (plan: Plans) => ( + + ); + + return ( + <> + + +
+
+ {discountEnabled && ( +
+
+ 🤖 Cyber Monday! Get 50% off a new Solo plan + subscription!
(50% off the first year or first 6 + months, discount applied at checkout) +
+ Remaining time:{' '} + {countdownDays > 0 && ( + + + {countdownDays} day{countdownDays > 1 ? 's' : ''} + + + )}{' '} + {countdownHours > 0 && ( + + + {countdownHours} hour{countdownHours > 1 ? 's' : ''} + + + )}{' '} + {countdownMinutes > 0 && ( + + + {countdownMinutes} minute + {countdownMinutes > 1 ? 's' : ''} + + + )}
- )} -
-
+ )} +
+
+ { + setPlanFrequency(event.target.value); + }} + /> +
+ Monthly + + + { + setPlanFrequency(event.target.value); + }} + /> +
- {configurePlan && ( - <> -
-
- -
-
- { - const newSeats = parseInt(event.target.value); - - if ( - isNaN(newSeats) || - newSeats < 1 || - newSeats < pricing[configurePlan].minSeats - ) { - setSeats(pricing[configurePlan].minSeats); - return; - } - - if (newSeats > pricing[configurePlan].maxSeats) { - setSeats(pricing[configurePlan].maxSeats); - return; - } - - setSeats(newSeats); - }} - /> -
-
- -
+
+ {configurePlan && ( + <> +
+
+
- - )} -
- {showFree && ( -
-
-
-

- Free - plan -

- -
- $ - - 0 - - - /{suffixes[planFrequency]} - -
- -
- - Download now - -
-
-
- -
- -

- All of Mockoon's{' '} - features -

-
-
- -
-
- -
- -

Community support

-
-
-
+
+ { + const newSeats = parseInt(event.target.value); + + if ( + isNaN(newSeats) || + newSeats < 1 || + newSeats < pricing[configurePlan].minSeats + ) { + setSeats(pricing[configurePlan].minSeats); + return; + } + + if (newSeats > pricing[configurePlan].maxSeats) { + setSeats(pricing[configurePlan].maxSeats); + return; + } + + setSeats(newSeats); + }} + />
- )} - +
+ +
+
+ + )} +
+ {showFree && (

- Solo + Free plan - {planFrequency === 'YEARLY' && ( - - {pricing.SOLO.discount} - - )}

-
+ +
$ - - {pricing.SOLO[planFrequency].price} + + 0 /{suffixes[planFrequency]} @@ -360,28 +332,23 @@ const Plans: FunctionComponent<{ showFree: boolean; showTagline: boolean }> =
- + Download now +
-
-

+

All of Mockoon's{' '} features

-
@@ -389,271 +356,346 @@ const Plans: FunctionComponent<{ showFree: boolean; showTagline: boolean }> =
-

- {pricing.SOLO.templatesQuota}{' '} - - AI-generated endpoints - {' '} - per month -

+

Community support

-
-
- -
+
+
+
+ )} -

- - Synchronize {pricing.SOLO.syncQuota} API mocks - {' '} - accross your devices -

+
+
+
+

+ Solo + plan + {planFrequency === 'YEARLY' && ( + + {pricing.SOLO.discount} + + )} +

+
+ $ + + {pricing.SOLO[planFrequency].price} + + + /{suffixes[planFrequency]} + +
+ +
+ {subscribeBtn(Plans.SOLO)} +
+ +
+
+
+ +

+ All of Mockoon's{' '} + features +

+
+ +
+ +
+
+ +
+ +

+ {pricing.SOLO.templatesQuota}{' '} + + AI-generated endpoints + {' '} + per month +

+
+
+
+ +
+ +

+ + Synchronize {pricing.SOLO.syncQuota} API mocks + {' '} + accross your devices +

+
+
+
+
+ +
+ +

Email support

+
+ +
-

Email support

+

+ Support our work on the open-source tools +

- -
-
-
-
- -
- -

- Support our work on the open-source tools -

-
-
-
- - - Coming - soon - +
+
+ + + Coming soon -
-
-

- ☁️ Deploy your API mocks in the cloud (Q2 2024) -

-
+ +
+
+

+ ☁️ Deploy your API mocks in the cloud (Q2 2024) +

+
-
-
-
-

- Team - plan - {planFrequency === 'YEARLY' && ( - - {pricing.TEAM.discount} - - )} -

-
- $ - - {pricing.TEAM[planFrequency].price} - - - /{suffixes[planFrequency]}/seat +
+
+
+

+ Team + plan + {planFrequency === 'YEARLY' && ( + + {pricing.TEAM.discount} + )} +

+
+ $ + + {pricing.TEAM[planFrequency].price} + + + /{suffixes[planFrequency]}/seat + +
+
+ {subscribeBtn(Plans.TEAM)} +
+ +
+
+
-
- + +

+ All of Mockoon's{' '} + features +

+
+ +
+ +
+
+
-
-
- -
+

+ {pricing.TEAM.templatesQuota}{' '} + + AI-generated endpoints + {' '} + per month per seat +

+
+
+
+ +
-

- All of Mockoon's{' '} - features -

+

+ + Collaborate in real-time + {' '} + with your team on {pricing.TEAM.syncQuota} API mocks +

+
+
+
+
+
+

Email support

+
+
-
-

- {pricing.TEAM.templatesQuota}{' '} - - AI-generated endpoints - {' '} - per month per seat +

+ Organizations up to {pricing.TEAM.maxSeats} seats

+ +

- - Collaborate in real-time - {' '} - with your team on {pricing.TEAM.syncQuota} API mocks + Support our work on the open-source tools

-
-
- -
- -

Email support

-
-
-
-
-
- -
- -

- Organizations up to {pricing.TEAM.maxSeats} seats -

-
- -
-
-
- -
- -

- Support our work on the open-source tools -

-
-
-
- - - Coming - soon - +
+ + + Coming soon -
-
-

- ☁️ Deploy your API mocks in the cloud (Q2 2024) -

-
+ +
+
+

+ ☁️ Deploy your API mocks in the cloud (Q2 2024) +

+
-
-
-
-

- Enterprise - plan - {planFrequency === 'YEARLY' && - pricing.ENTERPRISE.discount && ( - - {pricing.ENTERPRISE.discount} - - )} -

-
- $ - - {pricing.ENTERPRISE[planFrequency].price} - - - /{suffixes[planFrequency]}/seat - -
+
+
+
+

+ Enterprise + plan + {planFrequency === 'YEARLY' && + pricing.ENTERPRISE.discount && ( + + {pricing.ENTERPRISE.discount} + + )} +

+
+ $ + + {pricing.ENTERPRISE[planFrequency].price} + + + /{suffixes[planFrequency]}/seat + +
-
+
+ {subscribeBtn(Plans.ENTERPRISE)} + {currentUser.data?.plan === 'FREE' && ( + )} +
+ +
+
+
-
-
- -
+

+ All of Mockoon's{' '} + features +

+
-

- All of Mockoon's{' '} - features -

+
+ +
+
+
-
+

+ {pricing.ENTERPRISE.templatesQuota}{' '} + + AI-generated endpoints + {' '} + per month per seat +

+
+
+
+ +
-
-
- -
+

+ + Collaborate in real-time + {' '} + with your team on {pricing.ENTERPRISE.syncQuota} API + mocks +

+
+
+
+
+ +
-

- {pricing.ENTERPRISE.templatesQuota}{' '} - - AI-generated endpoints - {' '} - per month per seat -

+

+ Enterprise support1 +

+
+
+
+
+
-
-
- -
-

- - Collaborate in real-time - {' '} - with your team on {pricing.ENTERPRISE.syncQuota} API - mocks -

+

+ 1 hour live training for your team ( + Purchase separately) +

+
+
+
+
+
+ +

Unlimited seats (minimum 3)

+
+ +
@@ -661,119 +703,68 @@ const Plans: FunctionComponent<{ showFree: boolean; showTagline: boolean }> =

- Enterprise support1 + Support our work on the open-source tools

+
+ + + Coming soon + + +
-
- -
-

- 1 hour live training for your team ( - Purchase separately) + ☁️ Deploy your API mocks in the cloud (Q2 2024)

-
-
-
- -
- -

Unlimited seats (minimum 3)

-
- -
-
-
-
- -
- -

- Support our work on the open-source tools -

-
-
-
- - - Coming - soon - - -
-
-

- ☁️ Deploy your API mocks in the cloud (Q2 2024) -

-
-
-

- Prices are in USD and exclude VAT where applicable. By - proceeding to payment you agree to our{' '} - privacy policy and{' '} - terms of service.
- 1 To learn more about our Enterprise support, see the{' '} - FAQ of our Pro plans or our{' '} - terms of service. -

-
-

Special requests?

- -
- - Contact sales - - - Request a demo - -
-
- - {showTagline && ( -
-

- Your subscription goes directly towards the development and - maintenance of Mockoon and allows us to keep our tools - independent and open-source. -

-
-
- Founder @ Mockoon -
-
-

Guillaume

-

- Founder @ Mockoon -

-
+
+

+ Prices are in USD and exclude VAT where applicable. By proceeding + to payment you agree to our{' '} + privacy policy and{' '} + terms of service.
+ 1 To learn more about our Enterprise support, see the{' '} + FAQ of our Pro plans or our{' '} + terms of service. +

+ + {showTagline && ( +
+

+ Your subscription goes directly towards the development and + maintenance of Mockoon and allows us to keep our tools + independent and open-source. +

+
+
+ Founder @ Mockoon +
+
+

Guillaume

+

+ Founder @ Mockoon +

- )} -
-
- - - ); - }; +
+ )} +
+
+ + + ); +}; -export default Plans; +export default PlansView; diff --git a/models/user.model.ts b/models/user.model.ts index 02e2405b..fcb407b2 100644 --- a/models/user.model.ts +++ b/models/user.model.ts @@ -1,46 +1,3 @@ -export enum Plans { - FREE = 'FREE', - SOLO = 'SOLO', - TEAM = 'TEAM', - ENTERPRISE = 'ENTERPRISE' -} -type TeamRoles = 'owner' | 'user'; - -export type TeamMember = { - uid: string; - email: string; - role: TeamRoles; -}; - -export type Team = { - seats: number; - plan: Plans; - members: TeamMember[]; -}; - -export type User = { - uid: string; - email: string; - plan: Plans; - teamId: string; - teamRole: TeamRoles; - cloudSyncItemsQuota: number; - cloudSyncItemsQuotaUsed: number; - cloudSyncSizeQuota: number; - templatesQuota: number; - templatesQuotaUsed: number; - nextQuotaResetOn: number; - subscription: { - provider: 'stripe' | 'paddle'; - renewOn: number; - createdOn: number; - frequency: string; - portalEnabled?: boolean; - cancellationScheduled?: boolean; - pastDue?: boolean; - }; -}; - export type EmailingContact = { email: string; newsletter: boolean; diff --git a/package-lock.json b/package-lock.json index 36ec3194..079abac8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,6 +13,7 @@ "@codemirror/lang-xml": "^6.0.2", "@codemirror/lang-yaml": "^6.0.0", "@docsearch/react": "^3.5.2", + "@mockoon/cloud": "^8.2.0", "@tanstack/react-query": "^5.8.3", "@uiw/codemirror-theme-nord": "^4.21.21", "@uiw/react-codemirror": "^4.21.21", @@ -1312,14 +1313,12 @@ "node_modules/@hapi/hoek": { "version": "9.3.0", "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.3.0.tgz", - "integrity": "sha512-/c6rf4UJlmHlC9b5BaNvzAcFv7HZ2QHaV0D4/HNlBdvFnvQq8RI4kYdhyPCl7Xj+oWvTWQ8ujhqS53LIgAe6KQ==", - "dev": true + "integrity": "sha512-/c6rf4UJlmHlC9b5BaNvzAcFv7HZ2QHaV0D4/HNlBdvFnvQq8RI4kYdhyPCl7Xj+oWvTWQ8ujhqS53LIgAe6KQ==" }, "node_modules/@hapi/topo": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/@hapi/topo/-/topo-5.1.0.tgz", "integrity": "sha512-foQZKJig7Ob0BMAYBfcJk8d77QtOe7Wo4ox7ff1lQYoNNAb6jwcY1ncdoy2e9wQZzvNy7ODZCYJkK8kzmcAnAg==", - "dev": true, "dependencies": { "@hapi/hoek": "^9.0.0" } @@ -1661,6 +1660,40 @@ "node": ">=12.0.0" } }, + "node_modules/@mockoon/cloud": { + "version": "8.2.0", + "resolved": "https://registry.npmjs.org/@mockoon/cloud/-/cloud-8.2.0.tgz", + "integrity": "sha512-XEM6fgAXLv6jrBcH97WSGf//i9rZ+BKVYCjKihd/DlM2NOloiPmvK7SbQ3sIG8llqEYndTkDMqLHJp+Omna/ZQ==", + "dependencies": { + "@mockoon/commons": "8.2.0" + }, + "funding": { + "url": "https://mockoon.com/sponsor-us/" + } + }, + "node_modules/@mockoon/cloud/node_modules/@mockoon/commons": { + "version": "8.2.0", + "resolved": "https://registry.npmjs.org/@mockoon/commons/-/commons-8.2.0.tgz", + "integrity": "sha512-Hsr1t1fn0VlBIqj5JIbzjHPdlHWNEZpQJ9TNPid4SKkqxPnm8tHlFUll7YjhYmQP5cm7V5pdh7vz4lFB1/HERA==", + "dependencies": { + "joi": "17.13.0" + }, + "funding": { + "url": "https://mockoon.com/sponsor-us/" + } + }, + "node_modules/@mockoon/cloud/node_modules/joi": { + "version": "17.13.0", + "resolved": "https://registry.npmjs.org/joi/-/joi-17.13.0.tgz", + "integrity": "sha512-9qcrTyoBmFZRNHeVP4edKqIUEgFzq7MHvTNSDuHSqkpOPtiBkgNgcmTSqmiw1kw9tdKaiddvIDv/eCJDxmqWCA==", + "dependencies": { + "@hapi/hoek": "^9.3.0", + "@hapi/topo": "^5.1.0", + "@sideway/address": "^4.1.5", + "@sideway/formula": "^3.0.1", + "@sideway/pinpoint": "^2.0.0" + } + }, "node_modules/@mockoon/commons": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/@mockoon/commons/-/commons-5.1.0.tgz", @@ -2180,7 +2213,6 @@ "version": "4.1.5", "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.5.tgz", "integrity": "sha512-IqO/DUQHUkPeixNQ8n0JA6102hT9CmaljNTPmQ1u8MEhBo/R4Q8eKLN/vGZxuebwOroDB4cbpjheD4+/sKFK4Q==", - "dev": true, "dependencies": { "@hapi/hoek": "^9.0.0" } @@ -2188,14 +2220,12 @@ "node_modules/@sideway/formula": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@sideway/formula/-/formula-3.0.1.tgz", - "integrity": "sha512-/poHZJJVjx3L+zVD6g9KgHfYnb443oi7wLu/XKojDviHy6HOEOA6z1Trk5aR1dGcmPenJEgb2sK2I80LeS3MIg==", - "dev": true + "integrity": "sha512-/poHZJJVjx3L+zVD6g9KgHfYnb443oi7wLu/XKojDviHy6HOEOA6z1Trk5aR1dGcmPenJEgb2sK2I80LeS3MIg==" }, "node_modules/@sideway/pinpoint": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@sideway/pinpoint/-/pinpoint-2.0.0.tgz", - "integrity": "sha512-RNiOoTPkptFtSVzQevY/yWtZwf/RxyVnPy/OcA9HBM3MlGDnBEYL5B41H0MTn0Uec8Hi+2qUtTfG2WWZBmMejQ==", - "dev": true + "integrity": "sha512-RNiOoTPkptFtSVzQevY/yWtZwf/RxyVnPy/OcA9HBM3MlGDnBEYL5B41H0MTn0Uec8Hi+2qUtTfG2WWZBmMejQ==" }, "node_modules/@swc/helpers": { "version": "0.5.2", @@ -17255,14 +17285,12 @@ "@hapi/hoek": { "version": "9.3.0", "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.3.0.tgz", - "integrity": "sha512-/c6rf4UJlmHlC9b5BaNvzAcFv7HZ2QHaV0D4/HNlBdvFnvQq8RI4kYdhyPCl7Xj+oWvTWQ8ujhqS53LIgAe6KQ==", - "dev": true + "integrity": "sha512-/c6rf4UJlmHlC9b5BaNvzAcFv7HZ2QHaV0D4/HNlBdvFnvQq8RI4kYdhyPCl7Xj+oWvTWQ8ujhqS53LIgAe6KQ==" }, "@hapi/topo": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/@hapi/topo/-/topo-5.1.0.tgz", "integrity": "sha512-foQZKJig7Ob0BMAYBfcJk8d77QtOe7Wo4ox7ff1lQYoNNAb6jwcY1ncdoy2e9wQZzvNy7ODZCYJkK8kzmcAnAg==", - "dev": true, "requires": { "@hapi/hoek": "^9.0.0" } @@ -17518,6 +17546,36 @@ } } }, + "@mockoon/cloud": { + "version": "8.2.0", + "resolved": "https://registry.npmjs.org/@mockoon/cloud/-/cloud-8.2.0.tgz", + "integrity": "sha512-XEM6fgAXLv6jrBcH97WSGf//i9rZ+BKVYCjKihd/DlM2NOloiPmvK7SbQ3sIG8llqEYndTkDMqLHJp+Omna/ZQ==", + "requires": { + "@mockoon/commons": "8.2.0" + }, + "dependencies": { + "@mockoon/commons": { + "version": "8.2.0", + "resolved": "https://registry.npmjs.org/@mockoon/commons/-/commons-8.2.0.tgz", + "integrity": "sha512-Hsr1t1fn0VlBIqj5JIbzjHPdlHWNEZpQJ9TNPid4SKkqxPnm8tHlFUll7YjhYmQP5cm7V5pdh7vz4lFB1/HERA==", + "requires": { + "joi": "17.13.0" + } + }, + "joi": { + "version": "17.13.0", + "resolved": "https://registry.npmjs.org/joi/-/joi-17.13.0.tgz", + "integrity": "sha512-9qcrTyoBmFZRNHeVP4edKqIUEgFzq7MHvTNSDuHSqkpOPtiBkgNgcmTSqmiw1kw9tdKaiddvIDv/eCJDxmqWCA==", + "requires": { + "@hapi/hoek": "^9.3.0", + "@hapi/topo": "^5.1.0", + "@sideway/address": "^4.1.5", + "@sideway/formula": "^3.0.1", + "@sideway/pinpoint": "^2.0.0" + } + } + } + }, "@mockoon/commons": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/@mockoon/commons/-/commons-5.1.0.tgz", @@ -17889,7 +17947,6 @@ "version": "4.1.5", "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.5.tgz", "integrity": "sha512-IqO/DUQHUkPeixNQ8n0JA6102hT9CmaljNTPmQ1u8MEhBo/R4Q8eKLN/vGZxuebwOroDB4cbpjheD4+/sKFK4Q==", - "dev": true, "requires": { "@hapi/hoek": "^9.0.0" } @@ -17897,14 +17954,12 @@ "@sideway/formula": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@sideway/formula/-/formula-3.0.1.tgz", - "integrity": "sha512-/poHZJJVjx3L+zVD6g9KgHfYnb443oi7wLu/XKojDviHy6HOEOA6z1Trk5aR1dGcmPenJEgb2sK2I80LeS3MIg==", - "dev": true + "integrity": "sha512-/poHZJJVjx3L+zVD6g9KgHfYnb443oi7wLu/XKojDviHy6HOEOA6z1Trk5aR1dGcmPenJEgb2sK2I80LeS3MIg==" }, "@sideway/pinpoint": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@sideway/pinpoint/-/pinpoint-2.0.0.tgz", - "integrity": "sha512-RNiOoTPkptFtSVzQevY/yWtZwf/RxyVnPy/OcA9HBM3MlGDnBEYL5B41H0MTn0Uec8Hi+2qUtTfG2WWZBmMejQ==", - "dev": true + "integrity": "sha512-RNiOoTPkptFtSVzQevY/yWtZwf/RxyVnPy/OcA9HBM3MlGDnBEYL5B41H0MTn0Uec8Hi+2qUtTfG2WWZBmMejQ==" }, "@swc/helpers": { "version": "0.5.2", diff --git a/package.json b/package.json index 2c9f202c..dd7cbb50 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "@codemirror/lang-xml": "^6.0.2", "@codemirror/lang-yaml": "^6.0.0", "@docsearch/react": "^3.5.2", + "@mockoon/cloud": "^8.2.0", "@tanstack/react-query": "^5.8.3", "@uiw/codemirror-theme-nord": "^4.21.21", "@uiw/react-codemirror": "^4.21.21", diff --git a/pages/account/subscription.tsx b/pages/account/subscription.tsx index 36a5bfe2..30f94592 100644 --- a/pages/account/subscription.tsx +++ b/pages/account/subscription.tsx @@ -1,3 +1,4 @@ +import { Plans } from '@mockoon/cloud'; import Link from 'next/link'; import { useRouter } from 'next/router'; import { FunctionComponent, useEffect } from 'react'; @@ -9,7 +10,6 @@ import PaddleScript from '../../components/paddle'; import Spinner from '../../components/spinner'; import { frequencyNames, planNames } from '../../constants/plans'; import Layout from '../../layout/layout'; -import { Plans } from '../../models/user.model'; import { useAuth } from '../../utils/auth'; import { useCurrentSubscriptionLinks, diff --git a/styles/_user-variables.scss b/styles/_user-variables.scss index d6c70d32..23f18bc6 100644 --- a/styles/_user-variables.scss +++ b/styles/_user-variables.scss @@ -1,6 +1,7 @@ $custom-gray: #242830; $path-to-fonts: '/fonts'; $font-family-base: 'HKGroteskPro', sans-serif; +$font-size-base: 1rem; $container-max-widths: ( sm: 540px, md: 720px, diff --git a/utils/queries.tsx b/utils/queries.tsx index 3a33b395..85d1f56e 100644 --- a/utils/queries.tsx +++ b/utils/queries.tsx @@ -1,6 +1,7 @@ +import { Plans, Team, User } from '@mockoon/cloud'; import { useQuery } from '@tanstack/react-query'; import { useRouter } from 'next/router'; -import { EmailingContact, Plans, Team, User } from '../models/user.model'; +import { EmailingContact } from '../models/user.model'; import { useAuth } from './auth'; const useCurrentUser = () => {