it works rn ig?

components/app/windows/news.vue

@@ -34,6 +34,7 @@ const switchTabs = ref(false);
 const tabs = ref([]);
 const primary = ref<string>("top"); // Hard code value fn
 const canNotLoadTabUI = ref(false);
+const isDataCached = ref(false);
 const pullTabsData = async () => {
   try {
     const req = await fetch("/api/tabs");
@@ -60,6 +61,7 @@ const updateContent = async (url: string, tabAction: boolean) => {
     if (data) {
       contentArray.value = [...data.uuidData, ...(data.nuuiddata?.items || [])];
       switchTabs.value = false;
+      isDataCached.value = data.cached || false;
     }
   } catch (e) {
     console.log(e);

components/app/windows/settings.vue

@@ -1,28 +1,81 @@
 <script setup lang="ts">
-const user = ref();
-const userToken = localStorage.getItem("token");
+import { BadgeCheckIcon, OctagonAlertIcon } from "lucide-vue-next";
+import { Input } from "~/components/ui/input";
 const { t, locale } = useI18n();
+const user = ref();
 onMounted(async () => {
-  const req = await fetch("/api/user/validateUserToken", {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-    },
-    body: JSON.stringify({
-      token: userToken,
-      lang: locale,
-      page: "settings",
-    }),
-  });
-  const res = req.json();
+  const req = await fetch("/api/user/validateUserToken");
+  const res = await req.json();
   user.value = res;
 });
 
 const logoutAction = () => {};
+const groqApiKeyRegex = /^gsk_[a-zA-Z0-9]{52}$/;
+const customApiKey = ref();
+const isCorrect = ref(false);
+const submitCustomApiKey = async () => {
+  if (!isCorrect.value) {
+    checkValidApiKey();
+    if (!isCorrect.value) {
+      return;
+    }
+  }
+  const apiKey = customApiKey.value;
+  try {
+    const sendApi = await fetch("/api/ai/loadCustomGroqApi", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({
+        apiKey: apiKey,
+      }),
+    });
+    const data = await sendApi.json();
+    if (data.error) {
+    }
+  } catch (e) {}
+};
+
+const checkValidApiKey = () => {
+  const apiKey = customApiKey.value;
+  if (!apiKey) {
+    isCorrect.value = false;
+    return;
+  }
+  isCorrect.value = groqApiKeyRegex.test(apiKey);
+};
 </script>
 <template>
   <div class="justify-center align-center text-center">
     <div class="">Greetings, {{ user }}</div>
+    <div class="flex flex-row text-center align-center justify-center">
+      <span class="text-md p-1 text-nowrap">Your Groq API:&nbsp;</span>
+      <Input
+        type="text"
+        class="h-6 m-1 py-3 rounded"
+        v-model="customApiKey"
+        placeholder="gsk_..."
+        v-on:mouseover="checkValidApiKey"
+        v-on:keypress="checkValidApiKey"
+        v-on:mouseleave="checkValidApiKey"
+      />
+      <!--If it is a valid api key or not.-->
+      <BadgeCheckIcon
+        v-if="isCorrect"
+        class="w-8 h-8 p-1/2 mr-1 text-green-700"
+      />
+      <OctagonAlertIcon
+        v-if="!isCorrect"
+        class="w-8 h-8 p-1/2 mr-1 text-red-700"
+      />
+      <button
+        class="p-1 text-sm bg-gray-400/60 rounded"
+        @click="submitCustomApiKey"
+      >
+        Submit
+      </button>
+    </div>
     <div class="bg-gray-200/70 p-2 m-2 w-full">
       <button @click="logoutAction">Logout</button>
     </div>

components/app/windows/user.vue

@@ -29,7 +29,6 @@ const submitUserPassword = async () => {
 
   if (!res.error) {
     error.value = false;
-    localStorage.setItem("token", res.token);
     success.value = true;
     console.log(res);
     userAccount.value = "";

components/blurPageBeforeLogin.vue

@@ -9,20 +9,8 @@ const emit = defineEmits(["windowopener", "error", "loadValue"]);
 
 try {
   // 喔 我沒有加 await :( 難怪有問題
-  const token = localStorage.getItem("token");
   const { data, error: sendError } = await useFetch(
     "/api/user/validateUserToken",
-    {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify({
-        token: token,
-        lang: locale,
-        page: "a_window_application_using_blurPageBeforeLogin_component",
-      }),
-    },
   );
   if (sendError.value) {
     error.value = true;

pages/desktop.vue

@@ -269,7 +269,6 @@ const navBarDisplayText = (text: string) => {
   }
   const trimSpaces = text.trim();
   const regex = /.{0,7}/;
-  console.log("asdasda");
   if (trimSpaces.length <= 7) {
     return text;
   }

server/api/ai/loadCustomGroqApi.ts

@@ -0,0 +1,21 @@
+import sql from "~/server/components/postgres";
+export default defineEventHandler(async (event) => {
+  if (event.method !== "POST") {
+    return {
+      error: "ERR_METHOD_NOT_ALLOWED",
+    };
+  }
+  const body = readBody(event);
+  if (!body.apiKey) {
+    return {
+      error: "ERR_API_KEY_REQUIRED",
+    };
+  }
+  const readUserToken = getCookie(event, "token");
+  if (!readUserToken) {
+    return {
+      error: "ERR_NOT_USER_LOGIN",
+    };
+  }
+  const checkUser = await sql``;
+});

server/api/publishers/lt/[slug].ts

@@ -28,16 +28,30 @@ export default defineEventHandler(async (event) => {
       html("div.editor div figure img").attr("srcset") ||
       html("div.editor div figure img").attr("src") ||
       "";
+    const bgImage = html("figure.keyVisual img").attr("srcset") || "";
     const articles = [];
-    const otherArticles = html("section.moduleContainer div");
-    for (const item in otherArticles) {
-
-    }
+    const regexArticleLinks = /[a-zA-Z0-9]{7}/g
+    const otherArticles = <any[]>[];
+    html("a.ltcp-link")
+      .each((i, element) => {
+        const articleLink = html(element).attr("href");
+        const articleTitle = html(element).find("h3.header").text();
+        const date = html(element).find("div._articleCard div.css-wqleh6 span").text();
+        if (articleLink && articleTitle) {
+            const articleSlug = articleLink.matchAll(regexArticleLinks);
+          otherArticles.push({
+            index: i,
+            title: articleTitle,
+            link: articleSlug,
+            date: date,
+          });
+        }
+      });
     return {
       name: newsOrgName,
       description: description,
       logo: logo,
-      articles: []
+      articles: otherArticles,
     };
   } catch (e) {
     console.log(e);

server/api/user/login.ts

@@ -68,9 +68,9 @@ export default defineEventHandler(async (event) => {
         INSERT INTO usertokens (user, token)
         VALUES ('${fetchUserInfo[0].username}', '${newToken}')
       `;
+    setCookie(event, "token", newToken);
     return {
       user: fetchUserInfoAgain,
-      token: newToken,
     };
   } catch (e) {
     console.log(e);

server/api/user/logout.ts

@@ -4,12 +4,7 @@ export default defineEventHandler(async (event) => {
   const nowDate = new Date().toLocaleString();
   try {
     if (loginCookie) {
-      deleteCookie(event, "session");
-      setCookie(event, "lastCheckCookie", nowDate, {
-        httpOnly: true,
-        secure: process.env.NODE_ENV === "production",
-        path: "/",
-      });
+      deleteCookie(event, "token");
       return {
         success: true,
         error: null,

server/api/user/validateUserToken.post.ts

@@ -2,11 +2,11 @@ import sql from "~/server/components/postgres";
 
 export default defineEventHandler(async (event) => {
   const body = await readBody(event);
-  const token = body.token;
+  const token = getCookie(event, "token");
   if (!token) {
     return {
-      error: "NO_TOKEN_GIVEN",
-      requested_action: "SHOW_WARNING",
+      error: "INVALID_TOKEN",
+      requested_action: "LOGOUT_USER",
     };
   }
   const checkIsUUIDRegex =