GitHub/jsoncrack.com
1
0
Fork 0
mirror of https://github.com/AykutSarac/jsoncrack.com.git synced 2025-01-12 19:02:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix page meta tags

Browse Source
This commit is contained in:
AykutSarac 2024-11-19 13:00:27 +03:00
parent 16fc954c8c
commit 40e13041f7
No known key found for this signature in database
2 changed files with 18 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/containers/ConverterLayout/ToolPage.tsx
View File

@ -23,6 +23,9 @@ export const ToolPage = ({ from, to }: ToolPageProps) => {
const [scrollPosition, setScrollPosition] = React.useState(0);
const [editorHeight, setEditorHeight] = React.useState(0);
const fromLabel = formats.find(({ value }) => value === from)?.label;
const toLabel = formats.find(({ value }) => value === to)?.label;
useEffect(() => {
if (!originalContent.length) return;
@ -50,20 +53,20 @@ export const ToolPage = ({ from, to }: ToolPageProps) => {
<Layout>
<NextSeo
{...SEO}
title={`${formats.find(({ value }) => value === from)?.label} to ${formats.find(({ value }) => value === to)?.label} | ToDiagram`}
canonical={`https://todiagram.com/converter/${from}-to-${to}`}
title={`${fromLabel} to ${toLabel} | JSON Crack`}
canonical={`https://jsoncrack.com/converter/${from}-to-${to}`}
description={`Convert ${fromLabel} to ${toLabel} using this free online tool. Upload your ${fromLabel} file and get the converted ${fromLabel} file instantly.`}
/>
<Container mt="xl" size="lg">
<Title c="black">
{formats.find(({ value }) => value === from)?.label} to{" "}
{formats.find(({ value }) => value === to)?.label} Converter
{fromLabel} to {toLabel} Converter
</Title>
<PageLinks />
<Flex pt="lg" gap="40">
<Paper mah="600px" withBorder flex="1" style={{ overflow: "hidden" }}>
<Box p="xs" bg="gray">
<Flex justify="space-between" align="center">
<Text c="gray.3">{formats.find(({ value }) => value === from)?.label}</Text>
<Text c="gray.3">{fromLabel}</Text>
{contentHasError && !!originalContent ? (
<LuXCircle color="red" />
) : (
@ -90,7 +93,7 @@ export const ToolPage = ({ from, to }: ToolPageProps) => {
</Paper>
<Paper mah="600px" withBorder flex="1" style={{ overflow: "hidden" }}>
<Box p="xs" bg="gray">
<Text c="gray.3">{formats.find(({ value }) => value === to)?.label}</Text>
<Text c="gray.3">{toLabel}</Text>
</Box>
<Editor
value={convertedContent}

15
src/containers/TypeLayout/TypegenWrapper.tsx
View File

@ -21,6 +21,9 @@ export const TypegenWrapper = ({ from, to }: ConverterPagesProps) => {
const [originalContent, setOriginalContent] = React.useState("");
const [convertedContent, setConvertedContent] = React.useState("");
const fromLabel = formats.find(({ value }) => value === from)?.label;
const toLabel = typeOptions.find(({ value }) => value === to)?.label;
useEffect(() => {
if (!originalContent.length) return;
@ -40,20 +43,20 @@ export const TypegenWrapper = ({ from, to }: ConverterPagesProps) => {
<Layout>
<NextSeo
{...SEO}
title={`${formats.find(({ value }) => value === from)?.label} to ${typeOptions.find(({ value }) => value === to)?.label} | ToDiagram`}
canonical={`https://todiagram.com/converter/${from}-to-${to}`}
title={`${fromLabel} to ${toLabel} | JSON Crack`}
canonical={`https://jsoncrack.com/converter/${from}-to-${to}`}
description={`Instantly generate ${toLabel} from ${fromLabel} using this free online tool. Paste your ${fromLabel} and get the generated ${toLabel} instantly.`}
/>
<Container mt="xl" size="lg">
<Title c="black">
{formats.find(({ value }) => value === from)?.label} to{" "}
{typeOptions.find(({ value }) => value === to)?.label} Converter
{fromLabel} to {toLabel} Converter
</Title>
<PageLinks />
<Flex pt="lg" gap="40">
<Paper mah="600px" withBorder flex="1" style={{ overflow: "hidden" }}>
<Box p="xs" bg="gray">
<Flex justify="space-between" align="center">
<Text c="gray.3">{formats.find(({ value }) => value === from)?.label}</Text>
<Text c="gray.3">{fromLabel}</Text>
{contentHasError && !!originalContent ? (
<LuXCircle color="red" />
) : (
@ -71,7 +74,7 @@ export const TypegenWrapper = ({ from, to }: ConverterPagesProps) => {
</Paper>
<Paper mah="600px" withBorder flex="1" style={{ overflow: "hidden" }}>
<Box p="xs" bg="gray">
<Text c="gray.3">{typeOptions.find(({ value }) => value === to)?.label}</Text>
<Text c="gray.3">{toLabel}</Text>
</Box>
<Editor
value={convertedContent}