Skip to content

Commit 3fa12d5

Browse files
committed
Properties Config Editor
1 parent c4c044c commit 3fa12d5

File tree

5 files changed

+143
-4
lines changed

5 files changed

+143
-4
lines changed

README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,10 @@ HelpChat ToolBox is a toolbox of useful tools for HelpChat's Minecraft plugins,
55

66
It currently includes the following features:
77
- [DeluxeChat to ChatChat Config Converter](https://toolbox.helpch.at/converters/chatchat/deluxechat)
8+
- [EssentialsChat to ChatChat Config Converter](https://toolbox.helpch.at/converters/chatchat/essentialschat)
9+
- [VentureChat to ChatChat Config Converter](https://toolbox.helpch.at/converters/chatchat/venturechat)
810
- [Yaml Config Validator](https://toolbox.helpch.at/validators/yaml)
11+
- [Properties Config Validator](https://toolbox.helpch.at/validators/properties)
912
### Usage
1013
HelpChat's ToolBox is hosted at [toolbox.helpch.at](https://toolbox.helpch.at/).
1114

converters/chatchat/essentialschat.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,6 @@ const ChatChatEssentialsChatConverter = new Converter<EssentialsChatTypes, { for
5656
}
5757

5858
if (essentialschatConfig.language.msgFormat) {
59-
console.log(MiniMessage(essentialschatConfig.language.msgFormat))
6059
chatchatSettingsConfig["sender-format"].parts.push(
6160
MiniMessage(essentialschatConfig.language.msgFormat)
6261
);

pages/_app.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,9 @@ function Toolbox({Component, pageProps}: AppProps) {
6868
<Link href={"/validators/yaml"}>
6969
<p css={tw`px-2 mx-1 ml-3 hover:cursor-pointer pb-1`}>Yaml</p>
7070
</Link>
71+
<Link href={"/validators/properties"}>
72+
<p css={tw`px-2 mx-1 ml-3 hover:cursor-pointer pb-2`}>Properties</p>
73+
</Link>
7174
</div>
7275
</div>
7376
<Link href={"https://www.youtube.com/watch?v=dQw4w9WgXcQ"}>

pages/validators/properties.tsx

Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,124 @@
1+
import type {NextPage} from 'next'
2+
import Head from 'next/head'
3+
import tw, {css} from 'twin.macro'
4+
import {TextBox} from "../../components/TextBox";
5+
import {useEffect, useState} from "react";
6+
import dynamic from "next/dynamic";
7+
import duotoneDark from 'prism-react-renderer/themes/duotoneDark';
8+
import {useRouter} from "next/router";
9+
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
10+
import {faLink} from "@fortawesome/free-solid-svg-icons";
11+
import Properties from "@js.properties/properties";
12+
13+
const ReactJson = dynamic(import('react-json-view'), {ssr: false});
14+
15+
const Home: NextPage = () => {
16+
17+
const router = useRouter();
18+
19+
const [config, setConfig] = useState("");
20+
const [parsedConfig, setParsedConfig] = useState<any>({});
21+
const [error, setError] = useState<false | string>(false);
22+
23+
useEffect(() => {
24+
if (!router.query.data) return;
25+
if (!(typeof router.query.data === 'string')) return;
26+
try {
27+
const properties = Buffer.from(router.query.data, "base64").toString("utf8");
28+
setConfig(properties.toString())
29+
} catch (e) {
30+
return;
31+
}
32+
}, [router.query.data]);
33+
34+
useEffect(() => {
35+
let configObject: any = {};
36+
try {
37+
const propertiesList = Properties.parseToEntries(config, {
38+
all: false
39+
});
40+
propertiesList.forEach(properties => {
41+
if (!properties.key) return;
42+
configObject[properties.key] = properties.element;
43+
});
44+
setParsedConfig(configObject);
45+
setError(false);
46+
} catch (e: any) {
47+
setError(e?.message ?? "Error parsing properties");
48+
setParsedConfig(false)
49+
return;
50+
}
51+
}, [config])
52+
53+
return (
54+
<div>
55+
<Head>
56+
<title>Properties Validator</title>
57+
<meta name="description" content="Validate .properties Files"/>
58+
</Head>
59+
60+
<main css={css`${tw`flex flex-col`} height: calc(100vh - 3.5rem)`}>
61+
<div css={tw`text-white bg-blue-500 w-full md:px-8 p-16 h-48 text-center`}>
62+
<p css={tw`text-3xl font-bold`}>HelpChat</p>
63+
<p css={tw`text-lg`}>Properties Validator</p>
64+
</div>
65+
<div css={tw`flex flex-col md:flex-row flex-grow flex-shrink h-full`}>
66+
<div css={css`
67+
height: calc(100vh - 15.5em);
68+
${tw`md:w-1/2 p-4 pt-1 pr-2 md:max-width[50vw]`}
69+
`}>
70+
<TextBox title={"Properties Config"} code={config} editor={setConfig} language={"properties"}/>
71+
</div>
72+
<div css={css`
73+
height: calc(100vh - 15.5em);
74+
${tw`w-full md:w-1/2 p-4 pl-2 pt-1 flex flex-col md:max-width[50vw]`}
75+
`}>
76+
<div css={tw`flex flex-col h-full w-full pt-1`}>
77+
<div css={tw`flex flex-row pl-2`}>
78+
<p css={tw`text-xl font-semibold mx-auto mb-2`}>JSON Object Dumb</p>
79+
<div css={tw`flex flex-row h-8`}>
80+
<div css={tw`py-1 px-2 bg-green-400 rounded-md hover:cursor-pointer`} onClick={() => {
81+
router.query.data = Buffer.from(config).toString("base64");
82+
router.push(router);
83+
}}>
84+
<FontAwesomeIcon icon={faLink} size="1x"/>
85+
</div>
86+
</div>
87+
</div>
88+
<div css={css`${tw`rounded-md overflow-auto h-full`} background-color: #2a2734`}>
89+
<div css={tw`py-2 px-4 text-base`}>
90+
{!(error || !parsedConfig) ? <ReactJson src={parsedConfig} theme={{
91+
base00: duotoneDark.plain.backgroundColor ?? "",
92+
base01: duotoneDark.styles[2].style.color ?? "",
93+
base02: duotoneDark.styles[1].style.color ?? "",
94+
base03: duotoneDark.styles[2].style.color ?? "",
95+
base04: duotoneDark.styles[4].style.color ?? "",
96+
base05: duotoneDark.styles[4].style.color ?? "",
97+
base06: duotoneDark.styles[5].style.color ?? "",
98+
base07: duotoneDark.styles[3].style.color ?? "",
99+
base08: duotoneDark.styles[7].style.color ?? "",
100+
base09: duotoneDark.styles[6].style.color ?? "",
101+
base0A: duotoneDark.styles[9].style.color ?? "",
102+
base0B: duotoneDark.styles[10].style.color ?? "",
103+
base0C: duotoneDark.styles[4].style.color ?? "",
104+
base0D: duotoneDark.styles[2].style.color ?? "",
105+
base0E: duotoneDark.styles[2].style.color ?? "",
106+
base0F: duotoneDark.styles[2].style.color ?? "",
107+
}}/> :
108+
<span css={
109+
css`
110+
${tw`text-base text-white whitespace-pre`}
111+
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
112+
`}>{error}</span>
113+
}
114+
</div>
115+
</div>
116+
</div>
117+
</div>
118+
</div>
119+
</main>
120+
</div>
121+
)
122+
}
123+
124+
export default Home

pages/validators/yaml.tsx

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,8 @@ import {parse} from 'yaml'
77
import dynamic from "next/dynamic";
88
import duotoneDark from 'prism-react-renderer/themes/duotoneDark';
99
import {useRouter} from "next/router";
10+
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
11+
import {faLink} from "@fortawesome/free-solid-svg-icons";
1012

1113
const ReactJson = dynamic(import('react-json-view'), {ssr: false});
1214

@@ -22,12 +24,12 @@ const Home: NextPage = () => {
2224
if (!router.query.data) return;
2325
if (!(typeof router.query.data === 'string')) return;
2426
try {
25-
const yaml = Buffer.from(router.query.data, 'base64');
27+
const yaml = Buffer.from(router.query.data, "base64").toString("utf8");
2628
setConfig(yaml.toString())
2729
} catch (e) {
2830
return;
2931
}
30-
}, [router.query.yaml]);
32+
}, [router.query.data]);
3133

3234
useEffect(() => {
3335
let configObject;
@@ -71,7 +73,15 @@ const Home: NextPage = () => {
7173
`}>
7274
<div css={tw`flex flex-col h-full w-full pt-1`}>
7375
<div css={tw`flex flex-row pl-2`}>
74-
<p css={tw`text-xl font-semibold mx-auto mb-2`}>Json Object Dump</p>
76+
<p css={tw`text-xl font-semibold mx-auto mb-2`}>JSON Object Dumb</p>
77+
<div css={tw`flex flex-row h-8`}>
78+
<div css={tw`py-1 px-2 bg-green-400 rounded-md hover:cursor-pointer`} onClick={() => {
79+
router.query.data = Buffer.from(config).toString("base64");
80+
router.push(router);
81+
}}>
82+
<FontAwesomeIcon icon={faLink} size="1x"/>
83+
</div>
84+
</div>
7585
</div>
7686
<div css={css`${tw`rounded-md overflow-auto h-full`} background-color: #2a2734`}>
7787
<div css={tw`py-2 px-4 text-base`}>

0 commit comments

Comments
 (0)