From 35c861b711a0dd64a9ee77da03bb26010ce62c36 Mon Sep 17 00:00:00 2001
From: Dominik Pschenitschni <mail@celement.de>
Date: Mon, 4 Oct 2021 14:20:29 +0200
Subject: [PATCH] feat: create randomId helper and use everywhere
 Co-authored-by: konrad <konrad@kola-entertainments.de>

---
 src/components/input/colorPicker.vue   | 7 ++-----
 src/components/input/fancycheckbox.vue | 4 +++-
 src/helpers/randomId.ts                | 5 +++++
 src/helpers/redirectToProvider.ts      | 4 +++-
 4 files changed, 13 insertions(+), 7 deletions(-)
 create mode 100644 src/helpers/randomId.ts

diff --git a/src/components/input/colorPicker.vue b/src/components/input/colorPicker.vue
index 2a42222c..539a9dcb 100644
--- a/src/components/input/colorPicker.vue
+++ b/src/components/input/colorPicker.vue
@@ -28,6 +28,8 @@
 </template>
 
 <script>
+import {createRandomID} from '@/helpers/randomId'
+
 const DEFAULT_COLORS = [
 	'#1973ff',
 	'#7F23FF',
@@ -37,11 +39,6 @@ const DEFAULT_COLORS = [
 	'#00db60',
 ]
 
-function createRandomID() {
-	const ID_LENGTH = 9
-	return Math.random().toString(36).substr(2, ID_LENGTH)
-}
-
 export default {
 	name: 'colorPicker',
 	data() {
diff --git a/src/components/input/fancycheckbox.vue b/src/components/input/fancycheckbox.vue
index 9d22f844..260ec8d2 100644
--- a/src/components/input/fancycheckbox.vue
+++ b/src/components/input/fancycheckbox.vue
@@ -21,12 +21,14 @@
 </template>
 
 <script>
+import {createRandomID} from '@/helpers/randomId'
+
 export default {
 	name: 'fancycheckbox',
 	data() {
 		return {
 			checked: false,
-			checkBoxId: 'fancycheckbox' + Math.random(),
+			checkBoxId: `fancycheckbox_${createRandomID()}`,
 		}
 	},
 	props: {
diff --git a/src/helpers/randomId.ts b/src/helpers/randomId.ts
new file mode 100644
index 00000000..3608a165
--- /dev/null
+++ b/src/helpers/randomId.ts
@@ -0,0 +1,5 @@
+const DEFAULT_ID_LENGTH = 9
+
+export function createRandomID(idLength = DEFAULT_ID_LENGTH) {
+	return Math.random().toString(36).substr(2, idLength)
+}
\ No newline at end of file
diff --git a/src/helpers/redirectToProvider.ts b/src/helpers/redirectToProvider.ts
index ba2137f4..df67d3af 100644
--- a/src/helpers/redirectToProvider.ts
+++ b/src/helpers/redirectToProvider.ts
@@ -1,3 +1,5 @@
+import {createRandomID} from '@/helpers/randomId'
+
 interface Provider {
 	name: string
 	key: string
@@ -6,7 +8,7 @@ interface Provider {
 }
 
 export const redirectToProvider = (provider: Provider, redirectUrl: string) => {
-	const state = Math.random().toString(36).substring(2, 24)
+	const state = createRandomID(24)
 	localStorage.setItem('state', state)
 
 	window.location.href = `${provider.authUrl}?client_id=${provider.clientId}&redirect_uri=${redirectUrl}${provider.key}&response_type=code&scope=openid email profile&state=${state}`