feat: negative competitors pricing

src/components/PricingComparator/PricingComparator.js

@@ -6,6 +6,7 @@ import { Dropdown } from "../Dropdown";
 import formatNumber from "@site/src/utils/formatNumber";
 import plans from "@site/src/constants/plans";
 import competitors from "@site/src/constants/competitors";
+import Link from "@docusaurus/Link";
 
 function getPrices(users, paidAnnually, labCompetitor, chatCompetitor) {
   const plan = [
@@ -81,6 +82,26 @@ export default function PricingComparator() {
     setUsers(currentUsers => currentUsers + step);
   };
 
+  const value = Math.round(prices.froggit - (prices.lab + prices.chat)) * users * 12;
+
+  let message = <>
+    Économise{users > 1 ? "z" : ""}{" "}
+    <span className={styles.summaryBadge}>
+      {formatNumber(
+        Math.abs(value)
+      )}
+          €
+    </span>{" "}
+        par an pour {users} utilisateur
+    {users > 1 ? "s" : ""} avec Froggit ! 
+  </>;
+
+  if (value > 0) {
+    message = <>
+    Froggit ne {users > 1 ? "vous" : "te"} ferait rien économiser, mais regarde{users > 1 ? "z" : ""} du coté de nos <Link to="/dedie">offres dédiées</Link> !
+    </>;
+  }
+
   return (
     <div className={styles.container}>
       <div className={styles.controls}>
@@ -251,15 +272,7 @@ export default function PricingComparator() {
         </div>
       </div>
       <p className={styles.summary}>
-        Économise{users > 1 ? "z" : ""}{" "}
-        <span className={styles.summaryBadge}>
-          {formatNumber(
-            Math.abs(prices.froggit - (prices.lab + prices.chat)) * users * 12
-          )}
-          €
-        </span>{" "}
-        par an pour {users} utilisateur
-        {users > 1 ? "s" : ""} avec Froggit !
+        {message}
       </p>
     </div>
   );

src/constants/competitors.ts

@@ -30,5 +30,10 @@ export default {
       paidMonthly: 18.25,
       paidAnnually: 16.75,
     },
+    {
+      name: "Discord",
+      paidMonthly: 0,
+      paidAnnually: 0,
+    },
   ],
 };