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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,13 +1,14 @@
1
- import { jsx as e, jsxs as i, Fragment as r } from "react/jsx-runtime";
2
- import { memo as l } from "react";
3
- import { Modal as a } from "../ui/Modal.js";
4
- import { QrCode as d } from "../ui/QrCode.js";
5
- import { useSignInFlow as p } from "./SignInStateProvider.js";
6
- const t = ({ children: n }) => /* @__PURE__ */ e("span", { style: { fontSize: "16px", textAlign: "center", flexShrink: 0, color: "white", fontFamily: "sans-serif" }, children: n }), u = l(() => {
7
- const n = p(), o = n.signInStatus.step !== "none" && n.initiatedByUser;
8
- return /* @__PURE__ */ e(a, { isOpen: o, onOpenChange: (s) => {
9
- s || n.abort();
10
- }, width: 300, children: /* @__PURE__ */ i(
1
+ import { jsx as e, jsxs as n, Fragment as p } from "react/jsx-runtime";
2
+ import { memo as c, useMemo as m } from "react";
3
+ import { useSessionIdentity as u } from "../hooks/identity.js";
4
+ import { useAuthenticateFlow as f } from "../providers/AuthProvider.js";
5
+ import { Modal as g } from "../ui/Modal.js";
6
+ import { QrCode as h } from "../ui/QrCode.js";
7
+ const i = ({ children: t }) => /* @__PURE__ */ e("span", { style: { fontSize: "16px", textAlign: "center", flexShrink: 0, color: "white", fontFamily: "sans-serif" }, children: t }), w = c(() => {
8
+ const t = f(), s = t.status.step !== "none", o = (d) => {
9
+ d || t.abortAuthentication();
10
+ }, r = m(() => t.status.step === "finished" ? t.status.session : null, [t.status.step]), [a, l] = u(r);
11
+ return /* @__PURE__ */ e(g, { isOpen: s, onOpenChange: o, width: 300, children: /* @__PURE__ */ n(
11
12
  "div",
12
13
  {
13
14
  style: {
@@ -19,11 +20,11 @@ const t = ({ children: n }) => /* @__PURE__ */ e("span", { style: { fontSize: "1
19
20
  alignItems: "center"
20
21
  },
21
22
  children: [
22
- /* @__PURE__ */ e(t, { children: "Sign in Polkadot app" }),
23
- n.signInStatus.step === "pairing" && /* @__PURE__ */ e(d, { value: n.signInStatus.payload, size: 270 }),
24
- n.signInStatus.step === "finished" && /* @__PURE__ */ e(r, { children: /* @__PURE__ */ i(t, { children: [
23
+ /* @__PURE__ */ e(i, { children: "Sign in Polkadot app" }),
24
+ t.status.step === "pairing" && /* @__PURE__ */ e(h, { value: t.status.payload, size: 270 }),
25
+ t.status.step === "finished" && /* @__PURE__ */ e(p, { children: /* @__PURE__ */ n(i, { children: [
25
26
  "Welcome back, ",
26
- n.identity?.liteUsername ?? "User",
27
+ a?.liteUsername ?? (l ? "..." : "user"),
27
28
  "!"
28
29
  ] }) })
29
30
  ]
@@ -31,5 +32,5 @@ const t = ({ children: n }) => /* @__PURE__ */ e("span", { style: { fontSize: "1
31
32
  ) });
32
33
  });
33
34
  export {
34
- u as PairingModal
35
+ w as PairingModal
35
36
  };
@@ -1,13 +1,14 @@
1
1
  import { jsx as o } from "react/jsx-runtime";
2
2
  import { createContext as n, useContext as i } from "react";
3
- import { SignInStateProvider as p } from "./SignInStateProvider.js";
4
- const e = n(null), a = () => {
3
+ import { AuthProvider as p } from "../providers/AuthProvider.js";
4
+ import { SessionsProvider as d } from "../providers/SessionsProvider.js";
5
+ const e = n(null), P = () => {
5
6
  const r = i(e);
6
7
  if (r === null)
7
8
  throw new Error("Polkadot app Provider must be defined.");
8
9
  return r;
9
- }, l = ({ adapter: r, children: t }) => /* @__PURE__ */ o(e.Provider, { value: r, children: /* @__PURE__ */ o(p, { children: t }) });
10
+ }, c = ({ adapter: r, children: t }) => /* @__PURE__ */ o(e.Provider, { value: r, children: /* @__PURE__ */ o(p, { children: /* @__PURE__ */ o(d, { children: t }) }) });
10
11
  export {
11
- l as PappProvider,
12
- a as usePapp
12
+ c as PappProvider,
13
+ P as usePapp
13
14
  };
@@ -0,0 +1,3 @@
1
+ import { Identity, UserSession } from '../../../host-papp';
2
+ export declare function useIdentity(accountId: string | null): readonly [Identity | null, boolean];
3
+ export declare function useSessionIdentity(session: UserSession | null): readonly [Identity | null, boolean];
@@ -0,0 +1,30 @@
1
+ import { toHex as o } from "@polkadot-api/utils";
2
+ import { useState as r, useEffect as p } from "react";
3
+ import { usePapp as a } from "../flow/PappProvider.js";
4
+ function d(e) {
5
+ const f = a(), [u, t] = r(!1), [s, i] = r(null);
6
+ return p(() => {
7
+ if (!e) {
8
+ t(!1);
9
+ return;
10
+ }
11
+ let n = !0;
12
+ return t(!0), f.identity.getIdentity(e).match(
13
+ (l) => {
14
+ n && (i(l), t(!1));
15
+ },
16
+ () => {
17
+ n && (i(null), t(!1));
18
+ }
19
+ ), () => {
20
+ t(!1), n = !1;
21
+ };
22
+ }, [e]), [s, u];
23
+ }
24
+ function g(e) {
25
+ return d(e ? o(e.peer.accountId) : null);
26
+ }
27
+ export {
28
+ d as useIdentity,
29
+ g as useSessionIdentity
30
+ };
package/dist/index.d.ts CHANGED
@@ -1,3 +1,5 @@
1
- export { useSignInFlow } from './flow/SignInStateProvider.js';
1
+ export { useAuthenticateFlow } from './providers/AuthProvider.js';
2
+ export { useSession } from './providers/SessionsProvider.js';
3
+ export { useIdentity, useSessionIdentity } from './hooks/identity.js';
2
4
  export { PappProvider } from './flow/PappProvider.js';
3
5
  export { PairingModal } from './flow/PairingModal.js';
package/dist/index.js CHANGED
@@ -1,8 +1,13 @@
1
- import { useSignInFlow as e } from "./flow/SignInStateProvider.js";
2
- import { PappProvider as i } from "./flow/PappProvider.js";
3
- import { PairingModal as f } from "./flow/PairingModal.js";
1
+ import { useAuthenticateFlow as r } from "./providers/AuthProvider.js";
2
+ import { useSession as i } from "./providers/SessionsProvider.js";
3
+ import { useIdentity as p, useSessionIdentity as n } from "./hooks/identity.js";
4
+ import { PappProvider as m } from "./flow/PappProvider.js";
5
+ import { PairingModal as x } from "./flow/PairingModal.js";
4
6
  export {
5
- f as PairingModal,
6
- i as PappProvider,
7
- e as useSignInFlow
7
+ x as PairingModal,
8
+ m as PappProvider,
9
+ r as useAuthenticateFlow,
10
+ p as useIdentity,
11
+ i as useSession,
12
+ n as useSessionIdentity
8
13
  };
@@ -0,0 +1,12 @@
1
+ import { AuthentificationStatus, UserSession } from '../../../host-papp';
2
+ import { PropsWithChildren } from 'react';
3
+ type State = {
4
+ status: AuthentificationStatus;
5
+ pending: boolean;
6
+ authenticate(): Promise<UserSession | null>;
7
+ abortAuthentication(): void;
8
+ disconnect(session: UserSession): Promise<void>;
9
+ };
10
+ export declare const useAuthenticateFlow: () => State;
11
+ export declare const AuthProvider: ({ children }: PropsWithChildren) => import("react").JSX.Element;
12
+ export {};
@@ -0,0 +1,33 @@
1
+ import { jsx as m } from "react/jsx-runtime";
2
+ import { createContext as f, useContext as P, useState as b, useCallback as r, useSyncExternalStore as v, useDebugValue as x } from "react";
3
+ import { usePapp as u } from "../flow/PappProvider.js";
4
+ const c = f({
5
+ status: { step: "none" },
6
+ pending: !1,
7
+ authenticate: () => Promise.resolve(null),
8
+ abortAuthentication() {
9
+ },
10
+ async disconnect() {
11
+ }
12
+ }), w = () => P(c), A = () => {
13
+ const e = u(), s = v(e.sso.status.subscribe, e.sso.status.read);
14
+ return x(`Polkadot app authentification status: ${s.step}`), s;
15
+ }, k = ({ children: e }) => {
16
+ const [s, n] = b(!1), t = u(), i = A(), l = r(() => (n(!0), new Promise((o, a) => {
17
+ t.sso.authenticate().andTee(() => n(!1)).orTee(() => n(!1)).match(o, a);
18
+ })), [t]), p = r(
19
+ (o) => new Promise((a, h) => t.sessions.disconnect(o).match(a, h)),
20
+ [t]
21
+ ), d = {
22
+ pending: s,
23
+ status: i,
24
+ authenticate: l,
25
+ abortAuthentication: t.sso.abortAuthentication,
26
+ disconnect: p
27
+ };
28
+ return /* @__PURE__ */ m(c.Provider, { value: d, children: e });
29
+ };
30
+ export {
31
+ k as AuthProvider,
32
+ w as useAuthenticateFlow
33
+ };
@@ -0,0 +1,9 @@
1
+ import { UserSession } from '../../../host-papp';
2
+ import { PropsWithChildren } from 'react';
3
+ type State = {
4
+ session: UserSession | null;
5
+ };
6
+ export declare const useSession: () => State;
7
+ export declare const SessionsProvider: ({ children }: PropsWithChildren) => import("react").JSX.Element;
8
+ export declare const useUserSession: () => UserSession | null;
9
+ export {};
@@ -0,0 +1,25 @@
1
+ import { jsx as r } from "react/jsx-runtime";
2
+ import { createContext as i, useContext as u, useDebugValue as n, useState as c, useEffect as l } from "react";
3
+ import { usePapp as d } from "../flow/PappProvider.js";
4
+ const t = i(null), v = () => {
5
+ const s = u(t);
6
+ if (s === null)
7
+ throw new Error("User provider is not defined");
8
+ return s;
9
+ }, x = ({ children: s }) => {
10
+ const o = {
11
+ session: S()
12
+ };
13
+ return /* @__PURE__ */ r(t.Provider, { value: o, children: s });
14
+ }, p = () => {
15
+ const s = d(), [e, o] = c([]);
16
+ return l(() => s.sessions.sessions.subscribe(o), [s]), n(`Sessions: ${e.length}`), e;
17
+ }, S = () => {
18
+ const e = p().at(0) ?? null;
19
+ return n(`Selected user: ${e?.peer.accountId.toString() ?? "None"}`), e;
20
+ };
21
+ export {
22
+ x as SessionsProvider,
23
+ v as useSession,
24
+ S as useUserSession
25
+ };
package/dist/ui/QrCode.js CHANGED
@@ -32,7 +32,7 @@ const f = p, h = s(({ value: e, size: o }) => {
32
32
  color: "#ffffff"
33
33
  },
34
34
  qrOptions: {
35
- errorCorrectionLevel: "H"
35
+ errorCorrectionLevel: "M"
36
36
  }
37
37
  }), [o]);
38
38
  return n(() => (t && r.append(t), () => {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@novasamatech/host-papp-ui",
3
3
  "type": "module",
4
- "version": "0.5.0-6",
4
+ "version": "0.5.0-8",
5
5
  "description": "Polkadot app UI Flow",
6
6
  "license": "Apache-2.0",
7
7
  "repository": {
@@ -29,7 +29,8 @@
29
29
  "react-dom": ">=18"
30
30
  },
31
31
  "dependencies": {
32
- "qr-code-styling": "1.9.2"
32
+ "qr-code-styling": "1.9.2",
33
+ "@polkadot-api/utils": "0.2.0"
33
34
  },
34
35
  "devDependencies": {
35
36
  "@types/react": "19.2.7",
@@ -1,13 +0,0 @@
1
- import { Identity, SignInStatus } from '../../../host-papp';
2
- import { PropsWithChildren } from 'react';
3
- type State = {
4
- identity: Identity | null;
5
- signInStatus: SignInStatus;
6
- pending: boolean;
7
- initiatedByUser: boolean;
8
- signIn(): Promise<Identity | null>;
9
- abort(): void;
10
- };
11
- export declare const useSignInFlow: () => State;
12
- export declare const SignInStateProvider: ({ children }: PropsWithChildren) => import("react").JSX.Element;
13
- export {};
@@ -1,35 +0,0 @@
1
- import { jsx as I } from "react/jsx-runtime";
2
- import { createContext as p, useContext as h, useState as s, useSyncExternalStore as m, useEffect as y, useCallback as x } from "react";
3
- import { usePapp as C } from "./PappProvider.js";
4
- const a = p({
5
- identity: null,
6
- signInStatus: { step: "none" },
7
- pending: !1,
8
- initiatedByUser: !1,
9
- signIn: () => Promise.resolve(null),
10
- abort() {
11
- }
12
- }), U = () => h(a), B = ({ children: i }) => {
13
- const [o, n] = s(!1), [u, l] = s(!1), [g, r] = s(null), t = C(), c = m(t.auth.onSignInStatusChange, t.auth.getSignInStatus);
14
- y(() => {
15
- let e = !0;
16
- return n(!0), t.auth.getCurrentUser().then((d) => {
17
- e && (r(d), n(!1));
18
- }), () => {
19
- e = !1;
20
- };
21
- }, [t]);
22
- const f = x(() => (n(!0), l(!0), t.auth.signIn().then((e) => (r(e), e)).finally(() => n(!1))), [t]), S = {
23
- pending: o,
24
- signInStatus: c,
25
- initiatedByUser: u,
26
- identity: g,
27
- signIn: f,
28
- abort: t.auth.abortSignIn
29
- };
30
- return /* @__PURE__ */ I(a.Provider, { value: S, children: i });
31
- };
32
- export {
33
- B as SignInStateProvider,
34
- U as useSignInFlow
35
- };