chore: update and tweak community page (#1950)

formbricks · Jan 23, 2024 · 3d6e974 · 3d6e974 · vercel · Jan 23, 2024
1 parent 6ea7486
commit 3d6e974
Show file tree

Hide file tree

Showing 2 changed files with 98 additions and 19 deletions.
diff --git a/apps/formbricks-com/pages/community/Roadmap.tsx b/apps/formbricks-com/pages/community/Roadmap.tsx
@@ -1,4 +1,5 @@
 import { ChevronDownIcon } from "@heroicons/react/24/outline";
+import Image from "next/image";
 import Link from "next/link";
 import { FaGithub } from "react-icons/fa6";
 
@@ -7,6 +8,7 @@ import { Button } from "@formbricks/ui/Button";
 interface Event {
   name: string;
   link?: string;
+  contributorAvatarUrl?: string;
 }
 
 interface EventBlock {
@@ -37,9 +39,23 @@ export const Roadmap: React.FC<RoadmapProps> = ({ data }) => {
                 <Link
                   href={event.link}
                   target="_blank"
-                  className="group mb-2 flex max-w-fit justify-between rounded-xl border border-slate-200 bg-slate-100 px-6 py-3 text-slate-700 transition-all hover:scale-105 hover:border-slate-300 hover:bg-slate-200">
+                  className="group mb-2 flex max-w-fit items-center justify-between rounded-xl border border-slate-200 bg-slate-100 px-6 py-3 text-slate-700 transition-all hover:scale-105 hover:border-slate-300 hover:bg-slate-200">
                   {event.name}
-                  <FaGithub className="ml-0 inline-block h-6 w-0 text-slate-800 opacity-0 transition-all group-hover:ml-6 group-hover:w-6 group-hover:opacity-100" />
+                  <div className="relative inline-block">
+                    {event.contributorAvatarUrl && (
+                      <Image
+                        src={event.contributorAvatarUrl}
+                        alt="contributor power"
+                        width={32}
+                        height={32}
+                        className="ml-2 transform rounded-full transition-all delay-200 group-hover:scale-0 "
+                      />
+                    )}
+                    <FaGithub
+                      className="absolute left-2 top-0 h-8 w-8 scale-0 transform text-slate-800 opacity-0 transition-all group-hover:scale-100 group-hover:opacity-100"
+                      style={{ transitionDelay: "0.2s" }}
+                    />
+                  </div>
                 </Link>
               ) : (
                 <div className="mb-2 block max-w-fit rounded-xl border border-slate-200 bg-slate-100 px-6 py-3 text-slate-700 transition-all">

diff --git a/apps/formbricks-com/pages/community/index.tsx b/apps/formbricks-com/pages/community/index.tsx
@@ -11,6 +11,7 @@ import Image from "next/image";
 import Link from "next/link";
 import { useEffect } from "react";
 
+import { Button } from "@formbricks/ui/Button";
 import LoadingSpinner from "@formbricks/ui/LoadingSpinner";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@formbricks/ui/Tooltip";
 
@@ -230,35 +231,93 @@ const roadmapDates = [
     description: "Hackathon Kick-Off 🔥",
     period: "1st October 2023",
     events: [
-      { name: "✅ Email Embeds", link: "https://github.com/formbricks/formbricks/pull/873" },
-      { name: "✅ Hidden Fields", link: "https://github.com/formbricks/formbricks/pull/1144" },
+      {
+        name: "✅ Email Embeds",
+        link: "https://github.com/formbricks/formbricks/pull/873",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/56182734?v=4",
+      },
+      {
+        name: "✅ Hidden Fields",
+        link: "https://github.com/formbricks/formbricks/pull/1144",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/72537293?v=4",
+      },
       {
         name: "✅ Question Type: Picture Choice",
         link: "https://github.com/formbricks/formbricks/pull/1388",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/56182734?v=4",
+      },
+      {
+        name: "✅ Question Type: Welcome Card",
+        link: "https://github.com/formbricks/formbricks/pull/1073",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/88614335?v=4",
+      },
+      {
+        name: "✅ Add Image to Question",
+        link: "https://github.com/formbricks/formbricks/pull/1305",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/72537293?v=4",
+      },
+      {
+        name: "✅ Dynamic Link Previews",
+        link: "https://github.com/formbricks/formbricks/pull/1093",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/92802904?v=4",
+      },
+      {
+        name: "✅ Fullscreen Previews",
+        link: "https://github.com/formbricks/formbricks/pull/898",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/32243289?v=4",
+      },
+      {
+        name: "✅ PIN protected surveys",
+        link: "https://github.com/formbricks/formbricks/pull/1142",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/44976328?v=4",
+      },
+      {
+        name: "✅ Source Tracking",
+        link: "https://github.com/formbricks/formbricks/pull/1486",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/67850763?v=4",
+      },
+      {
+        name: "✅ Time To Complete Indicator",
+        link: "https://github.com/formbricks/formbricks/pull/1461",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/67850763?v=4",
       },
-      { name: "✅ Question Type: Welcome Card", link: "https://github.com/formbricks/formbricks/pull/1073" },
-      { name: "✅ Add Image to Question", link: "https://github.com/formbricks/formbricks/pull/1305" },
-      { name: "✅ Dynamic Link Previews", link: "https://github.com/formbricks/formbricks/pull/1093" },
-      { name: "✅ Fullscreen Previews", link: "https://github.com/formbricks/formbricks/pull/898" },
-      { name: "✅ PIN protected surveys", link: "https://github.com/formbricks/formbricks/pull/1142" },
-      { name: "✅ Source Tracking", link: "https://github.com/formbricks/formbricks/pull/1486" },
-      { name: "✅ Time To Complete Indicator", link: "https://github.com/formbricks/formbricks/pull/1461" },
     ],
   },
   {
     id: "phlaunch",
     description: "Product Hunt Launch 🚀",
     period: "31st October 2023",
     events: [
-      { name: "✅ Question Type: File Upload", link: "https://github.com/formbricks/formbricks/pull/1277" },
-      { name: "✅ Notion Integration", link: "https://github.com/formbricks/formbricks/pull/1197" },
-      { name: "✅ Media Backgrounds", link: "https://github.com/formbricks/formbricks/pull/1515" },
-      { name: "🚧 Custom Styling", link: "https://github.com/formbricks/formbricks/pull/916" },
-      { name: "🚧 Recall Information", link: "https://github.com/formbricks/formbricks/issues/884" },
+      {
+        name: "✅ Question Type: File Upload",
+        link: "https://github.com/formbricks/formbricks/pull/1277",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/88614335?v=4",
+      },
+      {
+        name: "✅ Notion Integration",
+        link: "https://github.com/formbricks/formbricks/pull/1197",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/54103265?v=4",
+      },
+      {
+        name: "✅ Media Backgrounds",
+        link: "https://github.com/formbricks/formbricks/pull/1515",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/92802904?v=4",
+      },
+      {
+        name: "✅ Question Type: Schedule a call (Powered by Cal.com)",
+        link: "https://github.com/formbricks/formbricks/pull/1722",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/88614335?v=4",
+      },
+      {
+        name: "✅ Recall Information",
+        link: "https://github.com/formbricks/formbricks/pull/1789",
+        contributorAvatarUrl: "https://avatars.githubusercontent.com/u/67850763?v=4",
+      },
+      { name: "🚧 Custom Styling" },
       { name: "⏳ Unsplash Backgrounds" },
       { name: "⏳ Question Type: Matrix" },
       { name: "⏳ Question Type: Collect payment" },
-      { name: "⏳Question Type: Schedule a call (Powered by Cal.com)" },
+
       { name: "⏳ Question Type: Signature (Powered by Documenso)" },
     ],
   },
@@ -442,8 +501,8 @@ export default function FormTribeHackathon() {
   }, []);
   return (
     <LayoutTribe
-      title="Join the FormTribe"
-      description="We build an Open Source Typeform alternative together and give it to the world. Join us!">
+      title="Formbricks Community - Surveys for Millions built by our Community."
+      description="Join us building the fastest growing survey platform for the web - free and open source.">
       {/* Header */}
 
       <div className="flex h-full w-full flex-col items-center justify-center overflow-clip text-center">
@@ -703,6 +762,10 @@ export default function FormTribeHackathon() {
             </div>
           ))}
         </div>
+        <Button href="https://formbricks.com/discord" className="mt-6" target="_blank" variant="darkCTA">
+          {" "}
+          Join Discord{" "}
+        </Button>
       </div>
     </LayoutTribe>
   );