feat: adds starting state

Will help for #334

Change-Id: Ie282b08e56577c142346cb5a8606233d3ba16d83
Signed-off-by: Florent Benoit <fbenoit@redhat.com>

extensions/podman/src/extension.ts

@@ -48,6 +48,7 @@ type MachineJSON = {
   Memory: string;
   DiskSize: string;
   Running: boolean;
+  Starting: boolean;
 };
 
 type MachineInfo = {
@@ -67,7 +68,14 @@ async function updateMachines(provider: extensionApi.Provider): Promise<void> {
   // update status of existing machines
   machines.forEach(machine => {
     const running = machine?.Running === true;
-    const status = running ? 'started' : 'stopped';
+    let status: extensionApi.ProviderConnectionStatus = running ? 'started' : 'stopped';
+
+    // update the status to starting if the machine is starting but not yet running
+    const starting = machine?.Starting === true;
+    if (!running && starting) {
+      status = 'starting';
+    }
+
     const previousStatus = podmanMachinesStatuses.get(machine.Name);
     if (previousStatus !== status) {
       // notify status change
@@ -123,9 +131,13 @@ async function updateMachines(provider: extensionApi.Provider): Promise<void> {
     provider.updateStatus('installed');
   } else {
     const atLeastOneMachineRunning = machines.some(machine => machine.Running);
+    const atLeastOneMachineStarting = machines.some(machine => machine.Starting);
     // if a machine is running it's started else it is ready
     if (atLeastOneMachineRunning) {
       provider.updateStatus('ready');
+    } else if (atLeastOneMachineStarting) {
+      // update to starting
+      provider.updateStatus('starting');
     } else {
       // needs to start a machine
       provider.updateStatus('configured');

packages/renderer/src/lib/welcome/ProviderStarting.svelte

@@ -0,0 +1,29 @@
+<script lang="ts">
+import type { CheckStatus, ProviderInfo } from '../../../../main/src/plugin/api/provider-info';
+import ProviderLinks from './ProviderLinks.svelte';
+import ProviderLogo from './ProviderLogo.svelte';
+
+export let provider: ProviderInfo;
+</script>
+
+<div class="p-2 flex flex-col bg-zinc-700 rounded-lg">
+  <ProviderLogo provider="{provider}" />
+  <div class="flex flex-col items-center text-center">
+    <p class="text-xl text-gray-300">
+      {provider.name} is starting...
+    </p>
+    {#if provider.version}
+      <p class="text-base font-semibold text-gray-400">
+        version {provider.version}
+      </p>
+    {/if}
+    {#if provider.containerConnections.length > 0}
+      <div class="flex flex-row  text-xs text-gray-500 mt-4">
+        <p>
+          {provider.containerConnections.map(c => c.name).join(', ')}
+        </p>
+      </div>
+    {/if}
+  </div>
+  <ProviderLinks provider="{provider}" />
+</div>

packages/renderer/src/lib/welcome/WelcomePage.svelte

@@ -7,11 +7,13 @@ import ProviderReady from './ProviderReady.svelte';
 import ProviderInstalled from './ProviderInstalled.svelte';
 import ProviderConfigured from './ProviderConfigured.svelte';
 import ProviderStopped from './ProviderStopped.svelte';
+import ProviderStarting from './ProviderStarting.svelte';
 
 $: providersNotInstalled = $providerInfos.filter(provider => provider.status === 'not-installed');
 $: providersInstalled = $providerInfos.filter(provider => provider.status === 'installed');
 $: providersConfigured = $providerInfos.filter(provider => provider.status === 'configured');
 $: providersReady = $providerInfos.filter(provider => provider.status === 'ready' || provider.status === 'started');
+$: providersStarting = $providerInfos.filter(provider => provider.status === 'starting');
 $: providersStopped = $providerInfos.filter(provider => provider.status === 'stopped');
 </script>
 
@@ -25,6 +27,13 @@ $: providersStopped = $providerInfos.filter(provider => provider.status === 'sto
         {/each}
       {/if}
 
+      <!-- Provider is starting -->
+      {#if providersStarting.length > 0}
+        {#each providersStarting as providerStarting}
+          <ProviderStarting provider="{providerStarting}" />
+        {/each}
+      {/if}
+
       <!-- Provider is installed but not ready, it requires a user action
         display a box to indicate how to make the provider ready -->
       {#if providersInstalled.length > 0}