@orsetra/shared-ui 1.10.7 → 1.10.9

package/components/layout/sidebar/sidebar.tsx

@@ -324,12 +324,11 @@ function Sidebar({ currentMenu, sidebarMenus = {}, main_base_url = "", sectionLa
             ? item.id === activeItemId
             : (pathname === itemPath || pathname.startsWith(`${itemPath}/`))
 
-          // Resolved once so the anchor's `href` attribute itself is already correct — not just
-          // the JS click handler — so middle-click / right-click "open in new tab" (which bypass
-          // onClick entirely) don't navigate to a literal "${envAlias}"-style broken URL.
-          const templateResolution = item.target === "_blank" ? resolveTemplateVars(item.href) : null
-          const isDisabled = !!templateResolution && !templateResolution.isResolved
-          const resolvedHref = templateResolution ? templateResolution.href : item.href
+          // Resolved unconditionally so middle-click/right-click (which bypass onClick) never
+          // navigate to a literal "${envAlias}"-style unresolved URL.
+          const templateResolution = resolveTemplateVars(item.href)
+          const isDisabled = !templateResolution.isResolved
+          const resolvedHref = templateResolution.href
 
           const handleClick = (e: React.MouseEvent) => {
             if (isDisabled) {
@@ -383,8 +382,10 @@ function Sidebar({ currentMenu, sidebarMenus = {}, main_base_url = "", sectionLa
           ) : (
             <Link
               key={item.id}
-              href={item.href}
+              href={isDisabled ? "#" : resolvedHref}
               onClick={handleClick}
+              aria-disabled={isDisabled}
+              title={isDisabled ? "Select a project/environment first" : undefined}
               className={linkCls}
             >
               {linkContent}

package/components/layout/user-panel.tsx

@@ -85,7 +85,13 @@ export function UserPanel({ main_base_url }: UserPanelProps) {
             </span>
             <div className="flex items-center gap-3 mt-1.5">
               <button
-                onClick={() => { close(); openBusinessUnitSwitcher() }}
+                onClick={() => {
+                  close()
+                  // Deferred: closing this dropdown and opening the dialog in
+                  // the same tick races Radix's body pointer-events cleanup,
+                  // leaving the whole app unclickable until a refresh.
+                  setTimeout(() => openBusinessUnitSwitcher(), 0)
+                }}
                 className="text-xs text-[#0f62fe] hover:underline"
               >
                 Switch

package/components/ui/environment-picker-dialog.tsx

@@ -2,7 +2,12 @@
 
 import { useState, useEffect } from "react"
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from "./dialog"
-import { Loader2, Globe } from "lucide-react"
+import { Button } from "./button"
+import { Loader2, Globe, Plus } from "lucide-react"
+
+const CREATE_ENV_URL = process.env.NEXT_PUBLIC_MAIN_APP_URL
+  ? `${process.env.NEXT_PUBLIC_MAIN_APP_URL}/infra/environments`
+  : undefined
 
 interface Environment {
   name: string
@@ -69,8 +74,20 @@ export function EnvironmentPickerDialog({
               <span className="ml-2 text-sm text-ibm-gray-70">Loading environments...</span>
             </div>
           ) : environments.length === 0 ? (
-            <div className="text-center py-8 text-sm text-ibm-gray-60">
-              No environments found
+            <div className="flex flex-col items-center gap-4 py-8 text-center">
+              <p className="text-sm text-ibm-gray-60">
+                No environments found for this project yet. Create one to continue.
+              </p>
+              {CREATE_ENV_URL && (
+                <Button
+                  variant="secondary"
+                  className="rounded-none h-9"
+                  leftIcon={<Plus className="h-3.5 w-3.5" />}
+                  onClick={() => { window.location.href = CREATE_ENV_URL }}
+                >
+                  Create an environment
+                </Button>
+              )}
             </div>
           ) : (
             <div className="border border-ibm-gray-20 max-h-60 overflow-y-auto">

package/components/ui/project-selector-modal.tsx

@@ -38,6 +38,7 @@ export interface ProjectSelectorModalProps extends ProjectSelectorProps {
   onOpenChange?: (open: boolean) => void
   title?: string
   description?: string
+  currentProjectId?: string
 }
 
 export function ProjectSelectorModal({
@@ -45,6 +46,7 @@ export function ProjectSelectorModal({
   onOpenChange,
   title = "Select Business Unit",
   description = "Choose a business unit to continue. This will be used for all operations in this application.",
+  currentProjectId,
   getProjects,
   createProject,
   doInit,
@@ -68,9 +70,13 @@ export function ProjectSelectorModal({
     try {
       const projectsList = await getProjects()
       setProjects(projectsList)
-      
-      // If no project selected yet and we have projects, select the first one
-      if (!selectedProject && projectsList.length > 0) {
+
+      // Always re-seed from the actual current project when the dialog opens,
+      // so switching business units twice in a row doesn't leave the picker
+      // stuck showing the previous pick.
+      if (currentProjectId && projectsList.some((p) => p.id === currentProjectId)) {
+        setSelectedProject(currentProjectId)
+      } else if (!selectedProject && projectsList.length > 0) {
         setSelectedProject(projectsList[0].id)
       }
     } catch (err) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orsetra/shared-ui",
-  "version": "1.10.7",
+  "version": "1.10.9",
   "description": "Shared UI components for Orsetra platform",
   "main": "./index.ts",
   "types": "./index.ts",