cleanup

4 weeks ago · 67f75f85da
parent 5f527e7fc6
commit 67f75f85da
6 changed files with 56 additions and 37 deletions
--- a/services/backend/src/manifest_generation.py
+++ b/services/backend/src/manifest_generation.py
@ -59,8 +59,17 @@ def _parse_version(version: str) -> int | float:
        return float(version)


+def _is_latest_compose_spec(version: str) -> bool:
+    return version.strip().lower() in {
+        "latest",
+        "latest (spec)",
+        "spec",
+        "compose-spec",
+    }
+
+
 def generate_docker_compose_yaml(payload: dict[str, Any]) -> str:
-    version = str(payload.get("version", "3"))
+    version = str(payload.get("version", "latest")).strip()
    services = payload.get("services")
    volumes = payload.get("volumes")
    networks = payload.get("networks")
@ -70,27 +79,39 @@ def generate_docker_compose_yaml(payload: dict[str, Any]) -> str:
    yaml.indent(mapping=2, sequence=4, offset=2)
    yaml.preserve_quotes = True
    yaml.explicit_start = True
-
-    specified_version = _parse_version(version)
-    major_version = int(specified_version)
-
-    yaml.dump({"version": DoubleQuotedScalarString(str(specified_version))}, output)
-    yaml.explicit_start = False
-    output.write("\n")
+    wrote_document = False
+
+    def dump_chunk(data: dict[str, Any], transform: Any = None) -> None:
+        nonlocal wrote_document
+        yaml.explicit_start = not wrote_document
+        if transform:
+            yaml.dump(data, output, transform=transform)
+        else:
+            yaml.dump(data, output)
+        wrote_document = True
+
+    latest_compose_spec = _is_latest_compose_spec(version)
+    major_version = 3
+
+    if not latest_compose_spec:
+        specified_version = _parse_version(version)
+        major_version = int(specified_version)
+        dump_chunk({"version": DoubleQuotedScalarString(str(specified_version))})
+        output.write("\n")

    if services:
-        if major_version in {2, 3}:
-            yaml.dump({"services": services}, output, transform=_sequence_indent_four)
+        if latest_compose_spec or major_version in {2, 3}:
+            dump_chunk({"services": services}, transform=_sequence_indent_four)
        elif major_version == 1:
-            yaml.dump(services, output, transform=_sequence_indent_one)
+            dump_chunk(services, transform=_sequence_indent_one)
        output.write("\n")

-    if major_version in {2, 3} and networks:
-        yaml.dump({"networks": networks}, output)
+    if (latest_compose_spec or major_version in {2, 3}) and networks:
+        dump_chunk({"networks": networks})
        output.write("\n")

    if volumes:
-        yaml.dump({"volumes": volumes}, output)
+        dump_chunk({"volumes": volumes})

    output.seek(0)
    return output.read()
--- a/services/frontend/public/favicon.png
+++ b/services/frontend/public/favicon.png
--- a/services/frontend/public/index.html
+++ b/services/frontend/public/index.html
@ -7,7 +7,7 @@
    <meta name="theme-color" content="#000000" />
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <title>Container Toolkit</title>
+    <title>Container Tool Kit</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
--- a/services/frontend/src/components/Project/CodeBox.tsx
+++ b/services/frontend/src/components/Project/CodeBox.tsx
@ -7,7 +7,6 @@ import { checkHttpStatus } from "../../services/helpers";
 import { generateHttp } from "../../services/generate";
 import { toaster } from "../../utils";
 import eventBus from "../../events/eventBus";
-import ManifestSelect from "./ManifestSelect";
 import CodeEditor from "../CodeEditor";
 import useWindowDimensions from "../../hooks/useWindowDimensions";

