@ibgib/space-gib 0.0.9 → 0.0.13

package/src/client/components/keystone-creator/keystone-creator.html

@@ -1,41 +0,0 @@
-<div id="container" class="component-container">
-    <h2 id="title">Keystone Creator</h2>
-    <div class="content">
-        <p>This will generate a new root keystone (identity) for your space.</p>
-
-        <div class="input-group">
-            <label for="input-username">Username</label>
-            <input type="text" id="input-username" placeholder="Enter your username..." class="text-input">
-        </div>
-
-        <div class="input-group">
-            <label for="input-description">Description (Optional)</label>
-            <input type="text" id="input-description" placeholder="Enter an optional description..." class="text-input">
-        </div>
-
-        <div class="input-group">
-            <label for="input-secret">Master Secret (Keep this private!)</label>
-            <input type="password" id="input-secret" placeholder="Enter your master secret..." class="secret-input">
-        </div>
-
-        <div class="checkbox-group" style="margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.5rem;">
-            <input type="checkbox" id="checkbox-make-active" checked style="cursor: pointer; width: 1rem; height: 1rem;">
-            <label for="checkbox-make-active" style="cursor: pointer; font-size: 0.9rem; user-select: none;">Make this the active identity</label>
-        </div>
-
-        <div class="action-row">
-            <button id="btn-generate" class="action-btn">Generate Identity Keystone</button>
-        </div>
-
-        <div id="status-area" class="status-area hidden">
-            <p id="status-text" class="status-msg"></p>
-        </div>
-
-        <div id="result-area" class="result-area collapsed">
-            <h3>New Keystone Generated!</h3>
-            <p class="address-label">Address:</p>
-            <code id="keystone-addr" class="keystone-addr"></code>
-            <p class="warning">⚠️ Store this address safely. It is your root identity for this space.</p>
-        </div>
-    </div>
-</div>

package/src/client/components/keystone-creator/keystone-creator.mts

