@uxland/primary-shell 7.26.4 → 7.28.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxland/primary-shell",
-  "version": "7.26.4",
+  "version": "7.28.0",
   "description": "Primaria Shell",
   "author": "UXLand <dev@uxland.es>",
   "homepage": "https://github.com/uxland/harmonix/tree/app#readme",

package/src/UI/components/navigation-tooltip/index.ts

@@ -0,0 +1,2 @@
+export { showNavItemTooltip } from "./tooltip-manager";
+export { default as NavigationTooltip } from "./navigation-tooltip";

package/src/UI/components/navigation-tooltip/navigation-tooltip.tsx

@@ -0,0 +1,64 @@
+import React from "react";
+import { createRoot, Root } from "react-dom/client";
+import "./styles.css";
+
+interface NavigationTooltipProps {
+  text: string;
+  itemAbsoluteY: number;
+}
+
+const NavigationTooltip: React.FC<NavigationTooltipProps> = ({ text, itemAbsoluteY }) => {
+  const itemHeight = 51;
+  const centerY = itemAbsoluteY + itemHeight / 2;
+
+  const style = {
+    left: "73px", // 60px (sidebar width) + 13px offset
+    top: `${centerY}px`,
+  };
+
+  return (
+    <div className="tooltip-overlay">
+      <div className="navigation-tooltip" style={style}>
+        <dss-icon icon="info" size="md" />
+        {text}
+        <div className="arrow" />
+      </div>
+    </div>
+  );
+};
+
+export default NavigationTooltip;
+
+// Singleton root to manage the tooltip rendering
+let tooltipRoot: Root | null = null;
+let tooltipContainer: HTMLDivElement | null = null;
+
+export const renderNavigationTooltip = (text: string, itemAbsoluteY: number) => {
+  // Clean up existing tooltip if any
+  if (tooltipRoot && tooltipContainer) {
+    tooltipRoot.unmount();
+    if (document.body.contains(tooltipContainer)) {
+      document.body.removeChild(tooltipContainer);
+    }
+  }
+
+  // Create new container
+  tooltipContainer = document.createElement("div");
+  document.body.appendChild(tooltipContainer);
+
+  // Create root and render
+  tooltipRoot = createRoot(tooltipContainer);
+  tooltipRoot.render(<NavigationTooltip text={text} itemAbsoluteY={itemAbsoluteY} />);
+
+  // Auto-remove after 5 seconds
+  setTimeout(() => {
+    if (tooltipRoot && tooltipContainer) {
+      tooltipRoot.unmount();
+      if (document.body.contains(tooltipContainer)) {
+        document.body.removeChild(tooltipContainer);
+      }
+      tooltipRoot = null;
+      tooltipContainer = null;
+    }
+  }, 5000);
+};

package/src/UI/components/navigation-tooltip/styles.css

