✨ Support show helm and docker icon (#212)

* ✨ Add setting * ✨ Support show helm and docker icon
go-sigma · Oct 15, 2023 · 159d52a · 159d52a
1 parent 9bd70a6
commit 159d52a
Show file tree

Hide file tree

Showing 11 changed files with 167 additions and 22 deletions.
diff --git a/docs/docs/push/helm.mdx b/docs/docs/push/helm.mdx
@@ -27,13 +27,21 @@ You can see the v3.13.0 [release note](https://github.com/helm/helm/releases/tag
 Before helm version v3.13.0:
 
 ``` bash
-helm registry login --insecure -u sigma -p sigma 127.0.0.1:3000
+helm registry login --insecure -u sigma -p Admin@123 127.0.0.1:3000
 helm push demo-0.1.0.tgz oci://127.0.0.1:3000/library/demo --insecure-skip-tls-verify
 ```
 
 After helm version v3.13.0:
 
 ``` bash
-helm registry login -u sigma -p sigma 127.0.0.1:3000
+helm registry login -u sigma -p Admin@123 127.0.0.1:3000
 helm push demo-0.1.0.tgz oci://127.0.0.1:3000/library/demo --plain-http
 ```
+
+### Pull the helm chart from sigma
+
+``` bash
+# before v3.13.0
+# helm pull oci://127.0.0.1:3000/library/demo --version 0.1.0 --insecure-skip-tls-verify
+helm pull oci://127.0.0.1:3000/library/demo --version 0.1.0 --plain-http
+```
diff --git a/pkg/handlers/apidocs/docs.go b/pkg/handlers/apidocs/docs.go
diff --git a/pkg/handlers/apidocs/swagger.json b/pkg/handlers/apidocs/swagger.json
@@ -4212,6 +4212,10 @@
                     "type": "string",
                     "example": "2006-01-02 15:04:05"
                 },
+                "media_type": {
+                    "type": "string",
+                    "example": "application/vnd.oci.image.manifest.v1+json"
+                },
                 "pull_times": {
                     "type": "integer",
                     "example": 10

diff --git a/pkg/handlers/apidocs/swagger.yaml b/pkg/handlers/apidocs/swagger.yaml
@@ -1015,6 +1015,9 @@ definitions:
       last_pull:
         example: "2006-01-02 15:04:05"
         type: string
+      media_type:
+        example: application/vnd.oci.image.manifest.v1+json
+        type: string
       pull_times:
         example: 10
         type: integer

diff --git a/pkg/handlers/tags/tags_list.go b/pkg/handlers/tags/tags_list.go
@@ -101,9 +101,10 @@ func (h *handlers) ListTag(c echo.Context) error {
 			artifacts = append(artifacts, types.TagItemArtifact{
 				ID:              item.ID,
 				Digest:          item.Digest,
+				MediaType:       item.ContentType,
 				Raw:             string(item.Raw),
-				ConfigRaw:       string(item.ConfigRaw),
 				ConfigMediaType: ptr.To(item.ConfigMediaType),
+				ConfigRaw:       string(item.ConfigRaw),
 				Type:            string(item.Type),
 				Size:            item.Size,
 				BlobSize:        item.BlobsSize,
@@ -121,9 +122,10 @@ func (h *handlers) ListTag(c echo.Context) error {
 			Artifact: types.TagItemArtifact{
 				ID:              tag.Artifact.ID,
 				Digest:          tag.Artifact.Digest,
+				MediaType:       tag.Artifact.ContentType,
 				Raw:             string(tag.Artifact.Raw),
-				ConfigRaw:       string(tag.Artifact.ConfigRaw),
 				ConfigMediaType: ptr.To(tag.Artifact.ConfigMediaType),
+				ConfigRaw:       string(tag.Artifact.ConfigRaw),
 				Type:            string(tag.Artifact.Type),
 				Size:            tag.Artifact.Size,
 				BlobSize:        tag.Artifact.BlobsSize,

diff --git a/pkg/types/tag.go b/pkg/types/tag.go
@@ -18,9 +18,10 @@ package types
 type TagItemArtifact struct {
 	ID              int64  `json:"id" example:"1"`
 	Digest          string `json:"digest" example:"sha256:87508bf3e050b975770b142e62db72eeb345a67d82d36ca166300d8b27e45744"`
+	MediaType       string `json:"media_type" example:"application/vnd.oci.image.manifest.v1+json"`
 	Raw             string `json:"raw" example:"{\n   \"schemaVersion\": 2,\n   \"mediaType\": \"application/vnd.docker.distribution.manifest.v2+json\",\n   \"config\": {\n      \"mediaType\": \"application/vnd.docker.container.image.v1+json\",\n      \"size\": 1472,\n      \"digest\": \"sha256:c1aabb73d2339c5ebaa3681de2e9d9c18d57485045a4e311d9f8004bec208d67\"\n   },\n   \"layers\": [\n      {\n         \"mediaType\": \"application/vnd.docker.image.rootfs.diff.tar.gzip\",\n         \"size\": 3397879,\n         \"digest\": \"sha256:31e352740f534f9ad170f75378a84fe453d6156e40700b882d737a8f4a6988a3\"\n      }\n   ]\n}"`
-	ConfigRaw       string `json:"config_raw" example:"{\"architecture\":\"amd64\",\"config\":{\"Hostname\":\"\",\"Domainname\":\"\",\"User\":\"\",\"AttachStdin\":false,\"AttachStdout\":false,\"AttachStderr\":false,\"Tty\":false,\"OpenStdin\":false,\"StdinOnce\":false,\"Env\":[\"PATH=/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin\"],\"Cmd\":[\"/bin/sh\"],\"Image\":\"sha256:5b8658701c96acefe1cd3a21b2a80220badf9124891ad440d95a7fa500d48765\",\"Volumes\":null,\"WorkingDir\":\"\",\"Entrypoint\":null,\"OnBuild\":null,\"Labels\":null},\"container\":\"bfc8078c169637d70e40ce591b5c2fe8d26329918dafcb96ebc9304ddff162ea\",\"container_config\":{\"Hostname\":\"bfc8078c1696\",\"Domainname\":\"\",\"User\":\"\",\"AttachStdin\":false,\"AttachStdout\":false,\"AttachStderr\":false,\"Tty\":false,\"OpenStdin\":false,\"StdinOnce\":false,\"Env\":[\"PATH=/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin\"],\"Cmd\":[\"/bin/sh\",\"-c\",\"#(nop) \",\"CMD [\\\"/bin/sh\\\"]\"],\"Image\":\"sha256:5b8658701c96acefe1cd3a21b2a80220badf9124891ad440d95a7fa500d48765\",\"Volumes\":null,\"WorkingDir\":\"\",\"Entrypoint\":null,\"OnBuild\":null,\"Labels\":{}},\"created\":\"2023-06-14T20:41:59.079795125Z\",\"docker_version\":\"20.10.23\",\"history\":[{\"created\":\"2023-06-14T20:41:58.950178204Z\",\"created_by\":\"/bin/sh -c #(nop) ADD file:1da756d12551a0e3e793e02ef87432d69d4968937bd11bed0af215db19dd94cd in / \"},{\"created\":\"2023-06-14T20:41:59.079795125Z\",\"created_by\":\"/bin/sh -c #(nop)  CMD [\\\"/bin/sh\\\"]\",\"empty_layer\":true}],\"os\":\"linux\",\"rootfs\":{\"type\":\"layers\",\"diff_ids\":[\"sha256:78a822fe2a2d2c84f3de4a403188c45f623017d6a4521d23047c9fbb0801794c\"]}}"`
 	ConfigMediaType string `json:"config_media_type" example:"application/vnd.oci.image.config.v1+json"`
+	ConfigRaw       string `json:"config_raw" example:"{\"architecture\":\"amd64\",\"config\":{\"Hostname\":\"\",\"Domainname\":\"\",\"User\":\"\",\"AttachStdin\":false,\"AttachStdout\":false,\"AttachStderr\":false,\"Tty\":false,\"OpenStdin\":false,\"StdinOnce\":false,\"Env\":[\"PATH=/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin\"],\"Cmd\":[\"/bin/sh\"],\"Image\":\"sha256:5b8658701c96acefe1cd3a21b2a80220badf9124891ad440d95a7fa500d48765\",\"Volumes\":null,\"WorkingDir\":\"\",\"Entrypoint\":null,\"OnBuild\":null,\"Labels\":null},\"container\":\"bfc8078c169637d70e40ce591b5c2fe8d26329918dafcb96ebc9304ddff162ea\",\"container_config\":{\"Hostname\":\"bfc8078c1696\",\"Domainname\":\"\",\"User\":\"\",\"AttachStdin\":false,\"AttachStdout\":false,\"AttachStderr\":false,\"Tty\":false,\"OpenStdin\":false,\"StdinOnce\":false,\"Env\":[\"PATH=/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin\"],\"Cmd\":[\"/bin/sh\",\"-c\",\"#(nop) \",\"CMD [\\\"/bin/sh\\\"]\"],\"Image\":\"sha256:5b8658701c96acefe1cd3a21b2a80220badf9124891ad440d95a7fa500d48765\",\"Volumes\":null,\"WorkingDir\":\"\",\"Entrypoint\":null,\"OnBuild\":null,\"Labels\":{}},\"created\":\"2023-06-14T20:41:59.079795125Z\",\"docker_version\":\"20.10.23\",\"history\":[{\"created\":\"2023-06-14T20:41:58.950178204Z\",\"created_by\":\"/bin/sh -c #(nop) ADD file:1da756d12551a0e3e793e02ef87432d69d4968937bd11bed0af215db19dd94cd in / \"},{\"created\":\"2023-06-14T20:41:59.079795125Z\",\"created_by\":\"/bin/sh -c #(nop)  CMD [\\\"/bin/sh\\\"]\",\"empty_layer\":true}],\"os\":\"linux\",\"rootfs\":{\"type\":\"layers\",\"diff_ids\":[\"sha256:78a822fe2a2d2c84f3de4a403188c45f623017d6a4521d23047c9fbb0801794c\"]}}"`
 	Type            string `json:"type" example:"image"`
 	Size            int64  `json:"size" example:"10201"`
 	BlobSize        int64  `json:"blob_size" example:"100210"`

diff --git a/web/src/components/svg/docker.tsx b/web/src/components/svg/docker.tsx
@@ -0,0 +1,42 @@
+/**
+ * Copyright 2023 sigma
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export default function () {
+  return (
+    <svg version="1.1" fill="#8052FD" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
+      x="0px"
+      y="0px"
+      width="25"
+      height="25"
+      viewBox="0 0 512 512" >
+      <path d="M279.6,108.3v23.7h-23.7v-23.7H279.6 M279.6,161.3V185h-23.7v-23.7H279.6 M226.5,161.3V185h-23.7v-23.7H226.5
+	 M173.4,161.3V185h-23.7v-23.7H173.4 M384.4,199.8c4.3,3.2,19.5,15.5,23.7,33.1l2.2,9.3l9.4-1.5c1.9-0.3,3.9-0.4,6-0.4
+	c15.9,0,31.6,8.6,36,11.1c-3.8,5.8-18.1,24.3-51.8,29.7l-4.9,0.8l-2.5,4.3c-17.7,31.3-45.3,60.1-77.5,81
+	c-18.7,12.1-38.8,21.6-59.8,28.1c-23.2,7.2-47.7,10.9-72.7,10.9c-18,0-52.4-2.9-80.9-22.5c-31.8-21.9-48.7-58.8-50.2-110
+	c-0.1-3.3,2.7-6.2,6-6.2h292.4c5.2,0,10.3-2.2,13.7-6.2c3.7-4.1,5.4-9.7,4.8-15.3c-3-27,2.7-40.4,5.2-44.8
+	C383.9,200.7,384.1,200.2,384.4,199.8 M332.7,214.4v23.7H309v-23.7H332.7 M279.6,214.4v23.7h-23.7v-23.7H279.6 M226.5,214.4v23.7
+	h-23.7v-23.7H226.5 M173.4,214.4v23.7h-23.7v-23.7H173.4 M120.3,214.4v23.7H96.7v-23.7H120.3 M289.9,98h-44.2v44.2h44.2V98L289.9,98
+	z M289.9,151.1h-44.2v44.2h44.2V151.1L289.9,151.1z M236.8,151.1h-44.2v44.2h44.2V151.1L236.8,151.1z M183.7,151.1h-44.2v44.2h44.2
+	V151.1L183.7,151.1z M382.8,186.4c0,0-3.9,4-5.1,5.3c-0.4,0.5-1.7,1.9-3.1,4.4c-3.9,6.9-9.7,22.5-6.5,51.2c0.3,2.7-0.5,5.3-2.2,7.3
+	c-1.5,1.7-3.7,2.7-6.1,2.7H59.8c-4.9,0-8.8,3.9-8.8,8.8l0,0c0,135.7,99,150.4,141.6,150.4c109.6,0,185.8-66.5,219-125.3
+	c43.8-6.9,59-34.5,59.8-35.8l4.4-7.4l-7.2-4.6c-1.1-0.7-21.4-13.5-42.8-13.5c-2.6,0-5.1,0.2-7.6,0.6c-5.8-24.3-28-39.4-29.1-40
+	L382.8,186.4L382.8,186.4z M343,204.1h-44.2v44.2H343V204.1L343,204.1z M289.9,204.1h-44.2v44.2h44.2V204.1L289.9,204.1z
+	 M236.8,204.1h-44.2v44.2h44.2V204.1L236.8,204.1z M183.7,204.1h-44.2v44.2h44.2V204.1L183.7,204.1z M130.6,204.1H86.3v44.2h44.2
+	V204.1L130.6,204.1z"/>
+    </svg>
+
+  );
+}
diff --git a/web/src/components/svg/helm.tsx b/web/src/components/svg/helm.tsx
@@ -0,0 +1,43 @@
+/**
+ * Copyright 2023 sigma
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export default function () {
+  return (
+    <svg version="1.1" fill="#8052FD" xmlns="http://www.w3.org/2000/svg"
+      x="0px" y="0px"
+      width="25"
+      height="25"
+      viewBox="0 0 512 512" >
+      <g>
+        <path d="M52.1,205.7h29v40.9h33.5v-40.9h29v110h-29v-43.9H81.1v43.9h-29V205.7z" />
+        <path d="M167.3,205.7h70.5v23.9h-42.4V248h36.3v23.6h-36.3v20h43.9v24.2h-72.1V205.7H167.3z" />
+        <path d="M262.2,205.7h28.7v86.1h41.3v23.9h-70V205.7z" />
+      </g>
+      <path d="M352.4,206h30.9l22.1,64.6h0.3l22.1-64.6h30.9v110h-24.8c0,0,0-28,0-42.6c0-12.2,2.3-30.8,2.3-30.8l-22.5,64.1
+    h-16.1l-23.2-64.1c0,0,2.9,21.6,2.9,31.3s0,42.1,0,42.1h-24.8L352.4,206L352.4,206z"/>
+      <path d="M354.3,148c6.1-4.3,12.8-11.1,18.7-19.6c12.4-17.7,16.9-35.9,10.1-40.6c-6.8-4.8-22.4,5.7-34.7,23.4
+    c-5.6,8-9.6,16.1-11.7,23.1c-20.4-13.7-44-22.2-69.1-24.6c2.3-6.8,3.7-15.8,3.7-25.5c0-21.6-6.7-39.1-15-39.1
+    c-8.3,0-15,17.5-15,39.1c0,9.6,1.3,18.3,3.5,25.1c-25.1,1.4-49,9-69.9,21.8c-2.2-6.3-5.9-13.3-10.7-20.2
+    c-12.4-17.7-27.9-28.2-34.7-23.4c-6.8,4.8-2.3,23,10.1,40.6c5,7.1,10.5,13.1,15.7,17.3c-10.4,8.9-19.6,19.4-27.3,31.1l19,12.6
+    c23.7-35.9,63.4-57.3,106.3-57.3c44,0,84.3,22.3,107.8,59.6l19.3-12.2C373,167.5,364.2,157,354.3,148z"/>
+      <path d="M373,385.6c-5.2-7.4-10.9-13.5-16.3-17.8c7.4-7.1,14.2-15,20.2-23.6l-18.8-13c-23.8,34.5-63,55.1-104.8,55.1
+    s-81-20.6-104.8-55.1l-18.8,13c6.8,9.8,14.6,18.6,23.2,26.4c-4.5,4-9.1,9.3-13.4,15.3c-12.4,17.7-16.9,35.9-10.1,40.6
+    c6.8,4.8,22.4-5.7,34.7-23.4c4-5.8,7.2-11.6,9.5-17c20.9,13.1,44.9,21,70,22.6c-1.5,6.1-2.4,13.3-2.4,21c0,21.6,6.7,39.1,15,39.1
+    s15-17.5,15-39.1c0-8-0.9-15.4-2.5-21.5c24.9-2.6,48.6-11.4,69-25.3c2.2,6.1,5.8,13,10.6,19.8c12.4,17.7,27.9,28.2,34.7,23.4
+    C389.9,421.5,385.4,403.3,373,385.6z"/>
+    </svg>
+  );
+}
diff --git a/web/src/interfaces/index.ts b/web/src/interfaces/index.ts
@@ -95,7 +95,9 @@ export interface IArtifactList {
 export interface IArtifact {
   id: number;
   digest: string;
+  media_type: string;
   raw: string;
+  config_media_type: string;
   config_raw: string;
   size: number;
   blob_size: number;

diff --git a/web/src/pages/Tag/TableItem.tsx b/web/src/pages/Tag/TableItem.tsx
@@ -36,9 +36,12 @@ export default function ({ namespace, repository, artifact, artifacts }: { names
   return (
     <tbody>
       {
-        artifactObj.mediaType === "application/vnd.oci.image.manifest.v1+json" || artifactObj.mediaType === "application/vnd.docker.distribution.manifest.v2+json" ? (
+        artifactObj.mediaType === "application/vnd.oci.image.manifest.v1+json" ||
+          artifactObj.mediaType === "application/vnd.docker.distribution.manifest.v2+json" ||
+          artifact.config_media_type == "application/vnd.cncf.helm.config.v1+json" ? (
           <DetailItem artifact={artifact} />
-        ) : artifactObj.mediaType === "application/vnd.docker.distribution.manifest.list.v2+json" || artifactObj.mediaType === "application/vnd.oci.image.index.v1+json" ? (
+        ) : artifactObj.mediaType === "application/vnd.docker.distribution.manifest.list.v2+json" ||
+          artifactObj.mediaType === "application/vnd.oci.image.index.v1+json" ? (
           artifacts.map((artifact: IArtifact, index: number) => {
             return (
               !skipManifest(artifact.raw) && (
@@ -75,7 +78,14 @@ function DetailItem({ artifact }: { artifact: IArtifact }) {
         </code>
       </td>
       <td className="text-right text-xs">
-        <span>  {imageConfigObj.os}/{imageConfigObj.architecture}</span>
+        {
+          imageConfigObj.os === undefined ||
+            imageConfigObj.architecture === undefined ||
+            imageConfigObj.os === "" ||
+            imageConfigObj.architecture === "" ? "-" : (
+            <span>{imageConfigObj.os}/{imageConfigObj.architecture}</span>
+          )
+        }
       </td>
       <td className="text-right text-xs">
         <div className='flex flex-row-reverse gap-1'>

diff --git a/web/src/pages/Tag/index.tsx b/web/src/pages/Tag/index.tsx
@@ -28,6 +28,8 @@ import Menu from "../../components/Menu";
 import Header from "../../components/Header";
 import Toast from "../../components/Notification";
 import Pagination from "../../components/Pagination";
+import HelmSvg from "../../components/svg/helm";
+import DockerSvg from "../../components/svg/docker";
 
 import TableItem from "./TableItem";
 
@@ -87,16 +89,6 @@ export default function Tag({ localServer }: { localServer: string }) {
 
   useEffect(fetchTags, [refresh, page]);
 
-  const imageDomain = () => {
-    if (localServer.startsWith("http://")) {
-      return localServer.substring(7);
-    } else if (localServer.startsWith("https://")) {
-      return localServer.substring(8)
-    } else {
-      return localServer;
-    }
-  }
-
   return (
     <Fragment>
       <HelmetProvider>
@@ -208,21 +200,55 @@ export default function Tag({ localServer }: { localServer: string }) {
                     <div key={tag.id} className="p-4 border-t border-gray-200 hover:shadow-md last:hover:shadow-none">
                       {/* first row begin */}
                       <div className="flex">
-                        <div className="flex-1">
-                          <span className="font-semibold text-gray-600">
+                        <div className="flex-1 flex gap-1">
+                          {
+                            tag.artifact.config_media_type === "application/vnd.cncf.helm.config.v1+json" ? (
+                              <HelmSvg />
+                            ) : tag.artifact.media_type === "application/vnd.oci.image.manifest.v1+json" ||
+                              tag.artifact.media_type === "application/vnd.docker.distribution.manifest.v2+json" ||
+                              tag.artifact.media_type === "application/vnd.docker.distribution.manifest.list.v2+json" ||
+                              tag.artifact.media_type === "application/vnd.oci.image.index.v1+json" ? (
+                              <DockerSvg />
+                            ) : null
+                          }
+                          <span className="font-semibold text-gray-600 cursor-pointer"
+                            id={"tooltip-tag-name-" + index}
+                            onClick={e => {
+                              copyToClipboard(`${tag.name}`);
+                              let tooltip = new Tooltip(document.getElementById("tooltip-top-content"),
+                                document.getElementById("tooltip-tag-name-" + index.toString()), { triggerType: "click" });
+                              tooltip.show();
+                            }}
+                          >
                             {tag.name}
                           </span>
                         </div>
                         <div>
                           <code className="block text-xs bg-gray-700 p-2 text-gray-50 cursor-pointer rounded-md w-96 text-ellipsis whitespace-nowrap overflow-hidden"
                             id={"tooltip-top-btn-" + index}
                             onClick={e => {
-                              copyToClipboard(`docker pull ${trimHTTP(endpoint)}/${repository}:${tag.name}`);
+                              let copyText = `docker pull ${trimHTTP(endpoint)}/${repository}:${tag.name}`;
+                              if (tag.artifact.config_media_type === "application/vnd.cncf.helm.config.v1+json") {
+                                copyText = `helm pull ${trimHTTP(endpoint)}/${repository} --version ${tag.name}`
+                              }
+                              copyToClipboard(copyText);
                               let tooltip = new Tooltip(document.getElementById("tooltip-top-content"),
                                 document.getElementById("tooltip-top-btn-" + index.toString()), { triggerType: "click" });
                               tooltip.show();
                             }}
-                          >docker pull {trimHTTP(endpoint)}/{repository}:{tag.name}</code>
+                          >
+                            {
+                              tag.artifact.config_media_type === "application/vnd.cncf.helm.config.v1+json" ? (
+                                <>
+                                  helm pull {trimHTTP(endpoint)}/{repository} --version {tag.name}
+                                </>
+                              ) : (
+                                <>
+                                  docker pull {trimHTTP(endpoint)}/{repository}:{tag.name}
+                                </>
+                              )
+                            }
+                          </code>
                         </div>
                       </div>
                       {/* first row end */}