@uxland/primary-shell 5.1.0 → 5.1.1

package/dist/primary/shell/src/UI/components/pdf-visor/pdf-selector/pdf-selector.d.ts

@@ -0,0 +1,12 @@
+import { LitElement } from 'lit';
+import { IPdfDocument } from '../../../../../src/api/pdf-viewer-manager/pdf-viewer-manager';
+
+export declare class PdfSelector extends LitElement {
+    render(): import('lit').TemplateResult<1>;
+    static styles: import('lit').CSSResult;
+    pdfList: IPdfDocument[];
+    activePdfs: IPdfDocument[];
+    removePdf(id: string): void;
+    setActivePdf(id: string): void;
+    openInNewWindow(pdf: IPdfDocument): void;
+}

package/dist/primary/shell/src/UI/components/pdf-visor/pdf-selector/template.d.ts

@@ -0,0 +1,3 @@
+import { PdfSelector } from './pdf-selector';
+
+export declare const template: (props: PdfSelector) => import('lit').TemplateResult<1>;

package/dist/primary/shell/src/UI/components/pdf-visor/pdf-visor.d.ts

@@ -0,0 +1,22 @@
+import { LitElement } from 'lit';
+import { PrimariaApi } from '../../../api/api';
+import { IPdfDocument } from '../../../api/pdf-viewer-manager/pdf-viewer-manager';
+
+export declare class PdfVisor extends LitElement {
+    static styles: import('lit').CSSResult;
+    api: PrimariaApi;
+    pdfList: IPdfDocument[];
+    activePdfs: IPdfDocument[];
+    private subscriptions;
+    connectedCallback(): Promise<void>;
+    disconnectedCallback(): void;
+    private _initializePdfState;
+    private _getPdfSrc;
+    private _subscribeEvents;
+    private _unsubscribeEvents;
+    private _onPdfAdded;
+    private _onPdfDeleted;
+    private _removePdf;
+    private _updateActivePdfs;
+    render(): import('lit').TemplateResult<1>;
+}

package/dist/primary/shell/src/UI/components/pdf-visor/utils.d.ts

@@ -0,0 +1 @@
+export declare const createUrlFromBase64: (b64: string, type?: string) => string | undefined;

package/dist/primary/shell/src/UI/components/poc-events-ecap/poc-events-ecap.d.ts

@@ -2,6 +2,8 @@ import { LitElement } from 'lit';
 
 export declare class PocEventsEcap extends LitElement {
     render(): import('lit').TemplateResult<1>;
+    sendPdfToViewer(): void;
+    getPDFS(): void;
     goToLinkOnEcap(): void;
     static styles: import('lit').CSSResult;
 }

package/dist/primary/shell/src/api/api.d.ts

@@ -8,6 +8,7 @@ import { EcapEventManager } from './ecap-event-manager/ecap-event-manager';
 import { PluginBusyManager } from './plugin-busy-manager/plugin-busy-manager';
 import { PrimariaInteractionService } from './interaction-service';
 import { PrimariaNotificationService } from './notification-service/notification-service';