@ -15,11 +14,11 @@ const CodeBox = () => {
  const versionRef = useRef<string>();
  const manifestRef = useRef<string>();
  const [language, setLanguage] = useState("yaml");
-  const [version, setVersion] = useState("3");
+  const [version, setVersion] = useState("latest");
  const [copyText, setCopyText] = useState("Copy");
  const [generatedCode, setGeneratedCode] = useState<string>("");
  const [formattedCode, setFormattedCode] = useState<string>("");
-  const [manifest, setManifest] = useState(manifestTypes.DOCKER_COMPOSE);
+  const [manifest] = useState(manifestTypes.DOCKER_COMPOSE);
  const { height } = useWindowDimensions();

  versionRef.current = version;
@ -98,14 +97,15 @@ const CodeBox = () => {
  return (
    <>
      <div
-        className={`absolute top-0 left-0 right-0 z-10 flex justify-end p-1 space-x-2 group-hover:visible invisible`}
+        className={`absolute top-0 right-0 z-10 flex p-1 space-x-2 group-hover:visible invisible pointer-events-none`}
      >
        <select
          id="version"
          onChange={versionChange}
          value={version}
-          className="input-util w-min pr-8"
+          className="input-util w-min pr-8 pointer-events-auto"
        >
+          <option value="latest">latest (spec)</option>
          <option value="1">v 1</option>
          <option value="2">v 2</option>
          <option value="3">v 3</option>
@ -114,7 +114,7 @@ const CodeBox = () => {
        <button
          className={`btn-util ${
            language === "json" ? `btn-util-selected` : ``
-          }`}
+          } pointer-events-auto`}
          onClick={() => setLanguage("json")}
        >
          json
@ -122,22 +122,20 @@ const CodeBox = () => {
        <button
          className={`btn-util ${
            language === "yaml" ? `btn-util-selected` : ``
-          }`}
+          } pointer-events-auto`}
          onClick={() => setLanguage("yaml")}
        >
          yaml
        </button>
-        <button className="btn-util" type="button" onClick={copy}>
+        <button
+          className="btn-util pointer-events-auto"
+          type="button"
+          onClick={copy}
+        >
          {copyText}
        </button>
      </div>

-      <div
-        className={`absolute top-10 left-0 right-0 z-10 flex justify-end p-1 space-x-2 group-hover:visible invisible`}
-      >
-        <ManifestSelect setManifest={setManifest} />
-      </div>
-
      <CodeEditor
        data={formattedCode}
        language={language}
--- a/services/frontend/src/components/Project/ManifestSelect.tsx
+++ b/services/frontend/src/components/Project/ManifestSelect.tsx
@ -14,9 +14,14 @@ const Button = styled("button", {
  filter: grayscale(${({ selected }) => (selected ? "0%" : "100%")});
  opacity: ${({ selected }) => (selected ? "100%" : "80%")};

-  &:hover {
+  &:hover:not(:disabled) {
    filter: grayscale(0%);
  }
+
+  &:disabled {
+    cursor: not-allowed;
+    opacity: 40%;
+  }
 `;

 interface IManifestSelectProps {
@ -27,11 +32,6 @@ const ManifestSelect = (props: IManifestSelectProps) => {
  const { setManifest } = props;
  const [selected, setSelected] = useState(manifestTypes.DOCKER_COMPOSE);

-  const handleK8s = useCallback(() => {
-    setManifest(manifestTypes.KUBERNETES);
-    setSelected(manifestTypes.KUBERNETES);
-  }, []);
-
  const handleDC = useCallback(() => {
    setManifest(manifestTypes.DOCKER_COMPOSE);
    setSelected(manifestTypes.DOCKER_COMPOSE);
@ -42,7 +42,7 @@ const ManifestSelect = (props: IManifestSelectProps) => {
      <Button
        selected={selected === manifestTypes.KUBERNETES}
        type="button"
-        onClick={handleK8s}
+        disabled
      >
        <K8sLogo />
      </Button>
--- a/services/frontend/src/types/index.ts
+++ b/services/frontend/src/types/index.ts
@ -359,7 +359,7 @@ export interface IProjectPayload {

 export interface IGeneratePayload {
  data: {
-    version: number;
+    version: string | number;
    networks: Record<string, Partial<INetworkTopLevel>>;
    services: Record<string, Partial<IService>>;
    volumes: Record<string, Partial<IVolumeTopLevel>>;