@xyo-network/react-panel 2.23.7

package/dist/esm/contexts/Context.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { XyoPanelContextState } from './State';
+export declare const XyoPanelContext: import("react").Context<XyoPanelContextState & import("@xyo-network/react-shared").ContextExState>;

package/dist/esm/contexts/Context.js

@@ -0,0 +1,3 @@
+import { createContextEx } from '@xyo-network/react-shared';
+export const XyoPanelContext = createContextEx();
+//# sourceMappingURL=Context.js.map

package/dist/esm/contexts/Context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Context.js","sourceRoot":"","sources":["../../../src/contexts/Context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAI3D,MAAM,CAAC,MAAM,eAAe,GAAG,eAAe,EAAwB,CAAA"}

package/dist/esm/contexts/Provider.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { WithChildren } from '@xylabs/sdk-react';
+import { XyoArchivistApi } from '@xyo-network/api';
+import { XyoPayload, XyoWitness } from '@xyo-network/core';
+export interface XyoPanelProviderProps {
+    archivists?: XyoArchivistApi[];
+    inlinePayloads?: boolean;
+    witnesses?: XyoWitness<XyoPayload>[];
+    required?: boolean;
+    archive?: string;
+}
+export declare const XyoPanelProvider: React.FC<WithChildren<XyoPanelProviderProps>>;

package/dist/esm/contexts/Provider.js

