From da037a159bba9d7aa13c8701be06f5dae00db171 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Tue, 19 Dec 2023 11:41:01 +0000 Subject: [PATCH] deploy: 16305d852446b2844180aae50f89eb7d2158d61a --- 404.html | 2 +- assets/js/efc2a09d.c08a4589.js | 1 - assets/js/efc2a09d.e6cd623d.js | 1 + ...time~main.1ad85984.js => runtime~main.82c98736.js} | 2 +- blog.html | 2 +- blog/5-things-to-know-for-a-docker-user.html | 2 +- blog/archive.html | 2 +- blog/develop-using-devcontainer.html | 2 +- blog/podman-desktop-release-0.10.html | 2 +- blog/podman-desktop-release-0.11.html | 2 +- blog/podman-desktop-release-0.12.html | 2 +- blog/podman-desktop-release-0.13.html | 2 +- blog/podman-desktop-release-0.14.html | 2 +- blog/podman-desktop-release-0.15.html | 2 +- blog/podman-desktop-release-1.0.html | 2 +- blog/podman-desktop-release-1.1.html | 2 +- blog/podman-desktop-release-1.2.html | 2 +- blog/podman-desktop-release-1.3.html | 2 +- blog/podman-desktop-release-1.4.html | 2 +- blog/podman-desktop-release-1.5.html | 2 +- blog/podman-desktop-release-1.6.html | 2 +- ...-local-kubernetes-cluster-with-podman-desktop.html | 2 +- ...sharing-podman-images-with-kubernetes-cluster.html | 2 +- blog/tags.html | 2 +- blog/tags/codespaces.html | 2 +- blog/tags/compose.html | 2 +- blog/tags/devcontainer.html | 2 +- blog/tags/docker.html | 2 +- blog/tags/extensions.html | 2 +- blog/tags/images.html | 2 +- blog/tags/kind.html | 2 +- blog/tags/kubernetes.html | 2 +- blog/tags/migrating.html | 2 +- blog/tags/onboarding.html | 2 +- blog/tags/openshift.html | 2 +- blog/tags/podman-desktop.html | 2 +- blog/tags/podman.html | 2 +- blog/tags/release.html | 2 +- blog/tags/settings.html | 2 +- blog/tags/story.html | 2 +- core-values.html | 2 +- docs/compose.html | 2 +- docs/compose/running-compose.html | 2 +- docs/compose/setting-up-compose.html | 2 +- docs/containers.html | 2 +- docs/containers/creating-a-pod.html | 2 +- docs/containers/images.html | 2 +- docs/containers/images/building-an-image.html | 2 +- docs/containers/images/pulling-an-image.html | 2 +- .../images/pushing-an-image-to-a-registry.html | 2 +- docs/containers/onboarding.html | 2 +- docs/containers/registries.html | 2 +- .../authenticating-to-a-preconfigured-registry.html | 2 +- docs/containers/registries/insecure-registry.html | 2 +- docs/containers/starting-a-container.html | 2 +- docs/extensions.html | 2 +- docs/extensions/install.html | 2 +- docs/extensions/publish.html | 2 +- docs/extensions/write.html | 2 +- docs/extensions/write/onboarding-workflow.html | 11 ++++++++++- docs/extensions/write/when-clause-context.html | 2 +- docs/installation.html | 2 +- docs/installation/linux-install.html | 2 +- ...ing-podman-desktop-from-a-compressed-tar-file.html | 2 +- ...stalling-podman-desktop-from-a-flatpak-bundle.html | 2 +- docs/installation/macos-install.html | 2 +- docs/installation/windows-install.html | 2 +- ...esktop-and-podman-in-a-restricted-environment.html | 2 +- ...n-desktop-silently-with-the-windows-installer.html | 2 +- .../installing-podman-desktop-with-chocolatey.html | 2 +- .../installing-podman-desktop-with-scoop.html | 2 +- .../installing-podman-desktop-with-winget.html | 2 +- docs/intro.html | 2 +- docs/kind.html | 2 +- .../building-an-image-and-testing-it-in-kind.html | 2 +- docs/kind/configuring-podman-for-kind-on-windows.html | 2 +- docs/kind/creating-a-kind-cluster.html | 2 +- docs/kind/deleting-your-kind-cluster.html | 2 +- docs/kind/installing.html | 2 +- docs/kind/pushing-an-image-to-kind.html | 2 +- docs/kind/restarting-your-kind-cluster.html | 2 +- docs/kind/working-with-your-local-kind-cluster.html | 2 +- docs/kubernetes.html | 2 +- .../deploying-a-container-to-kubernetes.html | 2 +- docs/kubernetes/deploying-a-pod-to-kubernetes.html | 2 +- docs/kubernetes/existing-kubernetes.html | 2 +- docs/kubernetes/kind/pushing-an-image-to-kind.html | 2 +- ...g-current-kubernete-context-in-the-status-bar.html | 2 +- ...ewing-and-selecting-current-kubernete-context.html | 2 +- docs/lima.html | 2 +- docs/lima/creating-a-kubernetes-instance.html | 2 +- docs/lima/creating-a-lima-instance.html | 2 +- docs/lima/customizing.html | 2 +- docs/lima/installing.html | 2 +- docs/migrating-from-docker.html | 2 +- .../emulating-docker-cli-with-podman.html | 2 +- .../importing-saved-containers.html | 2 +- .../using-podman-mac-helper.html | 2 +- .../using-the-docker_host-environment-variable.html | 2 +- .../verifying-your-tools-are-using-podman.html | 2 +- docs/minikube.html | 2 +- .../building-an-image-and-testing-it-in-minikube.html | 2 +- .../configuring-podman-for-minikube-on-windows.html | 2 +- docs/minikube/creating-a-minikube-cluster.html | 2 +- docs/minikube/deleting-your-minikube-cluster.html | 2 +- docs/minikube/installing.html | 2 +- docs/minikube/pushing-an-image-to-minikube.html | 2 +- docs/minikube/restarting-your-minikube-cluster.html | 2 +- .../working-with-your-local-minikube-cluster.html | 2 +- docs/openshift.html | 2 +- docs/openshift/developer-sandbox.html | 2 +- docs/openshift/openshift-local.html | 2 +- docs/podman.html | 2 +- docs/podman/creating-a-podman-machine.html | 2 +- ...alling-podman-with-openshift-local-on-windows.html | 2 +- docs/podman/installing.html | 2 +- .../setting-podman-machine-default-connection.html | 2 +- docs/proxy.html | 2 +- docs/proxy/using-a-proxy-in-your-containers.html | 2 +- docs/proxy/using-a-proxy-on-linux.html | 2 +- docs/proxy/using-a-proxy-requiring-a-custom-ca.html | 2 +- docs/proxy/using-a-proxy.html | 2 +- docs/proxy/using-a-vpn-on-windows.html | 2 +- docs/tags.html | 2 +- docs/tags/chocolatey.html | 2 +- docs/tags/compose.html | 2 +- docs/tags/containers.html | 2 +- docs/tags/docker.html | 2 +- docs/tags/extension.html | 2 +- docs/tags/flathub.html | 2 +- docs/tags/flatpak.html | 2 +- docs/tags/images.html | 2 +- docs/tags/installing.html | 2 +- docs/tags/kind.html | 2 +- docs/tags/kubernetes.html | 2 +- docs/tags/lima.html | 2 +- docs/tags/linux.html | 2 +- docs/tags/mac-0-s.html | 2 +- docs/tags/mac-os.html | 2 +- docs/tags/macos.html | 2 +- docs/tags/migrating-from-docker.html | 2 +- docs/tags/migrating-to-kubernetes.html | 2 +- docs/tags/minikube.html | 2 +- docs/tags/onboarding.html | 2 +- docs/tags/openshift-local.html | 2 +- docs/tags/openshift.html | 2 +- docs/tags/podman-desktop.html | 2 +- docs/tags/podman.html | 2 +- docs/tags/pods.html | 2 +- docs/tags/proxy.html | 2 +- docs/tags/publishing.html | 2 +- docs/tags/registries.html | 2 +- docs/tags/restricted-environment.html | 2 +- docs/tags/scoop.html | 2 +- docs/tags/vpn.html | 2 +- docs/tags/when-clause.html | 2 +- docs/tags/windows.html | 2 +- docs/tags/winget.html | 2 +- docs/tags/writing.html | 2 +- docs/troubleshooting.html | 2 +- .../troubleshooting-openshift-local.html | 2 +- .../troubleshooting-podman-on-linux.html | 2 +- .../troubleshooting-podman-on-macos.html | 2 +- .../troubleshooting-podman-on-windows.html | 2 +- docs/troubleshooting/troubleshooting-podman.html | 2 +- downloads.html | 2 +- downloads/linux.html | 2 +- downloads/macos.html | 2 +- downloads/windows.html | 2 +- extend.html | 2 +- features.html | 2 +- index.html | 2 +- search.html | 2 +- 173 files changed, 181 insertions(+), 172 deletions(-) delete mode 100644 assets/js/efc2a09d.c08a4589.js create mode 100644 assets/js/efc2a09d.e6cd623d.js rename assets/js/{runtime~main.1ad85984.js => runtime~main.82c98736.js} (99%) diff --git a/404.html b/404.html index 5c59abd7ddd..8113f7232b4 100644 --- a/404.html +++ b/404.html @@ -13,7 +13,7 @@ - +
diff --git a/assets/js/efc2a09d.c08a4589.js b/assets/js/efc2a09d.c08a4589.js deleted file mode 100644 index 8a192a7cfff..00000000000 --- a/assets/js/efc2a09d.c08a4589.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[7739],{15799:(n,e,t)=>{t.r(e),t.d(e,{assets:()=>r,contentTitle:()=>a,default:()=>A,frontMatter:()=>i,metadata:()=>d,toc:()=>l});var o=t(24246),s=t(71670);const i={sidebar_position:1,title:"Onboarding workflow",description:"Podman Desktop onboarding workflow reference",tags:["podman-desktop","extension","writing","onboarding"],keywords:["podman desktop","extension","writing","onboarding"]},a="Onboarding",d={id:"extensions/write/onboarding-workflow",title:"Onboarding workflow",description:"Podman Desktop onboarding workflow reference",source:"@site/docs/extensions/write/onboarding-workflow.md",sourceDirName:"extensions/write",slug:"/extensions/write/onboarding-workflow",permalink:"/docs/extensions/write/onboarding-workflow",draft:!1,unlisted:!1,editUrl:"https://github.com/containers/podman-desktop/tree/main/website/docs/extensions/write/onboarding-workflow.md",tags:[{label:"podman-desktop",permalink:"/docs/tags/podman-desktop"},{label:"extension",permalink:"/docs/tags/extension"},{label:"writing",permalink:"/docs/tags/writing"},{label:"onboarding",permalink:"/docs/tags/onboarding"}],version:"current",sidebarPosition:1,frontMatter:{sidebar_position:1,title:"Onboarding workflow",description:"Podman Desktop onboarding workflow reference",tags:["podman-desktop","extension","writing","onboarding"],keywords:["podman desktop","extension","writing","onboarding"]},sidebar:"mySidebar",previous:{title:"Writing",permalink:"/docs/extensions/write/"},next:{title:"When clause contexts",permalink:"/docs/extensions/write/when-clause-context"}},r={},l=[{value:"Title, Description and Media",id:"title-description-and-media",level:3},{value:"Enablement",id:"enablement",level:3},{value:"Steps",id:"steps",level:3},{value:"Id",id:"id",level:4},{value:"Title, description and media",id:"title-description-and-media-1",level:4},{value:"Command",id:"command",level:4},{value:"CompletionEvents",id:"completionevents",level:4},{value:"Content",id:"content",level:4},{value:"Component",id:"component",level:4},{value:"When",id:"when",level:4},{value:"State",id:"state",level:4}];function c(n){const e={a:"a",code:"code",h1:"h1",h3:"h3",h4:"h4",img:"img",p:"p",pre:"pre",strong:"strong",...(0,s.a)(),...n.components};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(e.h1,{id:"onboarding",children:"Onboarding"}),"\n",(0,o.jsx)(e.p,{children:"A Podman Desktop extension can offer an onboarding workflow to guide users in installing and setting up all the necessary tools for the extension to work, and optionally to provide explanations about the capabilities of the extension."}),"\n",(0,o.jsxs)(e.p,{children:["Adding onboarding to an extension is as simple as writing JSON in the ",(0,o.jsx)(e.code,{children:"package.json"}),". Podman Desktop will convert the JSON object into actual code to render all items."]}),"\n",(0,o.jsx)(e.p,{children:"Onboarding consists of a title, a description, media (image), an enablement clause, and a list of steps. Only the title, enablement clause, and the steps are mandatory, as they constitute the minimum information required to define a workflow.\nBefore getting into the details, let's examine the JSON schema."}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'{\n "title": "onboarding",\n "type": "object",\n "properties": {\n "title": {\n "type": "string"\n },\n "description": {\n "type": "string"\n },\n "media": {\n "path": {\n "type": "string"\n },\n "altText": {\n "type": "string"\n }\n },\n "enablement": {\n "type": "string"\n },\n "steps": {\n "type": "array",\n "items": {\n "type": "object",\n "properties": {\n "id": {\n "type": "string"\n },\n "title": {\n "type": "string"\n },\n "description": {\n "type": "string"\n },\n "media": {\n "path": {\n "type": "string"\n },\n "altText": {\n "type": "string"\n }\n },\n "command": {\n "type": "string"\n },\n "completionEvents": {\n "type": "array",\n "items": {\n "type": "string"\n }\n },\n "content": {\n "type": "array",\n "items": {\n "type": "array",\n "items": {\n "type": "object",\n "properties": {\n "value": {\n "type": "string"\n },\n "highlight": {\n "type": "boolean"\n },\n "when": {\n "type": "string"\n }\n },\n "required": ["value"]\n }\n }\n },\n "when": {\n "type": "string"\n },\n "component": {\n "type": "string",\n "enum": ["createContainerProviderConnection", "createKubernetesProviderConnection"]\n },\n "state": {\n "type": "string",\n "enum": ["completed", "failed"]\n }\n },\n "required": ["id", "title"]\n }\n }\n },\n "required": ["title", "enablement", "steps"]\n}\n'})}),"\n",(0,o.jsx)(e.h3,{id:"title-description-and-media",children:"Title, Description and Media"}),"\n",(0,o.jsxs)(e.p,{children:["The ",(0,o.jsx)(e.strong,{children:"title"}),", the ",(0,o.jsx)(e.strong,{children:"description"})," and the ",(0,o.jsx)(e.strong,{children:"media"})," are all placed in the top left of the onboarding page.\nOnly the title is required. The description and the media are optional.\nIf the media is not specified, Podman Desktop will display the default icon set by the extension in its ",(0,o.jsx)(e.code,{children:"package.json"}),"."]}),"\n",(0,o.jsx)(e.p,{children:"This is how this JSON is defined:"}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"icon": "icon.png",\n...\n"onboarding": {\n "title": "Podman Setup",\n}\n'})}),"\n",(0,o.jsx)(e.p,{children:(0,o.jsx)(e.img,{alt:"img0",src:t(78679).Z+"",width:"1535",height:"983"})}),"\n",(0,o.jsx)(e.h3,{id:"enablement",children:"Enablement"}),"\n",(0,o.jsx)(e.p,{children:"The enablement clause allows Podman Desktop to determine when the onboarding should be enabled.\nWhen this condition is met, the user will find a setup button within the resources page. Clicking on it will initiate the onboarding workflow."}),"\n",(0,o.jsx)(e.p,{children:(0,o.jsx)(e.img,{alt:"img1",src:t(2808).Z+"",width:"1602",height:"1010"})}),"\n",(0,o.jsxs)(e.p,{children:["The enablement clause is mandatory and must be written by using ",(0,o.jsx)(e.a,{href:"/docs/extensions/write/when-clause-context",children:"when clauses"}),"."]}),"\n",(0,o.jsxs)(e.p,{children:["In the following example, we specify that the onboarding needs to be enabled if and only if the user's OS is Linux, and the ",(0,o.jsx)(e.code,{children:"podmanIsNotInstalled"})," context value is true. Alternatively, if the user's OS is different from Linux, that the ",(0,o.jsx)(e.code,{children:"podmanMachineExists"})," context value must be false. Essentially, if the user is on Linux, the onboarding must be enabled only if podman is not installed; for all other operating systems, it should be enabled if there is no Podman machine."]}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"enablement": "(isLinux && onboardingContext:podmanIsNotInstalled) || (!isLinux && !onboardingContext:podmanMachineExists)"\n'})}),"\n",(0,o.jsx)(e.h3,{id:"steps",children:"Steps"}),"\n",(0,o.jsx)(e.p,{children:"The steps property is required and includes the actual content that will be displayed to the user during the workflow."}),"\n",(0,o.jsx)(e.p,{children:"Each step can contribute to the onboarding process in various ways.\nYou can choose to display content explaining concepts to the user, incorporate input elements (such as buttons or textboxes) to encourage user interaction, run commands to perform installations, or showcase settings to be configured."}),"\n",(0,o.jsx)(e.p,{children:"Let's look again at its schema:"}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"type": "object",\n"properties": {\n "id": {\n "type": "string"\n },\n "title": {\n "type": "string"\n },\n "description": {\n "type": "string"\n },\n "media": {\n "path": {\n "type": "string"\n },\n "altText": {\n "type": "string"\n },\n },\n "command": {\n "type": "string"\n },\n "completionEvents": {\n "type": "array",\n "items": {\n "type": "string"\n }\n },\n "content": {\n "type": "array",\n "items": {\n "type": "array",\n "items": {\n "type": "object",\n "properties": {\n "value": {\n "type": "string"\n },\n "highlight": {\n "type": "boolean"\n },\n "when": {\n "type": "string"\n }\n },\n "required": ["value"]\n }\n }\n },\n "when": {\n "type": "string"\n },\n "component": {\n "type": "string",\n "enum": ["createContainerProviderConnection", "createKubernetesProviderConnection"]\n },\n "state": {\n "type": "string",\n "enum": ["completed", "failed"]\n }\n},\n"required": ["id", "title"]\n'})}),"\n",(0,o.jsx)(e.p,{children:"A step has only two mandatory fields - id and title. All other properties are optional."}),"\n",(0,o.jsx)(e.h4,{id:"id",children:"Id"}),"\n",(0,o.jsxs)(e.p,{children:["The ",(0,o.jsx)(e.strong,{children:"id"})," must be unique to identify a step, and it is never displayed directly to the user."]}),"\n",(0,o.jsx)(e.h4,{id:"title-description-and-media-1",children:"Title, description and media"}),"\n",(0,o.jsxs)(e.p,{children:["The ",(0,o.jsx)(e.strong,{children:"title"}),", ",(0,o.jsx)(e.strong,{children:"description"})," and ",(0,o.jsx)(e.strong,{children:"media"})," works as explained earlier. The only difference is their placement - they will appear in the top-center of the body."]}),"\n",(0,o.jsx)(e.p,{children:(0,o.jsx)(e.img,{alt:"img2",src:t(5058).Z+"",width:"1539",height:"981"})}),"\n",(0,o.jsxs)(e.p,{children:[(0,o.jsx)(e.strong,{children:"Note:"})," If media is not specified, Podman Desktop will display the icon of the extension providing the onboarding."]}),"\n",(0,o.jsx)(e.h4,{id:"command",children:"Command"}),"\n",(0,o.jsxs)(e.p,{children:["The ",(0,o.jsx)(e.strong,{children:"command"})," field allows you to declare the name of a command that must be run when the step becomes active.\nThe command must be registered by the extension beforehand, or it will result in an error."]}),"\n",(0,o.jsxs)(e.p,{children:["In the example below, we tell Podman Desktop to call ",(0,o.jsx)(e.code,{children:"podman.onboarding.checkPodmanInstalled"})," when the ",(0,o.jsx)(e.code,{children:"checkPodmanInstalled"})," step becomes active.\nBased on the result, we can then prompt the user to move to another step or display a message."]}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"commands": [\n {\n "command": "podman.onboarding.checkPodmanInstalled",\n "title": "Podman: Check podman installation"\n },\n],\n"onboarding": {\n "title": "Podman Setup",\n "steps": [\n {\n "id": "checkPodmanInstalled",\n "title": "Checking for Podman installation",\n "command": "podman.onboarding.checkPodmanInstalled",\n },\n ...\n ],\n ...\n}\n'})}),"\n",(0,o.jsx)(e.p,{children:"During the execution of the command, the user will see a spinner next to the title."}),"\n",(0,o.jsx)(e.p,{children:(0,o.jsx)(e.img,{alt:"img3",src:t(72149).Z+"",width:"1536",height:"972"})}),"\n",(0,o.jsx)(e.h4,{id:"completionevents",children:"CompletionEvents"}),"\n",(0,o.jsx)(e.p,{children:"CompletionEvents define the conditions under which a step should be considered complete."}),"\n",(0,o.jsxs)(e.p,{children:["It currently supports ",(0,o.jsx)(e.code,{children:"onboardingContext"})," and ",(0,o.jsx)(e.code,{children:"onCommand"})," events.\nThe former can be used to evaluate a context value, such as ",(0,o.jsx)(e.code,{children:"onboardingContext:podmanIsInstalled"}),". The latter checks if the command has been executed - ",(0,o.jsx)(e.code,{children:"onCommand:podman.onboarding.installPodman"}),"."]}),"\n",(0,o.jsx)(e.p,{children:"A practical example of progressing the user to the next step after the command finishes its execution is:"}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"commands": [\n {\n "command": "podman.onboarding.checkPodmanInstalled",\n "title": "Podman: Check podman installation"\n },\n],\n"onboarding": {\n "title": "Podman Setup",\n "steps": [\n {\n "id": "checkPodmanInstalled",\n "title": "Checking for Podman installation",\n "command": "podman.onboarding.checkPodmanInstalled",\n "completionEvents": [\n "onCommand:podman.onboarding.checkPodmanInstalled"\n ]\n },\n ...\n ],\n ...\n}\n'})}),"\n",(0,o.jsxs)(e.p,{children:["When the ",(0,o.jsx)(e.code,{children:"checkPodmanInstalled"})," step becomes active, the command ",(0,o.jsx)(e.code,{children:"podman.onboarding.checkPodmanInstalled"})," is invoked. Upon completion of its execution, the step is considered complete, and the user is then moved to the next one."]}),"\n",(0,o.jsx)(e.p,{children:"Here's another example, this time using a context value:"}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"commands": [\n {\n "command": "podman.onboarding.checkPodmanInstalled",\n "title": "Podman: Check podman installation"\n },\n],\n"onboarding": {\n "title": "Podman Setup",\n "steps": [\n {\n "id": "checkPodmanInstalled",\n "title": "Checking for Podman installation",\n "command": "podman.onboarding.checkPodmanInstalled",\n "completionEvents": [\n "onboardingContext:podmanVersion == 4.7.2"\n ]\n },\n ...\n ],\n ...\n}\n'})}),"\n",(0,o.jsxs)(e.p,{children:["When the ",(0,o.jsx)(e.code,{children:"checkPodmanInstalled"})," step becomes active, the command ",(0,o.jsx)(e.code,{children:"podman.onboarding.checkPodmanInstalled"})," is invoked. As soon as the context value ",(0,o.jsx)(e.code,{children:"podmanVersion"})," equals ",(0,o.jsx)(e.code,{children:"4.7.2"}),", the step is marked as completed, and the user is moved to the next one."]}),"\n",(0,o.jsxs)(e.p,{children:["You might wonder: who or what sets the context value? If you use a custom context value, it should be your extension's job to set it. Following the example above, we could set the context value during the execution of ",(0,o.jsx)(e.code,{children:"podman.onboarding.checkPodmanInstalled"})," such as"]}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{children:"extensionApi.commands.registerCommand(\n 'podman.onboarding.checkPodmanInstalled',\n async () => {\n // do something\n ...\n // set podmanVersion context value so we can mark the step as complete\n extensionApi.context.setValue('podmanVersion', '4.7.2', 'onboarding');\n }\n)\n"})}),"\n",(0,o.jsx)(e.p,{children:"After updating the context, the UI is refreshed, and Podman Desktop moves the user to the new step."}),"\n",(0,o.jsx)(e.h4,{id:"content",children:"Content"}),"\n",(0,o.jsxs)(e.p,{children:["The ",(0,o.jsx)(e.strong,{children:"content"})," property is an array of arrays where each item in the parent array defines a row, and each item in the child arrays defines a cell."]}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{children:'content = [\n ["cell", "cell"], //row\n ["cell", "cell", "cell"], //row\n]\n'})}),"\n",(0,o.jsx)(e.p,{children:"The JSON schema for a content cell entry is"}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"type": "object",\n"properties": {\n "value": {\n "type": "string"\n },\n "highlight": {\n "type": "boolean"\n },\n "when": {\n "type": "string"\n }\n},\n"required": ["value"]\n'})}),"\n",(0,o.jsxs)(e.p,{children:[(0,o.jsx)(e.strong,{children:"Value"})," is the only mandatory field and it can be a simple string or a Markdown string to render advanced objects."]}),"\n",(0,o.jsx)(e.p,{children:"In addition to all the standard Markdown syntax, Podman Desktop provides 3 custom Markdown components: button, link, and warnings list."}),"\n",(0,o.jsxs)(e.p,{children:["1 - You can create a button that executes a command (syntax - ",(0,o.jsx)(e.code,{children:':button[Name of the button]{command=command.example title="tooltip text"}'}),") or behaves like a link (syntax - ",(0,o.jsx)(e.code,{children:':button[Name of the button]{href=http://my-link title="tooltip text"}'}),")."]}),"\n",(0,o.jsx)(e.p,{children:"E.g.:"}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"value": ":button[Check requirements again]{command=podman.onboarding.checkPodmanRequirements}"\n'})}),"\n",(0,o.jsx)(e.p,{children:(0,o.jsx)(e.img,{alt:"img4",src:t(22704).Z+"",width:"912",height:"236"})}),"\n",(0,o.jsxs)(e.p,{children:["2 - Similarly, you can create a link that executes a command (syntax ",(0,o.jsx)(e.code,{children:':link[Name of the command link]{command=command.example title="tooltip text"}'}),") or behaves like a normal link (syntax - ",(0,o.jsx)(e.code,{children:':link[Name of the command link]{href=http://my-link title="tooltip text"}'}),")"]}),"\n",(0,o.jsx)(e.p,{children:"E.g.:"}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"value": "To install Podman please follow these :link[installation instructions]{href=https://podman.io/docs/installation#installing-on-linux}"\n'})}),"\n",(0,o.jsx)(e.p,{children:(0,o.jsx)(e.img,{alt:"img5",src:t(61308).Z+"",width:"613",height:"335"})}),"\n",(0,o.jsxs)(e.p,{children:["3 - The warning component allows displaying a list of items (syntax - ",(0,o.jsx)(e.code,{children:":warnings[[item]]"}),"), where an item consists of:"]}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"type": "object",\n"properties": {\n "state": {\n "type": "string"\n },\n "description": {\n "type": "string"\n },\n "command": {\n "type": "object",\n "properties": {\n "id": {\n "type": "string"\n },\n "title": {\n "type": "string"\n }\n },\n "required": [\n "id",\n "title"\n ]\n },\n "docDescription": {\n "type": "string"\n },\n "docLinks": {\n "type": "array",\n "items": {\n "type": "object",\n "properties": {\n "title": {\n "type": "string"\n },\n "url": {\n "type": "string"\n },\n "group": {\n "type": "string"\n }\n },\n "required": [\n "title",\n "url",\n "group"\n ]\n }\n },\n}\n'})}),"\n",(0,o.jsxs)(e.p,{children:["Adding a complete list in the ",(0,o.jsx)(e.code,{children:"package.json"})," can be confusing, so a better approach is to use a context value"]}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'"value": ":warnings[${onboardingContext:warningsMarkdown}]"\n'})}),"\n",(0,o.jsxs)(e.p,{children:["at runtime, ",(0,o.jsx)(e.code,{children:"${onboardingContext:warningsMarkdown}"})," is replaced by the actual list filled in the backend"]}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{children:"const warnings = [];\n...\nconst warning = {\n state: res.successful ? 'successful' : 'failed',\n description: res.description,\n docDescription: res.docLinksDescription,\n docLinks: res.docLinks,\n command: res.fixCommand,\n};\nwarnings.push(warning);\n\nextensionApi.context.setValue('warningsMarkdown', warnings, 'onboarding');\n"})}),"\n",(0,o.jsx)(e.p,{children:(0,o.jsx)(e.img,{alt:"img6",src:t(86519).Z+"",width:"1598",height:"1007"})}),"\n",(0,o.jsxs)(e.p,{children:["The ",(0,o.jsx)(e.strong,{children:"highlight"})," and ",(0,o.jsx)(e.strong,{children:"when"})," properties are optional. They are used to change the background color or define when the content column should be visible."]}),"\n",(0,o.jsx)(e.h4,{id:"component",children:"Component"}),"\n",(0,o.jsxs)(e.p,{children:["Podman Desktop has some built-in components that can fit perfectly into an onboarding workflow, such as the ",(0,o.jsx)(e.code,{children:"create new connection"})," wizard.\nIf you are working on an extension that allows creating a Kubernetes cluster, it would not make sense to re-create a page where the user can add the name, the resources to use, and so on. This is when the component field comes in handy."]}),"\n",(0,o.jsx)(e.p,{children:"By specifying the component you want to import, all the elements, styling, and actions are embedded into the step."}),"\n",(0,o.jsxs)(e.p,{children:["Currently, Podman Desktop only supports two types of components for onboarding: ",(0,o.jsx)(e.code,{children:"createContainerProviderConnection"})," and ",(0,o.jsx)(e.code,{children:"createKubernetesProviderConnection"}),"."]}),"\n",(0,o.jsx)(e.p,{children:"An example can be seen in the Podman extension, where you can create a Podman machine during the workflow."}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'{\n "id": "createPodmanMachine",\n "title": "Create a Podman machine",\n "when": "!onboardingContext:podmanMachineExists && !isLinux",\n "completionEvents": [\n "onboardingContext:podmanMachineExists"\n ],\n "component": "createContainerProviderConnection"\n},\n'})}),"\n",(0,o.jsx)(e.p,{children:(0,o.jsx)(e.img,{alt:"img7",src:t(59044).Z+"",width:"1517",height:"1001"})}),"\n",(0,o.jsxs)(e.p,{children:[(0,o.jsx)(e.strong,{children:"Note:"})," when using the ",(0,o.jsx)(e.strong,{children:"component"})," field, you should omit the ",(0,o.jsx)(e.strong,{children:"content"})]}),"\n",(0,o.jsx)(e.h4,{id:"when",children:"When"}),"\n",(0,o.jsxs)(e.p,{children:["The ",(0,o.jsx)(e.strong,{children:"when"})," property defines when a step must be visible. You can use any when clause, and Podman Desktop will evaluate it any time the context changes."]}),"\n",(0,o.jsx)(e.h4,{id:"state",children:"State"}),"\n",(0,o.jsxs)(e.p,{children:["The ",(0,o.jsx)(e.strong,{children:"state"}),", when set, allows Podman Desktop to distinguish a normal step from a special one. It is used to associate a step with a failed state (",(0,o.jsx)(e.code,{children:"failed"}),") or, alternatively, with a complete state (",(0,o.jsx)(e.code,{children:"completed"}),")."]}),"\n",(0,o.jsxs)(e.p,{children:[(0,o.jsx)(e.strong,{children:"Note:"})," the last workflow step should have ",(0,o.jsx)(e.code,{children:"completed"})," state."]}),"\n",(0,o.jsxs)(e.p,{children:["Based on the ",(0,o.jsx)(e.strong,{children:"state"}),", Podman Desktop might show some default objects."]}),"\n",(0,o.jsxs)(e.p,{children:["When a step with a failed state is encountered, Podman Desktop displays a ",(0,o.jsx)(e.code,{children:"Retry"})," button, allowing the user to restart the workflow."]}),"\n",(0,o.jsx)(e.pre,{children:(0,o.jsx)(e.code,{className:"language-json",children:'{\n "id": "podmanFailedInstallation",\n "title": "Failed installing Podman",\n "when": "onboardingContext:podmanFailedInstallation",\n "state": "failed"\n},\n{\n "id": "podmanSuccessfullySetup",\n "title": "Podman successfully setup",\n "when": "onboardingContext:podmanIsInstalled",\n "state": "completed"\n}\n'})})]})}function A(n={}){const{wrapper:e}={...(0,s.a)(),...n.components};return e?(0,o.jsx)(e,{...n,children:(0,o.jsx)(c,{...n})}):c(n)}},22704:(n,e,t)=>{t.d(e,{Z:()=>o});const o="data:image/png;base64,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"},59044:(n,e,t)=>{t.d(e,{Z:()=>o});const o=t.p+"assets/images/component_field-f5365284785944953339f77e4f63050e.png"},61308:(n,e,t)=>{t.d(e,{Z:()=>o});const o=t.p+"assets/images/link_micromark-054caad1549f752aff722890fb11be7c.png"},2808:(n,e,t)=>{t.d(e,{Z:()=>o});const o=t.p+"assets/images/setup_button-71362a4db9503ffb2fd2ae5b569112d5.png"},72149:(n,e,t)=>{t.d(e,{Z:()=>o});const o=t.p+"assets/images/spinner_title-1bcdcb7a4b920917f5b9dc93d945da28.png"},5058:(n,e,t)=>{t.d(e,{Z:()=>o});const o=t.p+"assets/images/step_title_description_media-185a47edbda6dd96d333a8d4a8b763be.png"},78679:(n,e,t)=>{t.d(e,{Z:()=>o});const o=t.p+"assets/images/title_media_description-9afd3b427798bb088d84d412a20f1222.png"},86519:(n,e,t)=>{t.d(e,{Z:()=>o});const o=t.p+"assets/images/warnings_micromark-0346d6cb229d20bd85d4eae552a91b31.png"},71670:(n,e,t)=>{t.d(e,{Z:()=>d,a:()=>a});var o=t(27378);const s={},i=o.createContext(s);function a(n){const e=o.useContext(i);return o.useMemo((function(){return"function"==typeof n?n(e):{...e,...n}}),[e,n])}function d(n){let e;return e=n.disableParentContext?"function"==typeof n.components?n.components(s):n.components||s:a(n.components),o.createElement(i.Provider,{value:e},n.children)}}}]); \ No newline at end of file diff --git a/assets/js/efc2a09d.e6cd623d.js b/assets/js/efc2a09d.e6cd623d.js new file mode 100644 index 00000000000..a5655b90729 --- /dev/null +++ b/assets/js/efc2a09d.e6cd623d.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[7739],{15799:(n,e,t)=>{t.r(e),t.d(e,{assets:()=>r,contentTitle:()=>a,default:()=>h,frontMatter:()=>i,metadata:()=>d,toc:()=>l});var s=t(24246),o=t(71670);const i={sidebar_position:1,title:"Onboarding workflow",description:"Podman Desktop onboarding workflow reference",tags:["podman-desktop","extension","writing","onboarding"],keywords:["podman desktop","extension","writing","onboarding"]},a="Onboarding",d={id:"extensions/write/onboarding-workflow",title:"Onboarding workflow",description:"Podman Desktop onboarding workflow reference",source:"@site/docs/extensions/write/onboarding-workflow.md",sourceDirName:"extensions/write",slug:"/extensions/write/onboarding-workflow",permalink:"/docs/extensions/write/onboarding-workflow",draft:!1,unlisted:!1,editUrl:"https://github.com/containers/podman-desktop/tree/main/website/docs/extensions/write/onboarding-workflow.md",tags:[{label:"podman-desktop",permalink:"/docs/tags/podman-desktop"},{label:"extension",permalink:"/docs/tags/extension"},{label:"writing",permalink:"/docs/tags/writing"},{label:"onboarding",permalink:"/docs/tags/onboarding"}],version:"current",sidebarPosition:1,frontMatter:{sidebar_position:1,title:"Onboarding workflow",description:"Podman Desktop onboarding workflow reference",tags:["podman-desktop","extension","writing","onboarding"],keywords:["podman desktop","extension","writing","onboarding"]},sidebar:"mySidebar",previous:{title:"Writing",permalink:"/docs/extensions/write/"},next:{title:"When clause contexts",permalink:"/docs/extensions/write/when-clause-context"}},r={},l=[{value:"Title, Description and Media",id:"title-description-and-media",level:3},{value:"Enablement",id:"enablement",level:3},{value:"Steps",id:"steps",level:3},{value:"Id",id:"id",level:4},{value:"Title, description and media",id:"title-description-and-media-1",level:4},{value:"Command",id:"command",level:4},{value:"CompletionEvents",id:"completionevents",level:4},{value:"Content",id:"content",level:4},{value:"Component",id:"component",level:4},{value:"When",id:"when",level:4},{value:"State",id:"state",level:4}];function c(n){const e={a:"a",code:"code",h1:"h1",h3:"h3",h4:"h4",img:"img",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,o.a)(),...n.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(e.h1,{id:"onboarding",children:"Onboarding"}),"\n",(0,s.jsx)(e.p,{children:"A Podman Desktop extension can offer an onboarding workflow to guide users in installing and setting up all the necessary tools for the extension to work, and optionally to provide explanations about the capabilities of the extension."}),"\n",(0,s.jsxs)(e.p,{children:["Adding onboarding to an extension is as simple as writing JSON in the ",(0,s.jsx)(e.code,{children:"package.json"}),". Podman Desktop will convert the JSON object into actual code to render all items."]}),"\n",(0,s.jsx)(e.p,{children:"Onboarding consists of a title, a description, media (image), an enablement clause, and a list of steps. Only the title, enablement clause, and the steps are mandatory, as they constitute the minimum information required to define a workflow.\nBefore getting into the details, let's examine the JSON schema."}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'{\n "title": "onboarding",\n "type": "object",\n "properties": {\n "title": {\n "type": "string"\n },\n "description": {\n "type": "string"\n },\n "media": {\n "path": {\n "type": "string"\n },\n "altText": {\n "type": "string"\n }\n },\n "enablement": {\n "type": "string"\n },\n "steps": {\n "type": "array",\n "items": {\n "type": "object",\n "properties": {\n "id": {\n "type": "string"\n },\n "title": {\n "type": "string"\n },\n "description": {\n "type": "string"\n },\n "media": {\n "path": {\n "type": "string"\n },\n "altText": {\n "type": "string"\n }\n },\n "command": {\n "type": "string"\n },\n "completionEvents": {\n "type": "array",\n "items": {\n "type": "string"\n }\n },\n "content": {\n "type": "array",\n "items": {\n "type": "array",\n "items": {\n "type": "object",\n "properties": {\n "value": {\n "type": "string"\n },\n "highlight": {\n "type": "boolean"\n },\n "when": {\n "type": "string"\n }\n },\n "required": ["value"]\n }\n }\n },\n "when": {\n "type": "string"\n },\n "component": {\n "type": "string",\n "enum": ["createContainerProviderConnection", "createKubernetesProviderConnection"]\n },\n "state": {\n "type": "string",\n "enum": ["completed", "failed"]\n }\n },\n "required": ["id", "title"]\n }\n }\n },\n "required": ["title", "enablement", "steps"]\n}\n'})}),"\n",(0,s.jsx)(e.h3,{id:"title-description-and-media",children:"Title, Description and Media"}),"\n",(0,s.jsxs)(e.p,{children:["The ",(0,s.jsx)(e.strong,{children:"title"}),", the ",(0,s.jsx)(e.strong,{children:"description"})," and the ",(0,s.jsx)(e.strong,{children:"media"})," are all placed in the top left of the onboarding page.\nOnly the title is required. The description and the media are optional.\nIf the media is not specified, Podman Desktop will display the default icon set by the extension in its ",(0,s.jsx)(e.code,{children:"package.json"}),"."]}),"\n",(0,s.jsx)(e.p,{children:"This is how this JSON is defined:"}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"icon": "icon.png",\n...\n"onboarding": {\n "title": "Podman Setup",\n}\n'})}),"\n",(0,s.jsx)(e.p,{children:(0,s.jsx)(e.img,{alt:"img0",src:t(78679).Z+"",width:"1535",height:"983"})}),"\n",(0,s.jsx)(e.h3,{id:"enablement",children:"Enablement"}),"\n",(0,s.jsx)(e.p,{children:"The enablement clause allows Podman Desktop to determine when the onboarding should be enabled.\nWhen this condition is met, the user will find a setup button within the resources page. Clicking on it will initiate the onboarding workflow."}),"\n",(0,s.jsx)(e.p,{children:(0,s.jsx)(e.img,{alt:"img1",src:t(2808).Z+"",width:"1602",height:"1010"})}),"\n",(0,s.jsxs)(e.p,{children:["The enablement clause is mandatory and must be written by using ",(0,s.jsx)(e.a,{href:"/docs/extensions/write/when-clause-context",children:"when clauses"}),"."]}),"\n",(0,s.jsxs)(e.p,{children:["In the following example, we specify that the onboarding needs to be enabled if and only if the user's OS is Linux, and the ",(0,s.jsx)(e.code,{children:"podmanIsNotInstalled"})," context value is true. Alternatively, if the user's OS is different from Linux, that the ",(0,s.jsx)(e.code,{children:"podmanMachineExists"})," context value must be false. Essentially, if the user is on Linux, the onboarding must be enabled only if podman is not installed; for all other operating systems, it should be enabled if there is no Podman machine."]}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"enablement": "(isLinux && onboardingContext:podmanIsNotInstalled) || (!isLinux && !onboardingContext:podmanMachineExists)"\n'})}),"\n",(0,s.jsx)(e.h3,{id:"steps",children:"Steps"}),"\n",(0,s.jsx)(e.p,{children:"The steps property is required and includes the actual content that will be displayed to the user during the workflow."}),"\n",(0,s.jsx)(e.p,{children:"Each step can contribute to the onboarding process in various ways.\nYou can choose to display content explaining concepts to the user, incorporate input elements (such as buttons or textboxes) to encourage user interaction, run commands to perform installations, or showcase settings to be configured."}),"\n",(0,s.jsx)(e.p,{children:"Let's look again at its schema:"}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"type": "object",\n"properties": {\n "id": {\n "type": "string"\n },\n "title": {\n "type": "string"\n },\n "description": {\n "type": "string"\n },\n "media": {\n "path": {\n "type": "string"\n },\n "altText": {\n "type": "string"\n },\n },\n "command": {\n "type": "string"\n },\n "completionEvents": {\n "type": "array",\n "items": {\n "type": "string"\n }\n },\n "content": {\n "type": "array",\n "items": {\n "type": "array",\n "items": {\n "type": "object",\n "properties": {\n "value": {\n "type": "string"\n },\n "highlight": {\n "type": "boolean"\n },\n "when": {\n "type": "string"\n }\n },\n "required": ["value"]\n }\n }\n },\n "when": {\n "type": "string"\n },\n "component": {\n "type": "string",\n "enum": ["createContainerProviderConnection", "createKubernetesProviderConnection"]\n },\n "state": {\n "type": "string",\n "enum": ["completed", "failed"]\n }\n},\n"required": ["id", "title"]\n'})}),"\n",(0,s.jsx)(e.p,{children:"A step has only two mandatory fields - id and title. All other properties are optional."}),"\n",(0,s.jsx)(e.h4,{id:"id",children:"Id"}),"\n",(0,s.jsxs)(e.p,{children:["The ",(0,s.jsx)(e.strong,{children:"id"})," must be unique to identify a step, and it is never displayed directly to the user."]}),"\n",(0,s.jsxs)(e.p,{children:["To analyze more easily in telemetry the steps executed by users, the ",(0,s.jsx)(e.strong,{children:"id"})," values must respect some rules.\nTo help developers respect these rules, a warning is displayed in case of non-repsect when Podman Destop loads the onboarding."]}),"\n",(0,s.jsx)(e.p,{children:"The rules are:"}),"\n",(0,s.jsxs)(e.ul,{children:["\n",(0,s.jsxs)(e.li,{children:["for a step defining a command, the id must terminate with ",(0,s.jsx)(e.code,{children:"Command"}),","]}),"\n",(0,s.jsxs)(e.li,{children:["for a state defining ",(0,s.jsx)(e.code,{children:"state='failed'"}),", the id must terminate with ",(0,s.jsx)(e.code,{children:"Failure"}),","]}),"\n",(0,s.jsxs)(e.li,{children:["for a state defining ",(0,s.jsx)(e.code,{children:"state='completed'"}),", the id must terminate with ",(0,s.jsx)(e.code,{children:"Success"}),","]}),"\n",(0,s.jsxs)(e.li,{children:["for any other step, the id must termminate with ",(0,s.jsx)(e.code,{children:"View"}),"."]}),"\n"]}),"\n",(0,s.jsx)(e.h4,{id:"title-description-and-media-1",children:"Title, description and media"}),"\n",(0,s.jsxs)(e.p,{children:["The ",(0,s.jsx)(e.strong,{children:"title"}),", ",(0,s.jsx)(e.strong,{children:"description"})," and ",(0,s.jsx)(e.strong,{children:"media"})," works as explained earlier. The only difference is their placement - they will appear in the top-center of the body."]}),"\n",(0,s.jsx)(e.p,{children:(0,s.jsx)(e.img,{alt:"img2",src:t(5058).Z+"",width:"1539",height:"981"})}),"\n",(0,s.jsxs)(e.p,{children:[(0,s.jsx)(e.strong,{children:"Note:"})," If media is not specified, Podman Desktop will display the icon of the extension providing the onboarding."]}),"\n",(0,s.jsx)(e.h4,{id:"command",children:"Command"}),"\n",(0,s.jsxs)(e.p,{children:["The ",(0,s.jsx)(e.strong,{children:"command"})," field allows you to declare the name of a command that must be run when the step becomes active.\nThe command must be registered by the extension beforehand, or it will result in an error."]}),"\n",(0,s.jsxs)(e.p,{children:["In the example below, we tell Podman Desktop to call ",(0,s.jsx)(e.code,{children:"podman.onboarding.checkPodmanInstalled"})," when the ",(0,s.jsx)(e.code,{children:"checkPodmanInstalled"})," step becomes active.\nBased on the result, we can then prompt the user to move to another step or display a message."]}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"commands": [\n {\n "command": "podman.onboarding.checkPodmanInstalled",\n "title": "Podman: Check podman installation"\n },\n],\n"onboarding": {\n "title": "Podman Setup",\n "steps": [\n {\n "id": "checkPodmanInstalled",\n "title": "Checking for Podman installation",\n "command": "podman.onboarding.checkPodmanInstalled",\n },\n ...\n ],\n ...\n}\n'})}),"\n",(0,s.jsx)(e.p,{children:"During the execution of the command, the user will see a spinner next to the title."}),"\n",(0,s.jsx)(e.p,{children:(0,s.jsx)(e.img,{alt:"img3",src:t(72149).Z+"",width:"1536",height:"972"})}),"\n",(0,s.jsx)(e.h4,{id:"completionevents",children:"CompletionEvents"}),"\n",(0,s.jsx)(e.p,{children:"CompletionEvents define the conditions under which a step should be considered complete."}),"\n",(0,s.jsxs)(e.p,{children:["It currently supports ",(0,s.jsx)(e.code,{children:"onboardingContext"})," and ",(0,s.jsx)(e.code,{children:"onCommand"})," events.\nThe former can be used to evaluate a context value, such as ",(0,s.jsx)(e.code,{children:"onboardingContext:podmanIsInstalled"}),". The latter checks if the command has been executed - ",(0,s.jsx)(e.code,{children:"onCommand:podman.onboarding.installPodman"}),"."]}),"\n",(0,s.jsx)(e.p,{children:"A practical example of progressing the user to the next step after the command finishes its execution is:"}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"commands": [\n {\n "command": "podman.onboarding.checkPodmanInstalled",\n "title": "Podman: Check podman installation"\n },\n],\n"onboarding": {\n "title": "Podman Setup",\n "steps": [\n {\n "id": "checkPodmanInstalled",\n "title": "Checking for Podman installation",\n "command": "podman.onboarding.checkPodmanInstalled",\n "completionEvents": [\n "onCommand:podman.onboarding.checkPodmanInstalled"\n ]\n },\n ...\n ],\n ...\n}\n'})}),"\n",(0,s.jsxs)(e.p,{children:["When the ",(0,s.jsx)(e.code,{children:"checkPodmanInstalled"})," step becomes active, the command ",(0,s.jsx)(e.code,{children:"podman.onboarding.checkPodmanInstalled"})," is invoked. Upon completion of its execution, the step is considered complete, and the user is then moved to the next one."]}),"\n",(0,s.jsx)(e.p,{children:"Here's another example, this time using a context value:"}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"commands": [\n {\n "command": "podman.onboarding.checkPodmanInstalled",\n "title": "Podman: Check podman installation"\n },\n],\n"onboarding": {\n "title": "Podman Setup",\n "steps": [\n {\n "id": "checkPodmanInstalled",\n "title": "Checking for Podman installation",\n "command": "podman.onboarding.checkPodmanInstalled",\n "completionEvents": [\n "onboardingContext:podmanVersion == 4.7.2"\n ]\n },\n ...\n ],\n ...\n}\n'})}),"\n",(0,s.jsxs)(e.p,{children:["When the ",(0,s.jsx)(e.code,{children:"checkPodmanInstalled"})," step becomes active, the command ",(0,s.jsx)(e.code,{children:"podman.onboarding.checkPodmanInstalled"})," is invoked. As soon as the context value ",(0,s.jsx)(e.code,{children:"podmanVersion"})," equals ",(0,s.jsx)(e.code,{children:"4.7.2"}),", the step is marked as completed, and the user is moved to the next one."]}),"\n",(0,s.jsxs)(e.p,{children:["You might wonder: who or what sets the context value? If you use a custom context value, it should be your extension's job to set it. Following the example above, we could set the context value during the execution of ",(0,s.jsx)(e.code,{children:"podman.onboarding.checkPodmanInstalled"})," such as"]}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{children:"extensionApi.commands.registerCommand(\n 'podman.onboarding.checkPodmanInstalled',\n async () => {\n // do something\n ...\n // set podmanVersion context value so we can mark the step as complete\n extensionApi.context.setValue('podmanVersion', '4.7.2', 'onboarding');\n }\n)\n"})}),"\n",(0,s.jsx)(e.p,{children:"After updating the context, the UI is refreshed, and Podman Desktop moves the user to the new step."}),"\n",(0,s.jsx)(e.h4,{id:"content",children:"Content"}),"\n",(0,s.jsxs)(e.p,{children:["The ",(0,s.jsx)(e.strong,{children:"content"})," property is an array of arrays where each item in the parent array defines a row, and each item in the child arrays defines a cell."]}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{children:'content = [\n ["cell", "cell"], //row\n ["cell", "cell", "cell"], //row\n]\n'})}),"\n",(0,s.jsx)(e.p,{children:"The JSON schema for a content cell entry is"}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"type": "object",\n"properties": {\n "value": {\n "type": "string"\n },\n "highlight": {\n "type": "boolean"\n },\n "when": {\n "type": "string"\n }\n},\n"required": ["value"]\n'})}),"\n",(0,s.jsxs)(e.p,{children:[(0,s.jsx)(e.strong,{children:"Value"})," is the only mandatory field and it can be a simple string or a Markdown string to render advanced objects."]}),"\n",(0,s.jsx)(e.p,{children:"In addition to all the standard Markdown syntax, Podman Desktop provides 3 custom Markdown components: button, link, and warnings list."}),"\n",(0,s.jsxs)(e.p,{children:["1 - You can create a button that executes a command (syntax - ",(0,s.jsx)(e.code,{children:':button[Name of the button]{command=command.example title="tooltip text"}'}),") or behaves like a link (syntax - ",(0,s.jsx)(e.code,{children:':button[Name of the button]{href=http://my-link title="tooltip text"}'}),")."]}),"\n",(0,s.jsx)(e.p,{children:"E.g.:"}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"value": ":button[Check requirements again]{command=podman.onboarding.checkPodmanRequirements}"\n'})}),"\n",(0,s.jsx)(e.p,{children:(0,s.jsx)(e.img,{alt:"img4",src:t(22704).Z+"",width:"912",height:"236"})}),"\n",(0,s.jsxs)(e.p,{children:["2 - Similarly, you can create a link that executes a command (syntax ",(0,s.jsx)(e.code,{children:':link[Name of the command link]{command=command.example title="tooltip text"}'}),") or behaves like a normal link (syntax - ",(0,s.jsx)(e.code,{children:':link[Name of the command link]{href=http://my-link title="tooltip text"}'}),")"]}),"\n",(0,s.jsx)(e.p,{children:"E.g.:"}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"value": "To install Podman please follow these :link[installation instructions]{href=https://podman.io/docs/installation#installing-on-linux}"\n'})}),"\n",(0,s.jsx)(e.p,{children:(0,s.jsx)(e.img,{alt:"img5",src:t(61308).Z+"",width:"613",height:"335"})}),"\n",(0,s.jsxs)(e.p,{children:["3 - The warning component allows displaying a list of items (syntax - ",(0,s.jsx)(e.code,{children:":warnings[[item]]"}),"), where an item consists of:"]}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"type": "object",\n"properties": {\n "state": {\n "type": "string"\n },\n "description": {\n "type": "string"\n },\n "command": {\n "type": "object",\n "properties": {\n "id": {\n "type": "string"\n },\n "title": {\n "type": "string"\n }\n },\n "required": [\n "id",\n "title"\n ]\n },\n "docDescription": {\n "type": "string"\n },\n "docLinks": {\n "type": "array",\n "items": {\n "type": "object",\n "properties": {\n "title": {\n "type": "string"\n },\n "url": {\n "type": "string"\n },\n "group": {\n "type": "string"\n }\n },\n "required": [\n "title",\n "url",\n "group"\n ]\n }\n },\n}\n'})}),"\n",(0,s.jsxs)(e.p,{children:["Adding a complete list in the ",(0,s.jsx)(e.code,{children:"package.json"})," can be confusing, so a better approach is to use a context value"]}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'"value": ":warnings[${onboardingContext:warningsMarkdown}]"\n'})}),"\n",(0,s.jsxs)(e.p,{children:["at runtime, ",(0,s.jsx)(e.code,{children:"${onboardingContext:warningsMarkdown}"})," is replaced by the actual list filled in the backend"]}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{children:"const warnings = [];\n...\nconst warning = {\n state: res.successful ? 'successful' : 'failed',\n description: res.description,\n docDescription: res.docLinksDescription,\n docLinks: res.docLinks,\n command: res.fixCommand,\n};\nwarnings.push(warning);\n\nextensionApi.context.setValue('warningsMarkdown', warnings, 'onboarding');\n"})}),"\n",(0,s.jsx)(e.p,{children:(0,s.jsx)(e.img,{alt:"img6",src:t(86519).Z+"",width:"1598",height:"1007"})}),"\n",(0,s.jsxs)(e.p,{children:["The ",(0,s.jsx)(e.strong,{children:"highlight"})," and ",(0,s.jsx)(e.strong,{children:"when"})," properties are optional. They are used to change the background color or define when the content column should be visible."]}),"\n",(0,s.jsx)(e.h4,{id:"component",children:"Component"}),"\n",(0,s.jsxs)(e.p,{children:["Podman Desktop has some built-in components that can fit perfectly into an onboarding workflow, such as the ",(0,s.jsx)(e.code,{children:"create new connection"})," wizard.\nIf you are working on an extension that allows creating a Kubernetes cluster, it would not make sense to re-create a page where the user can add the name, the resources to use, and so on. This is when the component field comes in handy."]}),"\n",(0,s.jsx)(e.p,{children:"By specifying the component you want to import, all the elements, styling, and actions are embedded into the step."}),"\n",(0,s.jsxs)(e.p,{children:["Currently, Podman Desktop only supports two types of components for onboarding: ",(0,s.jsx)(e.code,{children:"createContainerProviderConnection"})," and ",(0,s.jsx)(e.code,{children:"createKubernetesProviderConnection"}),"."]}),"\n",(0,s.jsx)(e.p,{children:"An example can be seen in the Podman extension, where you can create a Podman machine during the workflow."}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'{\n "id": "createPodmanMachine",\n "title": "Create a Podman machine",\n "when": "!onboardingContext:podmanMachineExists && !isLinux",\n "completionEvents": [\n "onboardingContext:podmanMachineExists"\n ],\n "component": "createContainerProviderConnection"\n},\n'})}),"\n",(0,s.jsx)(e.p,{children:(0,s.jsx)(e.img,{alt:"img7",src:t(59044).Z+"",width:"1517",height:"1001"})}),"\n",(0,s.jsxs)(e.p,{children:[(0,s.jsx)(e.strong,{children:"Note:"})," when using the ",(0,s.jsx)(e.strong,{children:"component"})," field, you should omit the ",(0,s.jsx)(e.strong,{children:"content"})]}),"\n",(0,s.jsx)(e.h4,{id:"when",children:"When"}),"\n",(0,s.jsxs)(e.p,{children:["The ",(0,s.jsx)(e.strong,{children:"when"})," property defines when a step must be visible. You can use any when clause, and Podman Desktop will evaluate it any time the context changes."]}),"\n",(0,s.jsx)(e.h4,{id:"state",children:"State"}),"\n",(0,s.jsxs)(e.p,{children:["The ",(0,s.jsx)(e.strong,{children:"state"}),", when set, allows Podman Desktop to distinguish a normal step from a special one. It is used to associate a step with a failed state (",(0,s.jsx)(e.code,{children:"failed"}),") or, alternatively, with a complete state (",(0,s.jsx)(e.code,{children:"completed"}),")."]}),"\n",(0,s.jsxs)(e.p,{children:[(0,s.jsx)(e.strong,{children:"Note:"})," the last workflow step should have ",(0,s.jsx)(e.code,{children:"completed"})," state."]}),"\n",(0,s.jsxs)(e.p,{children:["Based on the ",(0,s.jsx)(e.strong,{children:"state"}),", Podman Desktop might show some default objects."]}),"\n",(0,s.jsxs)(e.p,{children:["When a step with a failed state is encountered, Podman Desktop displays a ",(0,s.jsx)(e.code,{children:"Retry"})," button, allowing the user to restart the workflow."]}),"\n",(0,s.jsx)(e.pre,{children:(0,s.jsx)(e.code,{className:"language-json",children:'{\n "id": "podmanFailedInstallation",\n "title": "Failed installing Podman",\n "when": "onboardingContext:podmanFailedInstallation",\n "state": "failed"\n},\n{\n "id": "podmanSuccessfullySetup",\n "title": "Podman successfully setup",\n "when": "onboardingContext:podmanIsInstalled",\n "state": "completed"\n}\n'})})]})}function h(n={}){const{wrapper:e}={...(0,o.a)(),...n.components};return e?(0,s.jsx)(e,{...n,children:(0,s.jsx)(c,{...n})}):c(n)}},22704:(n,e,t)=>{t.d(e,{Z:()=>s});const s="data:image/png;base64,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"},59044:(n,e,t)=>{t.d(e,{Z:()=>s});const s=t.p+"assets/images/component_field-f5365284785944953339f77e4f63050e.png"},61308:(n,e,t)=>{t.d(e,{Z:()=>s});const s=t.p+"assets/images/link_micromark-054caad1549f752aff722890fb11be7c.png"},2808:(n,e,t)=>{t.d(e,{Z:()=>s});const s=t.p+"assets/images/setup_button-71362a4db9503ffb2fd2ae5b569112d5.png"},72149:(n,e,t)=>{t.d(e,{Z:()=>s});const s=t.p+"assets/images/spinner_title-1bcdcb7a4b920917f5b9dc93d945da28.png"},5058:(n,e,t)=>{t.d(e,{Z:()=>s});const s=t.p+"assets/images/step_title_description_media-185a47edbda6dd96d333a8d4a8b763be.png"},78679:(n,e,t)=>{t.d(e,{Z:()=>s});const s=t.p+"assets/images/title_media_description-9afd3b427798bb088d84d412a20f1222.png"},86519:(n,e,t)=>{t.d(e,{Z:()=>s});const s=t.p+"assets/images/warnings_micromark-0346d6cb229d20bd85d4eae552a91b31.png"},71670:(n,e,t)=>{t.d(e,{Z:()=>d,a:()=>a});var s=t(27378);const o={},i=s.createContext(o);function a(n){const e=s.useContext(i);return s.useMemo((function(){return"function"==typeof n?n(e):{...e,...n}}),[e,n])}function d(n){let e;return e=n.disableParentContext?"function"==typeof n.components?n.components(o):n.components||o:a(n.components),s.createElement(i.Provider,{value:e},n.children)}}}]); \ No newline at end of file diff --git a/assets/js/runtime~main.1ad85984.js b/assets/js/runtime~main.82c98736.js similarity index 99% rename from assets/js/runtime~main.1ad85984.js rename to assets/js/runtime~main.82c98736.js index 2dace695c0a..e930837a296 100644 --- a/assets/js/runtime~main.1ad85984.js +++ b/assets/js/runtime~main.82c98736.js @@ -1 +1 @@ -(()=>{"use strict";var e,a,c,f,d,b={},r={};function t(e){var a=r[e];if(void 0!==a)return a.exports;var c=r[e]={exports:{}};return b[e].call(c.exports,c,c.exports,t),c.exports}t.m=b,e=[],t.O=(a,c,f,d)=>{if(!c){var b=1/0;for(n=0;nA step has only two mandatory fields - id and title. All other properties are optional.
The id must be unique to identify a step, and it is never displayed directly to the user.
+To analyze more easily in telemetry the steps executed by users, the id values must respect some rules. +To help developers respect these rules, a warning is displayed in case of non-repsect when Podman Destop loads the onboarding.
+The rules are:
+Command,state='failed', the id must terminate with Failure,state='completed', the id must terminate with Success,View.The title, description and media works as explained earlier. The only difference is their placement - they will appear in the top-center of the body.
