feat: reck ssr

sosohime · Jan 27, 2025 · c739a66 · c739a66
1 parent f6c5cbf
commit c739a66
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 5 deletions.
diff --git a/apps/frontend-astro/src/components/tuixiu/reckful.tsx b/apps/frontend-astro/src/components/tuixiu/reckful.tsx
@@ -1,27 +1,34 @@
 import React from 'react';
 import { useTuixiuCountDown, getCountDown } from '../../hooks/countDown';
 import { tuixiu } from '@mono/const';
+import type { CountDown } from '../../hooks/countDown';
 import CopyToClipboardButton from '../copyToClipboard';
 import { ArrowUpRight, ArrowRightLeft } from 'lucide-react';
 import { buttonVariants } from '@mono/ui/button';
 
 const { reckfulTuiXiuDay, reckfulChangQiFuWu } = tuixiu;
 
-export default function Tuixiu() {
+export default function Tuixiu({
+  initCountDown,
+}: {
+  initCountDown: CountDown;
+}) {
   const countDown = useTuixiuCountDown(reckfulTuiXiuDay);
   const changQiFuWuCountDown = useTuixiuCountDown(reckfulChangQiFuWu);
 
   const getTuiClipboardText = React.useCallback(() => {
-    const tui = getCountDown(reckfulTuiXiuDay);
+    const tui = getCountDown(reckfulTuiXiuDay || initCountDown);
     return `你李进爷爷还有 ${tui['yyyyMMDD hhmmss']} 就退休了！`;
   }, []);
 
   return (
     <div className="text-center h-full w-full flex flex-col justify-center items-center">
       <h1 className="text-2xl pb-4">距离Reckful退休还有</h1>
       <p className="text-4xl pb-4">
-        {countDown?.['yyyyMMDD hhmmss']}
-        <span className="text-xl pl-1">{countDown?.milliseconds}</span>
+        {(countDown || initCountDown)['yyyyMMDD hhmmss']}
+        <span className="text-xl pl-1">
+          {(countDown || initCountDown).milliseconds}
+        </span>
       </p>
 
       <p className="pb-4">

diff --git a/apps/frontend-astro/src/pages/reckful.astro b/apps/frontend-astro/src/pages/reckful.astro
@@ -5,8 +5,13 @@ import Tuixiu from '../components/tuixiu/reckful'
 
 // Welcome to Astro! Wondering what to do next? Check out the Astro documentation at https://docs.astro.build
 // Don't want to use any of this? Delete everything in this file, the `assets`, `components`, and `layouts` directories, and start fresh.
+import { tuixiu } from '@mono/const';
+import { getCountDown } from '../hooks/countDown'
+const { reckfulTuiXiuDay } = tuixiu
+
+const initCountDown = getCountDown(reckfulTuiXiuDay)
 ---
 
 <Layout  title="Reckful退休倒计时">
-	<Tuixiu client:load />
+	<Tuixiu client:load initCountDown={initCountDown} />
 </Layout>