h1v3 0.4.1 → 0.6.1

package/.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "sarif-viewer.connectToGithubCodeScanning": "off"
+}

package/dist/browser/client/auth.js

@@ -0,0 +1,128 @@
+import { EVENT_EMAIL_AUTH_REQUESTED, EVENT_GOOGLE_AUTH_REQUESTED, EVENT_SIGN_OUT_REQUESTED, EVENT_USER_PROFILE_CHANGED } from "./events.js";
+import { firebase } from "./firebase.js";
+import bus from "./bus.js";
+
+let userDataProfileRef, userProfilePathBuildStrategy;
+const subscriptions = [];
+
+export function useUserProfiles(userProfilePathBuilder) {
+
+    userProfilePathBuildStrategy = userProfilePathBuilder;
+    initializeAuth();
+
+}
+
+export function initializeAuth() {
+
+    const { auth, onAuthStateChanged, GoogleAuthProvider, off, signOut, signInWithPopup, signInWithEmailAndPassword } = firebase.authentication;
+    const googleAuth = new GoogleAuthProvider();
+
+    while(subscriptions.length) subscriptions.pop()();
+
+    for(const [name, handler] of [
+        [EVENT_GOOGLE_AUTH_REQUESTED, handleAuthRequested],
+        [EVENT_EMAIL_AUTH_REQUESTED, handleEmailAuthRequested],
+        [EVENT_SIGN_OUT_REQUESTED, handleSignOutRequested]
+    ]) {
+
+        subscriptions.push(() => bus.removeEventListener(name, handler));
+        bus.addEventListener(name, handler);
+
+    }
+    subscriptions.push(
+
+        onAuthStateChanged(auth, user => {
+
+            if (userDataProfileRef) {
+
+                off(userDataProfileRef);
+                userDataProfileRef = null;
+
+            }
+            if (user) {
+
+                if(userProfilePathBuildStrategy) {
+
+                    userDataProfileRef = ref(db, userProfilePathBuildStrategy(user));
+                    onValue(userDataProfileRef, snap => {
+
+                        const userDataProfile = snap.val();
+                        dispatchUserProfile(user, userDataProfile);
+
+                    });
+
+                } else {
+
+                    dispatchUserProfile(user);
+
+                }
+
+            } else {
+
+                dispatchUserProfile(null);
+
+            }
+
+        })
+    );
+
+    function handleSignOutRequested() {
+
+        signOut(auth);
+
+    }
+
+    async function handleEmailAuthRequested(e) {
+
+        try {
+
+            await signInWithEmailAndPassword(auth, e.detail?.email, e.detail?.password);
+
+        } catch (err) {
+
+            switch (err?.code) {
+                case "auth/wrong-password":
+                    alert("Wrong password");
+                    break;
+                default:
+                    alert(err?.code || err?.message);
+                    break;
+            }
+
+        }
+    }
+
+    function handleAuthRequested() {
+
+        signInWithPopup(auth, googleAuth);
+
+    }
+
+}
+
+function dispatchUserProfile(user, userDataProfile) {
+
+    console.log("Dispatching user profile");
+    const displayName = userDataProfile?.displayName || user?.displayName || user?.email;
+    const email = user?.email;
+    const uid = user?.uid;
+    const currentUser = user && Object.freeze({ uid, displayName, email, user: Object.freeze(user) });
+    bus.dispatchEvent(new CustomEvent(EVENT_USER_PROFILE_CHANGED, { detail: currentUser }));
+
+}
+
+export const CURRENT_USER_COMPONENTS = ".h1v3-current-user";
+
+export function initializeCurrentUserHooks() {
+
+    bus.addEventListener(EVENT_USER_PROFILE_CHANGED, ({ detail }) => {
+
+        for (const el of document.querySelectorAll(CURRENT_USER_COMPONENTS)) {
+
+            el.currentUser = detail;
+
+        }
+
+    });
+
+}

package/dist/browser/client/bus.js

@@ -0,0 +1 @@
+export default document;

