feat: converting to hashrouting

apps/forum/src/components/App.tsx

@@ -1,6 +1,7 @@
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import {
+  HashRouter,
   BrowserRouter,
   Routes,
   Route,
@@ -24,9 +25,9 @@ import FilterAltIcon from "@mui/icons-material/FilterAlt";
 const App = () => {
   return (
     <div className="flex flex-col h-screen">
-      <BrowserRouter>
+      <HashRouter>
         <InnerApp />
-      </BrowserRouter>
+      </HashRouter>
     </div>
   );
 };
@@ -147,13 +148,13 @@ const InnerApp = () => {
             <Routes>
               <Route
                 element={<Board triggerRefresh={refresh} setBoard={setBoard} />}
-                path="forum"
+                path="/"
               />
               <Route
                 element={<Board triggerRefresh={refresh} setBoard={setBoard} />}
-                path="forum/:boardSlug"
+                path="/:boardSlug"
               />
-              <Route element={<Thread />} path="forum/:boardSlug/:threadUuid" />
+              <Route element={<Thread />} path="/:boardSlug/:threadUuid" />
               <Route element={<NotFound />} path="*" />
             </Routes>
           </div>

apps/forum/src/components/CreateThread.tsx

@@ -292,7 +292,7 @@ const CreateThread = ({ onNewThread }: CreateThreadProps) => {
 
           <textarea
             placeholder={`Anything interesting?`}
-            className="h-50 pl-2 pt-2 pb-20 w-full hover:outline-0 focus:outline-0 standard-style text-3xl "
+            className="pl-2 pt-2 pb-10 w-full hover:outline-0 focus:outline-0 standard-style text-3xl "
             value={textContent}
             onChange={handleBodyChange}
             onFocus={handleOpenForm}

apps/forum/src/utils/getDate.ts

@@ -13,3 +13,18 @@ export const getCurrentDateInJST = () => {
 
   return `${YYYY}${MM}${DD}${HH}${mm}${SS}`;
 };
+
+export const extractDate = (fullDate: string) => {
+  return fullDate.substring(0, 8) + "000000"; // Extracts the first 8 characters (YYYYMMDD)
+};
+
+export const getCurrentDateInUTC = () => {
+  const date = new Date();
+  const YYYY = date.getUTCFullYear();
+  const MM = String(date.getUTCMonth() + 1).padStart(2, "0");
+  const DD = String(date.getUTCDate()).padStart(2, "0");
+  const HH = String(date.getUTCHours()).padStart(2, "0");
+  const mm = String(date.getUTCMinutes()).padStart(2, "0");
+  const SS = String(date.getUTCSeconds()).padStart(2, "0");
+  return `${YYYY}${MM}${DD}${HH}${mm}${SS}`;
+};

apps/forum/src/utils/storeDate.ts

@@ -1,14 +1,14 @@
-import { getCurrentDateInJST } from "./getDate";
+import { getCurrentDateInUTC } from "./getDate";
 
 export const storeDate = () => {
-  const storedDateInJST = localStorage.getItem("lastCheckedDateJST");
-  const currentDateInJST = getCurrentDateInJST();
+  const storedDateInUTC = localStorage.getItem("lastCheckedDateUTC");
+  const currentDateInUTC = getCurrentDateInUTC();
 
-  if (!storedDateInJST) {
+  if (!storedDateInUTC) {
     // If there's no stored date, set the current date to local storage.
-    localStorage.setItem("lastCheckedDateJST", currentDateInJST);
-  } else if (storedDateInJST !== currentDateInJST) {
+    localStorage.setItem("lastCheckedDateUTC", currentDateInUTC);
+  } else if (storedDateInUTC !== currentDateInUTC) {
     // If the stored date and the current date are different, update the stored date.
-    localStorage.setItem("lastCheckedDateJST", currentDateInJST);
+    localStorage.setItem("lastCheckedDateUTC", currentDateInUTC);
   }
 };

apps/root/src/components/frame/Nav.tsx

@@ -26,11 +26,7 @@ import {
   TimetableIconHovered,
 } from "@app/components/icons/TimetableIcon"
 import { ThemeContext, ThemeProvider } from "@app/utils/theme-context"
-import {
-  getCurrentDateInJST,
-  getCurrentDateInUTC,
-  extractDate,
-} from "@app/utils/getDate"
+import { getCurrentDateInUTC, extractDate } from "@app/utils/getDate"
 import { shouldCallApi } from "@app/utils/shouldCallApi"
 import { fetchNotificaiton } from "@app/utils/fetchNotification"
 
@@ -71,15 +67,17 @@ const Nav = () => {
 
     const fetchNotificationAndUpdateState = async () => {
       try {
-        const storedDateInJST = localStorage.getItem("lastCheckedDateJST")
-        const currentDateInJST = getCurrentDateInJST()
-        const storedDateOnly = extractDate(storedDateInJST || "")
-        const currentDateOnly = extractDate(currentDateInJST)
+        const storedDateInUTC = localStorage.getItem("lastCheckedDateUTC")
+        const currentDateInUTC = getCurrentDateInUTC()
+        const storedDateOnly = extractDate(storedDateInUTC || "")
+        const currentDateOnly = extractDate(currentDateInUTC)
 
         if (!storedDateOnly) {
-          localStorage.setItem("lastCheckedDateJST", currentDateInJST)
+          localStorage.setItem("lastCheckedDateUTC", currentDateInUTC)
         } else if (shouldCallApi()) {
-          const newPostsCount = await fetchNotificaiton(storedDateInJST || "")
+          const newPostsCount = await fetchNotificaiton(currentDateOnly || "")
+          // const newPostsCount = ""
+
           const updatedNavItems = navItems.map((item) =>
             item.path === "/forum"
               ? {
@@ -92,7 +90,7 @@ const Nav = () => {
               : item
           )
           setNavItems(updatedNavItems)
-          localStorage.setItem("lastCheckedDateJST", currentDateInJST)
+          localStorage.setItem("lastCheckedDateUTC", currentDateInUTC)
           localStorage.setItem(
             "lastApiCallTimestamp",
             new Date().getTime().toString()

apps/root/src/index.html

@@ -135,12 +135,12 @@
           <route path="forum">
             <application name="@wasedatime/forum"></application>
           </route>
-          <route path="forum/:boardSlug">
+          <!-- <route path="forum/:boardSlug">
             <application name="@wasedatime/forum"></application>
           </route>
           <route path="forum/:boardSlug/:threadUuid">
             <application name="@wasedatime/forum"></application>
-          </route>
+          </route> -->
           <!-- <route path="career">
             <application name="@wasedatime/career"></application>
           </route> -->

apps/root/src/utils/getDate.ts

@@ -1,21 +1,21 @@
-export const getCurrentDateInJST = () => {
-  const date = new Date()
-  const jstOffset = 9 * 60 // JST is UTC+9
-  const localOffset = date.getTimezoneOffset()
-  date.setMinutes(date.getMinutes() + localOffset + jstOffset)
+// export const getCurrentDateInJST = () => {
+//   const date = new Date()
+//   const jstOffset = 9 * 60 // JST is UTC+9
+//   const localOffset = date.getTimezoneOffset()
+//   date.setMinutes(date.getMinutes() + localOffset + jstOffset)
 
-  const YYYY = date.getFullYear()
-  const MM = String(date.getMonth() + 1).padStart(2, "0") // Months are 0-based
-  const DD = String(date.getDate()).padStart(2, "0")
-  const HH = String(date.getHours()).padStart(2, "0")
-  const mm = String(date.getMinutes()).padStart(2, "0")
-  const SS = String(date.getSeconds()).padStart(2, "0")
+//   const YYYY = date.getFullYear()
+//   const MM = String(date.getMonth() + 1).padStart(2, "0") // Months are 0-based
+//   const DD = String(date.getDate()).padStart(2, "0")
+//   const HH = String(date.getHours()).padStart(2, "0")
+//   const mm = String(date.getMinutes()).padStart(2, "0")
+//   const SS = String(date.getSeconds()).padStart(2, "0")
 
-  return `${YYYY}${MM}${DD}${HH}${mm}${SS}`
-}
+//   return `${YYYY}${MM}${DD}${HH}${mm}${SS}`
+// }
 
 export const extractDate = (fullDate: string) => {
-  return fullDate.substring(0, 8) // Extracts the first 8 characters (YYYYMMDD)
+  return fullDate.substring(0, 8) + "000000" // Extracts the first 8 characters (YYYYMMDD)
 }
 
 export const getCurrentDateInUTC = () => {

apps/root/src/utils/shouldCallApi.ts

@@ -1,4 +1,5 @@
 const LAST_API_CALL_TIMESTAMP = "lastApiCallTimestamp"
+// const ONE_HOUR_IN_MS = 1
 const ONE_HOUR_IN_MS = 60 * 60 * 1000
 
 const convertToTimestamp = (datetime: string) => {