feat: finished testing!

apps/www/src/app/(sl-modification-frame)/servers/embedded/sl-modification-frame/file/[filename]/page.tsx

@@ -76,7 +76,7 @@ export namespace Minehut {
 }
 `;
 
-const transpileTypeScript = (code: string) => {
+export const transpileTypeScript = (code: string) => {
   try {
     const result = ts.transpileModule(typeDefs + code, {
       compilerOptions: {
@@ -304,13 +304,18 @@ export default function CustomFilePage({
               <Button
                 disabled={!successfullyLinted}
                 onClick={() => {
-                  const array =
+                  const t = btoa(value);
-                    (user?.unsafeMetadata
+
-                      .customFiles as Array<ClerkCustomModification>) ?? [];
+                  const newTab = window.open(`/servers?tm=${encodeURIComponent(t)}`)
-                  array[file].testId = guidGenerator();
+                  const interval = setInterval(() => {
-                  user?.update({
+                    newTab?.dispatchEvent(new Event("test-mode.enable"))
-                    unsafeMetadata: { customFiles: array },
+                  }, 500)
-                  });
+                  toast.info("Waiting for server tab to pick up thread...")
+
+                  newTab?.addEventListener("test-mode.enabled", () => {
+                    clearInterval(interval);
+                    toast.success("Connected to new tab; continue.")
+                  })
                 }}
               >
                 Test

apps/www/src/components/feat/server-list/server-list.tsx

@@ -38,11 +38,13 @@ import InfiniteScroll from "react-infinite-scroll-component";
 import { useInfiniteScrolling } from "@/lib/hooks/use-infinite-scrolling";
 import { useMHSFServer } from "@/lib/hooks/use-mhsf-multiple";
 import { ModificationButton } from "./modification/modification-button";
+import { useFilters } from "@/lib/hooks/use-filters";
 
 export function ServerList() {
   const { servers, loading, serverCount, playerCount } = useServers();
+  const { filteredData } = useFilters(servers);
   const { itemsLength, fetchMoreData, hasMoreData, data } =
-    useInfiniteScrolling(servers);
+    useInfiniteScrolling(filteredData);
 
   if (loading)
     return (

apps/www/src/lib/hooks/use-filters.tsx

@@ -0,0 +1,121 @@
+/*
+ * MHSF, Minehut Server List
+ * All external content is rather licensed under the ECA Agreement
+ * located here: https://mhsf.app/docs/legal/external-content-agreement
+ *
+ * All code under MHSF is licensed under the MIT License
+ * by open source contributors
+ *
+ * Copyright (c) 2025 dvelo
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to
+ * deal in the Software without restriction, including without limitation the
+ * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+ * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+ * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+ * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+ * OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+import { useEffect, useState } from "react";
+import type { OnlineServer } from "../types/mh-server";
+import { useQueryState } from "nuqs";
+import { toast } from "sonner";
+import { tryCatch } from "../try-catch";
+import { transpileTypeScript } from "@/app/(sl-modification-frame)/servers/embedded/sl-modification-frame/file/[filename]/page";
+
+export function useFilters(data: OnlineServer[]) {
+  const [filteredData, setFilteredData] = useState<OnlineServer[]>(data);
+  const [t] = useQueryState("tm");
+  const [testModeEnabled, setTestModeEnabled] = useState(false);
+
+  useEffect(() => {
+    if (filteredData.length === 0) setFilteredData(data);
+  }, [data, filteredData.length]);
+
+  useEffect(() => {
+    if (data.length !== 0)
+      window.addEventListener("test-mode.enable", (c) => {
+        window.dispatchEvent(new Event("test-mode.enabled"));
+        if (!t) {
+          toast.error("Couldn't enable test mode; no query variable.");
+        } else {
+          setTestModeEnabled(true);
+          const code = atob(t);
+          (async () => {
+            toast.info("Transpiling TypeScript...");
+            const startTime = Date.now();
+            const { error, data: transpiledCode } = await tryCatch(
+              (async () => transpileTypeScript(code))()
+            );
+            if (error) {
+              toast.error(
+                "Failed to transpile TypeScript! Error: " + error.message
+              );
+              return;
+            }
+            if (transpiledCode === null) {
+              toast.error("Cannot continue.");
+              return;
+            }
+            console.log(
+              "[MHSF Filters] Transpiled TypeScript:",
+              transpiledCode ?? ""
+            );
+            toast.info("Generating function...");
+            const functionBody = transpiledCode.match(
+              /function\s+filter\s*\([^)]*\)\s*\{([\s\S]*)\}/
+            )?.[1];
+            const { error: filterErr, data: filterFunc } = await tryCatch(
+              (async () => new Function("server", functionBody as string))()
+            );
+            if (filterErr) {
+              toast.error(
+                `Failed to generate function! Error: ${filterErr.message}`
+              );
+              return;
+            }
+            if (typeof filterFunc === "function") {
+              toast.success("Compiled in " + (Date.now() - startTime) + "ms");
+              toast.promise(
+                async () => {
+                  let newServers = [];
+                  newServers = data.filter((c) => filterFunc(c));
+                  toast.info(
+                    "Server count " + data.length + " -> " + newServers.length
+                  );
+                  setFilteredData(() => [...newServers]);
+                },
+                {
+                  loading: "Manipulating data...",
+                  success: "Manipulated data; test mode finished!",
+                  error: (e) =>
+                    `Error while manipulating data; go back to your editor and run again. ${es}`,
+                }
+              );
+            } else {
+              toast.error(
+                "Code doesn't have a 'filter' function. Cannot be tested."
+              );
+              toast.error(typeof filterFunc);
+            }
+          })();
+        }
+      });
+  }, [t, data]);
+
+  console.log(filteredData);
+
+  return { filteredData, testModeEnabled };
+}