fixing links to contact form (#9945)

* fixing links to contact form * editing links and hubspot form to fix caching issue * fixing linting * removing sales page * linter * fix linter again
dust-tt · Jan 14, 2025 · 3068af8 · 3068af8
1 parent 136e2e4
commit 3068af8
Show file tree

Hide file tree

Showing 6 changed files with 66 additions and 49 deletions.
diff --git a/front/components/home/ContentBlocks.tsx b/front/components/home/ContentBlocks.tsx
@@ -173,13 +173,14 @@ export const HeaderContentBlock = ({
               icon={RocketIcon}
             />
           </Link>
-          <Button
-            variant="outline"
-            size="md"
-            label="Talk to sales"
-            href="https://forms.gle/dGaQ1AZuDCbXY1ft9"
-            target="_blank"
-          />
+          <Link href="/contact" shallow={true}>
+            <Button
+              variant="outline"
+              size="md"
+              label="Talk to sales"
+              target="_blank"
+            />
+          </Link>
         </div>
       )}
     </div>

diff --git a/front/components/home/HubSpotForm.tsx b/front/components/home/HubSpotForm.tsx
@@ -1,25 +1,45 @@
-import { useEffect } from "react";
+import React, { useEffect } from "react";
+
+declare global {
+  interface Window {
+    hbspt?: {
+      forms: {
+        create: (config: {
+          region: string;
+          portalId: string;
+          formId: string;
+          target: string;
+        }) => void;
+      };
+    };
+  }
+}
 
 export default function HubSpotForm() {
   useEffect(() => {
-    // Add script dynamically
-    const script = document.createElement("script");
-    script.src = "https://js-eu1.hsforms.net/forms/embed/144442587.js";
-    script.defer = true;
-    document.body.appendChild(script);
-
-    // Cleanup on unmount
-    return () => {
-      document.body.removeChild(script);
+    const existingScript = document.getElementById("hubspot-script");
+    const createForm = () => {
+      if (window.hbspt && window.hbspt.forms && window.hbspt.forms.create) {
+        window.hbspt.forms.create({
+          region: "eu1",
+          portalId: "144442587",
+          formId: "31e790e5-f4d5-4c79-acc5-acd770fe8f84",
+          target: "#hubspotForm",
+        });
+      }
     };
-  }, []);
 
-  return (
-    <div
-      className="hs-form-frame"
-      data-region="eu1"
-      data-form-id="31e790e5-f4d5-4c79-acc5-acd770fe8f84"
-      data-portal-id="144442587"
-    />
-  );
+    if (!existingScript) {
+      const script = document.createElement("script");
+      script.id = "hubspot-script";
+      script.src = "https://js-eu1.hsforms.net/forms/v2.js";
+      script.defer = true;
+      script.onload = createForm;
+      document.body.appendChild(script);
+    } else {
+      // If the script is already present, just recreate the form
+      createForm();
+    }
+  }, []);
+  return <div id="hubspotForm" />;
 }
diff --git a/front/components/home/LandingLayout.tsx b/front/components/home/LandingLayout.tsx
@@ -99,14 +99,15 @@ export default function LandingLayout({
           </div>
           <MainNavigation />
           <div className="flex flex-grow justify-end gap-4">
-            <Button
-              className="hidden xs:block"
-              variant="outline"
-              size="sm"
-              label="Request a demo"
-              href="https://forms.gle/dGaQ1AZuDCbXY1ft9"
-              target="_blank"
-            />
+            <Link href="/home/contact" shallow={true}>
+              <Button
+                className="hidden xs:block"
+                variant="outline"
+                size="sm"
+                label="Request a demo"
+                target="_blank"
+              />
+            </Link>
             <Button
               variant="highlight"
               size="sm"

diff --git a/front/components/home/menu/config.ts b/front/components/home/menu/config.ts
@@ -146,7 +146,7 @@ const BuildMenuConfig: MenuConfig = {
     },
     {
       title: "Guides & Tutorials",
-      href: "https://dust-tt.notion.site/c3edbbd1a2e8464f9a692e9f7486af95?v=bab4f048e7a942e2b79bf434d83dc527",
+      href: "https://docs.dust.tt/docs/use-cases",
       isExternal: true,
     },
   ],

diff --git a/front/pages/home/contact.tsx b/front/pages/home/contact.tsx
@@ -1,20 +1,14 @@
-import dynamic from "next/dynamic";
 import type { ReactElement } from "react";
 
 import { HeaderContentBlock } from "@app/components/home/ContentBlocks";
+import HubSpotForm from "@app/components/home/HubSpotForm";
 import type { LandingLayoutProps } from "@app/components/home/LandingLayout";
 import LandingLayout from "@app/components/home/LandingLayout";
 import {
   getParticleShapeIndexByName,
   shapeNames,
 } from "@app/components/home/Particles";
 import TrustedBy from "@app/components/home/TrustedBy";
-// import HubSpotForm from "@app/components/home/HubSpotForm";
-
-const HubSpotForm = dynamic(
-  () => import("@app/components/home/HubSpotForm").then((mod) => mod.default)
-  // { ssr: false }
-);
 
 export async function getServerSideProps() {
   return {

diff --git a/front/pages/home/solutions/customer-support.tsx b/front/pages/home/solutions/customer-support.tsx
@@ -132,13 +132,14 @@ export default function CustomerSupport() {
                 icon={RocketIcon}
               />
             </Link>
-            <Button
-              variant="outline"
-              size="md"
-              label="Talk to sales"
-              href="https://forms.gle/dGaQ1AZuDCbXY1ft9"
-              target="_blank"
-            />
+            <Link href="/home/contact" shallow={true}>
+              <Button
+                variant="outline"
+                size="md"
+                label="Talk to sales"
+                target="_blank"
+              />
+            </Link>
           </div>
         </div>
         <div