feat(new tool): Sensitive data masker

Fix CorentinTh#765

Author: sharevb

components.d.ts

@@ -130,21 +130,14 @@ declare module '@vue/runtime-core' {
     NCode: typeof import('naive-ui')['NCode']
     NCollapseTransition: typeof import('naive-ui')['NCollapseTransition']
     NConfigProvider: typeof import('naive-ui')['NConfigProvider']
-    NDivider: typeof import('naive-ui')['NDivider']
     NEllipsis: typeof import('naive-ui')['NEllipsis']
-    NFormItem: typeof import('naive-ui')['NFormItem']
-    NGi: typeof import('naive-ui')['NGi']
-    NGrid: typeof import('naive-ui')['NGrid']
     NH1: typeof import('naive-ui')['NH1']
     NH3: typeof import('naive-ui')['NH3']
     NIcon: typeof import('naive-ui')['NIcon']
-    NInputNumber: typeof import('naive-ui')['NInputNumber']
-    NLabel: typeof import('naive-ui')['NLabel']
     NLayout: typeof import('naive-ui')['NLayout']
     NLayoutSider: typeof import('naive-ui')['NLayoutSider']
     NMenu: typeof import('naive-ui')['NMenu']
     NScrollbar: typeof import('naive-ui')['NScrollbar']
-    NSpin: typeof import('naive-ui')['NSpin']
     NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default']
     OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default']
     PasswordStrengthAnalyser: typeof import('./src/tools/password-strength-analyser/password-strength-analyser.vue')['default']
@@ -160,6 +153,7 @@ declare module '@vue/runtime-core' {
     RouterView: typeof import('vue-router')['RouterView']
     RsaKeyPairGenerator: typeof import('./src/tools/rsa-key-pair-generator/rsa-key-pair-generator.vue')['default']
     SafelinkDecoder: typeof import('./src/tools/safelink-decoder/safelink-decoder.vue')['default']
+    SensitiveDataMasker: typeof import('./src/tools/sensitive-data-masker/sensitive-data-masker.vue')['default']
     SlugifyString: typeof import('./src/tools/slugify-string/slugify-string.vue')['default']
     SpanCopyable: typeof import('./src/components/SpanCopyable.vue')['default']
     SqlPrettify: typeof import('./src/tools/sql-prettify/sql-prettify.vue')['default']

package.json

@@ -70,6 +70,7 @@
     "libphonenumber-js": "^1.10.28",
     "lodash": "^4.17.21",
     "marked": "^10.0.0",
+    "mask-sensitive-data": "^0.11.5",
     "mathjs": "^11.9.1",
     "mime-types": "^2.1.35",
     "monaco-editor": "^0.43.0",

pnpm-lock.yaml

@@ -6,6 +6,7 @@ import { tool as asciiTextDrawer } from './ascii-text-drawer';
 
 import { tool as textToUnicode } from './text-to-unicode';
 import { tool as safelinkDecoder } from './safelink-decoder';
+import { tool as sensitiveDataMasker } from './sensitive-data-masker';
 import { tool as pdfSignatureChecker } from './pdf-signature-checker';
 import { tool as numeronymGenerator } from './numeronym-generator';
 import { tool as macAddressGenerator } from './mac-address-generator';
@@ -172,6 +173,7 @@ export const toolsByCategory: ToolCategory[] = [
       textDiff,
       numeronymGenerator,
       asciiTextDrawer,
+      sensitiveDataMasker,
     ],
   },
   {

src/tools/index.ts

@@ -0,0 +1,12 @@
+import { ShieldLock } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'Sensitive data masker',
+  path: '/sensitive-data-masker',
+  description: 'Clean sensitive data from textual content (ie logs)',
+  keywords: ['sensitive', 'data', 'masker', 'obfuscator', 'clean', 'log'],
+  component: () => import('./sensitive-data-masker.vue'),
+  icon: ShieldLock,
+  createdAt: new Date('2024-06-16'),
+});

src/tools/sensitive-data-masker/index.ts

@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import maskSensitiveData from 'mask-sensitive-data';
+import { withDefaultOnError } from '@/utils/defaults';
+
+const defaultValue = `
+{
+  email: '[email protected]',
+  creditCard: '1234 5678 9000 9876',
+  id: '3f8a43fd-6489-4ec7-bd55-7a1ba172d77b',
+  name: 'John',
+  surname: 'Doe',
+  phone: '+358 40 1234567',
+  token: 'eyJhbGciOiJIUzI1NiJ9.ew0KICAic3ViIjogIjEyMzQ1Njc4OTAiLA0KICAibmFtZSI6ICJBbGV4IEtvemxvdiIsDQogICJpYXQiOiAxNTE2MjM5MDIyDQp9.PNKysYFTCenU5bekHCmwIxCUXoYG41H_xc3uN3ZF_b8',
+}
+`;
+function transformer(value: string) {
+  return withDefaultOnError(() => maskSensitiveData(value), '');
+}
+</script>
+
+<template>
+  <format-transformer
+    input-label="Your log/textual data:"
+    :input-default="defaultValue"
+    input-placeholder="Paste your log/textual data here..."
+    output-label="Cleaned version:"
+    :transformer="transformer"
+  />
+</template>