Skip to content

feat: remove uuid dep #654

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Bashamega merged 2 commits into from
Jun 25, 2026
Merged

feat: remove uuid dep #654

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
45bd10b
feat: remove uuid dep
Bashamega Jun 25, 2026
099fd81
Merge branch 'main' of github.com:Bashamega/WebDevTools into feat/rem…
Bashamega Jun 25, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
52 changes: 34 additions & 18 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 1 addition & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,8 +68,7 @@
"tailwindcss": "^4.2.1",
"tailwindcss-animate": "^1.0.7",
"typeify": "^0.1.1",
"typescript": "^6.0.3",
"uuid": "^11.1.0"
"typescript": "^6.0.3"
},
"devDependencies": {
"@testing-library/dom": "^10.4.1",
Expand Down
6 changes: 4 additions & 2 deletions src/app/customizer/JsonGenerator/components/CardForm.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import { useState, useEffect } from "react";
import { v4 as uuidv4 } from "uuid";
import { Reorder, useDragControls } from "framer-motion";
import { saveAs } from "file-saver";
import Categories from "../utils";
Expand Down Expand Up @@ -67,7 +66,10 @@ export default function CardForm({ isDarkMode }) {
};

const addField = () => {
setFields([...fields, { id: uuidv4(), fieldName: "", fieldType: "" }]);
setFields([
...fields,
{ id: crypto.randomUUID(), fieldName: "", fieldType: "" },
]);
};

const removeField = (id) => {
Expand Down
7 changes: 3 additions & 4 deletions src/app/customizer/JsonGenerator/components/Init.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import { v4 as uuidv4 } from "uuid";
export const initialFields = () => [
{ id: uuidv4(), fieldName: "id", fieldType: "" },
{ id: uuidv4(), fieldName: "first_name", fieldType: "" },
{ id: uuidv4(), fieldName: "last_name", fieldType: "" },
{ id: crypto.randomUUID(), fieldName: "id", fieldType: "" },
{ id: crypto.randomUUID(), fieldName: "first_name", fieldType: "" },
{ id: crypto.randomUUID(), fieldName: "last_name", fieldType: "" },
Comment on lines +2 to +4

@coderabbitai coderabbitai Bot Jun 25, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🩺 Stability & Availability | 🟡 Minor

🧩 Analysis chain

🌐 Web query:

Is crypto.randomUUID() available in non-secure (HTTP) browser contexts, and what is its minimum browser version support?

💡 Result:

No, crypto.randomUUID is not available in non-secure (HTTP) browser contexts [1][2]. It requires a secure context (HTTPS) to function [1][3][4]. This requirement is explicitly defined in the Web Cryptography API specification [5]. Note that localhost is typically treated as a secure context by browsers, allowing the method to function during local development [3][4][6]. The minimum browser versions supporting crypto.randomUUID are: - Chrome: 92 [2][4] - Edge: 92 [2][4] - Firefox: 95 [2][4] - Safari: 15.4 [2][4] If you need to support non-secure contexts or older browsers, you should use a fallback mechanism, such as a polyfill or the uuid npm package, which often rely on crypto.getRandomValues (if available) or Math.random as a last resort [7][3][4].

Citations:

crypto.randomUUID() fails in non-secure contexts, causing runtime errors on HTTP deployments.

The API is restricted to secure contexts (HTTPS or localhost) as per the Web Cryptography specification. Usage in plain HTTP environments results in a TypeError, reverting to a fallback ID generation strategy is necessary for stability in non-secure or legacy browser environments.

Use a guarded helper:

const genId = () => globalThis.crypto?.randomUUID?.() ?? `${Date.now()}-${Math.random().toString(36).slice(2)}`;
Apply this to lines 2–4 
- { id: crypto.randomUUID(), fieldName: "id", fieldType: "" },
- { id: crypto.randomUUID(), fieldName: "first_name", fieldType: "" },
- { id: crypto.randomUUID(), fieldName: "last_name", fieldType: "" },
+ { id: genId(), fieldName: "id", fieldType: "" },
+ { id: genId(), fieldName: "first_name", fieldType: "" },
+ { id: genId(), fieldName: "last_name", fieldType: "" },
🤖 Prompt for AI Agents 
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/app/customizer/JsonGenerator/components/Init.jsx` around lines 2 - 4, The
initial field IDs in Init.jsx are generated with crypto.randomUUID(), which
breaks in non-secure or unsupported environments. Update the ID generation used
for the default fields by introducing a guarded helper like genId and use it for
the objects in the Init component so it falls back safely when
globalThis.crypto.randomUUID is unavailable.

];
1 change: 0 additions & 1 deletion techstack.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -179,7 +179,6 @@
| [react-icons](https://www.npmjs.com/react-icons) | v5.2.1 | 07/09/24 | Jitendra | MIT | N/A |
| [react-tabs](https://www.npmjs.com/react-tabs) | v6.0.2 | 07/09/24 | Jitendra | N/A | N/A |
| [tailwindcss](https://www.npmjs.com/tailwindcss) | v3.4.4 | 07/05/24 | renovate[bot] | MIT | N/A |
| [uuid](https://www.npmjs.com/uuid) | v10.0.0 | 07/04/24 | renovate[bot] | MIT | N/A |
| [xml2js](https://www.npmjs.com/xml2js) | v0.6.2 | 07/21/24 | Bashamega | MIT | N/A |

<br/>
Expand Down
14 changes: 0 additions & 14 deletions techstack.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -383,20 +383,6 @@ tools:
detection_source: package.json
last_updated_by: renovate[bot]
last_updated_on: 2024-07-05 02:38:26.000000000 Z
- name: uuid
description: RFC4122
package_url: https://www.npmjs.com/uuid
version: 10.0.0
license: MIT
open_source: true
hosted_saas: false
category: Libraries
sub_category: npm Packages
image_url: https://img.stackshare.io/package/15916/default_e0a4fb1126d7400f419f0931cf1669947a5bc552.png
detection_source_url: https://github.com/Bashamega/WebDevTools/blob/main/package-lock.json
detection_source: package.json
last_updated_by: renovate[bot]
last_updated_on: 2024-07-04 16:27:45.000000000 Z
- name: xml2js
description: Simple XML to JavaScript object converter
package_url: https://www.npmjs.com/xml2js
Expand Down
Loading