Added the hover message for the publish menu icon

packages/builder/src/pages/builder/app/[application]/_layout.svelte

@@ -33,7 +33,7 @@
   let promise = getPackage()
   let unpublishModal
   let publishPopover
-  // let notPublishedPopover
+  let notPublishedPopover
 
   $: enrichedApps = enrichApps($apps, $auth.user)
   const enrichApps = (apps, user) => {
@@ -224,6 +224,7 @@
         <RevertModal />
         <Icon name="Play" hoverable on:click={previewApp} />
 
+        {#if isPublished}
           <PopoverMenu
             bind:this={publishPopover}
             align="right"
@@ -254,7 +255,7 @@
               <div class="publish-popover-actions">
                 <Button
                   warning={true}
-                icon="Globe"
+                  icon="GlobeStrike"
                   disabled={!isPublished}
                   on:click={unpublishApp}
                   dataCy="publish-popover-action"
@@ -265,6 +266,27 @@
               </div>
             </Layout>
           </PopoverMenu>
+        {/if}
+
+        {#if !isPublished}
+          <PopoverMenu bind:this={notPublishedPopover} align="right">
+            <div
+              slot="control"
+              class="icon"
+              on:mouseenter={() => {
+                notPublishedPopover.show()
+              }}
+              on:mouseout={() => {
+                notPublishedPopover.hide()
+              }}
+              on:blur={() => void 0}
+              disabled={true}
+            >
+              <Icon size="M" name={"GlobeStrike"} disabled={true} />
+            </div>
+            This app has not been published yet
+          </PopoverMenu>
+        {/if}
 
         <DeployModal onOk={completePublish} />
       </div>