@@ -0,0 +1,63 @@
+.tooltip-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  z-index: 9999;
+  pointer-events: none;
+}
+
+.navigation-tooltip {
+  position: absolute;
+  min-width: 250px;
+  transform: translateY(-50%);
+  background: #EAF7FD;
+  color: #0F4877;
+  border: 2px solid #0F4877;
+  padding: 12px 16px;
+  border-radius: 10px;
+  white-space: nowrap;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  font-size: 13px;
+  font-family: var(--etc-font-family, inherit);
+  font-weight: 500;
+  animation: fadeInOut 5s ease-in-out forwards;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.tooltip-icon {
+  font-size: 16px;
+}
+
+.arrow {
+  position: absolute;
+  right: 100%;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 0;
+  height: 0;
+  border: 12px solid transparent;
+  border-right-color: #1e88e5;
+}
+
+@keyframes fadeInOut {
+  0% {
+    opacity: 0;
+    transform: translateY(-50%) translateX(-10px);
+  }
+  10% {
+    opacity: 1;
+    transform: translateY(-50%) translateX(0px);
+  }
+  90% {
+    opacity: 1;
+    transform: translateY(-50%) translateX(0px);
+  }
+  100% {
+    opacity: 0;
+    transform: translateY(-50%) translateX(-10px);
+  }
+}

package/src/UI/components/navigation-tooltip/tooltip-manager.ts

@@ -0,0 +1,31 @@
+import { shellApi } from "../../../api/api";
+import { shellEvents } from "../../../events";
+import { renderNavigationTooltip } from "./navigation-tooltip";
+
+const scrollToNavItem = (
+  navItemMenuKey: string,
+): Promise<{ scrollTop: number; containerTop: number; itemIndex: number; itemAbsoluteY: number }> => {
+  return new Promise((resolve) => {
+    const subscription = shellApi.broker.subscribe(
+      shellEvents.scrollToNavItemCompleted,
+      (data: { scrollTop: number; containerTop: number; itemIndex: number; itemAbsoluteY: number }) => {
+        subscription.dispose();
+        resolve(data);
+      },
+    );
+
+    shellApi.broker.publish(shellEvents.scrollToNavItemRequested, navItemMenuKey);
+
+    // Fallback timeout in case the event doesn't arrive
+    setTimeout(() => {
+      subscription.dispose();
+      resolve({ scrollTop: 0, containerTop: 0, itemIndex: -1, itemAbsoluteY: window.innerHeight / 2 });
+    }, 1000);
+  });
+};
+
+export const showNavItemTooltip = async (navItemMenuKey: string, text: string) => {
+  const scrollData = await scrollToNavItem(navItemMenuKey);
+
+  renderNavigationTooltip(text, scrollData.itemAbsoluteY);
+};

package/src/UI/components/primaria-shell/primaria-shell.ts

@@ -89,6 +89,12 @@ export class PrimariaShell extends PrimariaRegionHost(LitElement) {
         this.quickActionBusy = detail.busy;
       }),
     );
