Merge branch 'main' into text-statistics

src/components/Navbar/index.tsx

@@ -100,9 +100,9 @@ const Navbar: React.FC<NavbarProps> = ({ onSwitchTheme }) => {
           alignItems: 'center'
         }}
       >
-        <a href="/">
+        <Link to="/">
           <img src={logo} width={isMobile ? '80px' : '150px'} />
-        </a>
+        </Link>
         {isMobile ? (
           <>
             <IconButton

src/components/ToolContent.tsx

@@ -38,25 +38,25 @@ const FormikListenerComponent = <T,>({
   return null; // This component doesn't render anything
 };
 
-interface ToolContentProps<T, I> extends ToolComponentProps {
+interface ToolContentProps<Options, Input> extends ToolComponentProps {
   inputComponent?: ReactNode;
   resultComponent?: ReactNode;
   renderCustomInput?: (
-    values: T,
+    values: Options,
     setFieldValue: (fieldName: string, value: any) => void
   ) => ReactNode;
-  initialValues: T;
-  getGroups: GetGroupsType<T> | null;
-  compute: (optionsValues: T, input: I) => void;
+  initialValues: Options;
+  getGroups: GetGroupsType<Options> | null;
+  compute: (optionsValues: Options, input: Input) => void;
   toolInfo?: {
     title: string;
     description?: string;
   };
-  input?: I;
-  exampleCards?: CardExampleType<T>[];
-  setInput?: React.Dispatch<React.SetStateAction<I>>;
+  input?: Input;
+  exampleCards?: CardExampleType<Options>[];
+  setInput?: React.Dispatch<React.SetStateAction<Input>>;
   validationSchema?: any;
-  onValuesChange?: (values: T) => void;
+  onValuesChange?: (values: Options) => void;
   verticalGroups?: boolean;
 }
 

src/pages/tools/pdf/index.ts

@@ -4,11 +4,13 @@ import { meta as mergePdf } from './merge-pdf/meta';
 import { DefinedTool } from '@tools/defineTool';
 import { tool as compressPdfTool } from './compress-pdf/meta';
 import { tool as protectPdfTool } from './protect-pdf/meta';
+import { meta as pdfToEpub } from './pdf-to-epub/meta';
 
 export const pdfTools: DefinedTool[] = [
   splitPdfMeta,
   pdfRotatePdf,
   compressPdfTool,
   protectPdfTool,
-  mergePdf
+  mergePdf,
+  pdfToEpub
 ];

src/pages/tools/pdf/pdf-to-epub/index.tsx

@@ -0,0 +1,58 @@
+import { useState, useEffect } from 'react';
+import ToolFileResult from '@components/result/ToolFileResult';
+import ToolContent from '@components/ToolContent';
+import { ToolComponentProps } from '@tools/defineTool';
+import ToolPdfInput from '@components/input/ToolPdfInput';
+import { convertPdfToEpub } from './service';
+
+export default function PdfToEpub({ title }: ToolComponentProps) {
+  const [input, setInput] = useState<File | null>(null);
+  const [result, setResult] = useState<File | null>(null);
+  const [isProcessing, setIsProcessing] = useState<boolean>(false);
+
+  const compute = async (options: {}, input: File | null) => {
+    if (!input) return;
+    try {
+      setIsProcessing(true);
+      setResult(null);
+      const epub = await convertPdfToEpub(input);
+      setResult(epub);
+    } catch (error) {
+      console.error('Failed to convert PDF to EPUB:', error);
+    } finally {
+      setIsProcessing(false);
+    }
+  };
+
+  return (
+    <ToolContent
+      title={title}
+      input={input}
+      setInput={setInput}
+      initialValues={{}}
+      compute={compute}
+      inputComponent={
+        <ToolPdfInput
+          value={input}
+          onChange={(file) => setInput(file)}
+          accept={['application/pdf']}
+          title={'Input PDF'}
+        />
+      }
+      getGroups={null}
+      resultComponent={
+        <ToolFileResult
+          title={'EPUB Output'}
+          value={result}
+          extension={'epub'}
+          loading={isProcessing}
+          loadingText={'Converting PDF to EPUB...'}
+        />
+      }
+      toolInfo={{
+        title: 'How to Use PDF to EPUB?',
+        description: `Upload a PDF file and this tool will convert it into an EPUB format, suitable for most e-reader devices.`
+      }}
+    />
+  );
+}

src/pages/tools/pdf/pdf-to-epub/meta.ts

@@ -0,0 +1,13 @@
+import { defineTool } from '@tools/defineTool';
+import { lazy } from 'react';
+
+export const meta = defineTool('pdf', {
+  name: 'PDF to EPUB',
+  shortDescription: 'Convert PDF files to EPUB format',
+  description:
+    'Transform PDF documents into EPUB files for better e-reader compatibility.',
+  icon: 'material-symbols:import-contacts',
+  component: lazy(() => import('./index')),
+  keywords: ['pdf', 'epub', 'convert', 'ebook'],
+  path: 'pdf-to-epub'
+});

src/pages/tools/pdf/pdf-to-epub/service.ts

@@ -0,0 +1,144 @@
+import * as pdfjsLib from 'pdfjs-dist';
+import pdfjsWorker from 'pdfjs-dist/build/pdf.worker.min?url';
+import JSZip from 'jszip';
+
+// Set worker source for PDF.js
+pdfjsLib.GlobalWorkerOptions.workerSrc = pdfjsWorker;
+
+function formatTextToParagraphs(raw: string): string {
+  return raw
+    .split(/\n{2,}|\r{2,}/g) // Split on double line breaks
+    .map((p) => p.trim())
+    .filter((p) => p.length > 0)
+    .map((p) => `<p>${p.replace(/\n/g, ' ')}</p>`)
+    .join('\n');
+}
+
+export async function convertPdfToEpub(pdfFile: File): Promise<File> {
+  const arrayBuffer = await pdfFile.arrayBuffer();
+
+  const loadingTask = pdfjsLib.getDocument({ data: arrayBuffer });
+  const pdfDoc = await loadingTask.promise;
+  const numPages = pdfDoc.numPages;
+
+  // Extracting text
+  const pages: string[] = [];
+  for (let i = 1; i <= numPages; i++) {
+    const page = await pdfDoc.getPage(i);
+    const textContent = await page.getTextContent();
+
+    const pageText = textContent.items.map((item: any) => item.str).join('\n'); // Preserve line breaks better
+
+    pages.push(pageText);
+  }
+
+  const zip = new JSZip();
+
+  zip.file('mimetype', 'application/epub+zip', { compression: 'STORE' });
+
+  const metaInf = zip.folder('META-INF');
+  metaInf!.file(
+    'container.xml',
+    `<?xml version="1.0" encoding="UTF-8"?>
+<container version="1.0" xmlns="urn:oasis:names:tc:opendocument:xmlns:container">
+  <rootfiles>
+    <rootfile full-path="OEBPS/content.opf" media-type="application/oebps-package+xml"/>
+  </rootfiles>
+</container>`
+  );
+
+  const oebps = zip.folder('OEBPS');
+  const bookTitle = pdfFile.name.replace(/\.pdf$/i, '');
+
+  const contentOpf = `<?xml version="1.0" encoding="UTF-8"?>
+<package xmlns="http://www.idpf.org/2007/opf" unique-identifier="bookid" version="2.0">
+  <metadata xmlns:dc="http://purl.org/dc/elements/1.1/">
+    <dc:title>${bookTitle}</dc:title>
+    <dc:creator>Converted by omni-tools</dc:creator>
+    <dc:identifier id="bookid">${Date.now()}</dc:identifier>
+    <dc:language>en</dc:language>
+  </metadata>
+  <manifest>
+    <item id="ncx" href="toc.ncx" media-type="application/x-dtbncx+xml"/>
+    ${pages
+      .map(
+        (_, index) =>
+          `<item id="chapter${index + 1}" href="chapter${
+            index + 1
+          }.xhtml" media-type="application/xhtml+xml"/>`
+      )
+      .join('\n    ')}
+  </manifest>
+  <spine toc="ncx">
+    ${pages
+      .map((_, index) => `<itemref idref="chapter${index + 1}"/>`)
+      .join('\n    ')}
+  </spine>
+</package>`;
+
+  oebps!.file('content.opf', contentOpf);
+
+  const tocNcx = `<?xml version="1.0" encoding="UTF-8"?>
+<ncx xmlns="http://www.daisy.org/z3986/2005/ncx/" version="2005-1">
+  <head>
+    <meta name="dtb:uid" content="${Date.now()}"/>
+    <meta name="dtb:depth" content="1"/>
+    <meta name="dtb:totalPageCount" content="0"/>
+    <meta name="dtb:maxPageNumber" content="0"/>
+  </head>
+  <docTitle>
+    <text>${bookTitle}</text>
+  </docTitle>
+  <navMap>
+    ${pages
+      .map(
+        (_, index) =>
+          `<navPoint id="navpoint-${index + 1}" playOrder="${index + 1}">
+        <navLabel>
+          <text>Page ${index + 1}</text>
+        </navLabel>
+        <content src="chapter${index + 1}.xhtml"/>
+      </navPoint>`
+      )
+      .join('\n    ')}
+  </navMap>
+</ncx>`;
+
+  oebps!.file('toc.ncx', tocNcx);
+
+  pages.forEach((pageText, index) => {
+    const formattedBody = formatTextToParagraphs(pageText);
+
+    const chapterXhtml = `<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+  <title>Page ${index + 1}</title>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <style>
+    body {
+      font-family: serif;
+      line-height: 1.6;
+      margin: 1em;
+    }
+    p {
+      margin-bottom: 1em;
+      text-align: justify;
+    }
+  </style>
+</head>
+<body>
+  <h1>Page ${index + 1}</h1>
+  ${formattedBody}
+</body>
+</html>`;
+
+    oebps!.file(`chapter${index + 1}.xhtml`, chapterXhtml);
+  });
+
+  const epubBuffer = await zip.generateAsync({ type: 'arraybuffer' });
+
+  return new File([epubBuffer], pdfFile.name.replace(/\.pdf$/i, '.epub'), {
+    type: 'application/epub+zip'
+  });
+}

src/pages/tools/string/base64/base64.service.test.ts

@@ -0,0 +1,64 @@
+import { expect, describe, it } from 'vitest';
+import { base64 } from './service';
+
+describe('base64', () => {
+  it('should encode a simple string using Base64 correctly', () => {
+    const input = 'hello';
+    const result = base64(input, true);
+    expect(result).toBe('aGVsbG8=');
+  });
+
+  it('should decode a simple Base64-encoded string correctly', () => {
+    const input = 'aGVsbG8=';
+    const result = base64(input, false);
+    expect(result).toBe('hello');
+  });
+
+  it('should handle special characters encoding correctly', () => {
+    const input = 'Hello, World!';
+    const result = base64(input, true);
+    expect(result).toBe('SGVsbG8sIFdvcmxkIQ==');
+  });
+
+  it('should handle special characters decoding correctly', () => {
+    const input = 'SGVsbG8sIFdvcmxkIQ==';
+    const result = base64(input, false);
+    expect(result).toBe('Hello, World!');
+  });
+
+  it('should handle an empty string encoding correctly', () => {
+    const input = '';
+    const result = base64(input, true);
+    expect(result).toBe('');
+  });
+
+  it('should handle an empty string decoding correctly', () => {
+    const input = '';
+    const result = base64(input, false);
+    expect(result).toBe('');
+  });
+
+  it('should handle a newline encoding correctly', () => {
+    const input = '\n';
+    const result = base64(input, true);
+    expect(result).toBe('Cg==');
+  });
+
+  it('should handle a newline decoding correctly', () => {
+    const input = 'Cg==';
+    const result = base64(input, false);
+    expect(result).toBe('\n');
+  });
+
+  it('should handle a string with symbols encoding correctly', () => {
+    const input = '!@#$%^&*()_+-=';
+    const result = base64(input, true);
+    expect(result).toBe('IUAjJCVeJiooKV8rLT0=');
+  });
+
+  it('should handle a string with mixed characters decoding correctly', () => {
+    const input = 'IUAjJCVeJiooKV8rLT0=';
+    const result = base64(input, false);
+    expect(result).toBe('!@#$%^&*()_+-=');
+  });
+});

src/pages/tools/string/base64/index.tsx

@@ -0,0 +1,86 @@
+import { useState } from 'react';
+import ToolContent from '@components/ToolContent';
+import ToolTextInput from '@components/input/ToolTextInput';
+import ToolTextResult from '@components/result/ToolTextResult';
+import { base64 } from './service';
+import { CardExampleType } from '@components/examples/ToolExamples';
+import { ToolComponentProps } from '@tools/defineTool';
+import { GetGroupsType } from '@components/options/ToolOptions';
+import { Box } from '@mui/material';
+import SimpleRadio from '@components/options/SimpleRadio';
+import { InitialValuesType } from './types';
+
+const initialValues: InitialValuesType = {
+  mode: 'encode'
+};
+
+const exampleCards: CardExampleType<InitialValuesType>[] = [
+  {
+    title: 'Encode data in UTF-8 with Base64',
+    description: 'This example shows how to encode a simple text using Base64.',
+    sampleText: 'Hello, World!',
+    sampleResult: 'SGVsbG8sIFdvcmxkIQ==',
+    sampleOptions: { mode: 'encode' }
+  },
+  {
+    title: 'Decode Base64-encoded data to UTF-8',
+    description:
+      'This example shows how to decode data that was encoded with Base64.',
+    sampleText: 'SGVsbG8sIFdvcmxkIQ==',
+    sampleResult: 'Hello, World!',
+    sampleOptions: { mode: 'decode' }
+  }
+];
+
+export default function Base64({ title }: ToolComponentProps) {
+  const [input, setInput] = useState<string>('');
+  const [result, setResult] = useState<string>('');
+
+  const compute = (optionsValues: InitialValuesType, input: string) => {
+    if (input) setResult(base64(input, optionsValues.mode === 'encode'));
+  };
+
+  const getGroups: GetGroupsType<InitialValuesType> = ({
+    values,
+    updateField
+  }) => [
+    {
+      title: 'Base64 Options',
+      component: (
+        <Box>
+          <SimpleRadio
+            onClick={() => updateField('mode', 'encode')}
+            checked={values.mode === 'encode'}
+            title={'Base64 Encode'}
+          />
+          <SimpleRadio
+            onClick={() => updateField('mode', 'decode')}
+            checked={values.mode === 'decode'}
+            title={'Base64 Decode'}
+          />
+        </Box>
+      )
+    }
+  ];
+
+  return (
+    <ToolContent
+      title={title}
+      inputComponent={
+        <ToolTextInput title="Input Data" value={input} onChange={setInput} />
+      }
+      resultComponent={<ToolTextResult title="Result" value={result} />}
+      initialValues={initialValues}
+      getGroups={getGroups}
+      toolInfo={{
+        title: 'What is Base64?',
+        description:
+          'Base64 is an encoding scheme that represents data in an ASCII string format by translating it into a radix-64 representation. Although it can be used to encode strings, it is commonly used to encode binary data for transmission over media that are designed to deal with textual data.'
+      }}
+      exampleCards={exampleCards}
+      input={input}
+      setInput={setInput}
+      compute={compute}
+    />
+  );
+}

src/pages/tools/string/base64/meta.ts

@@ -0,0 +1,13 @@
+import { defineTool } from '@tools/defineTool';
+import { lazy } from 'react';
+
+export const tool = defineTool('string', {
+  name: 'Base64',
+  path: 'base64',
+  icon: 'tabler:number-64-small',
+  description:
+    'A simple tool to encode or decode data using Base64, which is commonly used in web applications.',
+  shortDescription: 'Encode or decode data using Base64.',
+  keywords: ['base64'],
+  component: lazy(() => import('./index'))
+});

src/pages/tools/string/base64/service.ts

@@ -0,0 +1,7 @@
+import { Buffer } from 'buffer';
+
+export function base64(input: string, encode: boolean): string {
+  return encode
+    ? Buffer.from(input, 'utf-8').toString('base64')
+    : Buffer.from(input, 'base64').toString('utf-8');
+}

src/pages/tools/string/base64/types.ts

@@ -0,0 +1,3 @@
+export type InitialValuesType = {
+  mode: 'encode' | 'decode';
+};

src/pages/tools/string/index.ts

@@ -14,6 +14,7 @@ import { tool as stringJoin } from './join/meta';
 import { tool as stringReplace } from './text-replacer/meta';
 import { tool as stringRepeat } from './repeat/meta';
 import { tool as stringTruncate } from './truncate/meta';
+import { tool as stringBase64 } from './base64/meta';
 import { tool as stringStatistic } from './statistic/meta';
 
 export const stringTools = [
@@ -33,5 +34,6 @@ export const stringTools = [
   stringQuote,
   stringRotate,
   stringRot13,
+  stringBase64,
   stringStatistic
 ];