Merge branch 'feat/htpasswd' into chore/all-my-stuffs

# Conflicts:
#	package.json
#	pnpm-lock.yaml
#	src/tools/index.ts

Author: sharevb

package.json

@@ -111,6 +111,7 @@
     "@xmldom/xmldom": "^0.8.10",
     "aircodes": "^1.3.16",
     "ansible-vault": "^1.1.1",
+    "apache-md5": "^1.1.8",
     "bcryptjs": "^2.4.3",
     "big.js": "^6.2.2",
     "change-case": "^4.1.2",

pnpm-lock.yaml

@@ -0,0 +1,60 @@
+<script setup lang="ts">
+import { hashSync } from 'bcryptjs';
+import md5 from 'apache-md5';
+import TextareaCopyable from '@/components/TextareaCopyable.vue';
+
+const username = ref('');
+const password = ref('');
+const hashMethod = ref('bcrypt');
+const saltCount = ref(10);
+
+const htpasswd = computed(() => {
+  if (username.value === '' || password.value === '') {
+    return '# username and password must not be empty';
+  }
+  let hash;
+  if (hashMethod.value === 'md5') {
+    hash = md5(password.value);
+  }
+  else {
+    hash = hashSync(password.value, saltCount.value);
+  }
+  return `${username.value}:${hash}`;
+});
+</script>
+
+<template>
+  <div>
+    <c-input-text
+      v-model:value="username"
+      label="Username"
+      placeholder="Your username..."
+      clearable raw-text mb-5
+    />
+    <c-input-text
+      v-model:value="password"
+      label="Password"
+      placeholder="Your password..."
+      clearable
+      raw-text
+      mb-2
+      type="password"
+    />
+
+    <c-select
+      v-model:value="hashMethod"
+      label="Hash method:"
+      :options="['bcrypt', 'md5']"
+    />
+
+    <n-form-item v-if="hashMethod === 'bcrypt'" label="Salt count: " label-placement="left" label-width="120">
+      <n-input-number v-model:value="saltCount" placeholder="Salt rounds..." :max="100" :min="0" w-full />
+    </n-form-item>
+
+    <n-divider />
+
+    <n-form-item label="htpasswd content:">
+      <TextareaCopyable :value="htpasswd" />
+    </n-form-item>
+  </div>
+</template>

src/tools/htpasswd-generator/htpasswd-generator.vue

@@ -0,0 +1,12 @@
+import { PasswordRound } from '@vicons/material';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'Htpasswd/htaccess generator',
+  path: '/htpasswd-generator',
+  description: 'htpassword/htaccess user/password generator',
+  keywords: ['htpasswd', 'htaccess', 'bcrypt', 'password'],
+  component: () => import('./htpasswd-generator.vue'),
+  icon: PasswordRound,
+  createdAt: new Date('2024-02-20'),
+});

src/tools/htpasswd-generator/index.ts

@@ -71,6 +71,7 @@ import { tool as ipGeoLocation } from './ip-geo-location';
 import { tool as ocrImage } from './ocr-image';
 import { tool as ansibleVaultCryptDecrypt } from './ansible-vault-crypt-decrypt';
 import { tool as gzipConverter } from './gzip-converter';
+import { tool as htpasswdGenerator } from './htpasswd-generator';
 import { tool as safelinkDecoder } from './safelink-decoder';
 import { tool as mongoObjectidConverter } from './mongo-objectid-converter';
 import { tool as removeExif } from './remove-exif';
@@ -304,6 +305,7 @@ export const toolsByCategory: ToolCategory[] = [
       urlParser,
       deviceInformation,
       basicAuthGenerator,
+      htpasswdGenerator,
       metaTagGenerator,
       otpCodeGeneratorAndValidator,
       mimeTypes,