-
Notifications
You must be signed in to change notification settings - Fork 2
Added the supporter page and updated the navigations #30
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from all commits
c0bc6cb
34cf069
91c6777
98f1018
08cf44c
922578d
8fe0958
f29f414
f2ade7f
7477d96
a1528ca
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
import ContactUs from "../../components/supporters/contact_us"; | ||
|
||
export default function Supporters() { | ||
return ( | ||
<div className="container mx-auto items-center justify-center bg-[#00142B]"> | ||
<ContactUs /> | ||
</div> | ||
); | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import Description from "~/components/supporters/description"; | ||
import SteeringCommittee from "~/components/supporters/steering_committee"; | ||
import Members from "~/components/supporters/contributors"; | ||
// import ContactUs from "../../components/supporters/contact_us"; | ||
import JoinUs from "~/components/supporters/join_us"; | ||
import RoleDescription from "~/components/supporters/role_description"; | ||
|
||
export default function Supporters() { | ||
return ( | ||
<div className="items-center justify-center"> | ||
<div className="container mx-auto px-4 md:px-8 lg:px-48"> | ||
<Description /> | ||
<SteeringCommittee /> | ||
<Members /> | ||
</div> | ||
<div className="container mx-auto px-4 md:px-8 lg:px-20"> | ||
<JoinUs /> | ||
<RoleDescription /> | ||
</div> | ||
</div> | ||
); | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -13,19 +13,43 @@ import { Button } from "components/ui/button"; | |
|
||
const Navbar = () => { | ||
const navItems = [ | ||
{ | ||
name: "Supporters", | ||
href: "/supporters", | ||
segmentMsg: "agntcy supporters clicked", | ||
target: "_self", | ||
segmentOpt: { | ||
link_label: "Supporters", | ||
location: "global header", | ||
resource_interaction: "Visit supporters page", | ||
}, | ||
}, | ||
{ | ||
name: "Github", | ||
href: "https://github.com/agntcy", | ||
target: "_blank", | ||
segmentMsg: "agntcy github clicked", | ||
segmentOpt: { | ||
link_label: "Github", | ||
location: "global header", | ||
resource_interaction: "Visit GitHub repositoty", | ||
}, | ||
}, | ||
// { | ||
// name: "Resources", | ||
// href: "/resources", | ||
// target: "_self", | ||
// segmentMsg: "agntcy resources clicked", | ||
// segmentOpt: { | ||
// link_label: "Resources", | ||
// location: "global header", | ||
// resource_interaction: "Visit resources page", | ||
// }, | ||
// }, | ||
{ | ||
name: "Documentation", | ||
href: "https://docs.agntcy.org", | ||
target: "_blank", | ||
segmentMsg: "agntcy doc clicked", | ||
segmentOpt: { | ||
link_label: "Documentation", | ||
|
@@ -59,7 +83,7 @@ const Navbar = () => { | |
<Link | ||
key={item.name} | ||
href={item.href} | ||
target={"_blank"} | ||
target={item.target} | ||
// segmentMsg={item.segmentMsg} | ||
// segmentOpt={item.segmentOpt} | ||
> | ||
|
@@ -77,7 +101,7 @@ const Navbar = () => { | |
// resource_interaction: "email signup", | ||
// }} | ||
> | ||
<div className="flex-shrink-0 text-xl font-bold text-[#FBAB2C] hover:text-[#00142B] transition ease-in-out hover:bg-[#FBAB2C] border-2 border-[#FBAB2C] py-3 px-5 rounded-full"> | ||
<div className="flex-shrink-0 text-center text-xl font-bold text-[#FBAB2C] hover:text-[#00142B] transition ease-in-out hover:bg-[#FBAB2C] border-2 border-[#FBAB2C] py-3 md:py-0 lg:py-3 xl:py-3 2xl:py-3 px-5 rounded-full"> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Sure updated! |
||
Join us | ||
</div> | ||
</Link> | ||
|
@@ -128,7 +152,7 @@ const Navbar = () => { | |
<Link | ||
key={item.name} | ||
href={item.href} | ||
target={"_blank"} | ||
target={item.target} | ||
// segmentMsg={item.segmentMsg} | ||
// segmentOpt={item.segmentOpt} | ||
> | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,96 @@ | ||
"use client"; | ||
import React, { useEffect, useState } from "react"; | ||
import "~/styles/form.css"; | ||
// import { analytics } from "lib/segment"; | ||
// import { useRouter } from "next/navigation"; | ||
|
||
declare global { | ||
interface Window { | ||
lintrk: any; | ||
} | ||
} | ||
|
||
const HubspotContactForm = ({ | ||
region, | ||
portalId, | ||
formId, | ||
// segmentMsg = "AGNTCY supporter details submitted", | ||
}: { portalId: string; formId: string; region: string; }) => { | ||
// const router = useRouter(); | ||
const [loading, setLoading] = useState(true); | ||
|
||
useEffect(() => { | ||
const element = document.getElementsByClassName("hsfc-TextField"); | ||
if(element) | ||
{ | ||
setLoading(false); | ||
} | ||
},[]) | ||
|
||
useEffect(() => { | ||
const script = document.createElement("script"); | ||
script.src = "https://js.hsforms.net/forms/embed/v2.js"; | ||
document.body.appendChild(script); | ||
|
||
script.addEventListener("load", () => { | ||
// @ts-expect-error: Third-party library | ||
if (window.hbspt) { | ||
// @ts-expect-error: Third-party library | ||
window.hbspt.forms.create({ | ||
target: `#hubspotForm-${formId}`, | ||
// onFormSubmit: () => { | ||
// if (conversion_id) { | ||
// window.lintrk("track", { conversion_id: conversion_id }); | ||
// } | ||
// }, | ||
// onFormSubmitted: (_, data) => { | ||
// if formId is 7f3330bd-39c5-4358-b56d-44b90ae62e8e, redirect to thank you page | ||
// if (formId == "7f3330bd-39c5-4358-b56d-44b90ae62e8e") { | ||
// router.push("/outshift-newsletter-thank-you"); | ||
// } | ||
// const submissionValues = data.submissionValues; | ||
|
||
// Segment Identify Call | ||
// analytics.identify({ | ||
// firstname: submissionValues.firstname, | ||
// lastname: submissionValues.lastname, | ||
// email: submissionValues.email, | ||
// jobtitle: submissionValues.jobtitle, | ||
// agreed_to_pii: | ||
// submissionValues.consent_marketing_emails_and_privacy_policy, | ||
// }); | ||
|
||
// Segment Track Call | ||
// analytics.track(segmentMsg, { | ||
// firstname: submissionValues.firstname, | ||
// lastname: submissionValues.lastname, | ||
// email: submissionValues.email, | ||
// jobtitle: submissionValues.jobtitle, | ||
// agreed_to_pii: | ||
// submissionValues.consent_marketing_emails_and_privacy_policy, | ||
// }); | ||
// }, | ||
...{ region: region, portalId: portalId, formId: formId }, | ||
}); | ||
} | ||
setTimeout(() => { | ||
const formElement = document.querySelector(`#hubspotForm-${formId}`); | ||
if (formElement) { | ||
// Remove invalid role attributes | ||
const invalidRoles = | ||
formElement.querySelectorAll('[role="checkbox"]'); | ||
invalidRoles.forEach((el) => el.removeAttribute("role")); | ||
} | ||
}, 500); | ||
}); | ||
}, [region, portalId, formId]); | ||
|
||
return ( | ||
<div> | ||
{loading && <div className="loader">Loading form...</div>} | ||
<div id={`hubspotForm-${formId}`}></div> | ||
</div> | ||
); | ||
}; | ||
|
||
export default HubspotContactForm; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
import Image from "next/image"; | ||
|
||
const RenderLogos = ( | ||
logos: { | ||
name: string; | ||
src: string; | ||
width: number; | ||
height: number; | ||
}[], | ||
className: string, | ||
) => { | ||
return logos.map((logo, i) => ( | ||
<div key={i} className={className}> | ||
<Image | ||
key={logo.name} | ||
unoptimized | ||
src={logo.src} | ||
alt={logo.name} | ||
className="pt-4" | ||
height={logo.height} | ||
width={logo.width} | ||
/> | ||
</div> | ||
)); | ||
}; | ||
|
||
export default RenderLogos; | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
// components/Table.tsx | ||
import React from "react"; | ||
|
||
interface TableProps { | ||
headers: string[]; | ||
data: Array<{ [key: string]: string | number }>; | ||
} | ||
|
||
const Table: React.FC<TableProps> = ({ headers, data }) => { | ||
return ( | ||
<table style={{ border: "1px solid black", borderCollapse: "collapse", width: "100%", borderRadius: "20px" }}> | ||
<thead> | ||
<tr> | ||
{headers.map((header, index) => ( | ||
<th key={index} style={{ border: "1px solid black", borderColor:"white", verticalAlign: "top", textAlign: "left", padding: "8px", color: "white", fontWeight: "bold", backgroundColor: "#187ADC", paddingTop: "12px", paddingBottom: "12px", paddingLeft: "12px", paddingRight: "12px" }}> | ||
{header} | ||
</th> | ||
))} | ||
</tr> | ||
</thead> | ||
<tbody> | ||
{data.map((row, rowIndex) => ( | ||
<tr key={rowIndex}> | ||
{headers.map((header, colIndex) => ( | ||
<td key={colIndex} style={{ border: "1px solid black", borderColor:"white", padding: "8px", color: "white", backgroundColor: "#00142B", whiteSpace: "pre-line", verticalAlign: "top", paddingTop: "12px", paddingBottom: "12px", paddingLeft: "12px", paddingRight: "12px" }}> | ||
{row[header]} | ||
</td> | ||
))} | ||
</tr> | ||
))} | ||
</tbody> | ||
</table> | ||
); | ||
}; | ||
|
||
export default Table; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,37 @@ | ||
"use client"; | ||
import Image from "next/image"; | ||
import HubspotContactForm from "../reusables/hubspot-contact-form"; | ||
|
||
const ContactUs = () => { | ||
return ( | ||
<div className="container rounded-2xl md:py-36 w-[100%] md:w-[100%] lg:w-[80%] xl:w-[70%] py-12 mb-8 pl-4 pr-4 lg:py-12 lg:pl-56 lg:pr-0 xl:ml-56 xl:mr-56 xl:mb-24 xl:px-20 2xl:pl-[0%] 2xl:pr-0"> | ||
<div className="w-full 2xl:max-w-fit py-0 pb-12"> | ||
<div className="col-span-1 sm:pt-0 sm:pb-12 px-4 "> | ||
<div className="flex items-center justify-center"> | ||
<Image | ||
unoptimized | ||
src={"/images/logo_orange.png"} | ||
alt="Logo" | ||
className="pt-4" | ||
height={300} | ||
width={300} | ||
/> | ||
</div> | ||
<div className="py-6 flex text-white text-lg"> | ||
<h3>If you're using AGNTCY in your organization or desire to show your support for an open, interoperable internet of agents, please fill out this form to add your company name to the list.</h3> | ||
</div> | ||
</div> | ||
<div className="px-0 relative py-0 bg-white rounded-xl"> | ||
<HubspotContactForm | ||
region="na1" | ||
portalId="19886599" | ||
// conversion_id='15706732' | ||
formId="78489991-a791-474b-b7e6-38e53f887820" | ||
/> | ||
</div> | ||
</div> | ||
</div> | ||
); | ||
}; | ||
|
||
export default ContactUs; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just a quick note for
RenderLogos
andrenderLogos
here. Everything else looks good to me now. Thanks!There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yes while code conflict it updated wrongly. Corrected it now