From 7c540f1208da749c3932aab8f2c392048c4546ae Mon Sep 17 00:00:00 2001
From: Corentin Thomasset <corentin.thomasset74@gmail.com>
Date: Wed, 13 Apr 2022 13:55:41 +0200
Subject: [PATCH] feat(tool): random port generator

---
 src/tools/index.ts                            |  3 +-
 src/tools/random-port-generator/index.ts      | 11 +++++++
 .../random-port-generator.model.ts            |  3 ++
 .../random-port-generator.vue                 | 31 +++++++++++++++++++
 4 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 src/tools/random-port-generator/index.ts
 create mode 100644 src/tools/random-port-generator/random-port-generator.model.ts
 create mode 100644 src/tools/random-port-generator/random-port-generator.vue

diff --git a/src/tools/index.ts b/src/tools/index.ts
index 7cfa07e3..7bf13483 100644
--- a/src/tools/index.ts
+++ b/src/tools/index.ts
@@ -11,6 +11,7 @@ import { tool as dateTimeConverter } from './date-time-converter';
 import { tool as gitMemo } from './git-memo';
 import { tool as baseConverter } from './integer-base-converter';
 import { tool as urlEncoder } from './url-encoder';
+import { tool as randomPortGenerator } from './random-port-generator';
 
 export const toolsByCategory: ToolCategory[] = [
   {
@@ -31,7 +32,7 @@ export const toolsByCategory: ToolCategory[] = [
   {
     name: 'Development',
     icon: LockOpen,
-    components: [gitMemo],
+    components: [gitMemo, randomPortGenerator],
   },
 ];
 
diff --git a/src/tools/random-port-generator/index.ts b/src/tools/random-port-generator/index.ts
new file mode 100644
index 00000000..63c24cb4
--- /dev/null
+++ b/src/tools/random-port-generator/index.ts
@@ -0,0 +1,11 @@
+import { Server } from '@vicons/tabler';
+import type { ITool } from '../Tool';
+
+export const tool: ITool = {
+  name: 'Random port generator',
+  path: '/random-port-generator',
+  description: 'Generate random port numbers outside of the range of "known" ports (0-1023).',
+  keywords: ['system', 'port', 'lan', 'generator', 'random', 'developement', 'computer'],
+  component: () => import('./random-port-generator.vue'),
+  icon: Server,
+};
diff --git a/src/tools/random-port-generator/random-port-generator.model.ts b/src/tools/random-port-generator/random-port-generator.model.ts
new file mode 100644
index 00000000..b73871d2
--- /dev/null
+++ b/src/tools/random-port-generator/random-port-generator.model.ts
@@ -0,0 +1,3 @@
+import { randIntFromInterval } from '@/utils/random';
+
+export const generatePort = () => randIntFromInterval(1024, 65535);
diff --git a/src/tools/random-port-generator/random-port-generator.vue b/src/tools/random-port-generator/random-port-generator.vue
new file mode 100644
index 00000000..5c94a635
--- /dev/null
+++ b/src/tools/random-port-generator/random-port-generator.vue
@@ -0,0 +1,31 @@
+<template>
+    <n-card>
+        <n-input :value="port" readonly style="text-align: center; font-family: monospace;" />
+        <br>
+        <br>
+        <n-space justify="center">
+            <n-button @click="copy" secondary>Copy</n-button>
+            <n-button @click="refreshPort" secondary>Refresh</n-button>
+        </n-space>
+    </n-card>
+</template>
+
+<script setup lang="ts">
+import { useCopy } from '@/composable/copy';
+import { ref } from 'vue'
+import { generatePort } from './random-port-generator.model'
+
+const port = ref('')
+
+const { copy } = useCopy({ source: port, text: 'Port copied to the clipboard' })
+
+function refreshPort() {
+    port.value = String(generatePort())
+}
+
+refreshPort()
+
+</script>
+
+<style lang="scss" scoped>
+</style>
\ No newline at end of file