marcel/omni-tools
1
0
Fork 0
mirror of https://github.com/iib0011/omni-tools.git synced 2025-09-22 07:29:39 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor: use ToolContent

Browse Source
This commit is contained in:
Ibrahima G. Coulibaly
2025-03-09 01:50:09 +00:00
parent b372692971
commit 0499673a03
6 changed files with 136 additions and 159 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/pages/tools/string/randomize-case/index.tsx
View File

@@ -1,15 +1,10 @@
import { Box } from '@mui/material';
import React, { useState, useRef } from 'react';
import React, { useState } from 'react';
import ToolTextInput from '@components/input/ToolTextInput';
import ToolTextResult from '@components/result/ToolTextResult';
import ToolOptions from '@components/options/ToolOptions';
import { randomizeCase } from './service';
import ToolInputAndResult from '@components/ToolInputAndResult';
import ToolExamples, {
CardExampleType
} from '@components/examples/ToolExamples';
import { CardExampleType } from '@components/examples/ToolExamples';
import { ToolComponentProps } from '@tools/defineTool';
import { FormikProps } from 'formik';
import ToolContent from '@components/ToolContent';
const initialValues = {};
@@ -45,7 +40,6 @@ const exampleCards: CardExampleType<typeof initialValues>[] = [
export default function RandomizeCase({ title }: ToolComponentProps) {
const [input, setInput] = useState<string>('');
const [result, setResult] = useState<string>('');
const formRef = useRef<FormikProps<typeof initialValues>>(null);
const computeExternal = (
_optionsValues: typeof initialValues,
@@ -54,27 +48,19 @@ export default function RandomizeCase({ title }: ToolComponentProps) {
setResult(randomizeCase(input));
};
const getGroups = () => [];
return (
<Box>
<ToolInputAndResult
input={<ToolTextInput value={input} onChange={setInput} />}
result={<ToolTextResult title={'Randomized text'} value={result} />}
/>
<ToolOptions
compute={computeExternal}
getGroups={getGroups}
initialValues={initialValues}
input={input}
/>
<ToolExamples
title={title}
exampleCards={exampleCards}
getGroups={getGroups}
formRef={formRef}
setInput={setInput}
/>
</Box>
<ToolContent
title={title}
initialValues={initialValues}
getGroups={null}
compute={computeExternal}
input={input}
setInput={setInput}
inputComponent={<ToolTextInput value={input} onChange={setInput} />}
resultComponent={
<ToolTextResult title={'Randomized text'} value={result} />
}
exampleCards={exampleCards}
/>
);
}

34
src/pages/tools/string/reverse/index.tsx
View File

@@ -11,6 +11,7 @@ import ToolExamples, {
} from '@components/examples/ToolExamples';
import { ToolComponentProps } from '@tools/defineTool';
import { FormikProps } from 'formik';
import ToolContent from '@components/ToolContent';
const initialValues = {
multiLine: true,
@@ -59,7 +60,6 @@ const exampleCards: CardExampleType<typeof initialValues>[] = [
export default function Reverse({ title }: ToolComponentProps) {
const [input, setInput] = useState<string>('');
const [result, setResult] = useState<string>('');
const formRef = useRef<FormikProps<typeof initialValues>>(null);
const computeExternal = (
optionsValues: typeof initialValues,
@@ -102,24 +102,18 @@ export default function Reverse({ title }: ToolComponentProps) {
];
return (
<Box>
<ToolInputAndResult
input={<ToolTextInput value={input} onChange={setInput} />}
result={<ToolTextResult title={'Reversed text'} value={result} />}
/>
<ToolOptions
compute={computeExternal}
getGroups={getGroups}
initialValues={initialValues}
input={input}
/>
<ToolExamples
title={title}
exampleCards={exampleCards}
getGroups={getGroups}
formRef={formRef}
setInput={setInput}
/>
</Box>
<ToolContent
title={title}
initialValues={initialValues}
getGroups={getGroups}
compute={computeExternal}
input={input}
setInput={setInput}
inputComponent={<ToolTextInput value={input} onChange={setInput} />}
resultComponent={
<ToolTextResult title={'Reversed text'} value={result} />
}
exampleCards={exampleCards}
/>
);
}

46
src/pages/tools/string/uppercase/index.tsx
View File

@@ -1,15 +1,10 @@
import { Box } from '@mui/material';
import React, { useState, useRef } from 'react';
import React, { useState } from 'react';
import ToolTextInput from '@components/input/ToolTextInput';
import ToolTextResult from '@components/result/ToolTextResult';
import ToolOptions from '@components/options/ToolOptions';
import { UppercaseInput } from './service';
import ToolInputAndResult from '@components/ToolInputAndResult';
import ToolExamples, {
CardExampleType
} from '@components/examples/ToolExamples';
import { CardExampleType } from '@components/examples/ToolExamples';
import { ToolComponentProps } from '@tools/defineTool';
import { FormikProps } from 'formik';
import ToolContent from '@components/ToolContent';
const initialValues = {};
@@ -42,7 +37,6 @@ const exampleCards: CardExampleType<typeof initialValues>[] = [
export default function Uppercase({ title }: ToolComponentProps) {
const [input, setInput] = useState<string>('');
const [result, setResult] = useState<string>('');
const formRef = useRef<FormikProps<typeof initialValues>>(null);
const computeExternal = (
_optionsValues: typeof initialValues,
@@ -51,27 +45,19 @@ export default function Uppercase({ title }: ToolComponentProps) {
setResult(UppercaseInput(input));
};
const getGroups = () => [];
return (
<Box>
<ToolInputAndResult
input={<ToolTextInput value={input} onChange={setInput} />}
result={<ToolTextResult title={'Uppercase text'} value={result} />}
/>
<ToolOptions
compute={computeExternal}
getGroups={getGroups}
initialValues={initialValues}
input={input}
/>
<ToolExamples
title={title}
exampleCards={exampleCards}
getGroups={getGroups}
formRef={formRef}
setInput={setInput}
/>
</Box>
<ToolContent
title={title}
initialValues={initialValues}
getGroups={null}
compute={computeExternal}
input={input}
setInput={setInput}
inputComponent={<ToolTextInput value={input} onChange={setInput} />}
resultComponent={
<ToolTextResult title={'Uppercase text'} value={result} />
}
exampleCards={exampleCards}
/>
);
}