link pricing page buttons upgrade now (#2684)

Helicone · Sep 27, 2024 · 9fafb63 · 9fafb63
1 parent 5110e38
commit 9fafb63
Show file tree

Hide file tree

Showing 7 changed files with 43 additions and 13 deletions.
diff --git a/bifrost/app/components/templates/pricing/EnterpriseCard.tsx b/bifrost/app/components/templates/pricing/EnterpriseCard.tsx
@@ -3,6 +3,7 @@ import { Col } from "@/components/common/col";
 import { Row } from "@/components/common/row";
 import { CheckIcon } from "@heroicons/react/24/outline";
 import { FeatureItem } from "./FeaturedItem";
+import Link from "next/link";
 
 const EnterpriseCard: React.FC = () => {
   return (
@@ -30,9 +31,12 @@ const EnterpriseCard: React.FC = () => {
           <FeatureItem title="SOC-2 Compliance" />
           <FeatureItem title="Dedicated support" />
         </Col>
-        <button className="bg-[#FFFFFF] text-slate-900 py-[12px] border border-slate-200 rounded-[4px] mt-[8px] text-[16px]">
+        <Link
+          href="/contact"
+          className="bg-[#FFFFFF] text-slate-900 py-[12px] border border-slate-200 rounded-[4px] mt-[8px] text-[16px] text-center"
+        >
           Contact sales
-        </button>
+        </Link>
       </Col>
     </Card>
   );

diff --git a/bifrost/app/components/templates/pricing/FreeCard.tsx b/bifrost/app/components/templates/pricing/FreeCard.tsx
@@ -3,6 +3,7 @@ import { Col } from "@/components/common/col";
 import { Row } from "@/components/common/row";
 import { CheckIcon } from "@heroicons/react/24/outline";
 import { FeatureItem } from "./FeaturedItem";
+import Link from "next/link";
 
 const FreeCard: React.FC = () => {
   return (
@@ -34,9 +35,12 @@ const FreeCard: React.FC = () => {
             description="No credit card required."
           />
         </Col>
-        <button className="bg-[#FFFFFF] text-slate-900 py-[12px] border border-slate-200 rounded-[4px] mt-[8px] text-[16px]">
+        <Link
+          className="bg-[#FFFFFF] text-slate-900 py-[12px] border border-slate-200 rounded-[4px] mt-[8px] text-[16px] text-center"
+          href="https://us.helicone.ai/signin"
+        >
           Get started
-        </button>
+        </Link>
       </Col>
     </Card>
   );

diff --git a/bifrost/app/components/templates/pricing/ScaleCard.tsx b/bifrost/app/components/templates/pricing/ScaleCard.tsx
@@ -67,9 +67,12 @@ const ScaleCard: React.FC = () => {
             description="Support via email, Discord or Slack."
           />
         </Col>
-        <button className="bg-brand text-white py-[12px] rounded-[4px] mt-[8px] text-[16px] font-semibold">
+        <Link
+          href="https://us.helicone.ai/settings/billing"
+          className="bg-brand text-white py-[12px] rounded-[4px] mt-[8px] text-[16px] font-semibold text-center"
+        >
           Upgrade Now
-        </button>
+        </Link>
       </Col>
     </Card>
   );

diff --git a/bifrost/app/pricing/page.tsx b/bifrost/app/pricing/page.tsx
@@ -77,7 +77,11 @@ export default function Example() {
                 </Col>
                 <Row className="w-full h-[72px] px-[24px] items-center justify-between border-t text-slate-900 font-medium border-slate-200">
                   <span>Free</span>
-                  <Button variant={"outline"}>Start for Free</Button>
+                  <Button variant={"outline"} asChild>
+                    <Link href="https://us.helicone.ai/signin">
+                      Start for Free
+                    </Link>
+                  </Button>
                 </Row>
               </Col>
             </div>
@@ -98,8 +102,10 @@ export default function Example() {
                 </Col>
                 <Row className="w-full h-[97px] px-[24px] items-center justify-between border-t border-slate-200 text-slate-900 font-medium">
                   <span>Pro</span>
-                  <Button className="bg-brand text-white font-bold">
-                    Upgrade now
+                  <Button className="bg-brand text-white font-bold" asChild>
+                    <Link href="https://us.helicone.ai/settings/billing">
+                      Upgrade now
+                    </Link>
                   </Button>
                 </Row>
               </Col>
@@ -121,7 +127,9 @@ export default function Example() {
                 </Col>
                 <Row className=" w-full h-[72px] px-[24px] items-center justify-between border-t border-slate-200 text-slate-900 font-medium">
                   <span>Enterprise</span>
-                  <Button variant={"outline"}>Contact Sales</Button>
+                  <Button variant={"outline"} asChild>
+                    <Link href="/contact">Contact Sales</Link>
+                  </Button>
                 </Row>
               </Col>
             </div>

diff --git a/bifrost/components/templates/pricing/DeveloperCard.tsx b/bifrost/components/templates/pricing/DeveloperCard.tsx
@@ -1,6 +1,7 @@
 import { Button } from "@/components/ui/button";
 import { Col } from "@/components/common/col";
 import { Row } from "@/components/common/row";
+import Link from "next/link";
 
 const DeveloperCard = () => {
   return (
@@ -14,7 +15,9 @@ const DeveloperCard = () => {
         </Col>
         <Row className="w-full h-[72px] px-[24px] items-center justify-between border-t">
           <span>Developer</span>
-          <Button variant={"outline"}>Start for Free</Button>
+          <Button variant={"outline"} asChild>
+            <Link href="https://us.helicone.ai/signin">Start for Free</Link>
+          </Button>
         </Row>
       </Col>
     </div>

diff --git a/bifrost/components/templates/pricing/EnterpriseCard.tsx b/bifrost/components/templates/pricing/EnterpriseCard.tsx
@@ -1,6 +1,7 @@
 import { Button } from "@/components/ui/button";
 import { Col } from "@/components/common/col";
 import { Row } from "@/components/common/row";
+import Link from "next/link";
 
 const EnterpriseCard = () => {
   return (
@@ -14,7 +15,9 @@ const EnterpriseCard = () => {
         </Col>
         <Row className="w-full h-[72px] px-[24px] items-center justify-between border-t">
           <span>Enterprise</span>
-          <Button variant={"outline"}>Contact Sales</Button>
+          <Button asChild variant={"outline"}>
+            <Link href="/contact">Contact Sales</Link>
+          </Button>
         </Row>
       </Col>
     </div>

diff --git a/bifrost/components/templates/pricing/ScaleCard.tsx b/bifrost/components/templates/pricing/ScaleCard.tsx
@@ -1,6 +1,7 @@
 import { Button } from "@/components/ui/button";
 import { Col } from "@/components/common/col";
 import { Row } from "@/components/common/row";
+import Link from "next/link";
 
 const ScaleCard = () => {
   return (
@@ -14,7 +15,11 @@ const ScaleCard = () => {
         </Col>
         <Row className="w-full h-[72px] px-[24px] items-center justify-between border-t">
           <span>Scale</span>
-          <Button className="bg-brand text-white">Upgrade now</Button>
+          <Button className="bg-brand text-white" asChild>
+            <Link href="https://us.helicone.ai/settings/billing">
+              Upgrade now
+            </Link>
+          </Button>
         </Row>
       </Col>
     </div>