add support links

docs/support.md

@@ -3,6 +3,7 @@ sidebar_position: 10
 title: Support
 description: Contact support
 ---
+import SupportContent from '@site/src/components/SupportContent';
 
 ## Troubleshooting
 
@@ -14,6 +15,8 @@ While NEAR Treasury is designed to be user-friendly and reliable, issues can som
 
 ## Contact us
 
+<SupportContent />
+
 :::tip
 If you encounter a problem that's not listed here, please contact the [NEAR Treasury support team](https://neartreasury.com/contact-form) for assistance.
 :::

src/components/HomepageContent/index.js → src/components/SupportContent/index.js

@@ -1,13 +1,14 @@
 import React from 'react';
 import clsx from 'clsx';
 import Link from '@docusaurus/Link';
-
+import Gleap from "gleap";
 import styles from './index.module.scss';
 
+
 function Card({ Svg, title, description, to }) {
   return (
     <div className={clsx('col col--4 margin-bottom--lg', styles.heroCard)}>
-      <Link to={to} className='card padding--lg'>
+      <Link onClick={to} to='#' className='card padding--lg'>
         <div className={styles.svgWrapper}>
           <Svg className={styles.cardSvg} role="img" />
         </div>
@@ -18,27 +19,39 @@ function Card({ Svg, title, description, to }) {
   );
 }
 
-export default function HomepageContent() {
+export default function SupportContent() {
+  const runGleapConversations = () => {
+    Gleap.openConversations();
+  };
+
+  const runGleapFeatureRequests = () => {
+    Gleap.openFeatureRequests(false);
+  };
+
+  const runGleapNews = () => {
+    Gleap.openNews(false);
+  };
+
   return (
     <div className="container">
       <section className="row">
         <Card
-          Svg={require('@site/static/img/multisig.svg').default}
-          title="Table of Contents"
-          description="Welcome to the Near Treasury documentation."
-          to="/intro"
+          Svg={require('@site/static/img/operations.svg').default}
+          title="Messages"
+          description="Send us a message"
+          to={runGleapConversations}
         />
         <Card
           Svg={require('@site/static/img/transparency.svg').default}
-          title="Getting Started"
-          description="Create your Treasury in a few simple steps."
-          to="/quickstart"
+          title="News"
+          description="Latest News"
+          to={runGleapNews}
         />
         <Card
-          Svg={require('@site/static/img/operations.svg').default}
-          title="Payments"
-          description="Core features for managing your funds."
-          to="/payments"
+          Svg={require('@site/static/img/multisig.svg').default}
+          title="Feature Requests"
+          description="Ask for a feature"
+          to={runGleapFeatureRequests}
         />
       </section>
     </div>