@@ -0,0 +1,122 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { assertEx, delay } from '@xylabs/sdk-js';
+import { useAsyncEffect } from '@xylabs/sdk-react';
+import { XyoArchivistApi } from '@xyo-network/api';
+import { XyoPanel } from '@xyo-network/panel';
+import { useArchive } from '@xyo-network/react-archive';
+import { useAccount } from '@xyo-network/react-wallet';
+import { XyoSystemInfoWitness } from '@xyo-network/systeminfo-witness';
+import { useEffect, useState } from 'react';
+import { XyoPanelContext } from './Context';
+import { XyoReportStatus } from './State';
+const getDefaultArchivists = () => {
+    const archivistConfigs = [
+        {
+            apiDomain: process.env.API_DOMAIN || 'https://api.archivist.xyo.network',
+        },
+    ];
+    return archivistConfigs.map((config) => {
+        return new XyoArchivistApi(config);
+    });
+};
+export const XyoPanelProvider = ({ inlinePayloads = false, required = false, archivists = getDefaultArchivists(), witnesses = [new XyoSystemInfoWitness()], children, }) => {
+    const { archive } = useArchive();
+    const [panel, setPanel] = useState();
+    const [history, setHistory] = useState();
+    const [progress, setProgress] = useState({});
+    const [status, setStatus] = useState(XyoReportStatus.Idle);
+    const [reportingErrors, setReportingErrors] = useState();
+    const { account } = useAccount();
+    useAsyncEffect(
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    async (mounted) => {
+        const panel = new XyoPanel({
+            account,
+            archive,
+            archivists,
+            inlinePayloads,
+            onArchivistSendEnd: (archivist, error) => {
+                const archivists = progress.archivists ?? {};
+                archivists[archivist.config.apiDomain] = {
+                    archivist,
+                    status: error ? XyoReportStatus.Failed : XyoReportStatus.Succeeded,
+                };
+                if (mounted()) {
+                    setProgress({ archivists, witnesses: progress.witnesses });
+                }
+            },
+            onArchivistSendStart: (archivist) => {
+                const archivists = progress.archivists ?? {};
+                archivists[archivist.config.apiDomain] = {
+                    archivist,
+                    status: XyoReportStatus.Started,
+                };
+                if (mounted()) {
+                    setProgress({ archivists, witnesses: progress.witnesses });
+                }
+            },
+            onHistoryAdd: () => {
+                if (mounted()) {
+                    setHistory(assertEx(panel).history.map((item) => item));
+                }
+            },
+            onHistoryRemove: () => {
+                if (mounted()) {
+                    setHistory(assertEx(panel).history.map((item) => item));
+                }
+            },
+            onReportEnd: (_, errors) => {
+                if (mounted()) {
+                    setProgress({
+                        archivists: progress.archivists,
+                        witnesses: progress.witnesses,
+                    });
+                    setStatus(errors ? XyoReportStatus.Failed : XyoReportStatus.Succeeded);
+                    setReportingErrors(errors);
+                }
+            },
+            onReportStart: () => {
+                if (mounted()) {
+                    setProgress({ archivists: {}, witnesses: {} });
+                    setStatus(XyoReportStatus.Started);
+                }
+            },
+            onWitnessReportEnd: (witness, error) => {
+                const witnesses = progress.witnesses ?? {};
+                witnesses[witness.config.schema] = {
+                    status: error ? XyoReportStatus.Failed : XyoReportStatus.Succeeded,
+                    witness,
+                };
+                if (mounted()) {
+                    setProgress({
+                        archivists: progress.archivists,
+                        witnesses,
+                    });
+                }
+            },
+            onWitnessReportStart: (witness) => {
+                const witnesses = progress.witnesses ?? {};
+                witnesses[witness.config.schema] = {
+                    status: XyoReportStatus.Started,
+                    witness,
+                };
+                if (mounted()) {
+                    setProgress({
+                        archivists: progress.archivists,
+                        witnesses,
+                    });
+                }
+            },
+            witnesses: witnesses.filter((witness) => !!witness),
+        });
+        setPanel(panel);
+        await delay(0);
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [account, archive, archivists, witnesses]);
+    useEffect(() => {
+        setHistory(panel?.history);
+    }, [panel]);
+    return (_jsx(XyoPanelContext.Provider, { value: { history, panel, progress, provided: true, reportingErrors, status }, children: panel ? children : required ? null : children }));
+};
+//# sourceMappingURL=Provider.js.map

package/dist/esm/contexts/Provider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Provider.js","sourceRoot":"","sources":["../../../src/contexts/Provider.tsx"],"names":[],"mappings":"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"}

package/dist/esm/contexts/State.d.ts

@@ -0,0 +1,29 @@
+import { XyoArchivistApi } from '@xyo-network/api';
+import { XyoBoundWitness, XyoWitness } from '@xyo-network/core';
+import { XyoPanel } from '@xyo-network/panel';
+export declare enum XyoReportStatus {
+    Idle = "idle",
+    Queued = "queued",
+    Started = "started",
+    Succeeded = "succeeded",
+    Failed = "failed"
+}
+export interface XyoWitnessReportProgress {
+    witness: XyoWitness;
+    status: XyoReportStatus;
+}
+export interface XyoArchivistApiReportProgress {
+    archivist: XyoArchivistApi;
+    status: XyoReportStatus;
+}
+export interface XyoPanelReportProgress {
+    witnesses?: Record<string, XyoWitnessReportProgress>;
+    archivists?: Record<string, XyoArchivistApiReportProgress>;
+}
+export interface XyoPanelContextState {
+    panel?: XyoPanel;
+    history?: XyoBoundWitness[];
+    progress?: XyoPanelReportProgress;
+    status?: XyoReportStatus;
+    reportingErrors?: Error[];
+}

package/dist/esm/contexts/State.js

@@ -0,0 +1,9 @@
+export var XyoReportStatus;
+(function (XyoReportStatus) {
+    XyoReportStatus["Idle"] = "idle";
+    XyoReportStatus["Queued"] = "queued";
+    XyoReportStatus["Started"] = "started";
+    XyoReportStatus["Succeeded"] = "succeeded";
+    XyoReportStatus["Failed"] = "failed";
+})(XyoReportStatus || (XyoReportStatus = {}));
+//# sourceMappingURL=State.js.map

package/dist/esm/contexts/State.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"State.js","sourceRoot":"","sources":["../../../src/contexts/State.ts"],"names":[],"mappings":"AAIA,MAAM,CAAN,IAAY,eAMX;AAND,WAAY,eAAe;IACzB,gCAAa,CAAA;IACb,oCAAiB,CAAA;IACjB,sCAAmB,CAAA;IACnB,0CAAuB,CAAA;IACvB,oCAAiB,CAAA;AACnB,CAAC,EANW,eAAe,KAAf,eAAe,QAM1B"}

package/dist/esm/contexts/index.d.ts

@@ -0,0 +1,4 @@
+export * from './Context';
+export * from './Provider';
+export * from './State';
+export * from './use';

package/dist/esm/contexts/index.js

@@ -0,0 +1,5 @@
+export * from './Context';
+export * from './Provider';
+export * from './State';
+export * from './use';
+//# sourceMappingURL=index.js.map

package/dist/esm/contexts/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/contexts/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,OAAO,CAAA"}

package/dist/esm/contexts/use.d.ts

@@ -0,0 +1,7 @@
+export declare const useXyoPanel: () => {
+    history: import("@xyo-network/core/dist/esm/BoundWitness/models/XyoBoundWitness").XyoBoundWitness[] | undefined;
+    panel: import("@xyo-network/panel").XyoPanel | undefined;
+    progress: import("./State").XyoPanelReportProgress | undefined;
+    reportingErrors: Error[] | undefined;
+    status: import("./State").XyoReportStatus | undefined;
+};

