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

feat: replace text inputs with code editor in JSON tools

Browse Source
This commit is contained in:
Bhavesh Kshatriya
2025-07-19 18:56:49 +05:30
parent fc18dc0dc0
commit 4cec13da63
7 changed files with 33 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/pages/tools/json/escape-json/index.tsx
View File

@@ -1,6 +1,6 @@
import React, { useState } from 'react';
import ToolContent from '@components/ToolContent';
import ToolTextInput from '@components/input/ToolTextInput';
import ToolCodeInput from '@components/input/ToolCodeInput';
import ToolTextResult from '@components/result/ToolTextResult';
import { escapeJson } from './service';
import { CardExampleType } from '@components/examples/ToolExamples';
@@ -88,7 +88,12 @@ export default function EscapeJsonTool({
<ToolContent
title={title}
inputComponent={
<ToolTextInput title="Input JSON" value={input} onChange={setInput} />
<ToolCodeInput
title="Input JSON"
value={input}
onChange={setInput}
language="json"
/>
}
resultComponent={
<ToolTextResult

9
src/pages/tools/json/json-to-xml/index.tsx
View File

@@ -1,6 +1,6 @@
import { useState } from 'react';
import ToolContent from '@components/ToolContent';
import ToolTextInput from '@components/input/ToolTextInput';
import ToolCodeInput from '@components/input/ToolCodeInput';
import ToolTextResult from '@components/result/ToolTextResult';
import { convertJsonToXml } from './service';
import { CardExampleType } from '@components/examples/ToolExamples';
@@ -84,7 +84,12 @@ export default function JsonToXml({ title }: ToolComponentProps) {
compute={compute}
exampleCards={exampleCards}
inputComponent={
<ToolTextInput title="Input Json" value={input} onChange={setInput} />
<ToolCodeInput
title="Input Json"
value={input}
onChange={setInput}
language="json"
/>
}
resultComponent={
<ToolTextResult title="Output XML" value={result} extension={'xml'} />

5
src/pages/tools/json/minify/index.tsx
View File

@@ -1,6 +1,6 @@
import React, { useState } from 'react';
import ToolContent from '@components/ToolContent';
import ToolTextInput from '@components/input/ToolTextInput';
import ToolCodeInput from '@components/input/ToolCodeInput';
import ToolTextResult from '@components/result/ToolTextResult';
import { minifyJson } from './service';
import { CardExampleType } from '@components/examples/ToolExamples';
@@ -60,10 +60,11 @@ export default function MinifyJson({ title }: ToolComponentProps) {
<ToolContent
title={title}
inputComponent={
<ToolTextInput
<ToolCodeInput
title={t('minify.inputTitle')}
value={input}
onChange={setInput}
language="json"
/>
}
resultComponent={

5
src/pages/tools/json/prettify/index.tsx
View File

@@ -1,6 +1,6 @@
import { Box } from '@mui/material';
import React, { useRef, useState } from 'react';
import ToolTextInput from '@components/input/ToolTextInput';
import ToolCodeInput from '@components/input/ToolCodeInput';
import ToolTextResult from '@components/result/ToolTextResult';
import { beautifyJson } from './service';
import ToolInfo from '@components/ToolInfo';
@@ -130,10 +130,11 @@ export default function PrettifyJson({ title }: ToolComponentProps) {
title={title}
input={input}
inputComponent={
<ToolTextInput
<ToolCodeInput
title={t('prettify.inputTitle')}
value={input}
onChange={setInput}
language="json"
/>
}
resultComponent={

5
src/pages/tools/json/stringify/index.tsx
View File

@@ -1,7 +1,7 @@
import { Box } from '@mui/material';
import React, { useState } from 'react';
import ToolContent from '@components/ToolContent';
import ToolTextInput from '@components/input/ToolTextInput';
import ToolCodeInput from '@components/input/ToolCodeInput';
import ToolTextResult from '@components/result/ToolTextResult';
import { stringifyJson } from './service';
import { ToolComponentProps } from '@tools/defineTool';
@@ -103,10 +103,11 @@ export default function StringifyJson({ title }: ToolComponentProps) {
compute={compute}
exampleCards={exampleCards}
inputComponent={
<ToolTextInput
<ToolCodeInput
title="JavaScript Object/Array"
value={input}
onChange={setInput}
language="json"
/>
}
resultComponent={

9
src/pages/tools/json/tsv-to-json/index.tsx
View File

@@ -1,6 +1,6 @@
import React, { useState } from 'react';
import ToolContent from '@components/ToolContent';
import ToolTextInput from '@components/input/ToolTextInput';
import ToolCodeInput from '@components/input/ToolCodeInput';
import ToolTextResult from '@components/result/ToolTextResult';
import { convertTsvToJson } from './service';
import { CardExampleType } from '@components/examples/ToolExamples';
@@ -216,7 +216,12 @@ export default function TsvToJson({
exampleCards={exampleCards}
getGroups={getGroups}
inputComponent={
<ToolTextInput title="Input TSV" value={input} onChange={setInput} />
<ToolCodeInput
title="Input TSV"
value={input}
onChange={setInput}
language="tsv"
/>
}
resultComponent={
<ToolTextResult title="Output JSON" value={result} extension={'json'} />

5
src/pages/tools/json/validateJson/index.tsx
View File

@@ -1,5 +1,5 @@
import React, { useState } from 'react';
import ToolTextInput from '@components/input/ToolTextInput';
import ToolCodeInput from '@components/input/ToolCodeInput';
import ToolTextResult from '@components/result/ToolTextResult';
import { CardExampleType } from '@components/examples/ToolExamples';
import { validateJson } from './service';
@@ -65,10 +65,11 @@ export default function ValidateJson({ title }: ToolComponentProps) {
<ToolContent
title={title}
inputComponent={
<ToolTextInput
<ToolCodeInput
title={t('validateJson.inputTitle')}
value={input}
onChange={setInput}
language="json"
/>
}
resultComponent={