+
+    this.subscriptions.push(
+      shellApi.broker.subscribe(shellEvents.scrollToNavItemRequested, (navItemMenuKey: string) => {
+        this._scrollToNavItem(navItemMenuKey);
+      }),
+    );
   }
 
   _handleError(error: { message: string }) {
@@ -100,4 +106,88 @@ export class PrimariaShell extends PrimariaRegionHost(LitElement) {
   _unsubscribeEvents() {
     this.subscriptions.forEach((s) => s.dispose());
   }
+
+  async _scrollToNavItem(navItemMenuKey: string) {
+    const region = await shellApi.regionManager.getRegion(shellApi.regionManager.regions.shell.navigationMenu);
+
+    const allViews = region.currentActiveViews;
+
+    // Extract the actual view id from the key (remove plugin prefix)
+    // navItemMenuKey comes as "primaria-shell::pdf-viewer", we need just "pdf-viewer"
+    const viewId = navItemMenuKey.includes("::") ? navItemMenuKey.split("::")[1] : navItemMenuKey;
+
+    const targetView = allViews.find((view: any) => view.id === viewId);
+
+    if (!targetView) {
+      shellApi.broker.publish(shellEvents.scrollToNavItemCompleted, {
+        scrollTop: 0,
+        containerTop: 0,
+        itemIndex: -1,
+      });
+      return;
+    }
+
+    // Sort views by sortHint to find the correct position
+    const sortedViews = [...allViews].sort((a: any, b: any) => {
+      const sortHintA = a.sortHint || "999";
+      const sortHintB = b.sortHint || "999";
+      return sortHintA.localeCompare(sortHintB);
+    });
+
+    const targetIndex = sortedViews.findIndex((view: any) => view.id === viewId);
+
+    if (targetIndex === -1) {
+      shellApi.broker.publish(shellEvents.scrollToNavItemCompleted, {
+        scrollTop: 0,
+        containerTop: 0,
+        itemIndex: -1,
+      });
+      return;
+    }
+
+    const menuContainer = this.shadowRoot?.querySelector("#menu-region-container") as HTMLElement;
+    if (!menuContainer) {
+      shellApi.broker.publish(shellEvents.scrollToNavItemCompleted, {
+        scrollTop: 0,
+        containerTop: 0,
+        itemIndex: targetIndex,
+      });
+      return;
+    }
+
+    const itemHeight = 51;
+    const targetPosition = itemHeight * targetIndex;
+    const containerHeight = menuContainer.clientHeight;
+
+    // Scroll to position the item in the middle of the container
+    const scrollPosition = targetPosition - containerHeight / 2 + itemHeight / 2;
+    menuContainer.scrollTo({
+      top: Math.max(0, scrollPosition),
+      behavior: "smooth",
+    });
+
+    // Wait for scroll to complete and then publish the completed event
+    setTimeout(() => {
+      const containerRect = menuContainer.getBoundingClientRect();
+
+      // Get all nav items from the container
+      const navItems = Array.from(menuContainer.children) as HTMLElement[];
+
+      // Find the actual DOM element for the target item
+      let itemAbsoluteY = window.innerHeight / 2; // default fallback
+
+      if (navItems[targetIndex]) {
+        const itemRect = navItems[targetIndex].getBoundingClientRect();
+        itemAbsoluteY = itemRect.top;
+      }
+
+      const data = {
+        scrollTop: menuContainer.scrollTop,
+        containerTop: containerRect.top,
+        itemIndex: targetIndex,
+        itemAbsoluteY: itemAbsoluteY,
+      };
+      shellApi.broker.publish(shellEvents.scrollToNavItemCompleted, data);
+    }, 300);
+  }
 }

package/src/UI/internal-views/administrative-nav-menu.ts

@@ -1,5 +1,5 @@
 import { getPatientCip } from "../../features/get-patient-cip/action";
-import { navigateToEcapWithoutClosingWithCip } from "../../features/navigate-to-ecap/navigate-without-closing-and-with-cip";
+import { navigateToEcap } from "../../features/navigate-to-ecap/navigate-to-ecap";
 import { GetVisitId } from "../../features/visit/get-visit-id/request";
 import { shellApi } from "../../api/api";
 import { QuickActionItem } from "../shared-components/quick-action-item/quick-action-item";
@@ -15,13 +15,33 @@ const administrativeNavMenuItems: MenuItemConfig[] = [
     actionMenuItems: [
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Metge/essa",
+        callbackFn: () => navigateToEcap("CREAR_VISITA_ADM", "", { TipusCrida: "UAB" }),
       },
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Infermeria",
+        callbackFn: () => navigateToEcap("CREAR_VISITA_ADM", "", { TipusCrida: "UI" }),
+      },
+      {
+        icon: "open_in_new",
+        label: "Administrativa",
+        callbackFn: () => navigateToEcap("CREAR_VISITA_ADM", "", { TipusCrida: "UAS" }),
+      },
+      {
+        icon: "open_in_new",
+        label: "Entre sectors",
+        callbackFn: () => navigateToEcap("CREAR_VISITA_SECTORS_ADM", ""),
+      },
+      {
+        icon: "open_in_new",
+        label: "Multiprogramació",
+        callbackFn: () => navigateToEcap("MULTIPROGRAMACIO_ADM", ""),
+      },
+      {
+        icon: "open_in_new",
+        label: "Vacunació internacional",
+        callbackFn: () => navigateToEcap("VACUNACIO_INTERNACIONAL_ADM", "", {}, false),
       },
     ],
   },
@@ -34,13 +54,18 @@ const administrativeNavMenuItems: MenuItemConfig[] = [
     actionMenuItems: [
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Programades",
+        callbackFn: () => navigateToEcap("VISITES_PROGRAMADES_ADM", ""),
+      },
+      {
+        icon: "open_in_new",
+        label: "Passades",
+        callbackFn: () => navigateToEcap("VISITES_PASSADES_ADM", ""),
       },
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Anul·lades",
+        callbackFn: () => navigateToEcap("VISITES_ANULADES_ADM", ""),
       },
     ],
   },