package/dist/esm/contexts/use.js

@@ -0,0 +1,7 @@
+import { useContextEx } from '@xyo-network/react-shared';
+import { XyoPanelContext } from './Context';
+export const useXyoPanel = () => {
+    const { panel, history, progress, reportingErrors, status } = useContextEx(XyoPanelContext, 'XyoPanel');
+    return { history, panel, progress, reportingErrors, status };
+};
+//# sourceMappingURL=use.js.map

package/dist/esm/contexts/use.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use.js","sourceRoot":"","sources":["../../../src/contexts/use.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAExD,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AAE3C,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE;IAC9B,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,EAAE,GAAG,YAAY,CAAC,eAAe,EAAE,UAAU,CAAC,CAAA;IACvG,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,EAAE,CAAA;AAC9D,CAAC,CAAA"}

package/dist/esm/index.d.ts

@@ -0,0 +1 @@
+export * from './contexts';

package/dist/esm/index.js

@@ -0,0 +1,2 @@
+export * from './contexts';
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAA"}

package/package.json

@@ -0,0 +1,138 @@
+{
+  "name": "@xyo-network/react-panel",
+  "author": {
+    "email": "support@xyo.network",
+    "name": "XYO Development Team",
+    "url": "https://xyo.network"
+  },
+  "bugs": {
+    "email": "support@xyo.network",
+    "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues"
+  },
+  "workspaces": [
+    "packages/*"
+  ],
+  "dependencies": {
+    "@emotion/react": "^11.9.0",
+    "@emotion/styled": "^11.8.1",
+    "@mui/icons-material": "^5.8.0",
+    "@mui/lab": "^5.0.0-alpha.83",
+    "@mui/material": "^5.8.1",
+    "@xylabs/pixel": "^1.3.7",
+    "@xylabs/sdk-js": "^2.5.5",
+    "@xylabs/sdk-react": "^2.12.7",
+    "@xyo-network/api": "^2.20.33",
+    "@xyo-network/core": "^2.20.33",
+    "@xyo-network/network": "^2.20.33",
+    "@xyo-network/panel": "^2.20.33",
+    "@xyo-network/react-archive": "^2.23.7",
+    "@xyo-network/react-shared": "^2.23.7",
+    "@xyo-network/react-wallet": "^2.23.7",
+    "@xyo-network/systeminfo-witness": "^2.20.33",
+    "@xyo-network/utils": "^2.20.33",
+    "lodash": "^4.17.21",
+    "luxon": "^2.4.0",
+    "react": "^18.1.0",
+    "react-dom": "^18.1.0",
+    "react-icons": "^4.3.1",
+    "react-json-view": "^1.21.3",
+    "react-router-dom": "^6.3.0",
+    "rollbar": "^2.25.0",
+    "typedoc": "^0.22.15"
+  },
+  "description": "Common React library for all XYO projects that use React",
+  "devDependencies": {
+    "@babel/core": "^7.18.0",
+    "@babel/preset-env": "^7.18.0",
+    "@storybook/addon-actions": "^6.5.4",
+    "@storybook/addon-docs": "^6.5.4",
+    "@storybook/addon-essentials": "^6.5.4",
+    "@storybook/addon-interactions": "^6.5.4",
+    "@storybook/addon-links": "^6.5.4",
+    "@storybook/addons": "^6.5.4",
+    "@storybook/api": "^6.5.4",
+    "@storybook/builder-webpack5": "^6.5.4",
+    "@storybook/components": "^6.5.4",
+    "@storybook/core-events": "^6.5.4",
+    "@storybook/manager-webpack5": "^6.5.4",
+    "@storybook/react": "^6.5.4",
+    "@storybook/testing-library": "^0.0.11",
+    "@storybook/theming": "^6.5.4",
+    "@types/lodash": "^4.14.182",
+    "@types/luxon": "^2.3.2",
+    "@xylabs/eslint-config-react": "^2.1.5",
+    "@xylabs/pixel": "^1.3.7",
+    "@xylabs/rollup-config": "^1.1.17",
+    "@xylabs/sdk-js": "^2.5.5",
+    "@xylabs/sdk-react": "^2.12.7",
+    "@xylabs/ts-scripts": "^1.0.66",
+    "@xylabs/tsconfig": "^1.0.13",
+    "assert": "^2.0.0",
+    "axios": "^0.27.2",
+    "storybook-dark-mode": "^1.1.0",
+    "typescript": "^4.6.4"
+  },
+  "browser": "dist/esm/index.js",
+  "docs": "dist/docs.json",
+  "exports": {
+    ".": {
+      "node": {
+        "import": "./dist/esm/index.js",
+        "require": "./dist/cjs/index.js"
+      },
+      "browser": {
+        "import": "./dist/esm/index.js",
+        "require": "./dist/cjs/index.js"
+      },
+      "default": "./dist/esm/index.js"
+    },
+    "./dist/docs.json": {
+      "default": "./dist/docs.json"
+    },
+    "./package.json": "./package.json"
+  },
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "homepage": "https://xyo.network",
+  "keywords": [
+    "xyo",
+    "utility",
+    "typescript",
+    "react"
+  ],
+  "license": "LGPL-3.0",
+  "peerDependencies": {
+    "axios": ">0.26",
+    "typedoc": "^0.22.13"
+  },
+  "peerDependenciesMeta": {
+    "typedoc": {
+      "optional": true
+    }
+  },
+  "resolutions": {
+    "@storybook/react/webpack": "^5",
+    "bn.js": "^5.2.0",
+    "react": "^18.1.0",
+    "react-dom": "^18.1.0",
+    "webpack": "^5"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js.git"
+  },
+  "scripts": {
+    "deploy": "yarn deploy3",
+    "lint-pkg": "npmPkgJsonLint .",
+    "build": "yarn clean && tsc -p tsconfig.build.cjs.json && tsc -p tsconfig.build.esm.json && yarn gen:docs",
+    "gen:docs": "typedoc ./src/index.ts --json ./dist/docs.json --tsconfig ./tsconfig.json",
+    "license": "yarn license-checker --exclude \"MIT, ISC, Apache-2.0, BSD, BSD-2-Clause, CC-BY-4.0, Unlicense, CC-BY-3.0, CC0-1.0\""
+  },
+  "sideEffects": false,
+  "types": "dist/esm/index.d.ts",
+  "version": "2.23.7",
+  "packageManager": "yarn@3.1.1"
+}

