Skip to content

Commit 40e1304

Browse files
committed
fix page meta tags
1 parent 16fc954 commit 40e1304

File tree

2 files changed

+18
-12
lines changed

2 files changed

+18
-12
lines changed

src/containers/ConverterLayout/ToolPage.tsx

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,9 @@ export const ToolPage = ({ from, to }: ToolPageProps) => {
2323
const [scrollPosition, setScrollPosition] = React.useState(0);
2424
const [editorHeight, setEditorHeight] = React.useState(0);
2525

26+
const fromLabel = formats.find(({ value }) => value === from)?.label;
27+
const toLabel = formats.find(({ value }) => value === to)?.label;
28+
2629
useEffect(() => {
2730
if (!originalContent.length) return;
2831

@@ -50,20 +53,20 @@ export const ToolPage = ({ from, to }: ToolPageProps) => {
5053
<Layout>
5154
<NextSeo
5255
{...SEO}
53-
title={`${formats.find(({ value }) => value === from)?.label} to ${formats.find(({ value }) => value === to)?.label} | ToDiagram`}
54-
canonical={`https://todiagram.com/converter/${from}-to-${to}`}
56+
title={`${fromLabel} to ${toLabel} | JSON Crack`}
57+
canonical={`https://jsoncrack.com/converter/${from}-to-${to}`}
58+
description={`Convert ${fromLabel} to ${toLabel} using this free online tool. Upload your ${fromLabel} file and get the converted ${fromLabel} file instantly.`}
5559
/>
5660
<Container mt="xl" size="lg">
5761
<Title c="black">
58-
{formats.find(({ value }) => value === from)?.label} to{" "}
59-
{formats.find(({ value }) => value === to)?.label} Converter
62+
{fromLabel} to {toLabel} Converter
6063
</Title>
6164
<PageLinks />
6265
<Flex pt="lg" gap="40">
6366
<Paper mah="600px" withBorder flex="1" style={{ overflow: "hidden" }}>
6467
<Box p="xs" bg="gray">
6568
<Flex justify="space-between" align="center">
66-
<Text c="gray.3">{formats.find(({ value }) => value === from)?.label}</Text>
69+
<Text c="gray.3">{fromLabel}</Text>
6770
{contentHasError && !!originalContent ? (
6871
<LuXCircle color="red" />
6972
) : (
@@ -90,7 +93,7 @@ export const ToolPage = ({ from, to }: ToolPageProps) => {
9093
</Paper>
9194
<Paper mah="600px" withBorder flex="1" style={{ overflow: "hidden" }}>
9295
<Box p="xs" bg="gray">
93-
<Text c="gray.3">{formats.find(({ value }) => value === to)?.label}</Text>
96+
<Text c="gray.3">{toLabel}</Text>
9497
</Box>
9598
<Editor
9699
value={convertedContent}

src/containers/TypeLayout/TypegenWrapper.tsx

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,9 @@ export const TypegenWrapper = ({ from, to }: ConverterPagesProps) => {
2121
const [originalContent, setOriginalContent] = React.useState("");
2222
const [convertedContent, setConvertedContent] = React.useState("");
2323

24+
const fromLabel = formats.find(({ value }) => value === from)?.label;
25+
const toLabel = typeOptions.find(({ value }) => value === to)?.label;
26+
2427
useEffect(() => {
2528
if (!originalContent.length) return;
2629

@@ -40,20 +43,20 @@ export const TypegenWrapper = ({ from, to }: ConverterPagesProps) => {
4043
<Layout>
4144
<NextSeo
4245
{...SEO}
43-
title={`${formats.find(({ value }) => value === from)?.label} to ${typeOptions.find(({ value }) => value === to)?.label} | ToDiagram`}
44-
canonical={`https://todiagram.com/converter/${from}-to-${to}`}
46+
title={`${fromLabel} to ${toLabel} | JSON Crack`}
47+
canonical={`https://jsoncrack.com/converter/${from}-to-${to}`}
48+
description={`Instantly generate ${toLabel} from ${fromLabel} using this free online tool. Paste your ${fromLabel} and get the generated ${toLabel} instantly.`}
4549
/>
4650
<Container mt="xl" size="lg">
4751
<Title c="black">
48-
{formats.find(({ value }) => value === from)?.label} to{" "}
49-
{typeOptions.find(({ value }) => value === to)?.label} Converter
52+
{fromLabel} to {toLabel} Converter
5053
</Title>
5154
<PageLinks />
5255
<Flex pt="lg" gap="40">
5356
<Paper mah="600px" withBorder flex="1" style={{ overflow: "hidden" }}>
5457
<Box p="xs" bg="gray">
5558
<Flex justify="space-between" align="center">
56-
<Text c="gray.3">{formats.find(({ value }) => value === from)?.label}</Text>
59+
<Text c="gray.3">{fromLabel}</Text>
5760
{contentHasError && !!originalContent ? (
5861
<LuXCircle color="red" />
5962
) : (
@@ -71,7 +74,7 @@ export const TypegenWrapper = ({ from, to }: ConverterPagesProps) => {
7174
</Paper>
7275
<Paper mah="600px" withBorder flex="1" style={{ overflow: "hidden" }}>
7376
<Box p="xs" bg="gray">
74-
<Text c="gray.3">{typeOptions.find(({ value }) => value === to)?.label}</Text>
77+
<Text c="gray.3">{toLabel}</Text>
7578
</Box>
7679
<Editor
7780
value={convertedContent}

0 commit comments

Comments
 (0)