refactor: tools folder inside pages

src/pages/tools/string/to-morse/index.tsx

@@ -0,0 +1,63 @@
+import { Box } from '@mui/material';
+import React, { useState } from 'react';
+import ToolTextInput from '@components/input/ToolTextInput';
+import ToolTextResult from '@components/result/ToolTextResult';
+import ToolOptions from '@components/options/ToolOptions';
+import { compute } from './service';
+import TextFieldWithDesc from '@components/options/TextFieldWithDesc';
+import ToolInputAndResult from '@components/ToolInputAndResult';
+
+const initialValues = {
+  dotSymbol: '.',
+  dashSymbol: '-'
+};
+
+export default function ToMorse() {
+  const [input, setInput] = useState<string>('');
+  const [result, setResult] = useState<string>('');
+  // const formRef = useRef<FormikProps<typeof initialValues>>(null);
+  const computeOptions = (optionsValues: typeof initialValues, input: any) => {
+    const { dotSymbol, dashSymbol } = optionsValues;
+    setResult(compute(input, dotSymbol, dashSymbol));
+  };
+
+  return (
+    <Box>
+      <ToolInputAndResult
+        input={<ToolTextInput value={input} onChange={setInput} />}
+        result={<ToolTextResult title={'Morse code'} value={result} />}
+      />
+      <ToolOptions
+        compute={computeOptions}
+        getGroups={({ values, updateField }) => [
+          {
+            title: 'Short Signal',
+            component: (
+              <TextFieldWithDesc
+                description={
+                  'Symbol that will correspond to the dot in Morse code.'
+                }
+                value={values.dotSymbol}
+                onOwnChange={(val) => updateField('dotSymbol', val)}
+              />
+            )
+          },
+          {
+            title: 'Long Signal',
+            component: (
+              <TextFieldWithDesc
+                description={
+                  'Symbol that will correspond to the dash in Morse code.'
+                }
+                value={values.dashSymbol}
+                onOwnChange={(val) => updateField('dashSymbol', val)}
+              />
+            )
+          }
+        ]}
+        initialValues={initialValues}
+        input={input}
+      />
+    </Box>
+  );
+}

src/pages/tools/string/to-morse/meta.ts

@@ -0,0 +1,14 @@
+import { defineTool } from '@tools/defineTool';
+import { lazy } from 'react';
+// import image from '@assets/text.png';
+
+export const tool = defineTool('string', {
+  name: 'String To morse',
+  path: 'to-morse',
+  // image,
+  description:
+    "World's simplest browser-based utility for converting text to Morse code. Load your text in the input form on the left and you'll instantly get Morse code in the output area. Powerful, free, and fast. Load text – get Morse code.",
+  shortDescription: 'Quickly encode text to morse',
+  keywords: ['to', 'morse'],
+  component: lazy(() => import('./index'))
+});

src/pages/tools/string/to-morse/service.ts

@@ -0,0 +1,9 @@
+import { encode } from 'morsee';
+
+export const compute = (
+  input: string,
+  dotSymbol: string,
+  dashSymbol: string
+): string => {
+  return encode(input).replaceAll('.', dotSymbol).replaceAll('-', dashSymbol);
+};

src/pages/tools/string/to-morse/to-morse.service.test.ts

@@ -0,0 +1,50 @@
+import { describe, expect, it } from 'vitest';
+import { compute } from './service';
+
+describe('compute function', () => {
+  it('should replace dots and dashes with specified symbols', () => {
+    const input = 'test';
+    const dotSymbol = '*';
+    const dashSymbol = '#';
+    const result = compute(input, dotSymbol, dashSymbol);
+    const expected = '# * *** #';
+    expect(result).toBe(expected);
+  });
+
+  it('should return an empty string for empty input', () => {
+    const input = '';
+    const dotSymbol = '*';
+    const dashSymbol = '#';
+    const result = compute(input, dotSymbol, dashSymbol);
+    expect(result).toBe('');
+  });
+
+  // Test case 3: Special characters handling
+  it('should handle input with special characters', () => {
+    const input = 'hello, world!';
+    const dotSymbol = '*';
+    const dashSymbol = '#';
+    const result = compute(input, dotSymbol, dashSymbol);
+    const expected =
+      '**** * *#** *#** ### ##**## / *## ### *#* *#** #** #*#*##';
+    expect(result).toBe(expected);
+  });
+
+  it('should work with different symbols for dots and dashes', () => {
+    const input = 'morse';
+    const dotSymbol = '!';
+    const dashSymbol = '@';
+    const result = compute(input, dotSymbol, dashSymbol);
+    const expected = '@@ @@@ !@! !!! !';
+    expect(result).toBe(expected);
+  });
+
+  it('should handle numeric input correctly', () => {
+    const input = '12345';
+    const dotSymbol = '*';
+    const dashSymbol = '#';
+    const result = compute(input, dotSymbol, dashSymbol);
+    const expected = '*#### **### ***## ****# *****'; // This depends on how "12345" is encoded in morse code
+    expect(result).toBe(expected);
+  });
+});