Merge pull request #63 from com-pas/userinfo

Added User Info functionality

Author: Dennis Labordus

src/Hosting.ts

@@ -15,6 +15,9 @@ import { LoggingElement } from './Logging.js';
 import { Plugin, PluggingElement, pluginIcons } from './Plugging.js';
 import { SettingElement } from './Setting.js';
 
+import { UserInfoEvent } from './foundation.js';
+import { string } from 'fast-check';
+
 interface MenuItem {
   icon: string;
   name: string;
@@ -49,6 +52,9 @@ export function Hosting<
     @property({ attribute: false })
     validated: Promise<unknown> = Promise.resolve();
 
+    @property({ type: string})
+    username: string | undefined;
+
     @internalProperty()
     statusNumber = 0;
 
@@ -200,6 +206,10 @@ export function Hosting<
       ];
     }
 
+    private onUserInfo(event: UserInfoEvent) {
+      this.username = event.detail.name;
+    }
+
     constructor(...args: any[]) {
       super(...args);
 
@@ -216,6 +226,8 @@ export function Hosting<
             })
         );
       });
+
+      this.addEventListener('userinfo', this.onUserInfo);
     }
 
     renderMenuItem(me: MenuItem | 'divider'): TemplateResult {
@@ -288,6 +300,9 @@ export function Hosting<
               @click=${() => (this.menuUI.open = true)}
             ></mwc-icon-button>
             <div slot="title" id="title">${this.docName}</div>
+            ${this.username != undefined
+              ? html`<span id="userField" slot="actionItems">${translate('userinfo.loggedInAs', {name: this.username})}</span>`
+              : ``}
             ${this.menu.map(this.renderActionItem)}
             ${this.doc
               ? html`<mwc-tab-bar

src/compas-services/CompasUserInfoService.ts

@@ -0,0 +1,17 @@
+import {CompasSettings} from "../compas/CompasSettingsElement.js";
+
+export function CompasUserInfoService() {
+
+  function getCompasSettings() {
+    return CompasSettings().compasSettings;
+  }
+
+  return {
+    getCompasUserInfo(): Promise<Document> {
+      const userInfoUrl = getCompasSettings().sclDataServiceUrl + '/common/v1/userinfo';
+      return fetch(userInfoUrl)
+        .then(response => response.text())
+        .then(str => new DOMParser().parseFromString(str, 'application/xml'));
+    }
+  }
+}

src/compas/foundation.ts

@@ -1,5 +1,6 @@
 import {get} from "lit-translate";
-import {newOpenDocEvent} from "../foundation.js";
+import { CompasUserInfoService } from "../compas-services/CompasUserInfoService.js";
+import {newOpenDocEvent, newUserInfoEvent} from "../foundation.js";
 import {OpenSCD} from "../open-scd.js";
 
 const FILE_EXTENSION_LENGTH = 3;
@@ -38,3 +39,13 @@ export function updateDocumentInOpenSCD(doc: Document): void {
 
   getOpenScdElement().dispatchEvent(newOpenDocEvent(doc, docName, {detail: {docId: id}}));
 }
+
+export async function showOptionalUserInfo(): Promise<void> {
+  await CompasUserInfoService().getCompasUserInfo()
+  .then(response => {
+    const name = response.querySelectorAll("Name").item(0)?.textContent;
+    if (name != null)
+      getOpenScdElement().dispatchEvent(newUserInfoEvent(name));
+  });
+}
+showOptionalUserInfo();

src/foundation.ts

@@ -345,6 +345,23 @@ export function newOpenDocEvent(
   });
 }
 
+/** Represents user information from a backend. */
+export interface UserInfoDetail {
+  name: string;
+}
+export type UserInfoEvent = CustomEvent<UserInfoDetail>;
+export function newUserInfoEvent(
+  name: string,
+  eventInitDict?: CustomEventInit<Partial<ValidateDetail>>
+): UserInfoEvent {
+  return new CustomEvent<UserInfoDetail>('userinfo', {
+    bubbles: true,
+    composed: true,
+    ...eventInitDict,
+    detail: { name, ...eventInitDict?.detail },
+  });
+}
+
 /** @returns a reference to `element` with segments delimited by '/'. */
 // TODO(c-dinkel): replace with identity (FIXME)
 export function referencePath(element: Element): string {
@@ -2547,6 +2564,7 @@ declare global {
     ['pending-state']: PendingStateEvent;
     ['editor-action']: EditorActionEvent<EditorAction>;
     ['open-doc']: OpenDocEvent;
+    ['userinfo']: UserInfoEvent;
     ['wizard']: WizardEvent;
     ['validate']: ValidateEvent;
     ['log']: LogEvent;

src/translations/de.ts

@@ -360,6 +360,9 @@ export const de: Translations = {
   code: {
     log: 'Element im XML Editor angepasst:  {{id}}',
   },
+  userinfo: {
+    loggedInAs: '???'
+  },
   add: 'Hinzufügen',
   new: 'Neu',
   remove: 'Entfernen',

src/translations/en.ts

@@ -357,6 +357,9 @@ export const en = {
   code: {
     log: 'Changed element in XML editor: {{id}}',
   },
+  userinfo: {
+    loggedInAs: 'Logged in as {{name}}'
+  },
   add: 'Add',
   new: 'New',
   remove: 'Remove',

test/integration/compas/foundation.test.ts

@@ -4,27 +4,34 @@ import {updateDocumentInOpenSCD} from "../../../src/compas/foundation.js";
 
 import {OpenSCD} from "../../../src/open-scd.js";
 import '../../../src/open-scd.js';
+import { newUserInfoEvent } from '../../../src/foundation.js';
 
 describe('compas-foundation', () => {
-  let doc: XMLDocument;
   let element: OpenSCD;
 
   beforeEach(async () => {
     element = await fixture(
         html`<open-scd></open-scd>`
     );
+  });
 
-    doc = await fetch('/base/test/testfiles/compas/test-scd.cid')
+  it('when loaded the document should be on open-scd component', async () => {
+    let doc = await fetch('/base/test/testfiles/compas/test-scd.cid')
       .then(response => response.text())
       .then(str => new DOMParser().parseFromString(str, 'application/xml'));
-  });
 
-  it('when loaded the document should be on open-scd component', async () => {
     updateDocumentInOpenSCD(doc);
     await element.updateComplete;
 
     expect(element.doc).to.be.not.undefined;
     expect(element.docId).to.be.equal('380b5e70-4753-4b59-b5b4-d51ceb26a30c');
     expect(element.docName).to.be.equal('ied_utrecht_station235-3.0.0.cid');
   });
+
+  it('when UserInfoEvent event is dispatched, the username is shown in OpenSCD', async () => {
+    element.dispatchEvent(newUserInfoEvent("Henk"));
+    await element.updateComplete;
+
+    expect(element.shadowRoot!.querySelector('span[id="userField"]')!.textContent).to.be.equal('Logged in as Henk')
+  });
 });