feat(new tool): WPA PSK Raw Key Generator

components.d.ts

@@ -129,6 +129,7 @@ declare module '@vue/runtime-core' {
     MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default']
     MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default']
     NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default']
+    NButton: typeof import('naive-ui')['NButton']
     NCode: typeof import('naive-ui')['NCode']
     NCollapseTransition: typeof import('naive-ui')['NCollapseTransition']
     NConfigProvider: typeof import('naive-ui')['NConfigProvider']
@@ -185,6 +186,7 @@ declare module '@vue/runtime-core' {
     UserAgentResultCards: typeof import('./src/tools/user-agent-parser/user-agent-result-cards.vue')['default']
     UuidGenerator: typeof import('./src/tools/uuid-generator/uuid-generator.vue')['default']
     WifiQrCodeGenerator: typeof import('./src/tools/wifi-qr-code-generator/wifi-qr-code-generator.vue')['default']
+    WpaPskGenerator: typeof import('./src/tools/wpa-psk-generator/wpa-psk-generator.vue')['default']
     XmlFormatter: typeof import('./src/tools/xml-formatter/xml-formatter.vue')['default']
     XmlToJson: typeof import('./src/tools/xml-to-json/xml-to-json.vue')['default']
     YamlToJson: typeof import('./src/tools/yaml-to-json-converter/yaml-to-json.vue')['default']

src/tools/index.ts

@@ -2,6 +2,7 @@ import { tool as base64FileConverter } from './base64-file-converter';
 import { tool as base64StringConverter } from './base64-string-converter';
 import { tool as basicAuthGenerator } from './basic-auth-generator';
 import { tool as emailNormalizer } from './email-normalizer';
+import { tool as wpaPskGenerator } from './wpa-psk-generator';
 
 import { tool as asciiTextDrawer } from './ascii-text-drawer';
 
@@ -88,7 +89,20 @@ import { tool as yamlViewer } from './yaml-viewer';
 export const toolsByCategory: ToolCategory[] = [
   {
     name: 'Crypto',
-    components: [tokenGenerator, hashText, bcrypt, uuidGenerator, ulidGenerator, cypher, bip39, hmacGenerator, rsaKeyPairGenerator, passwordStrengthAnalyser, pdfSignatureChecker],
+    components: [
+      tokenGenerator,
+      hashText,
+      bcrypt,
+      uuidGenerator,
+      ulidGenerator,
+      cypher,
+      bip39,
+      hmacGenerator,
+      rsaKeyPairGenerator,
+      passwordStrengthAnalyser,
+      pdfSignatureChecker,
+      wpaPskGenerator,
+    ],
   },
   {
     name: 'Converter',

src/tools/wpa-psk-generator/index.ts

@@ -0,0 +1,12 @@
+import { Wifi } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'WPA PSK generator',
+  path: '/wpa-psk-generator',
+  description: 'WPA Pre-shared Key Generator to convert a WPA passphrase and SSID to the 256-bit pre-shared ("raw") key',
+  keywords: ['wpa', 'psk', 'pre', 'shared', 'key', 'ssid', 'passphrase', 'generator'],
+  component: () => import('./wpa-psk-generator.vue'),
+  icon: Wifi,
+  createdAt: new Date('2024-08-15'),
+});

src/tools/wpa-psk-generator/wpa-psk-generator.service.test.ts

@@ -0,0 +1,13 @@
+import { describe, expect, it } from 'vitest';
+import { generateWpaPskRawKey } from './wpa-psk-generator.service';
+
+describe('wpa-psk-generator', () => {
+  it('generateWpaPskRawKey should generate raw key', () => {
+    expect(generateWpaPskRawKey('test', 'test')).to.deep.eq({
+      passphrase: 'test',
+      psk: 'd630c5513becfd3952432bd7fcf098b7a40907f3214cf43551f1b8cfda873ecc',
+      ssid: 'test',
+    });
+    expect(generateWpaPskRawKey('test', 'test')?.psk).toHaveLength(256 / 8 * 2);
+  });
+});

src/tools/wpa-psk-generator/wpa-psk-generator.service.ts

@@ -0,0 +1,15 @@
+import CryptoJS from 'crypto-js';
+import pbkdf2 from 'crypto-js/pbkdf2';
+
+export function generateWpaPskRawKey(ssid: string, passphrase: string) {
+  const psk = pbkdf2(passphrase, ssid, {
+    keySize: 256 / 32,
+    iterations: 4096,
+    hasher: CryptoJS.algo.SHA1,
+  }).toString(CryptoJS.enc.Hex);
+  return {
+    ssid,
+    passphrase,
+    psk,
+  };
+}

src/tools/wpa-psk-generator/wpa-psk-generator.vue

@@ -0,0 +1,58 @@
+<script setup lang="ts">
+import { generateWpaPskRawKey } from './wpa-psk-generator.service';
+import { useValidation } from '@/composable/validation';
+
+const ssid = ref('');
+const passphrase = ref('');
+
+const wpaPSKRawKey = ref('');
+function computeRawKey() {
+  try {
+    wpaPSKRawKey.value = generateWpaPskRawKey(ssid.value, passphrase.value)?.psk;
+  }
+  catch (e: any) {
+    wpaPSKRawKey.value = e.toString();
+  }
+}
+
+const ssidValidation = useValidation({
+  source: ssid,
+  rules: [
+    {
+      validator: v => v !== '',
+      message: 'SSID must not be empty.',
+    },
+  ],
+});
+</script>
+
+<template>
+  <div style="max-width: 600px;">
+    <c-card title="Wifi Infos" mb-2>
+      <c-input-text
+        v-model:value="ssid"
+        label="SSID"
+        label-position="left"
+        placeholder="Put your SSID here..."
+        :validation="ssidValidation"
+        mb-2
+      />
+
+      <c-input-text
+        v-model:value="passphrase"
+        label="Passphrase"
+        label-position="left"
+        placeholder="Put your Passphrase here..."
+        mb-2
+      />
+
+      <div flex justify-center>
+        <n-button @click="computeRawKey()">Compute</n-button>
+      </div>
+    </c-card>
+
+    <c-card title="WPA PSK Raw Key (256 bits)">
+      <TextareaCopyable :value="wpaPSKRawKey" />
+    </c-card>
+  </div>
+</template>