+import { PdfViewerManager } from './pdf-viewer-manager/pdf-viewer-manager';
 
 export interface PrimariaApi extends HarmonixApi {
     httpClient: HttpClient;
@@ -19,6 +20,7 @@ export interface PrimariaApi extends HarmonixApi {
     tokenManager: TokenManager;
     ecapEventManager: EcapEventManager;
     pluginBusyManager: PluginBusyManager;
+    pdfViewerManager: PdfViewerManager;
 }
 export declare const PrimariaRegionHost: any;
 /**

package/dist/primary/shell/src/api/pdf-viewer-manager/events.d.ts

@@ -0,0 +1,5 @@
+export declare const pdfViwerEvents: {
+    added: string;
+    showed: string;
+    deleted: string;
+};

package/dist/primary/shell/src/api/pdf-viewer-manager/pdf-viewer-manager.d.ts

@@ -0,0 +1,27 @@
+import { PrimariaBroker } from '../broker/primaria-broker';
+import { PrimariaNotificationService } from '../notification-service/notification-service';
+import { PrimariaRegionManager } from '../region-manager/region-manager';
+
+export interface IPdfDocument {
+    pdfName: string;
+    id: string;
+    data: PdfData;
+}
+export interface PdfData {
+    url?: string;
+    b64?: string;
+}
+export declare class PdfViewerManager {
+    private broker;
+    private notificationService;
+    private regionManager;
+    constructor(broker: PrimariaBroker, notificationService: PrimariaNotificationService, regionManager: PrimariaRegionManager);
+    private pdfs;
+    private activePdf;
+    private hasBeenActivated;
+    add(pdfName: string, data: PdfData): void;
+    delete(pdfId: string): void;
+    getPdfs(): IPdfDocument[];
+    private registerNavButton;
+}
+export declare const createPdfViewerManager: (broker: PrimariaBroker, notificationService: PrimariaNotificationService, regionManager: PrimariaRegionManager) => PdfViewerManager;

package/dist/primary/shell/src/constants.d.ts

@@ -1,3 +1,4 @@
 export declare const primariaShellId = "primaria-shell";
 export declare const clinicalMonitoringId = "clinical-monitoring";
 export declare const pocTestEventsId = "poc-events-ecap";
+export declare const pdfViewerId = "pdf-viewer";

package/dist/primary/shell/src/locales.d.ts

@@ -34,6 +34,16 @@ export declare const locales: {
             busyManager: {
                 title: string;
             };
+            pdfManager: {
+                uploaded: string;
+                alreadyUploaded: string;
+                navButtonLabel: string;
+                missingData: string;
+                duplicatedSource: string;
+            };
+            pdfVisor: {
+                noPdfSelected: string;
+            };
         };
     };
 };

package/package.json

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

package/src/UI/components/clinical-monitoring/styles.css

@@ -12,7 +12,6 @@
   flex-direction: row;
   
   #widgets-sidebar-region {
-    z-index: 1;
     width: 25%;
     border-left: 1px solid rgb(189, 189, 189);
   }

package/src/UI/components/index.ts

@@ -4,3 +4,4 @@ import "../shared-components";
 import "./shell-header/shell-header";
 import "./quick-actions-menu/quick-actions-menu";
 import "../../api/plugin-busy-manager/plugin-busy-list/component";
+import "./pdf-visor/pdf-selector/pdf-selector";

package/src/UI/components/pdf-visor/pdf-selector/pdf-selector.ts

@@ -0,0 +1,40 @@
+import { LitElement, css, unsafeCSS } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { IPdfDocument } from "../../../../../src/api/pdf-viewer-manager/pdf-viewer-manager";
+import { template } from "./template";
+import styles from "./styles.css?inline";
+import { createUrlFromBase64 } from "../utils";
+
+@customElement("pdf-selector")
+export class PdfSelector extends LitElement {
+  render() {
+    return template(this);
+  }
+
+  static styles = css`
+    ${unsafeCSS(styles)}
+  `;
+
+  @property({ type: Array })
+  pdfList: IPdfDocument[];
+
+  @property({ type: Array })
+  activePdfs: IPdfDocument[] = [];
+
+  removePdf(id: string) {
+    this.dispatchEvent(
+      new CustomEvent("pdf-removed", { detail: id, bubbles: true, composed: true }),
+    );
+  }
+
+  setActivePdf(id: string) {
+    this.dispatchEvent(
+      new CustomEvent("active-pdf-changed", { detail: id, bubbles: true, composed: true }),
+    );
+  }
+
+  openInNewWindow(pdf: IPdfDocument) {
+    const url = pdf.data.url ? pdf.data.url : createUrlFromBase64(pdf.data.b64 as string);
+    url && window.open(url);
+  }
+}

package/src/UI/components/pdf-visor/pdf-selector/styles.css

@@ -0,0 +1,24 @@
+:host {
+  width: 250px;
+  gap: 8px
+}
+
+.pdf-item{
+  display: flex;
+  align-items: flex-start;
+  padding: 8px; 
+  gap:8px;
+  color:black;
+  border-bottom: 1px solid var(--color-neutral-100);
+}
+
+.header-icons{
+  display: flex;
+  gap: 8px;
+}
+
+.container{
+  gap: 8px;   
+  display: flex;
+  flex-direction: column;
+}

package/src/UI/components/pdf-visor/pdf-selector/template.ts

@@ -0,0 +1,37 @@
+import { html } from "lit";
+import { PdfSelector } from "./pdf-selector";
+import { IPdfDocument } from "primary/shell/src/api/pdf-viewer-manager/pdf-viewer-manager";
+import { repeat } from "lit/directives/repeat.js";
+
+export const template = (props: PdfSelector) => {
+  const pdfitem = (pdf: IPdfDocument) => {
+    return html`
+    <div class="pdf-item">
+      <dss-checkbox @onChange=${() => props.setActivePdf(pdf.id)}>
+        <input 
+          slot="input" 
+          type="checkbox" 
+          aria-label="Label"
+          .checked=${props.activePdfs.some((p) => p.id === pdf.id)}
+        >
+      </dss-checkbox>
+      <div class="container">
+        <div class="header-icons">
+          <dss-icon-button size="md" variant="error" icon="picture_as_pdf"></dss-icon-button> 
+          <dss-icon-button size="md" variant="error" icon="close" @click=${() => props.removePdf(pdf.id)}></dss-icon-button> 
+          <dss-icon-button size="md"  icon="open_in_new" @click=${() => props.openInNewWindow(pdf)}></dss-icon-button> 
+        </div>
+        <div class="data">
+          ${pdf.pdfName}
+        </div>
+      </div>
+    </div>
+  `;
+  };
+
+  return html`
+    <div>
+        ${repeat(props.pdfList, (pdf: IPdfDocument) => pdfitem(pdf))}
+    </div> 
+  `;
+};

package/src/UI/components/pdf-visor/pdf-visor.ts

@@ -0,0 +1,124 @@
+import styles from "./styles.css?inline";
+import { html, LitElement, css, unsafeCSS } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { BrokerDisposableHandler } from "../../../api/broker/primaria-broker";
+import { PrimariaApi } from "../../../api/api";
+import { TYPES } from "../../../../src/infrastructure/ioc/types";
+import { lazyInject } from "../../../../src/infrastructure/ioc/container";
+import { pdfViwerEvents } from "../../../../src/api/pdf-viewer-manager/events";
+import { IPdfDocument } from "../../../api/pdf-viewer-manager/pdf-viewer-manager";
+import { translate } from "../../../../src/locales";
+import { createUrlFromBase64 } from "./utils";
+
+@customElement("pdf-visor")
+export class PdfVisor extends LitElement {
+  static styles = css`${unsafeCSS(styles)}`;
+
+  @lazyInject(TYPES.primaryApi)
+  api: PrimariaApi;
+
+  @property({ type: Array })
+  pdfList: IPdfDocument[] = [];
+
+  @property({ type: Array })
+  activePdfs: IPdfDocument[] = [];
+
+  private subscriptions: BrokerDisposableHandler[] = [];
+
+  async connectedCallback() {
+    super.connectedCallback();
+    this._initializePdfState();
+    this._subscribeEvents();
+  }
+
+  disconnectedCallback(): void {
+    super.disconnectedCallback();
+    this._unsubscribeEvents();
+  }
+
+  private _initializePdfState() {
+    const initialPdfs = this.api.pdfViewerManager.getPdfs?.() || [];
+    this.pdfList = [...initialPdfs];
+
+    if (initialPdfs.length === 1) {
+      this.activePdfs = [initialPdfs[0] as IPdfDocument];
+    } else if (initialPdfs.length >= 2) {
+      this.activePdfs = initialPdfs.slice(-2);
+    }
+  }
+
+  private _getPdfSrc(pdf: IPdfDocument) {
+    if (pdf.data.url) return pdf.data.url;
+    if (pdf.data.b64) return createUrlFromBase64(pdf.data.b64);
+    return "";
+  }
+
+  private _subscribeEvents() {
+    const subscriptions = [
+      this.api.broker.subscribe(pdfViwerEvents.added, (pdf: IPdfDocument) => this._onPdfAdded(pdf)),
+      this.api.broker.subscribe(pdfViwerEvents.deleted, ({ id }) => this._onPdfDeleted({ id })),
+    ];
+    subscriptions.forEach((s) => this.subscriptions.push(s));
+  }
+
+  private _unsubscribeEvents() {
+    this.subscriptions.forEach((s) => s.dispose());
+  }
+
+  private _onPdfAdded(pdf: IPdfDocument) {
+    this.pdfList = [...this.pdfList, pdf];
+    this._updateActivePdfs(pdf.id);
+  }
+
+  private _onPdfDeleted({ id }) {
+    this.pdfList = this.pdfList.filter((pdf) => pdf.id !== id);
+    this.activePdfs = this.activePdfs.filter((pdf) => pdf.id !== id);
+    this.requestUpdate();
+  }
+
+  private _removePdf(id: string) {
+    this.api.pdfViewerManager.delete(id);
+    this.activePdfs = this.activePdfs.filter((pdf) => pdf.id !== id);
+  }
+
+  private _updateActivePdfs(id: string) {
+    const isAlreadyActive = this.activePdfs.some((pdf) => pdf.id === id);
+    if (isAlreadyActive) {
+      this.activePdfs = this.activePdfs.filter((pdf) => pdf.id !== id);
+    } else {
+      const newPdf = this.pdfList.find((pdf) => pdf.id === id);
+      if (!newPdf) return;
+      if (this.activePdfs.length === 2) {
+        this.activePdfs = [this.activePdfs[1] as IPdfDocument, newPdf];
+      } else {
+        this.activePdfs = [...this.activePdfs, newPdf];
+      }
+    }
+    this.requestUpdate();
+  }
+
+  render() {
+    return html`
+      <div class="pdf-container">
+        ${
+          this.activePdfs.length > 0
+            ? this.activePdfs.map(
+                (pdf) =>
+                  html`<iframe height="100%" src=${this._getPdfSrc(pdf)} frameborder="0"></iframe>`,
+              )
+            : html`
+                <div class="no-pdf">
+                  <p>${translate("pdfVisor.noPdfSelected")}</p>
+                </div>
+              `
+        }
+      </div>
+      <pdf-selector
+        .pdfList=${this.pdfList}
+        .activePdfs=${this.activePdfs}
+        @pdf-removed=${(e: CustomEvent) => this._removePdf(e.detail)}
+        @active-pdf-changed=${(e: CustomEvent) => this._updateActivePdfs(e.detail)}
+      ></pdf-selector>
+    `;
+  }
+}

package/src/UI/components/pdf-visor/styles.css

@@ -0,0 +1,29 @@
+:host {
+  min-height: 1px;
+  height: 100%;
+  width: 100%;
+  display: flex;
+}
+
+iframe {
+  border: none;
+  flex:1;
+  height: 100%;
+
+}
+
+.pdf-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  flex: 1;
+  border: 1px solid #ccc;
+}
+
+.no-pdf {
+  text-align: center;
+  color: #666;
+  font-size: 1.2rem;
+  font-weight: bold;
+}

package/src/UI/components/pdf-visor/utils.ts

@@ -0,0 +1,16 @@
+function base64ToBlob(base64, type = "application/octet-stream") {
+  const binStr = window.atob(base64);
+  const len = binStr.length;
+  const arr = new Uint8Array(len);
+  for (let i = 0; i < len; i++) {
+    arr[i] = binStr.charCodeAt(i);
+  }
+  return new Blob([arr], { type: type });
+}
+
+export const createUrlFromBase64 = (b64: string, type?: string) => {
+  if (b64) {
+    const blob = base64ToBlob(b64, type || "application/pdf");
+    return URL.createObjectURL(blob);
+  }
+};

package/src/UI/components/poc-events-ecap/poc-events-ecap.ts

@@ -22,19 +22,49 @@ export class PocEventsEcap extends LitElement {
 
     </form>
     <button @click=${(e) => this.goToLinkOnEcap()}>LLennçar event ecap</button>
-    </div>`;
+    </div>
+    
+    <form>
+        <label for="pdfName">PDF Name</label>
+        <input type="text" id="pdfName" name="pdfName" placeholder="pdfName">
+        <label for="url">URL</label>
+        <input type="text" id="url" name="url" placeholder="url">
+
+
+    </form>
+    <button @click=${(e) => this.sendPdfToViewer()}>Add PDF</button>
+
+
+    <button @click=${(e) => this.getPDFS()}>GET PDFs</button>
+    `;
   }
 
-  goToLinkOnEcap() {
+  sendPdfToViewer() {
+    const pdfName = (this as any).shadowRoot?.getElementById("pdfName")?.value as string;
+    const fileName = (this as any).shadowRoot?.getElementById("url")?.value as string;
 
-    const eventType =  (this as any).shadowRoot?.getElementById("eventType")?.value;
-    const accio =  (this as any).shadowRoot?.getElementById("accio")?.value;
-    const parameterName =  (this as any).shadowRoot?.getElementById("parameterName")?.value;
-    const parameterValue =  (this as any).shadowRoot?.getElementById("parameterValue")?.value;
+    const data = fileName;
+
+    const pdf = { pdfName, data };
+    console.log("Añadiendo PDF:", pdf);
+
+    shellApi.pdfViewerManager.add(pdf);
+  }
+
+  getPDFS() {
+    const pdfs = shellApi.pdfViewerManager.getPdfs();
+    console.log(pdfs);
+  }
+
+  goToLinkOnEcap() {
+    const eventType = (this as any).shadowRoot?.getElementById("eventType")?.value;
+    const accio = (this as any).shadowRoot?.getElementById("accio")?.value;
+    const parameterName = (this as any).shadowRoot?.getElementById("parameterName")?.value;
+    const parameterValue = (this as any).shadowRoot?.getElementById("parameterValue")?.value;
 
     //sending data to parent window if opened inside iframe
     shellApi.ecapEventManager.publish(eventType, accio, {
-      [parameterName]: parameterValue
+      [parameterName]: parameterValue,
     });
   }
 

package/src/api/api.ts

@@ -22,8 +22,10 @@ import { PrimariaInteractionService } from "./interaction-service";
 import { ParimariaInteractionServiceImpl } from "./interaction-service/interaction-service-impl";
 import { PrimariaNotificationService } from "./notification-service/notification-service";
 import { PrimariaNotificationServiceImpl } from "./notification-service/notification.service-impl";
+import { createPdfViewerManager, PdfViewerManager } from "./pdf-viewer-manager/pdf-viewer-manager";
 
 const broker = createBroker();
+
 export interface PrimariaApi extends HarmonixApi {
   httpClient: HttpClient;
   interactionService: PrimariaInteractionService;
@@ -34,6 +36,7 @@ export interface PrimariaApi extends HarmonixApi {
   tokenManager: TokenManager;
   ecapEventManager: EcapEventManager;
   pluginBusyManager: PluginBusyManager;
+  pdfViewerManager: PdfViewerManager;
 }
 
 const regionManager: IRegionManager = createRegionManager("primaria");
@@ -53,9 +56,11 @@ const notificationService = new PrimariaNotificationServiceImpl();
 export const primariaApiFactory: ApiFactory<PrimariaApi> = (
   pluginInfo: PluginInfo,
 ): PrimariaApi => {
+  const regionManagerProxy = createRegionManagerProxy(pluginInfo, regionManager, broker);
+
   return {
     pluginInfo: pluginInfo,
-    regionManager: createRegionManagerProxy(pluginInfo, regionManager, broker),
+    regionManager: regionManagerProxy,
     httpClient: createHttpClient(tokenManager, broker),
     broker: broker,
     createLocaleManager: createLocaleManager(pluginInfo.pluginId) as any,
@@ -65,6 +70,7 @@ export const primariaApiFactory: ApiFactory<PrimariaApi> = (
     pluginBusyManager,
     interactionService,
     notificationService,
+    pdfViewerManager: createPdfViewerManager(broker, notificationService, regionManagerProxy),
   };
 };
 

package/src/api/pdf-viewer-manager/events.ts

@@ -0,0 +1,5 @@
+export const pdfViwerEvents = {
+  added: "added_pdf",
+  showed: "showed_pdf",
+  deleted: "deleted_pdf",
+};

package/src/api/pdf-viewer-manager/pdf-viewer-manager.ts

@@ -0,0 +1,97 @@
+import { translate } from "../../locales";
+import { PrimariaNavItem } from "../../UI/shared-components/primaria-nav-item/primaria-nav-item";
+import { PrimariaBroker } from "../broker/primaria-broker";
+import { PrimariaNotificationService } from "../notification-service/notification-service";
+import { shellRegions } from "../region-manager/regions";
+import { pdfViwerEvents } from "./events";
+import { pdfViewerId } from "../../constants";
+import { PrimariaRegionManager } from "../region-manager/region-manager";
+import { generateId } from "@primaria/plugins-core";
+
+export interface IPdfDocument {
+  pdfName: string;
+  id: string;
+  data: PdfData;
+}
+
+export interface PdfData {
+  url?: string;
+  b64?: string;
+}
+
+export class PdfViewerManager {
+  constructor(
+    private broker: PrimariaBroker,
+    private notificationService: PrimariaNotificationService,
+    private regionManager: PrimariaRegionManager,
+  ) {}
+
+  private pdfs: IPdfDocument[] = [];
+  private activePdf: IPdfDocument | null = null;
+  private hasBeenActivated = false;
+
+  add(pdfName: string, data: PdfData) {
+    const id = generateId();
+    const pdf: IPdfDocument = { id, pdfName, data };
+
+    if (!data.url && !data.b64) {
+      this.notificationService.error(translate("pdfManager.missingData"));
+      return;
+    }
+    if (data.url && data.b64) {
+      this.notificationService.error(translate("pdfManager.duplicatedSource"));
+      return;
+    }
+    if (!this.hasBeenActivated) {
+      this.registerNavButton();
+      this.hasBeenActivated = true;
+    }
+    if (this.pdfs.some((p) => p.pdfName === pdf.pdfName)) {
+      this.notificationService.warning(translate("pdfManager.alreadyUploaded"));
+    } else {
+      this.pdfs.push(pdf as IPdfDocument);
+      this.broker.publish(pdfViwerEvents.added, pdf);
+
+      this.notificationService.success(translate("pdfManager.uploaded"));
+    }
+  }
+
+  delete(pdfId: string) {
+    this.pdfs = this.pdfs.filter((pdf) => pdf.id !== pdfId);
+
+    if (this.activePdf?.id === pdfId) {
+      this.activePdf = null;
+    }
+
+    this.broker.publish(pdfViwerEvents.deleted, { id: pdfId });
+  }
+
+  getPdfs(): IPdfDocument[] {
+    return this.pdfs;
+  }
+
+  private registerNavButton() {
+    this.regionManager.registerView(shellRegions.navigationMenu, {
+      id: pdfViewerId,
+      factory: () => {
+        const menuItem = new PrimariaNavItem({
+          icon: "picture_as_pdf",
+          label: translate("pdfManager.navButtonLabel"),
+          callbackFn: () => {
+            this.regionManager.activateMainView(pdfViewerId);
+          },
+        });
+        return Promise.resolve(menuItem);
+      },
+    });
+  }
+}
+
+const pdfViewerManager = (broker, interactionManager, regionManager) =>
+  new PdfViewerManager(broker, interactionManager, regionManager);
+
+export const createPdfViewerManager = (
+  broker: PrimariaBroker,
+  notificationService: PrimariaNotificationService,
+  regionManager: PrimariaRegionManager,
+) => pdfViewerManager(broker, notificationService, regionManager);

package/src/constants.ts

@@ -1,3 +1,4 @@
 export const primariaShellId = "primaria-shell";
 export const clinicalMonitoringId = "clinical-monitoring";
 export const pocTestEventsId = "poc-events-ecap";
+export const pdfViewerId = "pdf-viewer";