feat(router): added legacy routes redirections

src/router.ts

@@ -4,6 +4,11 @@ import HomePage from './pages/Home.page.vue';
 import NotFound from './pages/404.page.vue';
 import { tools } from './tools';
 
+const toolsRoutes = tools.map(({ path, name, component, ...config }) => ({ path, name, component, meta: { isTool: true, layout: layouts.toolLayout, name, ...config } }));
+const toolsRedirectRoutes = tools
+  .filter(({ redirectFrom }) => redirectFrom && redirectFrom.length > 0)
+  .flatMap(({ path, redirectFrom }) => redirectFrom?.map((redirectSource) => ({ path: redirectSource, redirect: path })) ?? []);
+
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
   routes: [
@@ -12,7 +17,8 @@ const router = createRouter({
       name: 'home',
       component: HomePage,
     },
-    ...tools.map(({ path, name, component, ...config }) => ({ path, name, component, meta: { isTool: true, layout: layouts.toolLayout, name, ...config } })),
+    ...toolsRoutes,
+    ...toolsRedirectRoutes,
     { path: '/:pathMatch(.*)*', name: 'NotFound', component: NotFound },
   ],
 });

src/tools/Tool.ts

@@ -7,6 +7,7 @@ export interface ITool {
   keywords: string[];
   component: () => Promise<Component>;
   icon: Component;
+  redirectFrom?: string[];
 }
 
 export interface ToolCategory {

src/tools/base64-converter/index.ts

@@ -8,4 +8,5 @@ export const tool: ITool = {
   keywords: ['base64', 'converter', 'upload', 'image', 'file', 'convertion', 'web', 'data', 'format'],
   component: () => import('./base64-converter.vue'),
   icon: FileDigit,
+  redirectFrom: ['/file-to-base64', '/base64-string-converter'],
 };

src/tools/color-converter/index.ts

@@ -8,4 +8,5 @@ export const tool: ITool = {
   keywords: ['color', 'converter'],
   component: () => import('./color-converter.vue'),
   icon: Palette,
+  redirectFrom: ['/color-picker-converter'],
 };

src/tools/encryption/index.ts

@@ -8,4 +8,5 @@ export const tool: ITool = {
   keywords: ['cypher', 'uncypher', 'text', 'AES', 'TripleDES', 'Rabbit', 'RC4'],
   component: () => import('./encryption.vue'),
   icon: Lock,
+  redirectFrom: ['/cypher'],
 };

src/tools/hash-text/index.ts

@@ -8,4 +8,5 @@ export const tool: ITool = {
   keywords: ['hash', 'digest', 'crypto', 'security', 'text', 'MD5', 'SHA1', 'SHA256', 'SHA224', 'SHA512', 'SHA384', 'SHA3', 'RIPEMD160'],
   component: () => import('./hash-text.vue'),
   icon: EyeOff,
+  redirectFrom: ['/hash'],
 };

src/tools/qr-code-generator/index.ts

@@ -3,7 +3,7 @@ import type { ITool } from './../Tool';
 
 export const tool: ITool = {
   name: 'QR Code generator',
-  path: '/qr-code-generator',
+  path: '/qrcode-generator',
   description: 'Generate and download QR-code for an url or just a text and customize the background and foreground colors.',
   keywords: ['qr', 'code', 'generator', 'square', 'color', 'link', 'low', 'medium', 'quartile', 'high', 'transparent'],
   component: () => import('./qr-code-generator.vue'),

src/tools/text-statistics/index.ts

@@ -8,4 +8,5 @@ export const tool: ITool = {
   keywords: ['text', 'statistics', 'length', 'characters', 'count', 'size', 'bytes'],
   component: () => import('./text-statistics.vue'),
   icon: FileText,
+  redirectFrom: ['/text-stats'],
 };