Fix: Cleanup and SSR auth header fix

src/components/NavUser.tsx

@@ -46,13 +46,13 @@ async function getUser() {
 }
 
 function NavUser() {
-  const [user] = createResource(() =>
-    getUser().then((e) => {
-      if (!e.success) console.log(1, e.message);
-      console.log(2, e);
-      return e;
-    }),
-  );
+  const [user] = createResource(async () => {
+    const user = await getUser();
+
+    if (!user.success) console.error("userInfo", user.message);
+
+    return user;
+  });
 
   return (
     <Show

src/routes/api/config/[guildId].tsx

@@ -29,8 +29,6 @@ export const GET = async (
   { success: false; message: string } | (data & { success: true })
 > => {
   const id = event.params.guildId;
-  //   const id = "598539452343648256";
-  // const location = useLocation();
   if (!event) return { success: false, message: "No request event!" };
 
   const session = await getSession(event.request, authOptions);
@@ -62,9 +60,8 @@ export const GET = async (
     },
     headers: { Authorization: `Bot ${import.meta.env.VITE_DISCORD_BOT_TOKEN}` },
   });
-
   if (guildsRequest.error || channelsRequest.error) {
-    console.log(guildsRequest.error, channelsRequest.error, location.pathname);
+    console.log(guildsRequest.error, channelsRequest.error, event.path);
     return {
       success: false,
       message: "Error on one of the discord api requests!",
@@ -94,8 +91,6 @@ export const GET = async (
     });
   });
 
-  console.log("done");
-
   return {
     success: true,
     guild: {

src/routes/api/config/index.tsx

@@ -45,8 +45,6 @@ export const GET = async (
     headers: { Authorization: `Bearer ${DISCORD_ACCESS_TOKEN}` },
   });
 
-  console.log("guilds", guilds);
-
   if (error) {
     console.log(error);
     return { success: false, message: "Error on discord api request!" };

src/routes/config/[guildId].tsx

@@ -8,6 +8,7 @@ import {
   createSignal,
 } from "solid-js";
 import { createStore } from "solid-js/store";
+import { getRequestEvent } from "solid-js/web";
 import { FontAwesomeIcon } from "~/components/FontAwesomeIcon";
 import Layout from "~/components/Layout";
 import "../../styles/pages/config.scss";
@@ -30,6 +31,8 @@ function config() {
   const params = useParams();
   const navigator = useNavigate();
   const location = useLocation();
+  const event = getRequestEvent();
+
   const [timezoneRef, setTimezoneRef] = createSignal<HTMLInputElement>();
   const [timePlanningRef, setTimePlanningRef] =
     createSignal<HTMLInputElement>();
@@ -41,7 +44,9 @@ function config() {
   const [payload] = createResource(
     params.guildId,
     async (id) => {
-      const payload = await fetch(`http://localhost:3000/api/config/${id}`)
+      const payload = await fetch(`http://localhost:3000/api/config/${id}`, {
+        headers: event?.headers,
+      })
         .then(
           (res) =>
             res.json() as Promise<
@@ -56,17 +61,24 @@ function config() {
         )
         .catch((e) => console.warn(e, id));
 
-      if (!payload) return initialValue(params);
+      if (!payload) {
+        console.error(location.pathname, payload);
+        return initialValue(params);
+      }
 
       if (!payload.success) {
         console.log(payload);
         console.log(location.pathname, payload.message, "No success");
-        // navigator("/config", { replace: false });
+        navigator("/config", { replace: false });
         return initialValue(params);
       }
+
       return payload;
     },
-    { initialValue: initialValue(params) },
+    {
+      initialValue: initialValue(params),
+      deferStream: true,
+    },
   );
   const [config, setConfig] = createStore({
     features: {
@@ -78,53 +90,13 @@ function config() {
     },
   });
 
-  createEffect(() => console.log(payload.loading, payload()));
-  createEffect(() => console.log("timezone", timezone()));
-  createEffect(() =>
-    console.log("timePlanning.enabled", config.features.timePlanning.enabled),
-  );
-  createEffect(() =>
-    console.log(
-      "timePlanning.channelId",
-      config.features.timePlanning.channelId,
-    ),
-  );
-  createEffect(() =>
-    console.log(
-      "timePlanning.pingableRoles",
-      config.features.timePlanning.pingableRoles,
-    ),
-  );
-
-  createEffect(() => {
-    const ref = timezoneRef();
-    if (!ref) return;
-    ref.value = timezone();
-  });
-  createEffect(() => {
-    const ref = timePlanningRef();
-    if (!ref) return;
-    ref.checked = config.features.timePlanning.enabled;
-  });
   createEffect(() => {
     const channelId = payload().guild.channel;
     setConfig("features", "timePlanning", "channelId", channelId);
-    console.log(channelId, payload());
     const ref = channelRef();
     if (!ref) return;
-    if (
-      !ref ||
-      !channelId ||
-      !payload().guild.channels.find((e) => e.id === channelId)
-    )
-      return;
     ref.value = channelId;
   });
-  createEffect(() => {
-    const ref = pingableRolesRef();
-    if (!ref) return;
-    ref.checked = config.features.timePlanning.pingableRoles;
-  });
   createEffect(() => {
     const ref = timezoneRef();
     if (!ref) return;
@@ -141,8 +113,6 @@ function config() {
     ref.checked = config.features.timePlanning.pingableRoles;
   });
 
-  // console.log(payload());
-
   return (
     <Layout site="config">
       <h3 class="text-center">Configure li&apos;l Judd in</h3>
@@ -232,10 +202,7 @@ function config() {
                   )
                 }
               >
-                <option
-                  disabled={!!config.features.timePlanning.channelId}
-                  value=""
-                >
+                <option disabled value="">
                   --Select a Channel--
                 </option>
                 <For each={payload().guild.channels}>

src/routes/config/index.tsx

@@ -3,8 +3,9 @@ import {
   faCircleExclamation,
   faPlus,
 } from "@fortawesome/pro-regular-svg-icons";
-import { useLocation, useNavigate } from "@solidjs/router";
-import { For, Suspense, createEffect, createResource } from "solid-js";
+import { useNavigate } from "@solidjs/router";
+import { For, createResource } from "solid-js";
+import { getRequestEvent } from "solid-js/web";
 import { FontAwesomeIcon } from "~/components/FontAwesomeIcon";
 import Layout from "~/components/Layout";
 import "../../styles/pages/config.scss";
@@ -20,10 +21,14 @@ const initialValue = () => ({
 
 function index() {
   const navigator = useNavigate();
-  const location = useLocation();
+  const event = getRequestEvent();
 
-  const [payload] = createResource(async () => {
-    const payload = await fetch("http://localhost:3000/api/config")
+  const [payload] = createResource(
+    // eslint-disable-next-line solid/reactivity
+    async () => {
+      const payload = await fetch("http://localhost:3000/api/config", {
+        headers: event?.headers,
+      })
         .then(
           (res) =>
             res.json() as Promise<
@@ -38,20 +43,21 @@ function index() {
         )
         .catch((e) => console.warn(e));
 
-    if (!payload) return;
+      if (!payload) {
+        console.error("/config", payload);
+        return initialValue();
+      }
 
       if (!payload.success) {
-      console.log(location.pathname, payload.message, "No success");
+        console.log("/config", payload.message, "No success");
         navigator("/", { replace: false });
         return initialValue();
       }
-    console.log(location.pathname, "success");
+
       return payload;
-  });
-  createEffect(() => console.log(payload()?.guilds, payload()?.guilds.length));
-  // createRenderEffect(() =>
-  //   console.log(payload()?.guilds, payload()?.guilds.length),
-  // );
+    },
+    { deferStream: true },
+  );
 
   const icons = [faPlus, faCircleExclamation, faBadgeCheck];
   const colors = [undefined, "orange", "green"];
@@ -60,7 +66,6 @@ function index() {
     <Layout site="config">
       <h3 class="text-center">Configure li&apos;l Judd in</h3>
       <div>
-        <Suspense>
         <For each={payload()?.guilds}>
           {(guild, i) => {
             return (
@@ -92,7 +97,6 @@ function index() {
             );
           }}
         </For>
-        </Suspense>
       </div>
     </Layout>
   );