@@ -1,443 +0,0 @@
-import thisCss from "./keystone-creator.css";
-import thisHtml from "./keystone-creator.html";
-import styleCss from "../../style.css";
-
-import { delay, extractErrorMsg, hash } from "@ibgib/helper-gib/dist/helpers/utils-helper.mjs";
-import { HashAlgorithm } from "@ibgib/helper-gib/dist/helpers/utils-helper.mjs";
-import { IbGibAddr } from "@ibgib/ts-gib/dist/types.mjs";
-import { IbGib_V1 } from "@ibgib/ts-gib/dist/V1/types.mjs";
-import { getIbGibAddr } from "@ibgib/ts-gib/dist/helper.mjs";
-import { KeystoneService_V1 } from "@ibgib/core-gib/dist/keystone/keystone-service-v1.mjs";
-import {
-    KeystonePoolConfig, KeystoneChallengeType, KeystoneReplenishStrategy
-} from "@ibgib/core-gib/dist/keystone/keystone-types.mjs";
-import { KeystoneProfileBuilder } from "@ibgib/core-gib/dist/keystone/policy/keystone-profile-builder.mjs";
-import { getGlobalMetaspace_waitIfNeeded, getLocalCoupledIbGibForDomainIbGib } from "@ibgib/web-gib/dist/helpers.mjs";
-import {
-    IbGibDynamicComponentMetaBase, IbGibFormInstanceBase,
-} from "@ibgib/web-gib/dist/ui/component/ibgib-dynamic-component-bases.mjs";
-import {
-    ElementsBase, IbGibDynamicComponentInstance,
-    IbGibDynamicComponentInstanceInitOpts,
-} from "@ibgib/web-gib/dist/ui/component/component-types.mjs";
-
-import { getComponentCtorArg } from "../../helpers.web.mjs";
-import { spaceGibApiBridge } from "../../api/space-gib-api-bridge.mjs";
-import { devLog } from "../../dev-tools.mjs";
-
-import {
-    createSettings, getSectionName, getSettingsScope
-} from "@ibgib/web-gib/dist/common/settings/settings-helpers.mjs";
-import { SettingsType } from "@ibgib/web-gib/dist/common/settings/settings-constants.mjs";
-import { SettingsIbGib_V1 } from "@ibgib/web-gib/dist/common/settings/settings-types.mjs";
-import { updateSpecialIndex, mut8Timeline } from "@ibgib/core-gib/dist/timeline/timeline-api.mjs";
-import { toDto } from "@ibgib/core-gib/dist/common/other/ibgib-helper.mjs";
-import { KEYSTONE_USERNAME_REGEXP, KEYSTONE_DESCRIPTION_REGEXP, KEYSTONE_VERB_SYNC, KEYSTONE_VERB_CONNECT } from "@ibgib/core-gib/dist/keystone/keystone-constants.mjs";
-import { deriveDelegateSecret } from "@ibgib/core-gib/dist/keystone/strategy/hash-reveal-v1/hash-reveal-v1.mjs";
-import { EVENT_IBGIB_IDENTITY_REQUEST_CHANGE } from "@ibgib/web-gib/dist/ui/ui-constants.mjs";
-
-export const KEYSTONE_CREATOR_COMPONENT_NAME = 'ibgib-keystone-creator';
-
-/**
- * Metadata for the Keystone Creator component.
- */
-export class KeystoneCreatorComponentMeta extends IbGibDynamicComponentMetaBase {
-    protected lc: string = `[KeystoneCreatorComponentMeta]`;
-
-    routeRegExp?: RegExp = new RegExp(`^${KEYSTONE_CREATOR_COMPONENT_NAME}$`);
-    componentName = KEYSTONE_CREATOR_COMPONENT_NAME;
-
-    constructor() {
-        super(getComponentCtorArg());
-        if (!customElements.get(this.componentName)) {
-            customElements.define(this.componentName, KeystoneCreatorComponentInstance);
-        }
-    }
-
-    async createInstance({
-        path,
-        ibGibAddr
-    }: {
-        path: string;
-        ibGibAddr: IbGibAddr;
-    }): Promise<IbGibDynamicComponentInstance> {
-        const lc = `${this.lc}[${this.createInstance.name}]`;
-        const component = document.createElement(this.componentName) as KeystoneCreatorComponentInstance;
-        await component.initialize({
-            ibGibAddr,
-            meta: this,
-            html: thisHtml,
-            css: [styleCss, thisCss],
-        });
-        return component;
-    }
-}
-
-/**
- * References to DOM elements within the component's shadow root.
- */
-interface KeystoneCreatorElements extends ElementsBase {
-    containerEl: HTMLDivElement;
-    titleEl: HTMLHeadingElement;
-    btnGenerateEl: HTMLButtonElement;
-    resultAreaEl: HTMLDivElement;
-    keystoneAddrEl: HTMLElement;
-    inputUsername: HTMLInputElement;
-    inputDescription: HTMLInputElement;
-    inputSecret: HTMLInputElement;
-    checkboxMakeActive: HTMLInputElement;
-    statusArea: HTMLDivElement;
-    statusText: HTMLParagraphElement;
-}
-
-/**
- * Concrete implementation of the Keystone Creator component.
- */
-export class KeystoneCreatorComponentInstance
-    extends IbGibFormInstanceBase<IbGib_V1, KeystoneCreatorElements>
-    implements IbGibDynamicComponentInstance<IbGib_V1, KeystoneCreatorElements> {
-
-    protected lc: string = `[KeystoneCreatorComponentInstance]`;
-    private hasExistingIdentities = false;
-
-    constructor() {
-        super();
-    }
-
-    override async initialize(opts: IbGibDynamicComponentInstanceInitOpts): Promise<void> {
-        await super.initialize(opts);
-    }
-
-    override async created(): Promise<void> {
-        this.elements = {} as KeystoneCreatorElements;
-
-        this.elements.containerEl = this.shadowRoot!.getElementById('container') as HTMLDivElement;
-        this.elements.titleEl = this.shadowRoot!.getElementById('title') as HTMLHeadingElement;
-        this.elements.btnGenerateEl = this.shadowRoot!.getElementById('btn-generate') as HTMLButtonElement;
-        this.elements.resultAreaEl = this.shadowRoot!.getElementById('result-area') as HTMLDivElement;
-        this.elements.keystoneAddrEl = this.shadowRoot!.getElementById('keystone-addr') as HTMLElement;
-        this.elements.inputUsername = this.shadowRoot!.getElementById('input-username') as HTMLInputElement;
-        this.elements.inputDescription = this.shadowRoot!.getElementById('input-description') as HTMLInputElement;
-        this.elements.inputSecret = this.shadowRoot!.getElementById('input-secret') as HTMLInputElement;
-        this.elements.checkboxMakeActive = this.shadowRoot!.getElementById('checkbox-make-active') as HTMLInputElement;
-        this.elements.statusArea = this.shadowRoot!.getElementById('status-area') as HTMLDivElement;
-        this.elements.statusText = this.shadowRoot!.getElementById('status-text') as HTMLParagraphElement;
-
-        // ElementBase requires contentEl
-        this.elements.contentEl = this.elements.containerEl;
-
-        this.initHandlers();
-
-        if (this.ibGibAddr && !this.ibGib) {
-            await this.loadIbGib();
-        }
-        await this.checkExistingIdentities();
-        await this.renderUI();
-    }
-
-    private async checkExistingIdentities() {
-        const lc = `${this.lc}[checkExistingIdentities]`;
-        try {
-            const metaspace = await getGlobalMetaspace_waitIfNeeded();
-            const space = await metaspace.getLocalUserSpace({});
-            if (space) {
-                const keystonesIndex = await metaspace.getSpecialIbGib({
-                    type: "keystones",
-                    space,
-                    initialize: true,
-                });
-                const registeredKeystones = keystonesIndex?.rel8ns?.keystone ?? [];
-                this.hasExistingIdentities = registeredKeystones.length > 0;
-            }
-        } catch (error) {
-            console.warn(`${lc} Error checking existing identities: ${extractErrorMsg(error)}`);
-            this.hasExistingIdentities = false;
-        }
-
-        const checkbox = this.elements!.checkboxMakeActive;
-        if (checkbox) {
-            if (!this.hasExistingIdentities) {
-                checkbox.checked = true;
-                checkbox.disabled = true;
-                checkbox.title = "At least one active identity is required.";
-            } else {
-                checkbox.disabled = false;
-                checkbox.title = "";
-            }
-        }
-    }
-
-    override async disconnected(): Promise<void> {
-        // cleanup if needed
-    }
-
-    private initHandlers() {
-        this.elements!.btnGenerateEl.addEventListener('click', () => this.handleGenerate());
-
-        // Clear invalid styling when user inputs text
-        this.elements!.inputUsername.addEventListener('input', () => {
-            this.elements!.inputUsername.classList.remove('invalid');
-        });
-        this.elements!.inputDescription.addEventListener('input', () => {
-            this.elements!.inputDescription.classList.remove('invalid');
-        });
-        this.elements!.inputSecret.addEventListener('input', () => {
-            this.elements!.inputSecret.classList.remove('invalid');
-        });
-    }
-
-    /**
-     * Triggered by the "Generate" button.
-     * Orchestrates: Secret -> Local Genesis -> Graph Collection -> Server Sync.
-     */
-    protected async handleGenerate() {
-        const lc = `${this.lc}[${this.handleGenerate.name}]`;
-        try {
-            console.log(`${lc} [NAG][ibgib-paradigm] starting genesis orchestration...`);
-            /**
-             * Delay update messages so the human eye has a chance to comprehend
-             * progress.
-             */
-            const humanEyeDelay = 500;
-            this.setStatus("Initializing genesis...", "info");
-
-            devLog('Starting local genesis orchestration...');
-
-            // Validate Username using base class validation plumbing
-            if (!this.validateInputPattern({
-                input: this.elements!.inputUsername,
-                pattern: KEYSTONE_USERNAME_REGEXP,
-                errorMessage: "Username must be 1-63 characters (alphanumeric, underscores, hyphens, dots).",
-                required: true
-            })) {
-                this.setStatus("Invalid username. Must be 1-63 characters (alphanumeric, _, -, .).", "error");
-                devLog('✗ Invalid username.');
-                return; /* <<<< returns early */
-            }
-            const username = this.elements!.inputUsername.value.trim();
-
-            // Validate Description using base class validation plumbing
-            if (!this.validateInputPattern({
-                input: this.elements!.inputDescription,
-                pattern: KEYSTONE_DESCRIPTION_REGEXP,
-                errorMessage: "Description must be 0-128 characters and consist of English characters and common punctuation.",
-                required: false
-            })) {
-                this.setStatus("Invalid description. Alphanumeric + common punctuation, max 128 chars.", "error");
-                devLog('✗ Invalid description.');
-                return; /* <<<< returns early */
-            }
-            const description = this.elements!.inputDescription.value.trim();
-
-            const masterSecret = this.elements!.inputSecret.value;
-            if (!masterSecret) {
-                this.elements!.inputSecret.classList.add('invalid');
-                this.setStatus("Please enter a master secret.", "error");
-                devLog('✗ Please enter a master secret.');
-                return; /* <<<< returns early */
-            } else {
-                this.elements!.inputSecret.classList.remove('invalid');
-            }
-
-            this.showBusy({
-                isBusy: true,
-                title: 'Generating Identity...',
-                msg: 'Preparing configuration and policy options...',
-                animationEmoji: '⚙️',
-                submitBtnSelector: '#btn-generate',
-                loadingText: 'Generating...'
-            });
-
-            // 1. Prepare Primary/Domain Keystone Configs
-            const builder = KeystoneProfileBuilder.buildKeystone('domain')
-                .withUsername(username)
-                .withDescription(description)
-                .withDetails({
-                    client: 'space-gib-web',
-                    role: 'domain-identity'
-                });
-            const configs = await builder.compileConfigs();
-
-            // 2. Get local services
-            const metaspace = await getGlobalMetaspace_waitIfNeeded();
-            const space = await metaspace.getLocalUserSpace({});
-            if (!space) { throw new Error("No default space found in metaspace."); }
-
-            // 3. Perform Genesis (Local)
-            this.showBusy({
-                isBusy: true,
-                title: 'Generating Identity...',
-                msg: 'Performing cryptographic local genesis...\n(This runs compute-heavy Key Derivation Functions)',
-                animationEmoji: '🗝️'
-            });
-            const keystoneService = new KeystoneService_V1();
-            const keystoneIbGib = await keystoneService.genesis({
-                masterSecret,
-                configs,
-                metaspace,
-                space,
-                frameDetails: builder.getFrameDetails(),
-                isPrimary: true
-            });
-
-            const addr = getIbGibAddr({ ibGib: keystoneIbGib });
-            console.log(`${lc} [NAG][ibgib-paradigm] local genesis complete: ${addr}`);
-            await delay(humanEyeDelay); // for human eyes, not needed for functionality
-            this.setStatus("Local genesis complete. Creating sync delegate...", "info");
-            devLog(`✓ Local genesis complete: ${addr}`);
-
-            // Automatically generate Sync Delegate Keystone
-            this.showBusy({
-                isBusy: true,
-                title: 'Creating Sync Delegate...',
-                msg: 'Generating cryptographic sync delegate keys...',
-                animationEmoji: '🔑'
-            });
-
-            const delegateSecret = await deriveDelegateSecret({ masterSecret });
-            const delegateBuilder = KeystoneProfileBuilder.buildKeystone('sync')
-                .withUsername(`${username}-sync`)
-                .withDescription(`Sync Delegate for ${username}`)
-                .withDetails({
-                    client: 'space-gib-web',
-                    role: 'sync-delegate'
-                });
-            const delegateConfigs = await delegateBuilder.compileConfigs();
-
-            const delegateKeystoneIbGib = await keystoneService.genesis({
-                masterSecret: delegateSecret,
-                configs: delegateConfigs,
-                metaspace,
-                space,
-                frameDetails: delegateBuilder.getFrameDetails()
-            });
-
-            const delegateAddr = getIbGibAddr({ ibGib: delegateKeystoneIbGib });
-            console.log(`${lc} sync delegate genesis complete: ${delegateAddr}`);
-            await delay(humanEyeDelay);
-
-            // Register delegate on parent
-            this.setStatus("Registering delegate on parent...", "info");
-            this.showBusy({
-                isBusy: true,
-                title: 'Registering Delegate...',
-                msg: 'Evolving domain identity to register delegate...',
-                animationEmoji: '📝'
-            });
-            const evolvedParentKeystoneIbGib = await keystoneService.registerDelegate({
-                parentKeystone: keystoneIbGib,
-                delegateKeystone: delegateKeystoneIbGib,
-                masterSecret,
-                metaspace,
-                space,
-                allowedVerbs: [KEYSTONE_VERB_SYNC, KEYSTONE_VERB_CONNECT]
-            });
-            const evolvedParentAddr = getIbGibAddr({ ibGib: evolvedParentKeystoneIbGib });
-            console.log(`${lc} delegate registered. evolved parent address: ${evolvedParentAddr}`);
-            await delay(humanEyeDelay);
-
-            // 4. Post to Server
-            devLog(`Posting genesis keystone to server...`);
-            this.setStatus("Syncing genesis to server...", "info");
-            this.showBusy({
-                isBusy: true,
-                title: 'Syncing to Server...',
-                msg: [
-                    'Posting genesis keystone to server sync node...',
-                    '(may take awhile, depending on strength of keystone...)',
-                ].join('\n'),
-                animationEmoji: '🔄'
-            });
-            const resSync = await spaceGibApiBridge.postGenesisKeystone(keystoneIbGib);
-            if (!resSync.success) {
-                this.setStatus(`Sync failed: ${resSync.message}`, "error");
-                devLog(`✗ Server rejected genesis keystone: ${resSync.message}`);
-                return; /* <<<< returns early */
-            }
-
-            // Post evolved keystone + delegate keystone
-            this.setStatus("Syncing delegate registration to server...", "info");
-            this.showBusy({
-                isBusy: true,
-                title: 'Syncing Delegate...',
-                msg: 'Posting evolved domain identity and sync delegate to server...',
-                animationEmoji: '🔄'
-            });
-            const resEvolve = await spaceGibApiBridge.putEvolveKeystone({
-                domainAddr: addr,
-                keystoneIbGib: evolvedParentKeystoneIbGib,
-                relatedKeystoneIbGibs: [delegateKeystoneIbGib]
-            });
-            if (!resEvolve.success) {
-                this.setStatus(`Delegate registration sync failed: ${resEvolve.message}`, "error");
-                devLog(`✗ Server rejected delegate registration: ${resEvolve.message}`);
-                return; /* <<<< returns early */
-            }
-
-            // 5. Register with the keystones special index
-            this.showBusy({
-                isBusy: true,
-                title: 'Registering Identity...',
-                msg: 'Server sync succeeded!\nUpdating local identity indexes and scope settings...',
-                animationEmoji: '💾'
-            });
-            await delay(humanEyeDelay); // for human eyes, not needed for functionality
-            await updateSpecialIndex({
-                type: "keystones",
-                rel8nInfos: [
-                    {
-                        rel8nName: "keystone",
-                        ibGibs: [
-                            toDto({ ibGib: evolvedParentKeystoneIbGib }),
-                            toDto({ ibGib: delegateKeystoneIbGib })
-                        ],
-                    },
-                ],
-                metaspace,
-                space,
-            });
-
-            // Expose for dev tools
-            (window as any).dev_domainI = evolvedParentKeystoneIbGib;
-            (window as any).dev_domainIMasterSecret = masterSecret;
-            (window as any).dev_syncDelegate = delegateKeystoneIbGib;
-            (window as any).dev_syncDelegateSecret = delegateSecret;
-
-            // 6. Request to make the new identity active if the checkbox is checked
-            const makeActive = this.elements!.checkboxMakeActive?.checked;
-            if (makeActive) {
-                window.dispatchEvent(new CustomEvent(EVENT_IBGIB_IDENTITY_REQUEST_CHANGE, {
-                    detail: { activeIdentityAddr: evolvedParentAddr },
-                    bubbles: true,
-                    composed: true
-                }));
-            }
-
-            // 7. Success
-            this.elements!.keystoneAddrEl.textContent = evolvedParentAddr;
-            this.elements!.statusArea.classList.remove('hidden');
-            this.setStatus("Keystone successfully created and synced!", "success");
-            await delay(humanEyeDelay); // for human eyes, not needed for functionality
-            devLog(`✓ Keystone successfully created and synced!`);
-
-        } catch (error) {
-            const emsg = extractErrorMsg(error);
-            console.error(`${lc} ${emsg}`);
-            this.setStatus(`Error: ${emsg}`, "error");
-            devLog(`✗ Error: ${emsg}`);
-        } finally {
-            this.showBusy({
-                isBusy: false,
-                submitBtnSelector: '#btn-generate'
-            });
-        }
-    }
-
-    protected override async renderUI(): Promise<void> {
-        // No complex rendering needed for this simple creator component yet
-    }
-
-    override async handleContextUpdated(): Promise<void> {
-        await this.renderUI();
-    }
-}