@@ -53,13 +78,65 @@ const administrativeNavMenuItems: MenuItemConfig[] = [
     actionMenuItems: [
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Gestió de pendents",
+        callbackFn: () => navigateToEcap("GESTIO_PENDENTS_ADM", ""),
+      },
+      {
+        icon: "open_in_new",
+        label: "Gestió d'anul·lades",
+        callbackFn: () => navigateToEcap("GESTIO_ANULADES_ADM", ""),
+      },
+      {
+        icon: "open_in_new",
+        label: "Modificació/consulta derivacions",
+        callbackFn: () => navigateToEcap("MOD_CONS_DERIVACIONS_ADM", ""),
       },
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Ordres clíniques",
+        callbackFn: () => navigateToEcap("ORDRES_CLINIQUES_ADM", ""),
+      },
+      {
+        icon: "open_in_new",
+        label: "Gestió IS3",
+        callbackFn: () => navigateToEcap("PETICIONS_PEND_PROG_ADM", "", {}, false),
+      },
+      {
+        icon: "",
+        label: "Altres accessos",
+        hasNestedMenu: true,
+        nestedMenuItems: [
+          {
+            icon: "open_in_new",
+            label: "Sol·licituds eliminades",
+            callbackFn: () => navigateToEcap("DERIVACIONS_BAIXA_ADM", ""),
+          },
+          {
+            icon: "open_in_new",
+            label: "Impressió recordatori",
+            callbackFn: () => navigateToEcap("DERIVACIONS_IMP_RECORD_ADM", ""),
+          },
+          {
+            icon: "open_in_new",
+            label: "Correcció de visita de laboratori",
+            callbackFn: () => navigateToEcap("CORRECCIO_VISITA_LAB_ADM", ""),
+          },
+          {
+            icon: "open_in_new",
+            label: "Sol·licitud de trasllat",
+            callbackFn: () => navigateToEcap("TRASLLAT_ADM", ""),
+          },
+          {
+            icon: "open_in_new",
+            label: "Informes d'autoritzacions",
+            callbackFn: () => navigateToEcap("INFORME_AUT_ADM", "", {}, false),
+          },
+          {
+            icon: "open_in_new",
+            label: "Informes d'analítiques",
+            callbackFn: () => navigateToEcap("INF_ANALITIQUES_ADM", ""),
+          },
+        ],
       },
     ],
   },
@@ -72,13 +149,13 @@ const administrativeNavMenuItems: MenuItemConfig[] = [
     actionMenuItems: [
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Modificació",
+        callbackFn: () => navigateToEcap("PROCEDIMENTS_MOD_ADM", ""),
       },
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "SIUAC",
+        callbackFn: () => navigateToEcap("SIUAC_ADM", "", {}, false),
       },
     ],
   },
@@ -91,13 +168,23 @@ const administrativeNavMenuItems: MenuItemConfig[] = [
     actionMenuItems: [
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Gestió de factures",
+        callbackFn: () => navigateToEcap("FACTURACIO_GESTIO_ADM", "", {}, false),
       },
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Registres de factures",
+        callbackFn: () => navigateToEcap("FACTURACIO_REGISTRE_ADM", ""),
+      },
+      {
+        icon: "open_in_new",
+        label: "Registres de cobraments",
+        callbackFn: () => navigateToEcap("FACTURACIO_COBRAMENTS_ADM", "", {}, false),
+      },
+      {
+        icon: "open_in_new",
+        label: "Desvincular règim de finançament",
+        callbackFn: () => navigateToEcap("FACTURACIO_DESVINCULAR_ADM", ""),
       },
     ],
   },
@@ -110,13 +197,18 @@ const administrativeNavMenuItems: MenuItemConfig[] = [
     actionMenuItems: [
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Carrega l'escàner",
+        callbackFn: () => navigateToEcap("ESCANER_ADM", "", {}, false),
+      },
+      {
+        icon: "open_in_new",
+        label: "Visualització documents usuari",
+        callbackFn: () => navigateToEcap("DOCUMENTS_USUARI_ADM", ""),
       },
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Servei digitalització segura",
+        callbackFn: () => navigateToEcap("DIGITALITZACIO_ADM", ""),
       },
     ],
   },
