feat: Footer component integration

powerhouse-inc · Sep 12, 2024 · b9e6355 · b9e6355
1 parent d0a09f3
commit b9e6355
Show file tree

Hide file tree

Showing 3 changed files with 58 additions and 2 deletions.
diff --git a/src/components/app.tsx b/src/components/app.tsx
@@ -5,8 +5,8 @@ import {
 } from '@powerhousedao/design-system';
 import { useAtomValue } from 'jotai';
 import React, { Suspense } from 'react';
+import { Footer } from 'src/components/footer';
 import { ModalManager } from 'src/components/modal';
-import { PHLogo } from 'src/components/ph-logo';
 import { ReadModeContextProvider } from 'src/context/read-mode';
 import atoms from 'src/store';
 
@@ -34,7 +34,7 @@ export default (
                         <ToastContainer position="bottom-right" />
                         <ModalManager>
                             <Router />
-                            <PHLogo />
+                            <Footer />
                         </ModalManager>
                     </UiNodesContextProvider>
                 </ReadModeContextProvider>

diff --git a/src/components/footer.tsx b/src/components/footer.tsx
@@ -0,0 +1,50 @@
+import {
+    Footer as DesignSystemFooter,
+    FooterLink,
+    Icon,
+} from '@powerhousedao/design-system';
+import { Trans } from 'react-i18next';
+import { openUrl } from 'src/utils/openUrl';
+
+export const Footer = () => {
+    return (
+        <DesignSystemFooter className="fixed bottom-8 right-8">
+            <FooterLink
+                onClick={() =>
+                    openUrl('https://expenses.makerdao.network/cookies-policy')
+                }
+            >
+                <Trans i18nKey="footer.cookiePolicy" />
+            </FooterLink>
+            <FooterLink
+                onClick={() => openUrl('https://docs.sky.money/legal-terms')}
+            >
+                <Trans i18nKey="footer.termsOfUse" />
+            </FooterLink>
+            <FooterLink
+                onClick={() =>
+                    openUrl('https://expenses.makerdao.network/disclaimer')
+                }
+            >
+                <Trans i18nKey="footer.disclaimer" />
+            </FooterLink>
+            <FooterLink
+                id="ph-logo-link"
+                onClick={() => openUrl('https://www.powerhouse.inc/')}
+            >
+                <Trans
+                    i18nKey="footer.builtWith"
+                    components={{
+                        icon: (
+                            <Icon
+                                name="PHLogoSmall"
+                                size={16}
+                                className="mx-1"
+                            />
+                        ),
+                    }}
+                />
+            </FooterLink>
+        </DesignSystemFooter>
+    );
+};
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
@@ -87,5 +87,11 @@
         "driveSyncError": "Error synchronizing drive {{drive}}",
         "driveSyncConflict": "Conflict error detected in {{drive}}",
         "reloadApp": "It seems like you're running an outdated version of the app. Please reload Connect to get the latest version."
+    },
+    "footer": {
+        "cookiePolicy": "Cookie Policy",
+        "termsOfUse": "Terms of Use",
+        "disclaimer": "Disclaimer",
+        "builtWith": "Built with <icon /> Powerhouse"
     }
 }