feat: adding uuid library

src/renderer/src/app.tsx

@@ -27,6 +27,7 @@ import { downloadSourcesWorker } from "./workers";
 import { downloadSourcesTable } from "./dexie";
 import { useSubscription } from "./hooks/use-subscription";
 import { HydraCloudModal } from "./pages/shared-modals/hydra-cloud/hydra-cloud-modal";
+import { generateUUID } from "./helpers";
 
 import { injectCustomCss, removeCustomCss } from "./helpers";
 import "./app.scss";
@@ -212,7 +213,7 @@ export function App() {
   useEffect(() => {
     updateRepacks();
 
-    const id = `${Date.now()}-${Math.random()}`;
+    const id = generateUUID();
     const channel = new BroadcastChannel(`download_sources:sync:${id}`);
 
     channel.onmessage = async (event: MessageEvent<number>) => {

src/renderer/src/helpers.ts

@@ -1,6 +1,7 @@
 import type { GameShop } from "@types";
 
 import Color from "color";
+import { v4 as uuidv4 } from "uuid";
 import { THEME_WEB_STORE_URL } from "./constants";
 
 export const formatDownloadProgress = (
@@ -112,3 +113,11 @@ export const formatNumber = (num: number): string => {
     maximumFractionDigits: 1,
   }).format(num);
 };
+
+/**
+ * Generates a UUID v4
+ * @returns A random UUID string
+ */
+export const generateUUID = (): string => {
+  return uuidv4();
+};

src/renderer/src/pages/settings/aparence/modals/add-theme-modal.tsx

@@ -9,6 +9,7 @@ import { useForm } from "react-hook-form";
 import * as yup from "yup";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { useCallback } from "react";
+import { generateUUID } from "@renderer/helpers";
 
 import "./modals.scss";
 
@@ -79,7 +80,7 @@ export function AddThemeModal({
   const onSubmit = useCallback(
     async (values: FormValues) => {
       const theme: Theme = {
-        id: `${Date.now()}-${Math.random()}`,
+        id: generateUUID(),
         name: values.name,
         isActive: false,
         author: userDetails?.id,

src/renderer/src/pages/settings/aparence/modals/import-theme-modal.tsx

@@ -3,7 +3,11 @@ import { Modal } from "@renderer/components/modal/modal";
 import { useTranslation } from "react-i18next";
 import "./modals.scss";
 import { Theme } from "@types";
-import { injectCustomCss, removeCustomCss } from "@renderer/helpers";
+import {
+  injectCustomCss,
+  removeCustomCss,
+  generateUUID,
+} from "@renderer/helpers";
 import { useToast } from "@renderer/hooks";
 import { THEME_WEB_STORE_URL } from "@renderer/constants";
 import { logger } from "@renderer/logger";
@@ -30,7 +34,7 @@ export const ImportThemeModal = ({
 
   const handleImportTheme = async () => {
     const theme: Theme = {
-      id: `${Date.now()}-${Math.random()}`,
+      id: generateUUID(),
       name: themeName,
       isActive: false,
       author: authorId,

src/renderer/src/pages/settings/settings-download-sources.tsx

@@ -23,6 +23,7 @@ import { downloadSourcesTable } from "@renderer/dexie";
 import { downloadSourcesWorker } from "@renderer/workers";
 import { useNavigate } from "react-router-dom";
 import { setFilters, clearFilters } from "@renderer/features";
+import { generateUUID } from "@renderer/helpers";
 import "./settings-download-sources.scss";
 
 export function SettingsDownloadSources() {
@@ -95,7 +96,7 @@ export function SettingsDownloadSources() {
   const handleRemoveAllDownloadSources = () => {
     setIsRemovingDownloadSource(true);
 
-    const id = `${Date.now()}-${Math.random()}`;
+    const id = generateUUID();
     const channel = new BroadcastChannel(`download_sources:delete_all:${id}`);
 
     downloadSourcesWorker.postMessage(["DELETE_ALL_DOWNLOAD_SOURCES", id]);
@@ -120,7 +121,7 @@ export function SettingsDownloadSources() {
   const syncDownloadSources = async () => {
     setIsSyncingDownloadSources(true);
 
-    const id = `${Date.now()}-${Math.random()}`;
+    const id = generateUUID();
     const channel = new BroadcastChannel(`download_sources:sync:${id}`);
 
     downloadSourcesWorker.postMessage(["SYNC_DOWNLOAD_SOURCES", id]);