From ec249cad30ca4040b9a436b5d3c836b0e6d09ee1 Mon Sep 17 00:00:00 2001
From: xvoorvaa <xander@xvproductions.com>
Date: Thu, 25 Jan 2024 14:31:38 +0100
Subject: [PATCH] Added a `<Footer>`

---
 packages/app/app/(home)/layout.tsx        |  7 ++-
 packages/app/app/(vod)/layout.tsx         |  9 +++-
 packages/app/components/Layout/Footer.tsx | 54 +++++++++++++++++++++++
 3 files changed, 66 insertions(+), 4 deletions(-)
 create mode 100644 packages/app/components/Layout/Footer.tsx

diff --git a/packages/app/app/(home)/layout.tsx b/packages/app/app/(home)/layout.tsx
index 35d7f94e4..fe39bda04 100644
--- a/packages/app/app/(home)/layout.tsx
+++ b/packages/app/app/(home)/layout.tsx
@@ -1,16 +1,19 @@
 import Image from 'next/image'
 import HomePageNavbar from '@/components/Layout/HomePageNavbar'
+import Footer from '@/components/Layout/Footer'
+
 const Layout = async ({
   children,
 }: {
   children: React.ReactNode
 }) => {
   return (
-    <div className="w-full ">
+    <div className="w-full">
       <HomePageNavbar />
-      <div className="top-[74px] flex flex-col p-2 lg:p-4 overflow-scroll">
+      <div className="flex overflow-scroll flex-col p-2 lg:p-4 top-[74px]">
         {children}
       </div>
+      <Footer />
     </div>
   )
 }
diff --git a/packages/app/app/(vod)/layout.tsx b/packages/app/app/(vod)/layout.tsx
index 083d9193c..2acf0e8f0 100644
--- a/packages/app/app/(vod)/layout.tsx
+++ b/packages/app/app/(vod)/layout.tsx
@@ -1,15 +1,20 @@
 import HomePageNavbar from '@/components/Layout/HomePageNavbar'
+import Footer from '@/components/Layout/Footer'
+
 const Layout = async ({
   children,
 }: {
   children: React.ReactNode
 }) => {
   return (
-    <div className="w-screen h-screen max-w-screen-2xl mx-auto">
+    <div className="mx-auto w-screen max-w-screen-2xl h-screen">
       <HomePageNavbar />
-      <div className=" flex flex-col p-2 lg:p-4 overflow-scroll">
+      <div className="flex overflow-scroll flex-col p-2 lg:p-4">
         {children}
       </div>
+      <div className="sticky mb-5 top-[100vh]">
+        <Footer />
+      </div>
     </div>
   )
 }
diff --git a/packages/app/components/Layout/Footer.tsx b/packages/app/components/Layout/Footer.tsx
new file mode 100644
index 000000000..ff83ce3b4
--- /dev/null
+++ b/packages/app/components/Layout/Footer.tsx
@@ -0,0 +1,54 @@
+import Image from 'next/image'
+import Link from 'next/link'
+
+const items = {
+  about: {
+    item: 'About us',
+    href: 'https://info.streameth.org',
+  },
+  contact: {
+    item: 'Contact',
+    href: 'https://info.streameth.org/#team',
+  },
+  docs: {
+    item: 'Docs',
+    href: 'https://streameth.notion.site/a473a629420b4942904c851155a18c9b?v=4a29b97e7fd94bbbb38269cb808d3ac4',
+  },
+  privacy: {
+    item: 'Privacy',
+    href: '#',
+  },
+  terms: {
+    item: 'Terms',
+    href: 'https://streameth.notion.site/StreamETH-International-B-V-Terms-and-Conditions-4d6c7924134c4b2886bd171d2bad0966',
+  },
+}
+
+const Footer = () => {
+  const year = new Date().getFullYear()
+
+  return (
+    <footer className="flex justify-center items-center mb-5 z-[99999999]">
+      <Image
+        className="hidden lg:block"
+        src="/logo.png"
+        alt="Streameth logo"
+        width={30}
+        height={30}
+      />
+      <div className="mx-2 text-sm text-black">
+        © {year} StreamETH International B.V.
+      </div>
+      {Object.entries(items).map(([key, { item, href }]) => (
+        <Link
+          key={key}
+          href={href}
+          className="mx-2 text-sm font-light text-black underline">
+          {item}
+        </Link>
+      ))}
+    </footer>
+  )
+}
+
+export default Footer