From 76dccf804e79b171a149d7f89942fd180e7b7c43 Mon Sep 17 00:00:00 2001 From: prafull-opensignlabs Date: Wed, 24 Jul 2024 17:42:20 +0530 Subject: [PATCH] refactor: plan changes --- apps/OpenSign/src/components/Header.js | 17 ++- apps/OpenSign/src/constant/const.js | 14 +-- apps/OpenSign/src/json/plansArr.js | 120 ++++++++++++++----- apps/OpenSign/src/pages/PlanSubscriptions.js | 26 ++-- apps/OpenSign/src/pages/UserProfile.js | 19 +-- 5 files changed, 136 insertions(+), 60 deletions(-) diff --git a/apps/OpenSign/src/components/Header.js b/apps/OpenSign/src/components/Header.js index 67bcd6881..edfb32b68 100644 --- a/apps/OpenSign/src/components/Header.js +++ b/apps/OpenSign/src/components/Header.js @@ -4,7 +4,12 @@ import FullScreenButton from "./FullScreenButton"; import { useNavigate } from "react-router-dom"; import Parse from "parse"; import { useWindowSize } from "../hook/useWindowSize"; -import { checkIsSubscribed, getAppLogo, openInNewTab } from "../constant/Utils"; +import { + checkIsSubscribed, + checkIsSubscribedTeam, + getAppLogo, + openInNewTab +} from "../constant/Utils"; import { isEnableSubscription, isStaging } from "../constant/const"; const Header = ({ showSidebar }) => { @@ -15,6 +20,7 @@ const Header = ({ showSidebar }) => { const [isOpen, setIsOpen] = useState(false); const [isSubscribe, setIsSubscribe] = useState(true); const [isPro, setIsPro] = useState(false); + const [isTeam, setIsTeam] = useState(false); const [applogo, setAppLogo] = useState( localStorage.getItem("appLogo") || " " ); @@ -29,6 +35,7 @@ const Header = ({ showSidebar }) => { async function checkSubscription() { if (isEnableSubscription) { const getIsSubscribe = await checkIsSubscribed(); + const getIsTeam = await checkIsSubscribedTeam(); if (getIsSubscribe) { const applogo = await getAppLogo(); if (applogo?.logo) { @@ -38,6 +45,7 @@ const Header = ({ showSidebar }) => { } } setIsPro(getIsSubscribe); + setIsTeam(getIsTeam); setIsSubscribe(getIsSubscribe); } } @@ -122,11 +130,16 @@ const Header = ({ showSidebar }) => { )} - {isPro && ( + {!isTeam && isPro && (
PRO
)} + {isTeam && ( +
+ TEAM +
+ )}
diff --git a/apps/OpenSign/src/constant/const.js b/apps/OpenSign/src/constant/const.js index 7541804f5..4ac828514 100644 --- a/apps/OpenSign/src/constant/const.js +++ b/apps/OpenSign/src/constant/const.js @@ -4,10 +4,10 @@ export const documentCls = "contracts_Document"; export const themeColor = "#47a3ad"; export const iconColor = "#686968"; export const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/; -export const isEnableSubscription = true; -// process.env.REACT_APP_ENABLE_SUBSCRIPTION && -// process.env.REACT_APP_ENABLE_SUBSCRIPTION?.toLowerCase() === "true" -// ? true -// : false; -export const isStaging = "http://localhost:3001"; -// window.location.origin === "https://staging-app.opensignlabs.com"; +export const isEnableSubscription = + process.env.REACT_APP_ENABLE_SUBSCRIPTION && + process.env.REACT_APP_ENABLE_SUBSCRIPTION?.toLowerCase() === "true" + ? true + : false; +export const isStaging = + window.location.origin === "https://staging-app.opensignlabs.com"; diff --git a/apps/OpenSign/src/json/plansArr.js b/apps/OpenSign/src/json/plansArr.js index daa4d02b9..29d2fde9f 100644 --- a/apps/OpenSign/src/json/plansArr.js +++ b/apps/OpenSign/src/json/plansArr.js @@ -26,6 +26,27 @@ const plans = [ "Decline document support", "Email notifications", "Recipient authentication using OTP", + "Bulk send (upto 5 docs)", + "Public profiles", + "And much more" + ], + yearlyBenefits: [ + "Unlimited envelopes", + "Sign documents yourself", + "Request signatures from others", + "14 field types", + "Automatic e-signatures", + "Completion certificates", + "Send in order", + "Document templates", + "Import from Dropbox", + "Contact book", + "Document expiry support", + "Decline document support", + "Email notifications", + "Recipient authentication using OTP", + "Bulk send (upto 5 docs)", + "Public profiles", "And much more" ] }, @@ -34,7 +55,7 @@ const plans = [ img: "professional.png", currency: "$", monthlyPrice: "29.99", - yearlyPrice: `10 /month/user`, + yearlyPrice: "9.99", subtitle: "Exclusive Access to advanced features.", btn: { text: "Subscribe", color: "op-btn-primary" }, url: isStaging @@ -53,9 +74,64 @@ const plans = [ "Zapier integration", "API Access", "100 API signatures included", - "DocumentId removal from signed docs", "Custom email templates", - "Auto reminders" + "Auto reminders", + "Bulk send (upto 20 docs)", + "Premium Public profile usernames", + "Embedding (coming soon)" + ], + yearlyBenefits: [ + "Everything in OpenSign™ free", + "Field validations", + "Regular expression validations", + "Organize docs in OpenSign™ Drive", + "Webhooks", + "Zapier integration", + "API Access", + "240 API signatures included", + "Custom email templates", + "Auto reminders", + "Bulk send (upto 20 docs)", + "Premium Public profile usernames", + "Embedding (coming soon)" + ] + }, + { + planName: "OPENSIGN™ TEAMS", + img: "teams.png", + currency: "$", + monthlyPrice: `39.99/user`, + yearlyPrice: `19.99/user/month`, + subtitle: "Exclusive Access to advanced features.", + btn: { text: "Subscribe", color: "op-btn-accent" }, + url: isStaging + ? "https://billing.zoho.in/subscribe/ed8097273a82b6bf39892c11a3bb3c381eb2705736014cfbdbde1ccf1c7a189d/team-weekly" + : "https://billing.opensignlabs.com/subscribe/ef798486e6a0a11ea65f2bae8f2af901237d0702bfaa959406306635d80f138c/teams-monthly", + yearlyUrl: isStaging + ? "https://billing.zoho.in/subscribe/ed8097273a82b6bf39892c11a3bb3c381eb2705736014cfbdbde1ccf1c7a189d/team-weekly" + : "https://billing.opensignlabs.com/subscribe/ef798486e6a0a11ea65f2bae8f2af9011a864994bbeeec71fcf106188630199d/teams-yearly", + target: "_self", + benefits: [ + "Everything in OpenSign™ professional", + "100 API signatures included", + "Teams and Organizations", + "Share Templates with teams", + "Share Templates with individuals", + "DocumentId removal from signed docs", + "Bulk send (upto 50 docs)", + "Request Payments (coming soon)", + "Mobile app (coming soon)" + ], + yearlyBenefits: [ + "Everything in OpenSign™ professional", + "500 API signatures included", + "Teams and Organizations", + "Share Templates with teams", + "Share Templates with individuals", + "DocumentId removal from signed docs", + "Bulk send (upto 50 docs)", + "Request Payments (coming soon)", + "Mobile app (coming soon)" ] }, { @@ -75,36 +151,16 @@ const plans = [ "Uptime SLA", "SSO support", "Priority support" + ], + yearlyBenefits: [ + "All features", + "Custom domain", + "Custom branding", + "Uptime SLA", + "SSO support", + "Priority support" ] } ]; -export const stagingPlan = { - planName: "OPENSIGN™ TEAMS", - img: "teams.png", - currency: "$", - monthlyPrice: "40", - yearlyPrice: `20 /month/user`, - subtitle: "Exclusive Access to advanced features.", - btn: { text: "Subscribe", color: "op-btn-accent" }, - url: isStaging - ? "https://billing.zoho.in/subscribe/ed8097273a82b6bf39892c11a3bb3c381eb2705736014cfbdbde1ccf1c7a189d/team-weekly" - : "https://billing.opensignlabs.com/subscribe/ef798486e6a0a11ea65f2bae8f2af901d1a09dfa8085585cdd4ec4d7f32137f3/professional-monthly", - yearlyUrl: isStaging - ? "https://billing.zoho.in/subscribe/ed8097273a82b6bf39892c11a3bb3c381eb2705736014cfbdbde1ccf1c7a189d/team-weekly" - : "https://billing.opensignlabs.com/subscribe/ef798486e6a0a11ea65f2bae8f2af901d8ad1135190dff951330360e47585a71/professional-yearly", - target: "_self", - benefits: [ - "Everything in OpenSign™ free, professional", - "Field validations", - "Regular expression validations", - "Organize docs in OpenSign™ Drive", - "Webhooks", - "Zapier integration", - "API Access", - "100 API signatures included", - "DocumentId removal from signed docs", - "Custom email templates", - "Auto reminders" - ] -}; + export default plans; diff --git a/apps/OpenSign/src/pages/PlanSubscriptions.js b/apps/OpenSign/src/pages/PlanSubscriptions.js index b9292e989..eaaeaa08e 100644 --- a/apps/OpenSign/src/pages/PlanSubscriptions.js +++ b/apps/OpenSign/src/pages/PlanSubscriptions.js @@ -1,12 +1,11 @@ import React, { useState, useEffect } from "react"; import { useNavigate } from "react-router-dom"; import checkmark from "../assets/images/checkmark.png"; -import plansArr, { stagingPlan } from "../json/plansArr"; +import plansArr from "../json/plansArr"; import Title from "../components/Title"; import Parse from "parse"; import { openInNewTab } from "../constant/Utils"; import Loader from "../primitives/Loader"; -import { isStaging } from "../constant/const"; const listItemStyle = { paddingLeft: "20px", // Add padding to create space for the image backgroundImage: `url(${checkmark})`, // Set your image as the list style image @@ -17,7 +16,6 @@ const listItemStyle = { const PlanSubscriptions = () => { const navigate = useNavigate(); - const isTeamPlan = plansArr.some((x) => x.planName === "OPENSIGN™ TEAMS"); const [yearlyVisible, setYearlyVisible] = useState(true); const [isLoader, setIsLoader] = useState(true); const extUser = @@ -61,9 +59,6 @@ const PlanSubscriptions = () => { phone; useEffect(() => { setIsLoader(false); - if (!isTeamPlan && isStaging) { - plansArr.splice(2, 0, stagingPlan); - } // eslint-disable-next-line }, []); @@ -123,7 +118,7 @@ const PlanSubscriptions = () => { role="tab" className={`${yearlyVisible ? "op-tab-active" : ""} op-tab`} > - Yearly (10% off) + Yearly (upto 66% off)