Merge pull request #108 from kjannette/addOfCounsel

Add of counsel
2024-02-24 00:24:57 -06:00
parent 1b4fce5ffc e4df347aed
commit c194f23ebd
6 changed files with 98 additions and 66 deletions
--- a/src/Components/Modals/PaymentModal.js
+++ b/src/Components/Modals/PaymentModal.js
@@ -21,8 +21,6 @@ const PaymentModal = ({
  fieldsChunkSize,
  numberOfAccountsToAdd,
 }) => {
-  const monthlyAddAccountPrice = selectedPlan[0].pricing[2].amount;
-
  const monthlySubscriptionPriceToday = selectedPlan[0].pricing[0].amount;
  const annualSubscriptionPriceToday = selectedPlan[0].pricing[1].amount * 12;

@@ -46,12 +44,28 @@ const PaymentModal = ({
    (selectedPlan[0]?.value === "seniorPartner" && numberOfAccountsToAdd > 0);

  const planName = selectedPlan[0].name ? selectedPlan[0].name : null;
-  const billingPeriod = isAnnual ? "Annually" : "Monthly";
-  const amountToday = isAnnual
-    ? annualSubscriptionPriceToday
-    : monthlySubscriptionPriceToday;
+  const planValue = selectedPlan[0].value ? selectedPlan[0].value : null;
+  const billingPeriod =
+    planValue === "ofCounsel"
+      ? "Single Purchase"
+      : isAnnual
+      ? "Annually"
+      : "Monthly";
+  const amountToday =
+    planValue === "ofCounsel"
+      ? 59
+      : isAnnual
+      ? annualSubscriptionPriceToday
+      : monthlySubscriptionPriceToday;

-  const totalToday = amountToday + extraAccountsPrice;
+  const totalToday =
+    planValue === "ofCounsel" ? 59 : amountToday + extraAccountsPrice;
+
+  const isCounsel = planValue === "ofCounsel" ? true : false;
+  const handleSignupClick = () => {
+    //clear fields
+    handleSignup();
+  };

  return (
    <Modal show="true" size="lg">
@@ -92,7 +106,7 @@ const PaymentModal = ({
              <div className="paymodal-summary-right">Total today:</div>
              <div className="paymodal-summary-left">${totalToday}</div>
            </div>
-            {isAnnual ? (
+            {isAnnual && !isCounsel ? (
              <div className="payment-modal-text-wrapper">
                <div className="paymodal-summary-right"></div>
                <div className="paymodal-summary-left-bonus">
@@ -159,7 +173,7 @@ const PaymentModal = ({
        <Button
          disabled={isBusy}
          className="primary-button"
-          onClick={handleSignup}
+          onClick={handleSignupClick}
          labelText="Signup"
        />
      </Modal.Footer>
@@ -168,15 +182,3 @@ const PaymentModal = ({
 };

 export default PaymentModal;
-
-/*
-  const tempExtraAccountsPrice = isAnnual
-    ? additionalAccountsAnnualPriceToday
-    : additionalAccountsMonthlyPriceToday;
-
-  const extraAccountsPrice =
-    tempExtraAccountsPrice === NaN || tempExtraAccountsPrice === undefined
-      ? 0
-      : 0;
-      
-  */
--- a/src/Components/Navigation/Navbar.js
+++ b/src/Components/Navigation/Navbar.js
@@ -63,7 +63,6 @@ const NavbarElement = (props) => {

  function packUpAndLeave(link) {
    navToggle();
-
    handleClick(link);
  }

--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -45,12 +45,12 @@ const SignupPage = () => {
    getFormDataDefaults(paymentfields)
  );
  const [showPaymentModal, setShowPaymentModal] = useState(false);
-
+  /*
  const [showSelectPlan, setShowSelectPlan] = useState(
    isUpgrade ? true : false
  );
-
-  //const [showSelectPlan, setShowSelectPlan] = useState(true);
+*/
+  const [showSelectPlan, setShowSelectPlan] = useState(true);
  const [activeRadioOption, setActiveRadioOption] = useState("partner");
  const [selectedPlan, setSelectedPlan] = useState([signupRadioFields[1]]);
  const stripe = new Stripe(stripeApiKey);
@@ -65,6 +65,7 @@ const SignupPage = () => {
  const [isAnnual, setIsAnnual] = useState(1);
  const [valX, setValX] = useState(1);
  const [valY, setValY] = useState(4);
+  const userAgent = window.navigator.userAgent;

  const handleChangeInput = (e, name) => {
    const newData = handleFormDataChange(e, name, data, signupFields);
@@ -205,7 +206,6 @@ const SignupPage = () => {
    const fbAuthUid = authId;
    let plan = selectedPlan;
    let docsAllowedPerMonth;
-
    if (isPromotionalMebership === true) {
      docsAllowedPerMonth = 1;
      subscriptionId = uuidv4();
@@ -275,7 +275,6 @@ const SignupPage = () => {
  };

  const handleAdd = () => {
-    //add accounts, close section
    setShowAddAccount(!showAddAccount);
    setShowPaymentModal(true);
  };
@@ -347,30 +346,51 @@ const SignupPage = () => {
    });

    const type = selectedPlan[0].value ? selectedPlan[0].value : null;
-    const tempAnnual = isAnnual === 1 ? true : false;
+    const tempAnnual =
+      type === "ofCounsel" ? false : isAnnual === 1 ? true : false;
+
    try {
-      const response = await fetch(`${apiUrl}/create-subscription`, {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json",
-        },
-        body: JSON.stringify({
-          planType: type,
-          additionalAccounts: additionalAccounts,
-          isAnnual: tempAnnual,
-          customerData: {
-            email: customerDataValues.email,
-            name: `${customerDataValues.firstName} ${customerDataValues.lastName}`,
+      let response;
+      let data;
+
+      if (type === "ofCounsel") {
+        response = await fetch(`${apiUrl}/new-payment-intent`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+            "User-Agent": userAgent,
          },
-          token,
-        }),
-      });
-
-      const data = await response.json();
-
-      //subscriptionId = response.subscriptionId;
-      //customerId = response.customerId;
-
+          body: JSON.stringify({
+            planType: type,
+            additionalAccounts: 0,
+            isAnnual: false,
+            customerData: {
+              email: customerDataValues.email,
+              name: `${customerDataValues.firstName} ${customerDataValues.lastName}`,
+            },
+            token,
+          }),
+        });
+        data = await response.json();
+      } else {
+        response = await fetch(`${apiUrl}/create-subscription`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+          },
+          body: JSON.stringify({
+            planType: type,
+            additionalAccounts: additionalAccounts,
+            isAnnual: tempAnnual,
+            customerData: {
+              email: customerDataValues.email,
+              name: `${customerDataValues.firstName} ${customerDataValues.lastName}`,
+            },
+            token,
+          }),
+        });
+        data = await response.json();
+      }
      return {
        data,
      };
@@ -379,11 +399,9 @@ const SignupPage = () => {
      return error;
    }
  }
+
  // ******************** END STRIPE PAYMENT API CALL ******************** //
-
  const handleSignup = async (e) => {
-    e.preventDefault();
-
    const paymentDataValues = validatePaymentData();
    if (paymentDataValues === null) {
      return;
@@ -406,7 +424,7 @@ const SignupPage = () => {
          paymentDataValues,
          dataValues
        );
-
+        console.log("data returned from handleStipeAuth", data);
        const customerId = data?.data?.customerId;
        const subscriptionCreated = data?.data?.subscriptionCreated;
        const subscriptionPeriodStart = data?.data?.subscriptionPeriodStart;
@@ -437,12 +455,11 @@ const SignupPage = () => {
            subscriptionId,
            isPromotionalMebership
          );
-
          setIsBusy(false);
          navigate("/dashboard");
        }
      } catch (error) {
-        console.log("Error handling request", error, error.message);
+        console.log("Error handling request", error);
        setIsBusy(false);
        setNotice("Sorry, something went wrong. Please try again.");
      }
@@ -625,6 +642,9 @@ const SignupPage = () => {
              <h5 className="signup-subheader-text">
                Select a subscription plan
              </h5>
+              <p className="subscribe-header-sub">
+                ← Click left/right for more options →
+              </p>
            </div>
            <div className="plan-header-left">
              <div className="select-toggle-box">
--- a/src/Constants/Fields/RadioFields.js
+++ b/src/Constants/Fields/RadioFields.js
@@ -4,16 +4,17 @@ export const signupRadioFields = [
    label: "Of Counsel",
    value: "ofCounsel",
    description: [
-      "One document/one-time fee",
-      "Documents conform with state rules",
+      "Single document/one-time fee",
      "Intellidraft AI - downloadable document in minutes",
+      "Documents formatted for jurisdiction",
      "24/7 support",
    ],
    details: "",
    docsAllowedPerMonth: 1,
    pricing: [
-      { type: "monthly", amount: 59 },
+      { type: "one-time", amount: 59 },
      { type: "annDiscount", amount: 59 },
+      { type: "additionalAccount", amount: 0 },
    ],
  },
  {
@@ -22,9 +23,9 @@ export const signupRadioFields = [
    value: "associate",
    description: [
      "1 document per month",
-      "Carryover 1 unused document each subscription period",
-      "Documents conform with state rules",
      "Intellidraft AI - downloadable document in minutes",
+      "Carryover 1 unused document each subscription period",
+      "Documents formatted for jurisdiction",
      "24/7 support",
      "First month is free!",
    ],
@@ -42,11 +43,11 @@ export const signupRadioFields = [
    value: "partner",
    description: [
      "3 documents per month",
-      "Carryover 1 unused document per month",
-      "Documents conform with state rules",
      "Intellidraft AI - downloadable document in minutes",
-      "Up to 2 additional accounts: $49/each",
+      "Carryover 1 unused document per month",
+      "Documents formatted for jurisdiction",
      "24/7 support",
+      "Up to 2 additional accounts: $49/each",
    ],
    details: "",
    docsAllowedPerMonth: 3,
@@ -62,8 +63,8 @@ export const signupRadioFields = [
    value: "seniorPartner",
    description: [
      "Unlimited documents.",
-      "Documents conform with state rules",
      "Intellidraft AI - downloadable document in minutes",
+      "Documents formatted for jurisdiction",
      "24/7 Triage-level support response",
      "Up to 8 additional accounts at $39/each",
    ],
--- a/src/pageElements/Radio.js
+++ b/src/pageElements/Radio.js
@@ -22,7 +22,7 @@ const Radio = (props) => {
  const index = isAnnual === 1 ? Number("1") : Number("0");

  const upgradeClass = isUpgrade ? "upgrade" : "not-upgrade";
-
+  console.log("activeRadioOption", activeRadioOption);
  return (
    <div className="radio-container">
      <div className="radio-option-container" key={name}>
--- a/src/styles/signup.scss
+++ b/src/styles/signup.scss
@@ -86,7 +86,7 @@
 .select-plan-header {
  display: flex;
  flex-direction: row;
-  height: 55px;
+  height: 70px;
  width: 830px;
  margin-bottom: 10px;
 }
@@ -96,6 +96,16 @@
  width: 50%;
 }

+.plan-header-right > h5 {
+  margin-bottom: 4px !important;
+}
+
+.subscribe-header-sub {
+  margin-left: 14px;
+  font-size: 0.86rem;
+  font-weight: 300;
+}
+
 .plan-header-right-lower {
  display: flex;
  flex-direction: column;