From b3d36382df264a54b4e256f1acf582683d1834ed Mon Sep 17 00:00:00 2001
From: KaroGil <karolinkagil@gmail.com>
Date: Wed, 4 Feb 2026 17:47:13 +0100
Subject: [PATCH] remove hs msg after a week

---
 src/App.tsx                     | 18 +++++++++++-------
 src/components/screen-cycle.tsx |  2 ++
 src/lib/sanity/message.ts       |  3 ++-
 src/main.tsx                    |  7 ++++++-
 src/utils/date.ts               |  6 ++++++
 5 files changed, 27 insertions(+), 9 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 2c90edf..46ee1b1 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,16 +1,16 @@
-import { useEffect, useState } from "react";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { useEffect } from "react";
 import { ScreenCycle } from "./components/screen-cycle";
 import { CalendarScreen } from "./pages/calendar-screen";
 import { MessageScreen } from "./pages/message-screen";
 import { TransportScreen } from "./pages/transport-screen";
 import DateTime from "./components/date-time";
-import { isAugust, isValentinesSeason } from "./utils/date";
+import { isAugust, isMsgExpired, isValentinesSeason } from "./utils/date";
 import WelcomeScreen from "./pages/welcome-screen";
 import { AutoReload } from "./components/auto-reload";
+import { useMessage } from "./hooks/use-message";
 
 export default function App() {
-  const [queryClient] = useState(() => new QueryClient());
+  const { data: message } = useMessage();
 
   useEffect(() => {
     const interval = setInterval(
@@ -22,16 +22,20 @@ export default function App() {
     return () => clearInterval(interval);
   }, []);
 
-  const visibleScreens = [CalendarScreen, TransportScreen, MessageScreen];
+  const visibleScreens = [CalendarScreen, TransportScreen];
   if (isAugust()) {
     visibleScreens.push(WelcomeScreen);
   }
 
+  if (message?.title && message?.body && isMsgExpired(message._createdAt)) {
+    visibleScreens.push(MessageScreen);
+  }
+
   const isValentines = isValentinesSeason();
   document.body.classList.toggle("valentines", isValentines);
 
   return (
-    <QueryClientProvider client={queryClient}>
+    <>
       <AutoReload />
       <main
         className={`px-6 pt-6 pb-0 space-y-5 h-screen flex flex-col ${
@@ -41,6 +45,6 @@ export default function App() {
         <DateTime />
         <ScreenCycle screens={visibleScreens} />
       </main>
-    </QueryClientProvider>
+    </>
   );
 }
diff --git a/src/components/screen-cycle.tsx b/src/components/screen-cycle.tsx
index 0fb742f..cf748bf 100644
--- a/src/components/screen-cycle.tsx
+++ b/src/components/screen-cycle.tsx
@@ -45,6 +45,8 @@ export const ScreenCycle = ({ screens }: ScreenCycleProps) => {
 
   const CurrentScreen = screens[screenIndex];
 
+  console.log("CS", screens[screenIndex]);
+
   return (
     <div className="flex-1">
       {/* `key` is hack to force unmount the progressbar on change */}
diff --git a/src/lib/sanity/message.ts b/src/lib/sanity/message.ts
index edf1573..422c02a 100644
--- a/src/lib/sanity/message.ts
+++ b/src/lib/sanity/message.ts
@@ -4,7 +4,8 @@ const messageQuery = `
 *[_type == "post" && "board" in authors[]->groupType]
 | order(_createdAt desc)[0]{
   title,
-  "body": coalesce(pt::text(body), body)
+  "body": coalesce(pt::text(body), body),
+  _createdAt
 }
 `;
 
diff --git a/src/main.tsx b/src/main.tsx
index 0ebf5a7..8cdc31f 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -2,9 +2,14 @@ import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 import App from "./App.tsx";
 import "./index.css";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+
+const queryClient = new QueryClient();
 
 createRoot(document.getElementById("root")!).render(
   <StrictMode>
-    <App />
+    <QueryClientProvider client={queryClient}>
+      <App />
+    </QueryClientProvider>
   </StrictMode>
 );
diff --git a/src/utils/date.ts b/src/utils/date.ts
index 163afdc..199cc81 100644
--- a/src/utils/date.ts
+++ b/src/utils/date.ts
@@ -104,3 +104,9 @@ export function isValentinesSeason(date: Date = new Date()): boolean {
 
   return false;
 }
+
+export function isMsgExpired(createdAt: string): boolean {
+  const createdDate = new Date(createdAt);
+  const expiryDate = new Date(createdDate.getTime() + 24 * 60 * 60 * 1000);
+  return isBefore(new Date(), expiryDate);
+}