Added User Info functionality

Signed-off-by: Rob Tjalma <[email protected]>

Author: Rob Tjalma

__snapshots__/open-scd.md

@@ -394,6 +394,11 @@
       slot="title"
     >
     </div>
+    <span
+      id="userField"
+      slot="actionItems"
+    >
+    </span>
     <mwc-icon-button
       disabled=""
       icon="undo"

src/Hosting.ts

@@ -9,12 +9,15 @@ import {
   TemplateResult,
 } from 'lit-element';
 import { until } from 'lit-html/directives/until';
-import { translate } from 'lit-translate';
+import { get, translate } from 'lit-translate';
 import { Mixin, newPendingStateEvent, ValidateEvent } from './foundation.js';
 import { LoggingElement } from './Logging.js';
 import { Plugin, PluggingElement, pluginIcons } from './Plugging.js';
 import { SettingElement } from './Setting.js';
 
+import { UserInfoEvent } from './foundation.js';
+import { TextFieldBase } from '@material/mwc-textfield/mwc-textfield-base';
+
 interface MenuItem {
   icon: string;
   name: string;
@@ -200,6 +203,14 @@ export function Hosting<
       ];
     }
 
+    getNameField() : TextFieldBase {
+      return <TextFieldBase>this.shadowRoot!.querySelector('span[id="userField"]');
+    }
+
+    private onUserInfo(event: UserInfoEvent) {
+      this.getNameField().textContent = get('userinfo.loggedInAs', {name: event.detail.name});
+    }
+
     constructor(...args: any[]) {
       super(...args);
 
@@ -216,6 +227,8 @@ export function Hosting<
             })
         );
       });
+
+      this.addEventListener('userinfo', this.onUserInfo);
     }
 
     renderMenuItem(me: MenuItem | 'divider'): TemplateResult {
@@ -288,6 +301,7 @@ export function Hosting<
               @click=${() => (this.menuUI.open = true)}
             ></mwc-icon-button>
             <div slot="title" id="title">${this.docName}</div>
+            <span id="userField" slot="actionItems"></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',