3 files changed, 11 insertions, 10 deletions
diff --git a/src/tools/hash-text/hash-text.vue b/src/tools/hash-text/hash-text.vue
index 4b7bcf1..50a9c33 100644
--- a/src/tools/hash-text/hash-text.vue
+++ b/src/tools/hash-text/hash-text.vue
@@ -40,6 +40,7 @@
 </template>
 
 <script setup lang="ts">
+import { useQueryParam } from '@/composable/queryParams';
 import { enc, lib, MD5, RIPEMD160, SHA1, SHA224, SHA256, SHA3, SHA384, SHA512 } from 'crypto-js';
 import { ref } from 'vue';
 import InputCopyable from '../../components/InputCopyable.vue';
@@ -59,7 +60,7 @@ const algos = {
 type AlgoNames = keyof typeof algos;
 type Encoding = keyof typeof enc | 'Bin';
 const algoNames = Object.keys(algos) as AlgoNames[];
-const encoding = ref<Encoding>('Hex');
+const encoding = useQueryParam<Encoding>({ defaultValue: 'Hex', name: 'encoding' });
 const clearText = ref('');
 
 function formatWithEncoding(words: lib.WordArray, encoding: Encoding) {
diff --git a/src/tools/token-generator/token-generator.tool.vue b/src/tools/token-generator/token-generator.tool.vue
index 25bfea2..c2dcb0f 100644
--- a/src/tools/token-generator/token-generator.tool.vue
+++ b/src/tools/token-generator/token-generator.tool.vue
@@ -54,18 +54,19 @@
 <script setup lang="ts">
 import { useCopy } from '@/composable/copy';
 import { ref, watch } from 'vue';
+import { useQueryParam } from '@/composable/queryParams';
 import { createToken } from './token-generator.service';
 
 const token = ref('');
-const length = ref(64);
+const length = useQueryParam({ name: 'length', defaultValue: 64 });
 const { copy } = useCopy({ source: token, text: 'Token copied to the clipboard' });
 
-const withUppercase = ref(true);
-const withLowercase = ref(true);
-const withNumbers = ref(true);
-const withSymbols = ref(false);
+const withUppercase = useQueryParam({ name: 'uppercase', defaultValue: true });
+const withLowercase = useQueryParam({ name: 'lowercase', defaultValue: true });
+const withNumbers = useQueryParam({ name: 'numbers', defaultValue: true });
+const withSymbols = useQueryParam({ name: 'symbols', defaultValue: false });
 
-watch([withUppercase, withLowercase, withNumbers, withSymbols, length], refreshToken);
+watch([withUppercase, withLowercase, withNumbers, withSymbols, length], refreshToken, { immediate: true });
 
 function refreshToken() {
   token.value = createToken({
@@ -76,6 +77,4 @@ function refreshToken() {
     withSymbols: withSymbols.value,
   });
 }
-
-refreshToken();
 </script>
diff --git a/src/tools/uuid-generator/uuid-generator.vue b/src/tools/uuid-generator/uuid-generator.vue
index 36379f8..e274c98 100644
--- a/src/tools/uuid-generator/uuid-generator.vue
+++ b/src/tools/uuid-generator/uuid-generator.vue
@@ -32,8 +32,9 @@
 import { useCopy } from '@/composable/copy';
 import { ref, watch } from 'vue';
 import { v4 as generateUUID } from 'uuid';
+import { useQueryParam } from '@/composable/queryParams';
 
-const count = ref(1);
+const count = useQueryParam({ defaultValue: 1, name: 'count' });
 
 const uuids = ref('');