Remove crypto and replace with npm uuid package

bun.lock

@@ -27,6 +27,7 @@
         "tailwind-merge": "^3.6.0",
         "turndown": "^7.2.4",
         "unpdf": "^1.8.0",
+        "uuid": "^14.0.2",
         "xlsx": "^0.18.5",
       },
       "devDependencies": {
@@ -1096,6 +1097,8 @@
 
     "util-deprecate": ["[email protected]", "", {}, "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="],
 
+    "uuid": ["[email protected]", "", { "bin": { "uuid": "dist-node/bin/uuid" } }, "sha512-xZe/16rV4aa+HGSOCiY2YeLT1OybRLrrkL/Rqaq7p7GMVXjFh+6wN4oMYgjFmnSnhY8t6Xpdl2l9qmnHYuMHwQ=="],
+
     "validate-npm-package-license": ["[email protected]", "", { "dependencies": { "spdx-correct": "^3.0.0", "spdx-expression-parse": "^3.0.0" } }, "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew=="],
 
     "vfile": ["[email protected]", "", { "dependencies": { "@types/unist": "^3.0.0", "vfile-message": "^4.0.0" } }, "sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q=="],

package.json

@@ -51,6 +51,7 @@
         "tailwind-merge": "^3.6.0",
         "turndown": "^7.2.4",
         "unpdf": "^1.8.0",
+        "uuid": "^14.0.2",
         "xlsx": "^0.18.5"
     },
     "repository": {

src/components/twui/Readme.md

@@ -19,7 +19,7 @@ This package contains a `base.css` file which has all the base css rules require
 ### Install packages
 
 ```sh
-bun add lucide-react tailwind-merge html-to-react gray-matter mdx typescript lodash react-code-blocks react-responsive-modal next-mdx-remote remark-gfm rehype-prism-plus openai ace-builds
+bun add lucide-react tailwind-merge html-to-react gray-matter mdx typescript lodash react-code-blocks react-responsive-modal next-mdx-remote remark-gfm rehype-prism-plus openai ace-builds uuid
 ```
 
 ```sh

src/components/twui/editors/TinyMCE/index.tsx

@@ -4,6 +4,7 @@ import { twMerge } from "tailwind-merge";
 import twuiSlugToNormalText from "../../utils/slug-to-normal-text";
 import Border from "../../elements/Border";
 import useTinyMCE from "./useTinyMCE";
+import { v4 as uuidv4 } from "uuid";
 
 export type TinyMCEEditorProps<KeyType extends string> = {
     options?: RawEditorOptions;
@@ -80,7 +81,7 @@ export default function TinyMCEEditor<KeyType extends string>({
 
     let valueTimeout: any;
 
-    const id = crypto.randomUUID();
+    const id = uuidv4();
 
     const updateContent = useCallback((editor: Editor) => {
         if (changeHandler) {

src/pages/admin/hosts/[host_id]/clients/(partials)/client-rules/client-rule-draft.ts

@@ -1,5 +1,6 @@
 import type { BUN_SQLITE_WGUI_CLIENT_RULES } from "@/db/types/db";
 import type { ClientRuleProtocol, ClientRuleType } from "@/src/types";
+import { v4 as uuidv4 } from "uuid";
 
 export type ClientRuleDraft = {
     local_id: string;
@@ -14,7 +15,7 @@ type CreateParams = Partial<ClientRuleDraft>;
 
 export function createClientRuleDraft(params?: CreateParams): ClientRuleDraft {
     return {
-        local_id: crypto.randomUUID(),
+        local_id: uuidv4(),
         rule_type: "destination",
         destination: "",
         ports: "",
@@ -29,7 +30,7 @@ export function clientRuleToDraft({
     rule: BUN_SQLITE_WGUI_CLIENT_RULES;
 }): ClientRuleDraft {
     return {
-        local_id: String(rule.id || crypto.randomUUID()),
+        local_id: String(rule.id || uuidv4()),
         id: rule.id,
         rule_type: rule.rule_type == "all" ? "all" : "destination",
         destination: rule.destination || "",

src/server.ts

@@ -17,7 +17,6 @@ const server = Bun.serve({
     async fetch(req, server) {
         try {
             const url = new URL(req.url);
-            console.log(`[HTTP] ${req.method} ${url.pathname}`);
 
             if (url.pathname.startsWith("/media")) {
                 return await handleMediaServer({ req });