@@ -129,13 +221,40 @@ const administrativeNavMenuItems: MenuItemConfig[] = [
     actionMenuItems: [
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Manteniment IT",
+        callbackFn: () => navigateToEcap("IT_MANTENIMENT_CONSULTAR", ""),
       },
       {
         icon: "open_in_new",
-        label: "",
-        callbackFn: () => navigateToEcapWithoutClosingWithCip(""),
+        label: "Pla de medicació",
+        callbackFn: () => navigateToEcap("PLA_MEDICACIO_ADM", ""),
+      },
+      {
+        icon: "",
+        label: "Materials diabètics",
+        hasNestedMenu: true,
+        nestedMenuItems: [
+          {
+            icon: "open_in_new",
+            label: "Lliurament de material",
+            callbackFn: () => navigateToEcap("LLIURAMENT_MATERIAL_ADM", ""),
+          },
+          {
+            icon: "open_in_new",
+            label: "Llistats",
+            callbackFn: () => navigateToEcap("DIABETICS_LLISTAT_ADM", "", {}, false),
+          },
+        ],
+      },
+      {
+        icon: "open_in_new",
+        label: "Full dosificació TAO",
+        callbackFn: () => navigateToEcap("TAO_ADM", ""),
+      },
+      {
+        icon: "open_in_new",
+        label: "Consultar pautes demandes a l'hospital",
+        callbackFn: () => navigateToEcap("CONSULTAR_PAUTES_ADM", "", {}, false),
       },
     ],
   },
@@ -147,50 +266,23 @@ export const registerAdministrativeCommunicationMenuActions = () => {
       id: "1",
       sortHint: "0010",
       icon: "open_in_new",
-      label: "SMS",
-      callbackFn: async () => {
-        const CIP = await getPatientCip(shellApi);
-        shellApi.ecapEventManager.publish("MISSATGES_DEV", "NO_TANCAR", {
-          CIP: CIP || "",
-          TipusMissatge: "SMS",
-        });
-      },
-    },
-    {
-      id: "2",
-      sortHint: "0020",
-      icon: "open_in_new",
-      label: "eConsulta",
-      callbackFn: async () => {
-        const CIP = await getPatientCip(shellApi);
-        const visiId = (await shellApi.broker.send(new GetVisitId())) as string;
-
-        shellApi.ecapEventManager.publish("NAVEGACIO_ECAP_ECONSULTA", "NO_TANCAR", {
-          CIP: CIP || "",
-          VisiID: visiId || "",
-        });
-      },
+      label: "Seguretat",
+      callbackFn: () => navigateToEcap("SEGURETAT_ADM", ""),
     },
     {
       id: "3",
+      sortHint: "0030",
       icon: "open_in_new",
-      label: "Mail",
-      callbackFn: async () => {
-        const CIP = await getPatientCip(shellApi);
-        shellApi.ecapEventManager.publish("COMUNICACIO_MISSATGES_CREAR", "NO_TANCAR", {
-          CIP: CIP || "",
-          TipusMissatge: "SMS",
-        });
-      },
+      label: "SMS",
+      callbackFn: () => navigateToEcap("COMUNICACIO_MISSATGES_ADM", "", { TipusMissatge: "SMS" }),
     },
     {
       id: "4",
-      sortHint: "0030",
+      sortHint: "0040",
       icon: "open_in_new",
-      label: "Veu IP",
-      callbackFn: () => navigateToEcapWithoutClosingWithCip("VOIP"),
+      label: "Correu electrònic",
+      callbackFn: () => navigateToEcap("COMUNICACIO_MISSATGES_ADM", "", { TipusMissatge: "CORREU" }),
     },
-    // { id: "5", sortHint: "0040", icon: "open_in_new", label: "Videoconsulta", callbackFn: () => {} },
   ];
   for (const item of communicationItems) {
     shellApi.regionManager.registerView(shellApi.regionManager.regions.shell.communicationSidenav, {
@@ -208,4 +300,4 @@ export const registerAdministrativeNavMenuViews = () => {
   registerCommunicationNavMenu();
   registerAdministrativeCommunicationMenuActions();
   registerNavMenuViews(administrativeNavMenuItems);
-};
+};

package/src/UI/internal-views/common-nav-menu.ts

@@ -22,7 +22,13 @@ export type MenuItemConfig =
       actionMenuItems: {
         icon: string;
         label: string;
-        callbackFn: () => void | Promise<void>;
+        callbackFn?: () => void | Promise<void>;
+        hasNestedMenu?: boolean;
+        nestedMenuItems?: {
+          icon: string;
+          label: string;
+          callbackFn: () => void | Promise<void>;
+        }[];
       }[];
     };