diff --git a/package.json b/package.json index 3fe166638..50ef6b421 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bada-frame", - "version": "0.4.2", + "version": "0.4.3", "private": true, "scripts": { "dev": "next dev", @@ -39,7 +39,6 @@ "libsodium-wrappers": "^0.7.8", "localforage": "^1.9.0", "next": "^11.1.3", - "node-forge": "^0.10.0", "photoswipe": "file:./thirdparty/photoswipe", "piexifjs": "^1.0.6", "react": "^17.0.2", diff --git a/src/components/pages/gallery/PlanSelector.tsx b/src/components/pages/gallery/PlanSelector.tsx index 48156e7f5..3e2b0f0fe 100644 --- a/src/components/pages/gallery/PlanSelector.tsx +++ b/src/components/pages/gallery/PlanSelector.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState } from 'react'; import { Form, Modal, Button } from 'react-bootstrap'; import constants from 'utils/strings/constants'; -import styled from 'styled-components'; +import styled, { css } from 'styled-components'; import { Plan, Subscription } from 'types/billing'; import { convertBytesToGBs, @@ -25,7 +25,7 @@ import { DeadCenter } from 'pages/gallery'; import billingService from 'services/billingService'; import { SetLoading } from 'types/gallery'; -export const PlanIcon = styled.div<{ selected: boolean }>` +export const PlanIcon = styled.div<{ currentlySubscribed: boolean }>` border-radius: 20px; width: 220px; border: 2px solid #333; @@ -38,8 +38,9 @@ export const PlanIcon = styled.div<{ selected: boolean }>` justify-content: center; align-items: center; flex-direction: column; - cursor: ${(props) => (props.selected ? 'not-allowed' : 'pointer')}; - border-color: ${(props) => props.selected && '#56e066'}; + cursor: ${(props) => + props.currentlySubscribed ? 'not-allowed' : 'pointer'}; + border-color: ${(props) => props.currentlySubscribed && '#56e066'}; transition: all 0.3s ease-out; overflow: hidden; position: relative; @@ -56,12 +57,17 @@ export const PlanIcon = styled.div<{ selected: boolean }>` transition: all 0.5s ease-out; } - &:hover { - transform: scale(1.1); - background-color: #ffffff11; - } - - &:hover > div:first-child::before { + &:hover + ${(props) => + !props.currentlySubscribed && + css` + { + transform: scale(1.1); + background-color: #ffffff11; + } + `} + &:hover + > div:first-child::before { transform: rotate(45deg) translateX(300px); } `; @@ -163,8 +169,12 @@ function PlanSelector(props: Props) { await onPlanSelect(plan)}> + currentlySubscribed={isUserSubscribedPlan(plan, subscription)} + onClick={ + isUserSubscribedPlan(plan, subscription) + ? () => {} + : async () => await onPlanSelect(plan) + }>
{ + const token = getToken(); try { - const response = await HTTPService.get( - `${ENDPOINT}/billing/plans/v2` - ); + let response; + if (!token) { + response = await HTTPService.get( + `${ENDPOINT}/billing/plans/v2` + ); + } else { + response = await HTTPService.get( + `${ENDPOINT}/billing/user-plans`, + null, + { + 'X-Auth-Token': getToken(), + } + ); + } const { plans } = response.data; return plans; } catch (e) { diff --git a/src/utils/common/key.ts b/src/utils/common/key.ts index d3130d1fe..58309210e 100644 --- a/src/utils/common/key.ts +++ b/src/utils/common/key.ts @@ -22,8 +22,4 @@ export const getActualKey = async () => { } }; -export const getStripePublishableKey = () => - process.env.NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY ?? - 'pk_live_51HAhqDK59oeucIMOiTI6MDDM2UWUbCAJXJCGsvjJhiO8nYJz38rQq5T4iyQLDMKxqEDUfU5Hopuj4U5U4dff23oT00fHvZeodC'; - export const getToken = () => getData(LS_KEYS.USER)?.token; diff --git a/yarn.lock b/yarn.lock index e75a5a4d2..fcb0daec0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3434,9 +3434,9 @@ fn-name@~3.0.0: integrity sha512-eNMNr5exLoavuAMhIUVsOKF79SWd/zG104ef6sxBTSw+cZc6BXdQXDvYcGvp0VbxVVSp1XDUNoz7mg1xMtSznA== follow-redirects@^1.0.0, follow-redirects@^1.14.0: - version "1.14.3" - resolved "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.3.tgz" - integrity sha512-3MkHxknWMUtb23apkgz/83fDoe+y+qr0TdgacGIA7bew+QLBo3vdgEN2xEsuXNivpFy4CyDhBBZnNZOtalmenw== + version "1.14.7" + resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.14.7.tgz#2004c02eb9436eee9a21446a6477debf17e81685" + integrity sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ== foreach@^2.0.5: version "2.0.5" @@ -4684,11 +4684,6 @@ node-fetch@^2.6.0, node-fetch@^2.6.1: resolved "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.2.tgz" integrity sha512-aLoxToI6RfZ+0NOjmWAgn9+LEd30YCkJKFSyWacNZdEKTit/ZMcKjGkTRo8uWEsnIb/hfKecNPEbln02PdWbcA== -node-forge@^0.10.0: - version "0.10.0" - resolved "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz" - integrity sha512-PPmu8eEeG9saEUvI97fm4OYxXVB6bFvyNTyiUOBichBpFG8A1Ljw3bY62+5oOjDEMHRnd0Y7HQ+x7uzxOzC6JA== - node-html-parser@1.4.9: version "1.4.9" resolved "https://registry.npmjs.org/node-html-parser/-/node-html-parser-1.4.9.tgz"