From cf799e63ca57c15bc12e61f7f3749192e89f0769 Mon Sep 17 00:00:00 2001
From: Adithya Krishna <adikrish@redhat.com>
Date: Sat, 26 Aug 2023 13:19:47 +0530
Subject: [PATCH] chore: updated footer component

Signed-off-by: Adithya Krishna <adikrish@redhat.com>
---
 .../web/src/components/(marketing)/footer.tsx | 79 +++++++------------
 1 file changed, 28 insertions(+), 51 deletions(-)

diff --git a/apps/web/src/components/(marketing)/footer.tsx b/apps/web/src/components/(marketing)/footer.tsx
index 823ece92e..df47b05da 100644
--- a/apps/web/src/components/(marketing)/footer.tsx
+++ b/apps/web/src/components/(marketing)/footer.tsx
@@ -10,6 +10,19 @@ import { cn } from '@documenso/ui/lib/utils';
 export type FooterProps = HTMLAttributes<HTMLDivElement>;
 
 export const Footer = ({ className, ...props }: FooterProps) => {
+  const socialLinks = [
+    { href: 'https://twitter.com/documenso', icon: <Twitter className="h-6 w-6" /> },
+    { href: 'https://github.com/documenso/documenso', icon: <Github className="h-6 w-6" /> },
+    { href: 'https://documenso.slack.com', icon: <Slack className="h-6 w-6" /> },
+  ];
+
+  const footerLinks = [
+    { href: '/pricing', text: 'Pricing' },
+    { href: 'https://status.documenso.com', text: 'Status', target: '_blank' },
+    { href: 'mailto:support@documenso.com', text: 'Support' },
+    // { href: '/privacy', text: 'Privacy'}
+  ];
+
   return (
     <div className={cn('border-t py-12', className)} {...props}>
       <div className="mx-auto flex w-full max-w-screen-xl flex-wrap items-start justify-between gap-8 px-8">
@@ -19,61 +32,25 @@ export const Footer = ({ className, ...props }: FooterProps) => {
           </Link>
 
           <div className="mt-4 flex flex-wrap items-center gap-x-4 gap-y-4 text-[#8D8D8D]">
-            <Link
-              href="https://twitter.com/documenso"
-              target="_blank"
-              className="hover:text-[#6D6D6D]"
-            >
-              <Twitter className="h-6 w-6" />
-            </Link>
-
-            <Link
-              href="https://github.com/documenso/documenso"
-              target="_blank"
-              className="hover:text-[#6D6D6D]"
-            >
-              <Github className="h-6 w-6" />
-            </Link>
-
-            <Link
-              href="https://documenso.slack.com"
-              target="_blank"
-              className="hover:text-[#6D6D6D]"
-            >
-              <Slack className="h-6 w-6" />
-            </Link>
+            {socialLinks.map((link, index) => (
+              <Link key={index} href={link.href} target="_blank" className="hover:text-[#6D6D6D]">
+                {link.icon}
+              </Link>
+            ))}
           </div>
         </div>
 
         <div className="flex flex-wrap items-center gap-x-4 gap-y-2.5">
-          <Link
-            href="/pricing"
-            className="flex-shrink-0 text-sm text-[#8D8D8D] hover:text-[#6D6D6D]"
-          >
-            Pricing
-          </Link>
-
-          <Link
-            href="https://status.documenso.com"
-            target="_blank"
-            className="flex-shrink-0 text-sm text-[#8D8D8D] hover:text-[#6D6D6D]"
-          >
-            Status
-          </Link>
-
-          <Link
-            href="mailto:support@documenso.com"
-            className="flex-shrink-0 text-sm text-[#8D8D8D] hover:text-[#6D6D6D]"
-          >
-            Support
-          </Link>
-
-          {/* <Link
-            href="/privacy"
-            className="flex-shrink-0 text-sm text-[#8D8D8D] hover:text-[#6D6D6D]"
-          >
-            Privacy
-          </Link> */}
+          {footerLinks.map((link, index) => (
+            <Link
+              key={index}
+              href={link.href}
+              target={link.target}
+              className="flex-shrink-0 text-sm text-[#8D8D8D] hover:text-[#6D6D6D]"
+            >
+              {link.text}
+            </Link>
+          ))}
         </div>
       </div>
       <div className="mx-auto mt-4 w-full max-w-screen-xl px-8 md:mt-12 lg:mt-24">