package/{src/client/web-ui → dist/browser/client}/components/login.js

@@ -1,10 +1,19 @@
-import { LitElement, html, bus } from "../system.js";
+import { LitElement, html } from "../system.js";
 import { styled } from "./partials/wa-utils.js";
 import { hello, loginButton, loginDialog, signOutButton } from './login.html.js';
-import { EVENT_EMAIL_AUTH_REQUESTED, EVENT_GOOGLE_AUTH_REQUESTED, EVENT_SIGN_OUT_REQUESTED } from "../../web/events.js";
+import { EVENT_EMAIL_AUTH_REQUESTED, EVENT_GOOGLE_AUTH_REQUESTED, EVENT_SIGN_OUT_REQUESTED } from "../events.js";
+import { CURRENT_USER_COMPONENTS } from "../auth.js";
+import bus from "../bus.js";
 
 class Login extends LitElement {
 
+    constructor() {
+        super();
+        if (!this.classList.contains(CURRENT_USER_COMPONENTS.substring(1)))
+            this.classList.add(CURRENT_USER_COMPONENTS.substring(1));
+
+    }
+
     static get properties() {
 
         return {

package/dist/browser/client/components/notification.html.js

@@ -0,0 +1,25 @@
+import { html } from "../system.js";
+
+const styles = "opacity: 0.9; margin: 0.5rem; zoom: 0.9";
+
+export const errorNotification = ({ message }) => html`
+
+    <wa-callout variant="danger" style="${styles}; opacity: 1" role="alert">
+
+        <wa-icon slot="icon" name="circle-exclamation"></wa-icon>
+        <strong>${message}</strong>
+
+    </wa-callout>
+
+`;
+
+export const infoNotification = ({ message }) => html`
+
+    <wa-callout style="${styles}" role="alert">
+
+        <wa-icon slot="icon" name="circle-info"></wa-icon>
+        <strong>${message}</strong>
+
+    </wa-callout>
+
+`;

package/dist/browser/client/components/notification.js

@@ -0,0 +1,27 @@
+import { LitElement } from "../system.js";
+import { errorNotification, infoNotification } from "./notification.html.js";
+import { styled } from "./partials/wa-utils.js";
+
+class Notification extends LitElement {
+
+    static get properties() {
+
+        return {
+
+            err: { type: Object },
+            info: { type: Object }
+
+        };
+
+    }
+
+    render() {
+
+        if (this.err)
+            return styled(errorNotification(this.err));
+        if (this.info)
+            return styled(infoNotification(this.info));
+    }
+
+}
+customElements.define("h1v3-notification", Notification);

package/{src/client/web-ui → dist/browser/client}/components/partials/wa-utils.js

@@ -8,6 +8,7 @@ export const styled = (...children) => html`
     </div>
 `;
 
+
 export const dialog = (title, ...children) => html`
 <wa-dialog label="${title}" light-dismiss class="dialog-light-dismiss">
 

package/dist/browser/client/context.js

@@ -0,0 +1,98 @@
+import { eventStore } from "./event-store.js";
+import bus from "./bus.js";
+import { EVENT_ERROR_OCCURRED } from "./events.js";
+
+import { user } from "./team/user.js";
+import { userInvites } from "./team/invites.js";
+import { team } from "./team/team.js";
+import { logger } from "./logger.js";
+
+function populateParameters(ps, x) {
+
+    if (!x) return x;
+    return Object.entries(ps).reduce((x, [k, v]) => x.replaceAll(`$${k}`, v), x);
+
+}
+
+function defaultHandleError(err) {
+
+    bus.dispatchEvent(new CustomEvent(EVENT_ERROR_OCCURRED, { detail: { err } }));
+
+}
+
+export async function inject({ database, configPath, handleError = defaultHandleError }) {
+
+    if (!database) throw new Error("Missing database");
+    if (!configPath) throw new Error("Missing configPath");
+
+    const { db, ref, get } = database;
+    const snap = await get(ref(db, configPath));
+    const config = snap.val();
+
+    const log = logger(database, config.logs.path);
+    const teamMembershipStoreFactory = ({ tid }) => eventStore(database, populateParameters({ tid }, config.team.membership.path));
+    const teamDetailsStoreFactory = ({ tid }) => eventStore(database, populateParameters({ tid }, config.team.details.path));
+    const userInvitesStoreFactory = ({ emailId }) => eventStore(database, populateParameters({ emailId }, config.userInvites.path));
+    const userTeamsStoreFactory = ({ uid }) => eventStore(database, populateParameters({ uid }, config.user.teams.path));
+    const userProfileStoreFactory = ({ uid }) => eventStore(database, populateParameters({ uid }, config.user.profile.path));
+
+    return {
+
+        user({ uid }) {
+
+            const userTeamsStore = userTeamsStoreFactory({ uid });
+            const userProfileStore = userProfileStoreFactory({ uid });
+            const client = user({ userTeamsStore, userProfileStore });
+            return makeDisposable(client, [userTeamsStore, userProfileStore]);
+
+        },
+
+        invites({ uid, email }) {
+
+            const userTeamsStore = userTeamsStoreFactory({ uid });
+            const userInvitesStore = userInvitesStoreFactory({ emailId: btoa(email) });
+            const client = userInvites({ email, uid, userInvitesStore, teamMembershipStoreFactory, userTeamsStore });
+            return makeDisposable(client, [client, userTeamsStore, userInvitesStore]);
+
+        },
+
+        team({ tid }) {
+
+            const teamMembershipStore = teamMembershipStoreFactory({ tid });
+            const teamDetailsStore = teamDetailsStoreFactory({ tid });
+            const client = team({ teamMembershipStore, userInvitesStoreFactory, teamDetailsStore, userTeamsStoreFactory, handleError });
+            return makeDisposable(client, [teamMembershipStore, teamDetailsStore]);
+
+        },
+
+        log(sharedAttributes) {
+
+            return log.context(sharedAttributes);
+
+        }
+
+    };
+
+}
+
+function makeDisposable(client, disposables) {
+
+    const dispose = once(...disposables.map(x => x.dispose.bind(x)));
+    return Object.assign(client, { dispose });
+
+}
+
+function once(...strategies) {
+
+    let done = false;
+    return (...args) => {
+
+        if (done) return;
+        done = true;
+        if (!strategies?.length) return;
+        if (strategies.length ===1) return strategies[0](...args);
+        return strategies.map(s => s(...args));
+
+    }
+
+}

package/dist/browser/{event-store/modular.js → client/event-store.js}

@@ -1,17 +1,18 @@
-function newEventId(eventType) {
+import { timeId } from "./id.js";
 
-    return `${Date.now()}-${Math.random().toString().substring(2)}-${eventType}`;
+const newEventId = eventType => `${timeId()}-${eventType}`;
 
-}
+export const PROJECTIONS = "_p";
+export const EVENTS = "_e";
 
-export function eventStore(firebase, path) {
+export function eventStore(database, path) {
 
-    const { db, ref, onValue, get, set } = firebase;
+    const { db, ref, onValue, get, set } = database;
     for (const required of ["db", "ref", "onValue", "get", "set"])
-        if (!firebase[required]) throw new Error(`Missing required firebase.${required}`);
+        if (!database[required]) throw new Error(`Missing required database.${required}`);
 
-    const eventsPath = `${path}/events`;
-    const projectionsPath = `${path}/projections`;
+    const eventsPath = `${path}/${EVENTS}`;
+    const projectionsPath = `${path}/${PROJECTIONS}`;
 
     const subscriptions = {};
 
@@ -30,7 +31,7 @@ export function eventStore(firebase, path) {
 
     async function unsubscribeAll() {
 
-        while(Object.keys(subscriptions).length) {
+        while (Object.keys(subscriptions).length) {
 
             await Promise.all(
                 Object.keys(subscriptions).map(unsubscribe)
@@ -41,41 +42,48 @@ export function eventStore(firebase, path) {
     }
 
     return {
+
         async record(eventType, payload) {
 
             const eid = newEventId(eventType);
-            const data = { type: eventType, payload };
+            const data = { type: eventType, payload, meta: { when: new Date().toISOString() } };
             await set(ref(db, `${eventsPath}/${eid}`), data);
 
         },
+
         async getProjection(name) {
 
             const snap = await get(ref(db, `${projectionsPath}/${name}`));
             return snap.val();
 
         },
-        onProjectionValue(name, callback) {
+
+        onProjectionValue(name, callback, cancelCallback) {
 
             const query = ref(db, `${projectionsPath}/${name}`);
             console.log("Subscribing to", query.toString());
-            subscriptions[name] = onValue(query, callback);
+            subscriptions[name] = onValue(query, callback, cancelCallback);
 
         },
+
         async offProjection(name) {
 
             await unsubscribe(name);
 
         },
+
         async dispose() {
 
-           await unsubscribeAll();
+            await unsubscribeAll();
 
         },
+
         get path() {
 
             return path;
 
         }
+
     };
 
-}
+}

package/dist/browser/{web → client}/events.js

@@ -1,7 +1,11 @@
 export const EVENT_ERROR_OCCURRED = "h1v3:error-occurred";
 
+export const EVENT_INFO_AVAILABLE = "h1v3:info-available";
+
 export const EVENT_SIGN_OUT_REQUESTED = "h1v3:sign-out-requested";
 
 export const EVENT_EMAIL_AUTH_REQUESTED = "h1v3:email-auth-requested";
 
-export const EVENT_GOOGLE_AUTH_REQUESTED = "h1v3:google-auth-requested";
+export const EVENT_GOOGLE_AUTH_REQUESTED = "h1v3:google-auth-requested";
+
+export const EVENT_USER_PROFILE_CHANGED = "h1v3:user-profile-changed";

package/{src/client/web/system.js → dist/browser/client/firebase.js}

@@ -58,10 +58,4 @@ export const firebase = {
         onValue,
         off
     }
-}
-
-export const bus = document;
-
-// h1v3
-import { registerLoginHandlers } from "./login.js";
-registerLoginHandlers(bus, firebase);
+}

package/dist/browser/client/id.js

@@ -0,0 +1,37 @@
+function rand62(n) {
+
+    const out = [];
+    const bytes = new Uint8Array(n * 2);
+    do {
+
+        crypto.getRandomValues(bytes);
+        for (const b of bytes) {
+
+            if (b < 248) { // 248 is the largest multiple of 62 below 256
+
+                const x = b % 62;
+                out.push(
+                    String.fromCharCode(x < 10 ? 48 + x : x < 36 ? 97 + x - 10 : 65 + x - 36)
+                );
+                if (out.length === n) return out.join('');
+
+            }
+
+        }
+
+    } while (true);
+
+}
+
+export const timeId = () => `${Date.now()}-${rand62(21)}`;
+
+export const generateSpanId = () => generateLowerHex(8);
+
+export const generateTraceId = () => generateLowerHex(16);
+
+function generateLowerHex(byteLength) {
+
+    const bytes = crypto.getRandomValues(new Uint8Array(byteLength));
+    return Array.from(bytes, b => b.toString(16).padStart(2, '0')).join('');
+
+}

package/dist/browser/client/logger.js

@@ -0,0 +1,60 @@
+import { timeId, generateSpanId, generateTraceId } from "./id.js";
+
+function munge(attributes) {
+
+    if(!attributes) return attributes;
+    if (!(typeof attributes === "object")) return attributes;
+    return Object.entries(attributes).reduce((agg, [key, value]) => ({
+        ...agg,
+        [key.replaceAll(".", "__")]: munge(value)
+    }), {});
+
+}
+
+export function logger(database, path, defaultAttributes) {
+
+    const { db, ref, set } = database;
+    const record = data => {
+
+        const refPath = path.replace("$id", timeId());
+        console.log("Logging", data, "to", refPath);
+        return set(ref(db, refPath), data);
+
+    };
+
+    async function recordLog(trace_id, level, sharedAttributes, { body, parent_id, attributes }) {
+
+        const span_id = generateSpanId();
+        console.log(defaultAttributes, sharedAttributes, attributes);
+        const data = {
+            body,
+            trace_id,
+            span_id,
+            severity_text: level,
+            time_client_ms: Date.now(),
+            attributes: munge({ ...defaultAttributes, ...sharedAttributes, ...attributes })
+        };
+        if (parent_id) data.parent_id = parent_id;
+        await record(data);
+
+    }
+
+    return {
+
+        context(sharedAttributes) {
+
+            const id = generateTraceId();
+            return {
+                id,
+                trace: recordLog.bind(this, id, "TRACE", sharedAttributes),
+                debug: recordLog.bind(this, id, "DEBUG", sharedAttributes),
+                info: recordLog.bind(this, id, "INFO", sharedAttributes),
+                warn: recordLog.bind(this, id, "WARN", sharedAttributes),
+                error: recordLog.bind(this, id, "ERROR", sharedAttributes),
+                fatal: recordLog.bind(this, id, "FATAL", sharedAttributes)
+            };
+
+        }
+    };
+
+}

package/dist/browser/client/notifications.js

@@ -0,0 +1,50 @@
+import { EVENT_ERROR_OCCURRED, EVENT_INFO_AVAILABLE } from "./events.js";
+import bus from "./bus.js";
+
+const container = document.createElement("ASIDE");
+container.style.position = "fixed";
+container.style.top = "0px";
+container.style.right = "0px";
+container.style.maxWidth = "40rem";
+container.style.zIndex = 9999;
+
+document.body.appendChild(container);
+
+export function initializeNotifications() {
+
+    bus.addEventListener(EVENT_INFO_AVAILABLE, ({ detail }) => {
+
+        if (detail?.message) {
+
+            const notification = buildNotification();
+            notification.info = detail;
+
+        }
+
+    });
+
+}
+
+export function initializeErrorHandling() {
+
+    bus.addEventListener(EVENT_ERROR_OCCURRED, ({ detail: { err } }) => {
+
+        if (err) {
+
+            const notification = buildNotification();
+            notification.err = err;
+
+        }
+
+    });
+
+}
+
+function buildNotification() {
+
+    const notification = document.createElement("h1v3-notification");
+    container.appendChild(notification);
+    setTimeout(() => notification.remove(), 5000);
+    return notification;
+
+}

package/dist/browser/{web-ui → client}/system.js

@@ -1,7 +1,8 @@
-export * from "../web/system.js";
-
 export const waDist = "/vendor/@shoelace-style/webawesome-pro@3.0.0-beta.6/dist";
 
+// firebase
+export * from "./firebase.js";
+
 // vendor: webawesome
 import "/vendor/@shoelace-style/webawesome-pro@3.0.0-beta.6/dist/components/button/button.js";
 import "/vendor/@shoelace-style/webawesome-pro@3.0.0-beta.6/dist/components/input/input.js";
@@ -12,9 +13,14 @@ import "/vendor/@shoelace-style/webawesome-pro@3.0.0-beta.6/dist/components/dial
 import "/vendor/@shoelace-style/webawesome-pro@3.0.0-beta.6/dist/components/callout/callout.js";
 
 // vendor: lit
-export { html, LitElement } from "/vendor/lit@3.3.1/dist/lit-core.min.js";
+export { html, LitElement, css, render } from "/vendor/lit@3.3.1/dist/lit-core.min.js";
 
 // h1v3
-import "./errors.js";
 import "./components/notification.js";
 import "./components/login.js";
+import { initializeErrorHandling, initializeNotifications } from "./notifications.js";
+import { initializeAuth, initializeCurrentUserHooks } from "./auth.js";
+initializeErrorHandling();
+initializeNotifications();
+initializeCurrentUserHooks();
+initializeAuth();