diff --git a/ui/index.html b/ui/index.html
index 551a3352..da4c9cc6 100644
--- a/ui/index.html
+++ b/ui/index.html
@@ -46,7 +46,6 @@
-
diff --git a/ui/src/pages/Converter/CodeFormatter/index.tsx b/ui/src/pages/Converter/CodeFormatter/index.tsx
index 83f40934..796ea22b 100644
--- a/ui/src/pages/Converter/CodeFormatter/index.tsx
+++ b/ui/src/pages/Converter/CodeFormatter/index.tsx
@@ -1,5 +1,4 @@
import React, { useState } from "react";
-import beautify from "js-beautify";
import style from "./CodeFormatter.module.scss";
import PageGrid from "components/Layouts/PageGrid";
import { Card, Form, Space } from "antd";
@@ -11,7 +10,11 @@ import {
import CodeHighlightWithCopy from "components/General/CodeHighlightWithCopy";
import Warning from "components/General/Warning";
import InputGrid from "components/Layouts/InputGrid";
-import { INDENTATION_LEVEL, INPUT_TYPE } from "./utils/constants";
+import {
+ BEAUTIFY_FUNCTIONS,
+ INDENTATION_LEVEL,
+ INPUT_TYPE,
+} from "./utils/constants";
const CodeFormatter: React.FC = () => {
const [inputCode, setInputCode] = useState("");
@@ -23,20 +26,14 @@ const CodeFormatter: React.FC = () => {
const formatCode = () => {
try {
- let formatted = "";
- if (inputType === "html") {
- formatted = beautify.html_beautify(inputCode, {
- indent_size: Number(indentationLevel),
- });
- } else if (inputType === "css") {
- formatted = beautify.css_beautify(inputCode, {
- indent_size: Number(indentationLevel),
- });
- } else {
- formatted = beautify.js_beautify(inputCode, {
- indent_size: Number(indentationLevel),
- });
- }
+ const options = {
+ indent_size: Number(indentationLevel),
+ };
+
+ const selectedBeautifyFunction =
+ BEAUTIFY_FUNCTIONS[inputType] || BEAUTIFY_FUNCTIONS.default;
+
+ const formatted = selectedBeautifyFunction(inputCode, options);
setFormattedCode(formatted);
} catch (error) {
diff --git a/ui/src/pages/Converter/CodeFormatter/utils/constants.ts b/ui/src/pages/Converter/CodeFormatter/utils/constants.ts
index ba70020d..491efb03 100644
--- a/ui/src/pages/Converter/CodeFormatter/utils/constants.ts
+++ b/ui/src/pages/Converter/CodeFormatter/utils/constants.ts
@@ -1,3 +1,5 @@
+import beautify from "js-beautify";
+
const INDENTATION_LEVEL = [
{
value: "2",
@@ -21,4 +23,12 @@ const INPUT_TYPE = [
{ label: "YAML", value: "yaml" },
];
-export { INDENTATION_LEVEL, INPUT_TYPE };
+const BEAUTIFY_FUNCTIONS: {
+ [key: string]: (code: string, options: object) => string;
+} = {
+ html: beautify.html_beautify,
+ css: beautify.css_beautify,
+ default: beautify.js_beautify,
+};
+
+export { INDENTATION_LEVEL, INPUT_TYPE, BEAUTIFY_FUNCTIONS };