diff --git a/services/frontend/src/components/Project/CodeBox.tsx b/services/frontend/src/components/Project/CodeBox.tsx index 8e7e633..d765da2 100644 --- a/services/frontend/src/components/Project/CodeBox.tsx +++ b/services/frontend/src/components/Project/CodeBox.tsx @@ -1,6 +1,7 @@ import { useEffect, useMemo, useRef, useState } from "react"; import YAML from "yaml"; import { debounce } from "lodash"; +import { manifestTypes } from "../../constants"; import { generatePayload } from "../../utils/generators"; import { checkHttpStatus } from "../../services/helpers"; import { generateHttp } from "../../services/generate"; @@ -12,19 +13,19 @@ import useWindowDimensions from "../../hooks/useWindowDimensions"; const CodeBox = () => { const versionRef = useRef(); - const manifestRef = useRef(); + const manifestRef = useRef(); const [language, setLanguage] = useState("yaml"); const [version, setVersion] = useState("3"); const [copyText, setCopyText] = useState("Copy"); const [generatedCode, setGeneratedCode] = useState(""); const [formattedCode, setFormattedCode] = useState(""); - const [manifest, setManifest] = useState(0); + const [manifest, setManifest] = useState(manifestTypes.DOCKER_COMPOSE); const { height } = useWindowDimensions(); versionRef.current = version; manifestRef.current = manifest; - const getCode = (payload: any, manifest: number) => { + const getCode = (payload: any, manifest: string) => { generateHttp(JSON.stringify(payload), manifest) .then(checkHttpStatus) .then((data) => { @@ -34,13 +35,11 @@ const CodeBox = () => { setGeneratedCode(""); } - if (data["error"].length) { + if (data["error"]) { setGeneratedCode(""); toaster(`error ${data["error"]}`, "error"); } - }) - .catch(() => undefined) - .finally(() => undefined); + }); }; const debouncedOnGraphUpdate = useMemo( diff --git a/services/frontend/src/components/Project/ManifestSelect.tsx b/services/frontend/src/components/Project/ManifestSelect.tsx index 56dd4c8..1444f5d 100644 --- a/services/frontend/src/components/Project/ManifestSelect.tsx +++ b/services/frontend/src/components/Project/ManifestSelect.tsx @@ -1,5 +1,6 @@ import { styled } from "@mui/material"; import { useCallback, useState } from "react"; +import { manifestTypes } from "../../constants"; import DcLogo from "../global/dc-logo"; import K8sLogo from "../global/k8s-logo"; @@ -24,25 +25,33 @@ interface IManifestSelectProps { const ManifestSelect = (props: IManifestSelectProps) => { const { setManifest } = props; - const [selected, setSelected] = useState(0); + const [selected, setSelected] = useState(manifestTypes.DOCKER_COMPOSE); const handleK8s = useCallback(() => { - setManifest(1); - setSelected(1); + setManifest(manifestTypes.KUBERNETES); + setSelected(manifestTypes.KUBERNETES); }, []); const handleDC = useCallback(() => { - setManifest(0); - setSelected(0); + setManifest(manifestTypes.DOCKER_COMPOSE); + setSelected(manifestTypes.DOCKER_COMPOSE); }, []); return ( <> - - diff --git a/services/frontend/src/constants/index.ts b/services/frontend/src/constants/index.ts index 0ca9c77..0e89549 100644 --- a/services/frontend/src/constants/index.ts +++ b/services/frontend/src/constants/index.ts @@ -4,3 +4,7 @@ export const REACT_APP_GITHUB_CLIENT_ID = export const REACT_APP_GITHUB_SCOPE = process.env.REACT_APP_GITHUB_SCOPE; export const PROJECTS_FETCH_LIMIT = 300; export const LOCAL_STORAGE = "CtkLocalStorage"; +export const manifestTypes = { + DOCKER_COMPOSE: "DOCKER_COMPOSE", + KUBERNETES: "KUBERNETES" +}; diff --git a/services/frontend/src/services/generate.ts b/services/frontend/src/services/generate.ts index 09b6b29..1f8364c 100644 --- a/services/frontend/src/services/generate.ts +++ b/services/frontend/src/services/generate.ts @@ -1,12 +1,13 @@ +import { manifestTypes } from "../constants"; import { API_SERVER_URL } from "../constants"; -export const generateHttp = (data: string, manifest: number) => { +export const generateHttp = (data: string, manifest: string) => { let endpoint = `${API_SERVER_URL}/generate/`; - if (manifest === 0) { + if (manifest === manifestTypes.DOCKER_COMPOSE) { endpoint += "docker-compose"; } - if (manifest === 1) { + if (manifest === manifestTypes.KUBERNETES) { endpoint += "kubernetes"; }