@novasamatech/host-papp-ui 0.5.0-6 → 0.5.0-7

package/dist/flow/PairingModal.js

@@ -1,13 +1,14 @@
-import { jsx as e, jsxs as i, Fragment as r } from "react/jsx-runtime";
-import { memo as l } from "react";
-import { Modal as a } from "../ui/Modal.js";
-import { QrCode as d } from "../ui/QrCode.js";
-import { useSignInFlow as p } from "./SignInStateProvider.js";
-const t = ({ children: n }) => /* @__PURE__ */ e("span", { style: { fontSize: "16px", textAlign: "center", flexShrink: 0, color: "white", fontFamily: "sans-serif" }, children: n }), u = l(() => {
-  const n = p(), o = n.signInStatus.step !== "none" && n.initiatedByUser;
-  return /* @__PURE__ */ e(a, { isOpen: o, onOpenChange: (s) => {
-    s || n.abort();
-  }, width: 300, children: /* @__PURE__ */ i(
+import { jsx as e, jsxs as n, Fragment as p } from "react/jsx-runtime";
+import { memo as c, useMemo as m } from "react";
+import { useSessionIdentity as u } from "../hooks/identity.js";
+import { useAuthenticateFlow as f } from "../providers/AuthProvider.js";
+import { Modal as g } from "../ui/Modal.js";
+import { QrCode as h } from "../ui/QrCode.js";
+const i = ({ children: t }) => /* @__PURE__ */ e("span", { style: { fontSize: "16px", textAlign: "center", flexShrink: 0, color: "white", fontFamily: "sans-serif" }, children: t }), w = c(() => {
+  const t = f(), s = t.status.step !== "none", o = (d) => {
+    d || t.abortAuthentication();
+  }, r = m(() => t.status.step === "finished" ? t.status.session : null, [t.status.step]), [a, l] = u(r);
+  return /* @__PURE__ */ e(g, { isOpen: s, onOpenChange: o, width: 300, children: /* @__PURE__ */ n(
     "div",
     {
       style: {
@@ -19,11 +20,11 @@ const t = ({ children: n }) => /* @__PURE__ */ e("span", { style: { fontSize: "1
         alignItems: "center"
       },
       children: [
-        /* @__PURE__ */ e(t, { children: "Sign in Polkadot app" }),
-        n.signInStatus.step === "pairing" && /* @__PURE__ */ e(d, { value: n.signInStatus.payload, size: 270 }),
-        n.signInStatus.step === "finished" && /* @__PURE__ */ e(r, { children: /* @__PURE__ */ i(t, { children: [
+        /* @__PURE__ */ e(i, { children: "Sign in Polkadot app" }),
+        t.status.step === "pairing" && /* @__PURE__ */ e(h, { value: t.status.payload, size: 270 }),
+        t.status.step === "finished" && /* @__PURE__ */ e(p, { children: /* @__PURE__ */ n(i, { children: [
           "Welcome back, ",
-          n.identity?.liteUsername ?? "User",
+          a?.liteUsername ?? (l ? "..." : "user"),
           "!"
         ] }) })
       ]
@@ -31,5 +32,5 @@ const t = ({ children: n }) => /* @__PURE__ */ e("span", { style: { fontSize: "1
   ) });
 });
 export {
-  u as PairingModal
+  w as PairingModal
 };

package/dist/flow/PappProvider.js

@@ -1,13 +1,14 @@
 import { jsx as o } from "react/jsx-runtime";
 import { createContext as n, useContext as i } from "react";
-import { SignInStateProvider as p } from "./SignInStateProvider.js";
-const e = n(null), a = () => {
+import { AuthProvider as p } from "../providers/AuthProvider.js";
+import { SessionsProvider as d } from "../providers/SessionsProvider.js";
+const e = n(null), P = () => {
   const r = i(e);
   if (r === null)
     throw new Error("Polkadot app Provider must be defined.");
   return r;
-}, l = ({ adapter: r, children: t }) => /* @__PURE__ */ o(e.Provider, { value: r, children: /* @__PURE__ */ o(p, { children: t }) });
+}, c = ({ adapter: r, children: t }) => /* @__PURE__ */ o(e.Provider, { value: r, children: /* @__PURE__ */ o(p, { children: /* @__PURE__ */ o(d, { children: t }) }) });
 export {
-  l as PappProvider,
-  a as usePapp
+  c as PappProvider,
+  P as usePapp
 };

package/dist/hooks/identity.d.ts

@@ -0,0 +1,3 @@
+import { Identity, UserSession } from '../../../host-papp';
+export declare function useIdentity(accountId: string | null): readonly [Identity | null, boolean];
+export declare function useSessionIdentity(session: UserSession | null): readonly [Identity | null, boolean];

package/dist/hooks/identity.js

@@ -0,0 +1,30 @@
+import { toHex as o } from "@polkadot-api/utils";
+import { useState as r, useEffect as p } from "react";
+import { usePapp as a } from "../flow/PappProvider.js";
+function d(e) {
+  const f = a(), [u, t] = r(!1), [s, i] = r(null);
+  return p(() => {
+    if (!e) {
+      t(!1);
+      return;
+    }
+    let n = !0;
+    return t(!0), f.identity.getIdentity(e).match(
+      (l) => {
+        n && (i(l), t(!1));
+      },
+      () => {
+        n && (i(null), t(!1));
+      }
+    ), () => {
+      t(!1), n = !1;
+    };
+  }, [e]), [s, u];
+}
+function g(e) {
+  return d(e ? o(e.peer.accountId) : null);
+}
+export {
+  d as useIdentity,
+  g as useSessionIdentity
+};

package/dist/index.d.ts

@@ -1,3 +1,4 @@
-export { useSignInFlow } from './flow/SignInStateProvider.js';
+export { useAuthenticateFlow } from './providers/AuthProvider.js';
+export { useSession } from './providers/SessionsProvider.js';
 export { PappProvider } from './flow/PappProvider.js';
 export { PairingModal } from './flow/PairingModal.js';

package/dist/index.js

@@ -1,8 +1,10 @@
-import { useSignInFlow as e } from "./flow/SignInStateProvider.js";
-import { PappProvider as i } from "./flow/PappProvider.js";
-import { PairingModal as f } from "./flow/PairingModal.js";
+import { useAuthenticateFlow as e } from "./providers/AuthProvider.js";
+import { useSession as p } from "./providers/SessionsProvider.js";
+import { PappProvider as a } from "./flow/PappProvider.js";
+import { PairingModal as m } from "./flow/PairingModal.js";
 export {
-  f as PairingModal,
-  i as PappProvider,
-  e as useSignInFlow
+  m as PairingModal,
+  a as PappProvider,
+  e as useAuthenticateFlow,
+  p as useSession
 };

package/dist/providers/AuthProvider.d.ts

@@ -0,0 +1,12 @@
+import { AuthentificationStatus, UserSession } from '../../../host-papp';
+import { PropsWithChildren } from 'react';
+type State = {
+    status: AuthentificationStatus;
+    pending: boolean;
+    authenticate(): Promise<UserSession | null>;
+    abortAuthentication(): void;
+    disconnect(session: UserSession): Promise<void>;
+};
+export declare const useAuthenticateFlow: () => State;
+export declare const AuthProvider: ({ children }: PropsWithChildren) => import("react").JSX.Element;
+export {};

package/dist/providers/AuthProvider.js

@@ -0,0 +1,33 @@
+import { jsx as m } from "react/jsx-runtime";
+import { createContext as f, useContext as P, useState as b, useCallback as r, useSyncExternalStore as v, useDebugValue as x } from "react";
+import { usePapp as u } from "../flow/PappProvider.js";
+const c = f({
+  status: { step: "none" },
+  pending: !1,
+  authenticate: () => Promise.resolve(null),
+  abortAuthentication() {
+  },
+  async disconnect() {
+  }
+}), w = () => P(c), A = () => {
+  const e = u(), s = v(e.sso.status.subscribe, e.sso.status.read);
+  return x(`Polkadot app authentification status: ${s.step}`), s;
+}, k = ({ children: e }) => {
+  const [s, n] = b(!1), t = u(), i = A(), l = r(() => (n(!0), new Promise((o, a) => {
+    t.sso.authenticate().andTee(() => n(!1)).orTee(() => n(!1)).match(o, a);
+  })), [t]), p = r(
+    (o) => new Promise((a, h) => t.sessions.disconnect(o).match(a, h)),
+    [t]
+  ), d = {
+    pending: s,
+    status: i,
+    authenticate: l,
+    abortAuthentication: t.sso.abortAuthentication,
+    disconnect: p
+  };
+  return /* @__PURE__ */ m(c.Provider, { value: d, children: e });
+};
+export {
+  k as AuthProvider,
+  w as useAuthenticateFlow
+};

package/dist/providers/SessionsProvider.d.ts

@@ -0,0 +1,9 @@
+import { UserSession } from '../../../host-papp';
+import { PropsWithChildren } from 'react';
+type State = {
+    session: UserSession | null;
+};
+export declare const useSession: () => State;
+export declare const SessionsProvider: ({ children }: PropsWithChildren) => import("react").JSX.Element;
+export declare const useUserSession: () => UserSession | null;
+export {};

package/dist/providers/SessionsProvider.js

@@ -0,0 +1,25 @@
+import { jsx as r } from "react/jsx-runtime";
+import { createContext as i, useContext as u, useDebugValue as n, useState as c, useEffect as l } from "react";
+import { usePapp as d } from "../flow/PappProvider.js";
+const t = i(null), v = () => {
+  const s = u(t);
+  if (s === null)
+    throw new Error("User provider is not defined");
+  return s;
+}, x = ({ children: s }) => {
+  const o = {
+    session: S()
+  };
+  return /* @__PURE__ */ r(t.Provider, { value: o, children: s });
+}, p = () => {
+  const s = d(), [e, o] = c([]);
+  return l(() => s.sessions.sessions.subscribe(o), [s]), n(`Sessions: ${e.length}`), e;
+}, S = () => {
+  const e = p().at(0) ?? null;
+  return n(`Selected user: ${e?.peer.accountId.toString() ?? "None"}`), e;
+};
+export {
+  x as SessionsProvider,
+  v as useSession,
+  S as useUserSession
+};

package/dist/ui/QrCode.js

@@ -32,7 +32,7 @@ const f = p, h = s(({ value: e, size: o }) => {
       color: "#ffffff"
     },
     qrOptions: {
-      errorCorrectionLevel: "H"
+      errorCorrectionLevel: "M"
     }
   }), [o]);
   return n(() => (t && r.append(t), () => {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@novasamatech/host-papp-ui",
   "type": "module",
-  "version": "0.5.0-6",
+  "version": "0.5.0-7",
   "description": "Polkadot app UI Flow",
   "license": "Apache-2.0",
   "repository": {
@@ -29,7 +29,8 @@
     "react-dom": ">=18"
   },
   "dependencies": {
-    "qr-code-styling": "1.9.2"
+    "qr-code-styling": "1.9.2",
+    "@polkadot-api/utils": "0.2.0"
   },
   "devDependencies": {
     "@types/react": "19.2.7",

package/dist/flow/SignInStateProvider.d.ts

@@ -1,13 +0,0 @@
-import { Identity, SignInStatus } from '../../../host-papp';
-import { PropsWithChildren } from 'react';
-type State = {
-    identity: Identity | null;
-    signInStatus: SignInStatus;
-    pending: boolean;
-    initiatedByUser: boolean;
-    signIn(): Promise<Identity | null>;
-    abort(): void;
-};
-export declare const useSignInFlow: () => State;
-export declare const SignInStateProvider: ({ children }: PropsWithChildren) => import("react").JSX.Element;
-export {};

package/dist/flow/SignInStateProvider.js

@@ -1,35 +0,0 @@
-import { jsx as I } from "react/jsx-runtime";
-import { createContext as p, useContext as h, useState as s, useSyncExternalStore as m, useEffect as y, useCallback as x } from "react";
-import { usePapp as C } from "./PappProvider.js";
-const a = p({
-  identity: null,
-  signInStatus: { step: "none" },
-  pending: !1,
-  initiatedByUser: !1,
-  signIn: () => Promise.resolve(null),
-  abort() {
-  }
-}), U = () => h(a), B = ({ children: i }) => {
-  const [o, n] = s(!1), [u, l] = s(!1), [g, r] = s(null), t = C(), c = m(t.auth.onSignInStatusChange, t.auth.getSignInStatus);
-  y(() => {
-    let e = !0;
-    return n(!0), t.auth.getCurrentUser().then((d) => {
-      e && (r(d), n(!1));
-    }), () => {
-      e = !1;
-    };
-  }, [t]);
-  const f = x(() => (n(!0), l(!0), t.auth.signIn().then((e) => (r(e), e)).finally(() => n(!1))), [t]), S = {
-    pending: o,
-    signInStatus: c,
-    initiatedByUser: u,
-    identity: g,
-    signIn: f,
-    abort: t.auth.abortSignIn
-  };
-  return /* @__PURE__ */ I(a.Provider, { value: S, children: i });
-};
-export {
-  B as SignInStateProvider,
-  U as useSignInFlow
-};