From 13e70fe025d36181c2ed9e51ee28380db44e2d8f Mon Sep 17 00:00:00 2001
From: Tony Giorgio <tonygiorgio@protonmail.com>
Date: Fri, 1 Aug 2025 11:54:09 -0500
Subject: [PATCH] feat: add BetterStack status badge to footers
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Added BetterStack uptime status iframe to both Footer and SimplifiedFooter components
- Used system theme for automatic light/dark mode support
- Applied 58px left margin to compensate for BetterStack's internal left-alignment
- Status badge displays "All services are online" with visual indicator

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 frontend/src/components/Footer.tsx           | 33 +++++++++++++-------
 frontend/src/components/SimplifiedFooter.tsx | 14 +++++++--
 2 files changed, 34 insertions(+), 13 deletions(-)

diff --git a/frontend/src/components/Footer.tsx b/frontend/src/components/Footer.tsx
index 656a67e2c..e15d59278 100644
--- a/frontend/src/components/Footer.tsx
+++ b/frontend/src/components/Footer.tsx
@@ -135,17 +135,28 @@ export function Footer() {
         </div>
 
         <div className="mt-12 pt-8 border-t border-[hsl(var(--marketing-card-border))] text-center">
-          <p className="text-[hsl(var(--marketing-text-muted))]/50 font-light">
-            © {new Date().getFullYear()} Maple AI. All rights reserved. Powered by{" "}
-            <a
-              href="https://opensecret.cloud"
-              target="_blank"
-              rel="noopener noreferrer"
-              className="text-[hsl(var(--purple))] hover:text-[hsl(var(--purple))]/80 transition-colors"
-            >
-              OpenSecret
-            </a>
-          </p>
+          <div className="flex flex-col items-center gap-4">
+            <iframe
+              src="https://status.trymaple.ai/badge?theme=system"
+              width="250"
+              height="30"
+              frameBorder="0"
+              scrolling="no"
+              style={{ colorScheme: "normal", marginLeft: "58px" }}
+              title="BetterStack Status"
+            />
+            <p className="text-[hsl(var(--marketing-text-muted))]/50 font-light">
+              © {new Date().getFullYear()} Maple AI. All rights reserved. Powered by{" "}
+              <a
+                href="https://opensecret.cloud"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-[hsl(var(--purple))] hover:text-[hsl(var(--purple))]/80 transition-colors"
+              >
+                OpenSecret
+              </a>
+            </p>
+          </div>
         </div>
       </div>
     </div>
diff --git a/frontend/src/components/SimplifiedFooter.tsx b/frontend/src/components/SimplifiedFooter.tsx
index 6b4e0df79..80210d5b3 100644
--- a/frontend/src/components/SimplifiedFooter.tsx
+++ b/frontend/src/components/SimplifiedFooter.tsx
@@ -1,8 +1,18 @@
 export function SimplifiedFooter() {
   return (
     <div className="w-full border-t border-[hsl(var(--marketing-card-border))] py-6 mt-auto">
-      <div className="max-w-[45rem] mx-auto px-4 text-center">
-        <p className="text-[hsl(var(--marketing-text-muted))]/70 text-sm">
+      <div className="max-w-[45rem] mx-auto px-4 flex flex-col items-center">
+        <iframe
+          src="https://status.trymaple.ai/badge?theme=system"
+          width="250"
+          height="30"
+          frameBorder="0"
+          scrolling="no"
+          style={{ colorScheme: "normal", marginLeft: "58px" }}
+          title="BetterStack Status"
+          className="mb-3"
+        />
+        <p className="text-[hsl(var(--marketing-text-muted))]/70 text-sm text-center">
           © {new Date().getFullYear()} Maple AI. All rights reserved. Powered by{" "}
           <a
             href="https://opensecret.cloud"