mirror of
https://github.com/iib0011/omni-tools.git
synced 2025-09-25 08:59:31 +02:00
Merge branch 'tools-filtering' of https://github.com/AshAnand34/omni-tools into tools-filtering
This commit is contained in:
@@ -18,6 +18,8 @@ import { tool as stringBase64 } from './base64/meta';
|
||||
import { tool as stringStatistic } from './statistic/meta';
|
||||
import { tool as stringCensor } from './censor/meta';
|
||||
import { tool as stringPasswordGenerator } from './password-generator/meta';
|
||||
import { tool as stringEncodeUrl } from './url-encode/meta';
|
||||
import { tool as StringDecodeUrl } from './url-decode/meta';
|
||||
|
||||
export const stringTools = [
|
||||
stringSplit,
|
||||
@@ -39,5 +41,7 @@ export const stringTools = [
|
||||
stringBase64,
|
||||
stringStatistic,
|
||||
stringCensor,
|
||||
stringPasswordGenerator
|
||||
stringPasswordGenerator,
|
||||
stringEncodeUrl,
|
||||
StringDecodeUrl
|
||||
];
|
||||
|
69
src/pages/tools/string/url-decode/index.tsx
Normal file
69
src/pages/tools/string/url-decode/index.tsx
Normal file
@@ -0,0 +1,69 @@
|
||||
import { useState } from 'react';
|
||||
import ToolTextResult from '@components/result/ToolTextResult';
|
||||
import { decodeString } from './service';
|
||||
import ToolTextInput from '@components/input/ToolTextInput';
|
||||
import ToolContent from '@components/ToolContent';
|
||||
import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues = {};
|
||||
|
||||
const exampleCards: CardExampleType<typeof initialValues>[] = [
|
||||
{
|
||||
title: 'Decode an actual URL',
|
||||
description:
|
||||
'This example decodes a URL-encoded string back to its readable URL form.',
|
||||
sampleText: 'https%3A%2F%2Fomnitools.app%2F',
|
||||
sampleResult: 'https://omnitools.app/',
|
||||
sampleOptions: initialValues
|
||||
},
|
||||
{
|
||||
title: 'Decode All Characters',
|
||||
description:
|
||||
'This example decodes a string where every character has been URL-encoded, restoring the original readable text.',
|
||||
sampleText:
|
||||
'%49%20%63%61%6E%27%74%20%62%65%6C%69%65%76%65%20%69%74%27%73%20%6E%6F%74%20%62%75%74%74%65%72%21',
|
||||
sampleResult: "I can't believe it's not butter!",
|
||||
sampleOptions: initialValues
|
||||
}
|
||||
];
|
||||
|
||||
export default function DecodeString({
|
||||
title,
|
||||
longDescription
|
||||
}: ToolComponentProps) {
|
||||
const { t } = useTranslation('string');
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
function compute(_initialValues: typeof initialValues, input: string) {
|
||||
setResult(decodeString(input));
|
||||
}
|
||||
|
||||
return (
|
||||
<ToolContent
|
||||
title={title}
|
||||
initialValues={initialValues}
|
||||
getGroups={null}
|
||||
compute={compute}
|
||||
input={input}
|
||||
setInput={setInput}
|
||||
inputComponent={
|
||||
<ToolTextInput
|
||||
title={t('urlDecode.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={t('urlDecode.resultTitle')} value={result} />
|
||||
}
|
||||
toolInfo={{
|
||||
title: t('urlDecode.toolInfo.title', { title }),
|
||||
description: longDescription
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
/>
|
||||
);
|
||||
}
|
16
src/pages/tools/string/url-decode/meta.ts
Normal file
16
src/pages/tools/string/url-decode/meta.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
import { defineTool } from '@tools/defineTool';
|
||||
import { lazy } from 'react';
|
||||
|
||||
export const tool = defineTool('string', {
|
||||
path: 'url-decode-string',
|
||||
icon: 'codicon:symbol-string',
|
||||
|
||||
keywords: ['uppercase'],
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string:urlDecode.toolInfo.title',
|
||||
description: 'string:urlDecode.toolInfo.description',
|
||||
shortDescription: 'string:urlDecode.toolInfo.shortDescription',
|
||||
longDescription: 'string:urlDecode.toolInfo.longDescription'
|
||||
}
|
||||
});
|
4
src/pages/tools/string/url-decode/service.ts
Normal file
4
src/pages/tools/string/url-decode/service.ts
Normal file
@@ -0,0 +1,4 @@
|
||||
export function decodeString(input: string): string {
|
||||
if (!input) return '';
|
||||
return decodeURIComponent(input);
|
||||
}
|
98
src/pages/tools/string/url-encode/index.tsx
Normal file
98
src/pages/tools/string/url-encode/index.tsx
Normal file
@@ -0,0 +1,98 @@
|
||||
import { Box } from '@mui/material';
|
||||
import { useState } from 'react';
|
||||
import ToolTextResult from '@components/result/ToolTextResult';
|
||||
import { GetGroupsType } from '@components/options/ToolOptions';
|
||||
import { encodeString } from './service';
|
||||
import ToolTextInput from '@components/input/ToolTextInput';
|
||||
import { InitialValuesType } from './types';
|
||||
import ToolContent from '@components/ToolContent';
|
||||
import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import CheckboxWithDesc from '@components/options/CheckboxWithDesc';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues: InitialValuesType = {
|
||||
nonSpecialChar: false
|
||||
};
|
||||
|
||||
const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
{
|
||||
title: 'Encode an actual URL',
|
||||
description:
|
||||
'This example URL-encodes a string that also happens to be a valid web link. Special characters in this example are a colon, slash, question mark and equals sign.',
|
||||
sampleText: 'https://omnitools.app/',
|
||||
sampleResult: 'https%3A%2F%2Fomnitools.app%2F',
|
||||
sampleOptions: initialValues
|
||||
},
|
||||
{
|
||||
title: 'Encode All Characters',
|
||||
description:
|
||||
"In this example, we've enabled the option that encodes absolutely all characters in a string to URL-encoding. This option makes non-special characters, such as letters get encoded to their hex codes prefixed by a percent sign.",
|
||||
sampleText: "I can't believe it's not butter!",
|
||||
sampleResult:
|
||||
'%49%20%63%61%6E%27%74%20%62%65%6C%69%65%76%65%20%69%74%27%73%20%6E%6F%74%20%62%75%74%74%65%72%21',
|
||||
sampleOptions: {
|
||||
nonSpecialChar: true
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
export default function EncodeString({
|
||||
title,
|
||||
longDescription
|
||||
}: ToolComponentProps) {
|
||||
const { t } = useTranslation('string');
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
function compute(initialValues: InitialValuesType, input: string) {
|
||||
setResult(encodeString(input, initialValues));
|
||||
}
|
||||
|
||||
const getGroups: GetGroupsType<InitialValuesType> = ({
|
||||
values,
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: t('urlEncode.encodingOption.title'),
|
||||
component: (
|
||||
<Box>
|
||||
<CheckboxWithDesc
|
||||
checked={values.nonSpecialChar}
|
||||
onChange={(value) => updateField('nonSpecialChar', value)}
|
||||
title={t('urlEncode.encodingOption.nonSpecialCharPlaceholder')}
|
||||
description={t(
|
||||
'urlEncode.encodingOption.nonSpecialCharDescription'
|
||||
)}
|
||||
/>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<ToolContent
|
||||
title={title}
|
||||
initialValues={initialValues}
|
||||
getGroups={getGroups}
|
||||
compute={compute}
|
||||
input={input}
|
||||
setInput={setInput}
|
||||
inputComponent={
|
||||
<ToolTextInput
|
||||
title={t('urlEncode.inputTitle')}
|
||||
value={input}
|
||||
onChange={setInput}
|
||||
/>
|
||||
}
|
||||
resultComponent={
|
||||
<ToolTextResult title={t('urlEncode.resultTitle')} value={result} />
|
||||
}
|
||||
toolInfo={{
|
||||
title: t('urlEncode.toolInfo.title', { title }),
|
||||
description: longDescription
|
||||
}}
|
||||
exampleCards={exampleCards}
|
||||
/>
|
||||
);
|
||||
}
|
16
src/pages/tools/string/url-encode/meta.ts
Normal file
16
src/pages/tools/string/url-encode/meta.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
import { defineTool } from '@tools/defineTool';
|
||||
import { lazy } from 'react';
|
||||
|
||||
export const tool = defineTool('string', {
|
||||
path: 'url-encode-string',
|
||||
icon: 'ic:baseline-percentage',
|
||||
|
||||
keywords: ['uppercase'],
|
||||
component: lazy(() => import('./index')),
|
||||
i18n: {
|
||||
name: 'string:urlEncode.toolInfo.title',
|
||||
description: 'string:urlEncode.toolInfo.description',
|
||||
shortDescription: 'string:urlEncode.toolInfo.shortDescription',
|
||||
longDescription: 'string:urlEncode.toolInfo.longDescription'
|
||||
}
|
||||
});
|
18
src/pages/tools/string/url-encode/service.ts
Normal file
18
src/pages/tools/string/url-encode/service.ts
Normal file
@@ -0,0 +1,18 @@
|
||||
import { InitialValuesType } from './types';
|
||||
|
||||
export function encodeString(
|
||||
input: string,
|
||||
options: InitialValuesType
|
||||
): string {
|
||||
if (!input) return '';
|
||||
if (!options.nonSpecialChar) {
|
||||
return encodeURIComponent(input);
|
||||
}
|
||||
|
||||
let result = '';
|
||||
for (const char of input) {
|
||||
const hex = char.codePointAt(0)!.toString(16).toUpperCase();
|
||||
result += '%' + hex.padStart(2, '0');
|
||||
}
|
||||
return result;
|
||||
}
|
3
src/pages/tools/string/url-encode/types.ts
Normal file
3
src/pages/tools/string/url-encode/types.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
export type InitialValuesType = {
|
||||
nonSpecialChar: boolean;
|
||||
};
|
@@ -0,0 +1,56 @@
|
||||
import { expect, describe, it } from 'vitest';
|
||||
import { convertUnixToDate } from './service';
|
||||
|
||||
describe('convertUnixToDate', () => {
|
||||
it('should convert a single Unix timestamp with label (UTC)', () => {
|
||||
const input = '0';
|
||||
const result = convertUnixToDate(input, true, false);
|
||||
expect(result).toBe('1970-01-01 00:00:00.000 UTC');
|
||||
});
|
||||
|
||||
it('should convert a single Unix timestamp without label (UTC)', () => {
|
||||
const input = '1234567890';
|
||||
const result = convertUnixToDate(input, false, false);
|
||||
expect(result).toBe('2009-02-13 23:31:30.000');
|
||||
});
|
||||
|
||||
it('should convert a single Unix timestamp in local time', () => {
|
||||
const input = '1234567890';
|
||||
const result = convertUnixToDate(input, true, true);
|
||||
expect(result.endsWith('UTC')).toBe(false);
|
||||
});
|
||||
|
||||
it('should handle multiple lines with label (UTC)', () => {
|
||||
const input = '0\n2147483647';
|
||||
const result = convertUnixToDate(input, true, false);
|
||||
expect(result).toBe(
|
||||
'1970-01-01 00:00:00.000 UTC\n2038-01-19 03:14:07.000 UTC'
|
||||
);
|
||||
});
|
||||
|
||||
it('should handle multiple lines with local time', () => {
|
||||
const input = '1672531199\n1721287227';
|
||||
const result = convertUnixToDate(input, false, true);
|
||||
const lines = result.split('\n');
|
||||
expect(lines.length).toBe(2);
|
||||
expect(lines[0].endsWith('UTC')).toBe(false);
|
||||
});
|
||||
|
||||
it('should return empty string for invalid input', () => {
|
||||
const input = 'not_a_number';
|
||||
const result = convertUnixToDate(input, true, false);
|
||||
expect(result).toBe('');
|
||||
});
|
||||
|
||||
it('should return empty string for empty input', () => {
|
||||
const input = '';
|
||||
const result = convertUnixToDate(input, false, false);
|
||||
expect(result).toBe('');
|
||||
});
|
||||
|
||||
it('should ignore invalid lines in multiline input', () => {
|
||||
const input = 'abc\n1600000000';
|
||||
const result = convertUnixToDate(input, true, false);
|
||||
expect(result).toBe('\n2020-09-13 12:26:40.000 UTC');
|
||||
});
|
||||
});
|
102
src/pages/tools/time/convert-unix-to-date/index.tsx
Normal file
102
src/pages/tools/time/convert-unix-to-date/index.tsx
Normal file
@@ -0,0 +1,102 @@
|
||||
import { Box } from '@mui/material';
|
||||
import { useState } from 'react';
|
||||
import ToolContent from '@components/ToolContent';
|
||||
import { ToolComponentProps } from '@tools/defineTool';
|
||||
import ToolTextInput from '@components/input/ToolTextInput';
|
||||
import ToolTextResult from '@components/result/ToolTextResult';
|
||||
import { GetGroupsType } from '@components/options/ToolOptions';
|
||||
import { CardExampleType } from '@components/examples/ToolExamples';
|
||||
import CheckboxWithDesc from '@components/options/CheckboxWithDesc';
|
||||
import { convertUnixToDate } from './service';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const initialValues = {
|
||||
withLabel: true,
|
||||
useLocalTime: false
|
||||
};
|
||||
type InitialValuesType = typeof initialValues;
|
||||
|
||||
const exampleCards: CardExampleType<InitialValuesType>[] = [
|
||||
{
|
||||
title: 'Basic Unix Time to Date',
|
||||
description:
|
||||
'This example shows how Unix timestamps are converted into human-readable dates. Each timestamp represents the number of seconds that have elapsed since January 1, 1970 (UTC).',
|
||||
sampleText: `0
|
||||
1721287227
|
||||
2147483647`,
|
||||
sampleResult: `1970-01-01 00:00:00:000 UTC
|
||||
2024-07-18 10:00:27:000 UTC
|
||||
2038-01-19 03:14:07:000 UTC`,
|
||||
sampleOptions: { withLabel: true, useLocalTime: false }
|
||||
},
|
||||
{
|
||||
title: 'Without UTC Suffix',
|
||||
description:
|
||||
'In this example, the UTC suffix is removed from the output. This might be useful for embedding timestamps into other formats or for cleaner display.',
|
||||
sampleText: `1234567890
|
||||
1672531199`,
|
||||
sampleResult: `2009-02-13 23:31:30
|
||||
2022-12-31 23:59:59:000`,
|
||||
sampleOptions: { withLabel: false, useLocalTime: false }
|
||||
},
|
||||
{
|
||||
title: 'Use Local Time',
|
||||
description:
|
||||
'This example demonstrates how timestamps are shown in your local timezone rather than UTC. The UTC suffix is omitted in this case.',
|
||||
sampleText: `1721287227`,
|
||||
sampleResult: `2024-07-18 12:00:27`,
|
||||
sampleOptions: { withLabel: true, useLocalTime: true }
|
||||
}
|
||||
];
|
||||
|
||||
export default function ConvertUnixToDate({ title }: ToolComponentProps) {
|
||||
const { t } = useTranslation('time');
|
||||
const [input, setInput] = useState<string>('');
|
||||
const [result, setResult] = useState<string>('');
|
||||
|
||||
const compute = (values: typeof initialValues, input: string) => {
|
||||
setResult(convertUnixToDate(input, values.withLabel, values.useLocalTime));
|
||||
};
|
||||
|
||||
const getGroups: GetGroupsType<InitialValuesType> | null = ({
|
||||
values,
|
||||
updateField
|
||||
}) => [
|
||||
{
|
||||
title: t('convertUnixToDate.withLabel'),
|
||||
component: (
|
||||
<Box>
|
||||
<CheckboxWithDesc
|
||||
onChange={(val) => updateField('withLabel', val)}
|
||||
checked={values.withLabel}
|
||||
title={t('convertUnixToDate.addUtcLabel')}
|
||||
description={t('convertUnixToDate.addUtcLabelDescription')}
|
||||
/>
|
||||
<CheckboxWithDesc
|
||||
onChange={(val) => updateField('useLocalTime', val)}
|
||||
checked={values.useLocalTime}
|
||||
title={t('convertUnixToDate.useLocalTime')}
|
||||
description={t('convertUnixToDate.useLocalTimeDescription')}
|
||||
/>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
];
|
||||
return (
|
||||
<ToolContent
|
||||
title={title}
|
||||
input={input}
|
||||
inputComponent={<ToolTextInput value={input} onChange={setInput} />}
|
||||
resultComponent={<ToolTextResult value={result} />}
|
||||
initialValues={initialValues}
|
||||
exampleCards={exampleCards}
|
||||
getGroups={getGroups}
|
||||
setInput={setInput}
|
||||
compute={compute}
|
||||
toolInfo={{
|
||||
title: t('convertUnixToDate.toolInfo.title'),
|
||||
description: t('convertUnixToDate.toolInfo.description')
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
15
src/pages/tools/time/convert-unix-to-date/meta.ts
Normal file
15
src/pages/tools/time/convert-unix-to-date/meta.ts
Normal file
@@ -0,0 +1,15 @@
|
||||
import { defineTool } from '@tools/defineTool';
|
||||
import { lazy } from 'react';
|
||||
|
||||
export const tool = defineTool('time', {
|
||||
i18n: {
|
||||
name: 'time:convertUnixToDate.title',
|
||||
description: 'time:convertUnixToDate.description',
|
||||
shortDescription: 'time:convertUnixToDate.shortDescription',
|
||||
longDescription: 'time:convertUnixToDate.longDescription'
|
||||
},
|
||||
path: 'convert-unix-to-date',
|
||||
icon: 'material-symbols:schedule',
|
||||
keywords: ['convert', 'unix', 'to', 'date'],
|
||||
component: lazy(() => import('./index'))
|
||||
});
|
42
src/pages/tools/time/convert-unix-to-date/service.ts
Normal file
42
src/pages/tools/time/convert-unix-to-date/service.ts
Normal file
@@ -0,0 +1,42 @@
|
||||
import { containsOnlyDigits } from '@utils/string';
|
||||
|
||||
function computeUnixToDate(input: string, useLocalTime: boolean): string {
|
||||
if (!containsOnlyDigits(input)) {
|
||||
return '';
|
||||
}
|
||||
const timestamp = parseInt(input, 10);
|
||||
const date = new Date(timestamp * 1000); // Convert from seconds to milliseconds
|
||||
|
||||
if (useLocalTime) {
|
||||
const year = date.getFullYear();
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(date.getDate()).padStart(2, '0');
|
||||
const hours = String(date.getHours()).padStart(2, '0');
|
||||
const minutes = String(date.getMinutes()).padStart(2, '0');
|
||||
const seconds = String(date.getSeconds()).padStart(2, '0');
|
||||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
||||
} else {
|
||||
return date.toISOString().replace('T', ' ').replace('Z', '');
|
||||
}
|
||||
}
|
||||
|
||||
export function convertUnixToDate(
|
||||
input: string,
|
||||
withLabel: boolean,
|
||||
useLocalTime: boolean
|
||||
): string {
|
||||
const result: string[] = [];
|
||||
|
||||
const lines = input.split('\n');
|
||||
|
||||
lines.forEach((line) => {
|
||||
const parts = line.split(' ');
|
||||
const timestamp = parts[0];
|
||||
const formattedDate = computeUnixToDate(timestamp, useLocalTime);
|
||||
|
||||
const label = !useLocalTime && withLabel ? ' UTC' : '';
|
||||
result.push(formattedDate ? `${formattedDate}${label}` : '');
|
||||
});
|
||||
|
||||
return result.join('\n');
|
||||
}
|
@@ -1,3 +1,4 @@
|
||||
import { tool as timeConvertUnixToDate } from './convert-unix-to-date/meta';
|
||||
import { tool as timeCrontabGuru } from './crontab-guru/meta';
|
||||
import { tool as timeBetweenDates } from './time-between-dates/meta';
|
||||
import { tool as daysDoHours } from './convert-days-to-hours/meta';
|
||||
@@ -15,5 +16,6 @@ export const timeTools = [
|
||||
truncateClockTime,
|
||||
timeBetweenDates,
|
||||
timeCrontabGuru,
|
||||
checkLeapYear
|
||||
checkLeapYear,
|
||||
timeConvertUnixToDate
|
||||
];
|
||||
|
Reference in New Issue
Block a user