package/src/contexts/Context.ts

@@ -0,0 +1,5 @@
+import { createContextEx } from '@xyo-network/react-shared'
+
+import { XyoPanelContextState } from './State'
+
+export const XyoPanelContext = createContextEx<XyoPanelContextState>()

package/src/contexts/Provider.tsx

@@ -0,0 +1,148 @@
+import { assertEx, delay } from '@xylabs/sdk-js'
+import { useAsyncEffect, WithChildren } from '@xylabs/sdk-react'
+import { XyoApiConfig, XyoArchivistApi } from '@xyo-network/api'
+import { XyoBoundWitness, XyoPayload, XyoWitness } from '@xyo-network/core'
+import { XyoPanel } from '@xyo-network/panel'
+import { useArchive } from '@xyo-network/react-archive'
+import { useAccount } from '@xyo-network/react-wallet'
+import { XyoSystemInfoWitness } from '@xyo-network/systeminfo-witness'
+import { useEffect, useState } from 'react'
+
+import { XyoPanelContext } from './Context'
+import { XyoPanelReportProgress, XyoReportStatus } from './State'
+
+export interface XyoPanelProviderProps {
+  archivists?: XyoArchivistApi[]
+  inlinePayloads?: boolean
+  witnesses?: XyoWitness<XyoPayload>[]
+  required?: boolean
+  archive?: string
+}
+
+const getDefaultArchivists = () => {
+  const archivistConfigs: XyoApiConfig[] = [
+    {
+      apiDomain: process.env.API_DOMAIN || 'https://api.archivist.xyo.network',
+    },
+  ]
+
+  return archivistConfigs.map((config) => {
+    return new XyoArchivistApi(config)
+  })
+}
+
+export const XyoPanelProvider: React.FC<WithChildren<XyoPanelProviderProps>> = ({
+  inlinePayloads = false,
+  required = false,
+  archivists = getDefaultArchivists(),
+  witnesses = [new XyoSystemInfoWitness()],
+  children,
+}) => {
+  const { archive } = useArchive()
+  const [panel, setPanel] = useState<XyoPanel>()
+  const [history, setHistory] = useState<XyoBoundWitness[]>()
+  const [progress, setProgress] = useState<XyoPanelReportProgress>({})
+  const [status, setStatus] = useState(XyoReportStatus.Idle)
+  const [reportingErrors, setReportingErrors] = useState<Error[]>()
+
+  const { account } = useAccount()
+
+  useAsyncEffect(
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    async (mounted) => {
+      const panel = new XyoPanel({
+        account,
+        archive,
+        archivists,
+        inlinePayloads,
+        onArchivistSendEnd: (archivist: XyoArchivistApi, error?: Error) => {
+          const archivists = progress.archivists ?? {}
+          archivists[archivist.config.apiDomain] = {
+            archivist,
+            status: error ? XyoReportStatus.Failed : XyoReportStatus.Succeeded,
+          }
+          if (mounted()) {
+            setProgress({ archivists, witnesses: progress.witnesses })
+          }
+        },
+        onArchivistSendStart: (archivist: XyoArchivistApi) => {
+          const archivists = progress.archivists ?? {}
+          archivists[archivist.config.apiDomain] = {
+            archivist,
+            status: XyoReportStatus.Started,
+          }
+          if (mounted()) {
+            setProgress({ archivists, witnesses: progress.witnesses })
+          }
+        },
+        onHistoryAdd: () => {
+          if (mounted()) {
+            setHistory(assertEx(panel).history.map((item) => item))
+          }
+        },
+        onHistoryRemove: () => {
+          if (mounted()) {
+            setHistory(assertEx(panel).history.map((item) => item))
+          }
+        },
+        onReportEnd: (_, errors?: Error[]) => {
+          if (mounted()) {
+            setProgress({
+              archivists: progress.archivists,
+              witnesses: progress.witnesses,
+            })
+            setStatus(errors ? XyoReportStatus.Failed : XyoReportStatus.Succeeded)
+            setReportingErrors(errors)
+          }
+        },
+        onReportStart: () => {
+          if (mounted()) {
+            setProgress({ archivists: {}, witnesses: {} })
+            setStatus(XyoReportStatus.Started)
+          }
+        },
+        onWitnessReportEnd: (witness: XyoWitness, error?: Error) => {
+          const witnesses = progress.witnesses ?? {}
+          witnesses[witness.config.schema] = {
+            status: error ? XyoReportStatus.Failed : XyoReportStatus.Succeeded,
+            witness,
+          }
+          if (mounted()) {
+            setProgress({
+              archivists: progress.archivists,
+              witnesses,
+            })
+          }
+        },
+        onWitnessReportStart: (witness: XyoWitness) => {
+          const witnesses = progress.witnesses ?? {}
+          witnesses[witness.config.schema] = {
+            status: XyoReportStatus.Started,
+            witness,
+          }
+          if (mounted()) {
+            setProgress({
+              archivists: progress.archivists,
+              witnesses,
+            })
+          }
+        },
+        witnesses: witnesses.filter((witness) => !!witness),
+      })
+      setPanel(panel)
+      await delay(0)
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [account, archive, archivists, witnesses]
+  )
+
+  useEffect(() => {
+    setHistory(panel?.history)
+  }, [panel])
+
+  return (
+    <XyoPanelContext.Provider value={{ history, panel, progress, provided: true, reportingErrors, status }}>
+      {panel ? children : required ? null : children}
+    </XyoPanelContext.Provider>
+  )
+}

package/src/contexts/State.ts

@@ -0,0 +1,34 @@
+import { XyoArchivistApi } from '@xyo-network/api'
+import { XyoBoundWitness, XyoWitness } from '@xyo-network/core'
+import { XyoPanel } from '@xyo-network/panel'
+
+export enum XyoReportStatus {
+  Idle = 'idle',
+  Queued = 'queued',
+  Started = 'started',
+  Succeeded = 'succeeded',
+  Failed = 'failed',
+}
+
+export interface XyoWitnessReportProgress {
+  witness: XyoWitness
+  status: XyoReportStatus
+}
+
+export interface XyoArchivistApiReportProgress {
+  archivist: XyoArchivistApi
+  status: XyoReportStatus
+}
+
+export interface XyoPanelReportProgress {
+  witnesses?: Record<string, XyoWitnessReportProgress>
+  archivists?: Record<string, XyoArchivistApiReportProgress>
+}
+
+export interface XyoPanelContextState {
+  panel?: XyoPanel
+  history?: XyoBoundWitness[]
+  progress?: XyoPanelReportProgress
+  status?: XyoReportStatus
+  reportingErrors?: Error[]
+}

package/src/contexts/index.ts

@@ -0,0 +1,4 @@
+export * from './Context'
+export * from './Provider'
+export * from './State'
+export * from './use'

package/src/contexts/use.ts

@@ -0,0 +1,8 @@
+import { useContextEx } from '@xyo-network/react-shared'
+
+import { XyoPanelContext } from './Context'
+
+export const useXyoPanel = () => {
+  const { panel, history, progress, reportingErrors, status } = useContextEx(XyoPanelContext, 'XyoPanel')
+  return { history, panel, progress, reportingErrors, status }
+}

package/src/index.ts

@@ -0,0 +1 @@
+export * from './contexts'