@ibgib/space-gib 0.0.1

package/src/client/ui/shell/space-gib-shell-service.mts

@@ -0,0 +1,233 @@
+import { extractErrorMsg } from "@ibgib/helper-gib/dist/helpers/utils-helper.mjs";
+import { ROOT_ADDR } from "@ibgib/ts-gib/dist/V1/constants.mjs";
+import { getComponentSvc } from "@ibgib/web-gib/dist/ui/component/ibgib-component-service.mjs";
+import { IbGibDynamicComponentMeta } from "@ibgib/web-gib/dist/ui/component/component-types.mjs";
+
+import { APP_CONFIG } from "../../constants.mjs";
+import { getIbGibGlobalThis_SpaceGib } from "../../helpers.web.mjs";
+import {
+    ID_APP_ROOT, ID_HEADER_PANEL, ID_LEFT_PANEL, ID_CENTER_PANEL,
+    ID_RIGHT_PANEL, ID_FOOTER_PANEL, ID_LEFT_RESIZER, ID_RIGHT_RESIZER,
+    ID_FOOTER_RESIZER, ID_BTN_LEFT_PANEL_TOGGLE, ID_BTN_RIGHT_PANEL_TOGGLE,
+    ID_BTN_CREATE_KEYSTONE, ID_CENTER_PANEL_CONTENT,
+    EVENT_SHELL_READY
+} from "./space-gib-shell-constants.mjs";
+import { PanelState } from "./space-gib-shell-types.mjs";
+import { KeystoneCreatorComponentMeta } from "../../components/keystone-creator/keystone-creator.mjs";
+
+export class SpaceGibShellService {
+    private lc: string = `[SpaceGibShellService]`;
+
+    public initialized: Promise<void>;
+
+    // Panel States
+    private leftPanelState: PanelState = 'collapsed';
+    private rightPanelState: PanelState = 'collapsed';
+
+    // Resizing State
+    private isResizingLeft = false;
+    private isResizingRight = false;
+    private isResizingFooter = false;
+
+    constructor() {
+        this.initialized = this.initialize();
+    }
+
+    private async initialize(): Promise<void> {
+        this.initElements();
+        this.initEventHandlers();
+        await this.registerComponents();
+    }
+
+    private initElements(): void {
+        const lc = `${this.lc}[${this.initElements.name}]`;
+        try {
+            // Initial CSS vars setup
+            this.updateCssVariables();
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+        }
+    }
+
+    private initEventHandlers(): void {
+        const lc = `${this.lc}[${this.initEventHandlers.name}]`;
+        try {
+            // Left Panel Toggle
+            const btnLeft = document.getElementById(ID_BTN_LEFT_PANEL_TOGGLE);
+            if (btnLeft) {
+                btnLeft.addEventListener('click', () => this.toggleLeftPanel());
+            }
+
+            // Right Panel Toggle
+            const btnRight = document.getElementById(ID_BTN_RIGHT_PANEL_TOGGLE);
+            if (btnRight) {
+                btnRight.addEventListener('click', () => this.toggleRightPanel());
+            }
+
+            // Resizers
+            const leftResizer = document.getElementById(ID_LEFT_RESIZER);
+            if (leftResizer) {
+                leftResizer.addEventListener('mousedown', () => {
+                    if (this.leftPanelState === 'expanded') { this.isResizingLeft = true; }
+                });
+                leftResizer.addEventListener('dblclick', () => this.toggleLeftPanel());
+            }
+
+            const rightResizer = document.getElementById(ID_RIGHT_RESIZER);
+            if (rightResizer) {
+                rightResizer.addEventListener('mousedown', () => {
+                    if (this.rightPanelState === 'expanded') { this.isResizingRight = true; }
+                });
+                rightResizer.addEventListener('dblclick', () => this.toggleRightPanel());
+            }
+
+            const footerResizer = document.getElementById(ID_FOOTER_RESIZER);
+            if (footerResizer) {
+                footerResizer.addEventListener('mousedown', () => this.isResizingFooter = true);
+            }
+
+            // Window mouse events for dragging
+            window.addEventListener('mousemove', (e) => this.handleMouseMove(e));
+            window.addEventListener('mouseup', () => this.handleMouseUp());
+
+            // Create Keystone Button
+            const btnCreate = document.getElementById(ID_BTN_CREATE_KEYSTONE);
+            if (btnCreate) {
+                btnCreate.addEventListener('click', () => this.showKeystoneCreator());
+            }
+
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+        }
+    }
+
+    private async showKeystoneCreator() {
+        const lc = `${this.lc}[${this.showKeystoneCreator.name}]`;
+        try {
+            // 1. Expand side panels (as requested for visual transition)
+            if (this.leftPanelState === 'collapsed') { this.toggleLeftPanel(); }
+            if (this.rightPanelState === 'collapsed') { this.toggleRightPanel(); }
+
+            // 2. Instantiate and inject the component
+            const componentSvc = await getComponentSvc();
+            const component = await componentSvc.getComponentInstance({
+                path: 'space-gib-keystone-creator',
+                ibGibAddr: ROOT_ADDR, // Virtual address for initial render
+                useRegExpPrefilter: true,
+            });
+
+            const centerPanel = document.getElementById(ID_CENTER_PANEL);
+            if (centerPanel && component) {
+                centerPanel.innerHTML = ''; // Clear hero section
+                centerPanel.appendChild(component as any);
+            }
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+        }
+    }
+
+    private toggleLeftPanel() {
+        this.leftPanelState = this.leftPanelState === 'expanded' ? 'collapsed' : 'expanded';
+        const panel = document.getElementById(ID_LEFT_PANEL);
+        if (panel) {
+            if (this.leftPanelState === 'collapsed') {
+                panel.classList.add('collapsed');
+            } else {
+                panel.classList.remove('collapsed');
+            }
+        }
+    }
+
+    private toggleRightPanel() {
+        this.rightPanelState = this.rightPanelState === 'expanded' ? 'collapsed' : 'expanded';
+        const panel = document.getElementById(ID_RIGHT_PANEL);
+        if (panel) {
+            if (this.rightPanelState === 'collapsed') {
+                panel.classList.add('collapsed');
+            } else {
+                panel.classList.remove('collapsed');
+            }
+        }
+    }
+
+    private handleMouseMove(e: MouseEvent) {
+        if (!this.isResizingLeft && !this.isResizingRight && !this.isResizingFooter) return;
+
+        // Prevent text selection while dragging
+        e.preventDefault();
+
+        if (this.isResizingLeft) {
+            // Constrain between 100px and 600px
+            let newWidth = Math.max(100, Math.min(e.clientX, 600));
+            document.documentElement.style.setProperty('--left-panel-width', `${newWidth}px`);
+        }
+
+        if (this.isResizingRight) {
+            // Right panel width = window inner width - mouse X
+            let newWidth = Math.max(100, Math.min(window.innerWidth - e.clientX, 600));
+            document.documentElement.style.setProperty('--right-panel-width', `${newWidth}px`);
+        }
+
+        if (this.isResizingFooter) {
+            // Footer height = window inner height - mouse Y
+            let newHeight = Math.max(24, Math.min(window.innerHeight - e.clientY, 400));
+            document.documentElement.style.setProperty('--footer-panel-height', `${newHeight}px`);
+        }
+    }
+
+    private handleMouseUp() {
+        this.isResizingLeft = false;
+        this.isResizingRight = false;
+        this.isResizingFooter = false;
+    }
+
+    private updateCssVariables() {
+        // We set defaults in CSS, but this is a placeholder if we need to load saved user prefs later
+    }
+
+    private async registerComponents(): Promise<void> {
+        const lc = `${this.lc}[${this.registerComponents.name}]`;
+        try {
+            const componentsMeta: IbGibDynamicComponentMeta[] = [
+                new KeystoneCreatorComponentMeta(),
+            ];
+            const componentSvc = await getComponentSvc();
+            for (let componentMeta of componentsMeta) {
+                componentSvc.registerComponentMeta(componentMeta);
+            }
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+            throw error;
+        }
+    }
+
+    public async onEngineReady(): Promise<void> {
+        const lc = `${this.lc}[${this.onEngineReady.name}]`;
+        try {
+            await this.initialized;
+            console.log(`${lc} SpaceGib Shell Service is ready.`);
+
+            // Ensure the UI removes the loading text
+            const statusSection = document.getElementById('status-section');
+            if (statusSection) {
+                statusSection.style.display = 'none';
+            }
+
+            window.dispatchEvent(new CustomEvent(EVENT_SHELL_READY, { detail: { timestamp: Date.now() } }));
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+        }
+    }
+}
+
+export function getSpaceGibShellSvc(): SpaceGibShellService {
+    const lc = `[getSpaceGibShellSvc]`;
+    const ibGibGlobalThis = getIbGibGlobalThis_SpaceGib(APP_CONFIG);
+    if (!ibGibGlobalThis.spaceGibShellSvc) {
+        if (typeof (console) !== 'undefined') {
+            console.log(`${lc} initializing SpaceGibShellService singleton on globalThis... (I: genuuid)`);
+        }
+        ibGibGlobalThis.spaceGibShellSvc = new SpaceGibShellService();
+    }
+    return ibGibGlobalThis.spaceGibShellSvc;
+}

package/src/client/ui/shell/space-gib-shell-types.mts

@@ -0,0 +1,5 @@
+export type PanelState = 'collapsed' | 'expanded';
+
+export interface ShellReadyDetail {
+    timestamp: number;
+}

package/src/client/witness/app/space-gib/space-gib-app-v1.mts

@@ -0,0 +1,160 @@
+/**
+ * @module SpaceGibApp_V1
+ *
+ * The App witness for space-gib. This is the client-side engine that manages
+ * local ibgib interactions and proxies storage requests to the server API.
+ *
+ * ## design notes
+ *
+ * * For Phase 1 (scaffold), this simply extends AppBase_V1 with no extra
+ *   commands — a solid foundation to evolve.
+ * * Keystone-scoped write operations and manifest management will be layered
+ *   in subsequent phases (see IMPLEMENTATION.md).
+ */
+
+import { extractErrorMsg } from '@ibgib/helper-gib/dist/helpers/utils-helper.mjs';
+import { IbGibRel8ns_V1, IbGib_V1 } from '@ibgib/ts-gib/dist/V1/types.mjs';
+import { AppBase_V1 } from '@ibgib/core-gib/dist/witness/app/app-base-v1.mjs';
+
+import { GLOBAL_LOG_A_LOT } from '../../../constants.mjs';
+import {
+    SpaceGibAppData_V1,
+    SpaceGibAppRel8ns_V1,
+    SpaceGibAppAddlMetadata,
+} from './space-gib-types.mjs';
+import { ROOT } from '@ibgib/ts-gib/dist/V1/constants.mjs';
+import { WITNESS_CONTEXT_REL8N_NAME } from '@ibgib/core-gib/dist/witness/witness-constants.mjs';
+import { isRequestComment } from './space-gib-helper.mjs';
+import { RequestCommentIbGib_V1 } from '../../../types.mjs';
+import { PARAM_INFO_INTERACTIVE } from './space-gib-constants.mjs';
+
+const logalot = GLOBAL_LOG_A_LOT;
+
+/**
+ * SpaceGib App witness — client-side engine.
+ */
+export class SpaceGibApp_V1 extends AppBase_V1<
+    // in
+    any, IbGibRel8ns_V1, IbGib_V1<any, IbGibRel8ns_V1>,
+    // out
+    any, IbGibRel8ns_V1, IbGib_V1<any, IbGibRel8ns_V1>,
+    // this
+    SpaceGibAppData_V1, SpaceGibAppRel8ns_V1
+> {
+    protected lc: string = `[${SpaceGibApp_V1.name}]`;
+
+    constructor(
+        initialData?: SpaceGibAppData_V1,
+        initialRel8ns?: SpaceGibAppRel8ns_V1
+    ) {
+        super(initialData, initialRel8ns);
+        const lc = `${this.lc}[ctor]`;
+        try {
+            if (logalot) { console.log(`${lc} starting...`); }
+            this.initialized = this.initialize();
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+            throw error;
+        } finally {
+            if (logalot) { console.log(`${lc} complete.`); }
+        }
+    }
+
+    /**
+     * @returns addlmetadata string (atow default impl in base class)
+     */
+    protected getAddlMetadata(): string {
+        return super.getAddlMetadata();
+    }
+    protected parseAddlMetadataString<TParseResult>({ ib }: { ib: string; }): TParseResult {
+        if (!ib) { throw new Error(`ib required (E: aec93595c12cc15ee71d92dd8a4f4f23)`); }
+        const lc = `[${this.parseAddlMetadataString.name}]`;
+        try {
+            const [atom, classnameIsh, nameIsh, idIsh] = ib.split('_');
+            const result = { atom, classnameIsh, nameIsh, idIsh, } as SpaceGibAppAddlMetadata;
+            return result as TParseResult;
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+            throw error;
+        }
+    }
+
+    /**
+     * Minimal override — will be expanded in Phase 2 to route to API
+     * endpoints and handle keystone-scoped writes.
+     */
+    protected async handleNewContextChild({ newChild }: { newChild: IbGib_V1 }): Promise<void> {
+        const lc = `${this.lc}[${this.handleNewContextChild.name}]`;
+        try {
+            if (logalot) { console.log(`${lc} starting... (I: 8494f1d374a8490bb4598c8bffa1fe75)`); }
+            // TODO Phase 2: route to REST API
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+            throw error;
+        } finally {
+            if (logalot) { console.log(`${lc} complete.`); }
+        }
+    }
+
+    /**
+     * Overridden to handle Request comments (commands).
+     */
+    protected async doNonArg({
+        ibGib,
+    }: {
+        ibGib: IbGib_V1,
+    }): Promise<IbGib_V1 | undefined> {
+        const lc = `${this.lc}[${this.doNonArg.name}]`;
+        try {
+            if (logalot) { console.log(`${lc} starting...`); }
+
+            if (isRequestComment({ ibGib })) {
+                return await this.doContextRequestComment({
+                    requestCommentIbGib: ibGib as RequestCommentIbGib_V1
+                });
+            } else {
+                return await super.doNonArg({ ibGib });
+            }
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+            throw error;
+        } finally {
+            if (logalot) { console.log(`${lc} complete.`); }
+        }
+    }
+
+    /**
+     * Handles the initial bootstrap request or any subsequent command request.
+     */
+    protected async doContextRequestComment({
+        requestCommentIbGib
+    }: {
+        requestCommentIbGib: RequestCommentIbGib_V1
+    }): Promise<IbGib_V1> {
+        const lc = `${this.lc}[${this.doContextRequestComment.name}]`;
+        try {
+            if (logalot) { console.log(`${lc} starting...`); }
+
+            const { interpretedArgInfos } = requestCommentIbGib.data!;
+
+            // Handle the initial --interactive bootstrap request
+            if (interpretedArgInfos.some(x => x.name === PARAM_INFO_INTERACTIVE.name)) {
+                await this.initializeContext({
+                    contextIbGib: requestCommentIbGib,
+                    rel8nName: WITNESS_CONTEXT_REL8N_NAME,
+                });
+                
+                console.log(`${this.lc} space-gib initialized and ready.`);
+            } else {
+                console.warn(`${lc} other requests not implemented yet.`);
+            }
+
+            return ROOT;
+        } catch (error) {
+            console.error(`${lc} ${extractErrorMsg(error)}`);
+            throw error;
+        } finally {
+            if (logalot) { console.log(`${lc} complete.`); }
+        }
+    }
+}

package/src/client/witness/app/space-gib/space-gib-constants.mts

@@ -0,0 +1,38 @@
+/**
+ * @module space-gib-constants
+ *
+ * Constants for the SpaceGib App witness.
+ */
+
+import { RCLIParamInfo } from "@ibgib/helper-gib/dist/rcli/rcli-types.mjs";
+
+// ---------------------------------------------------------------------------
+// Commands
+// ---------------------------------------------------------------------------
+
+export type SpaceGibCommand = 'help' | 'quit';
+export const SpaceGibCommand = {
+    help: 'help' as SpaceGibCommand,
+    quit: 'quit' as SpaceGibCommand,
+} satisfies { [key: string]: SpaceGibCommand };
+
+export const SPACE_GIB_COMMANDS: SpaceGibCommand[] = Object.values(SpaceGibCommand);
+
+// ---------------------------------------------------------------------------
+// Param infos
+// ---------------------------------------------------------------------------
+
+export const PARAM_INFO_INTERACTIVE: RCLIParamInfo = {
+    name: 'interactive',
+    isFlag: true,
+    synonyms: ['i'],
+    argTypeName: 'boolean',
+    allowMultiple: false,
+};
+
+/**
+ * PARAM_INFOS consumed by bootstrapIbGibApp
+ */
+export const PARAM_INFOS: RCLIParamInfo[] = [
+    PARAM_INFO_INTERACTIVE,
+];

package/src/client/witness/app/space-gib/space-gib-helper.mts

@@ -0,0 +1,72 @@
+import {
+    getTimestamp, getUUID,
+} from '@ibgib/helper-gib/dist/helpers/utils-helper.mjs';
+import { RCLIArgInfo, RCLIParamInfo } from '@ibgib/helper-gib/dist/rcli/rcli-types.mjs';
+import { Factory_V1 as factory } from '@ibgib/ts-gib/dist/V1/factory.mjs';
+import { TransformResult } from '@ibgib/ts-gib/dist/types.mjs';
+import { isComment } from '@ibgib/core-gib/dist/common/comment/comment-helper.mjs';
+import { IbGib_V1 } from '@ibgib/ts-gib/dist/V1/types.mjs';
+
+import { RequestCommentData_V1, RequestCommentIbGib_V1 } from "@ibgib/web-gib/dist/app-bootstrap/types.mjs";
+
+/**
+ * Validates that no duplicate parameter identifiers exist in the config.
+ */
+export function validateParamInfos({ paramInfos }: { paramInfos: RCLIParamInfo[] }): string[] {
+    const errors: string[] = [];
+    const identifiers: string[] = [];
+    paramInfos.forEach(p => {
+        const names = [p.name, ...(p.synonyms ?? [])];
+        names.forEach(name => {
+            if (identifiers.includes(name.toLowerCase())) {
+                errors.push(`Duplicate identifier found: ${name} (E: genuuid)`);
+            }
+            identifiers.push(name.toLowerCase());
+        });
+    });
+    return errors;
+}
+
+/**
+ * Minimal stub for arg validation.
+ */
+export function validateArgInfos({ argInfos }: { argInfos: RCLIArgInfo[] }): string | undefined {
+    return undefined;
+}
+
+/**
+ * Detects if an ibgib is a Request Comment (a command).
+ */
+export function isRequestComment({ ibGib }: { ibGib: IbGib_V1 }): boolean {
+    if (!isComment({ ibGib })) { return false; }
+    const data = ibGib.data as RequestCommentData_V1;
+    return !!(data?.args?.length && data?.interpretedArgInfos?.length);
+}
+
+/**
+ * Creates a Request Comment ibgib from raw arguments.
+ */
+export async function createRequestCommentIbGib({
+    args, interpretedArgInfos,
+}: {
+    args: string[],
+    interpretedArgInfos: RCLIArgInfo[],
+}): Promise<TransformResult<RequestCommentIbGib_V1>> {
+    const text = args.join(' ');
+    const data: RequestCommentData_V1 = {
+        uuid: await getUUID(),
+        text,
+        args,
+        interpretedArgInfos,
+        textTimestamp: getTimestamp(),
+    };
+
+    return await factory.firstGen({
+        parentIbGib: factory.primitive({ ib: 'comment' }),
+        ib: `comment ${text.substring(0, 32).replace(/ /g, '_')}`,
+        data,
+        dna: true,
+        tjp: { uuid: true, timestamp: true },
+        nCounter: true,
+    }) as TransformResult<RequestCommentIbGib_V1>;
+}

package/src/client/witness/app/space-gib/space-gib-types.mts

@@ -0,0 +1,47 @@
+/**
+ * @module space-gib-types
+ *
+ * Types for the SpaceGib App witness.
+ */
+
+import {
+    AppData_V1, AppRel8ns_V1,
+    AppIbGib_V1,
+} from "@ibgib/core-gib/dist/witness/app/app-types.mjs";
+
+export const DEFAULT_UUID_SPACE_GIB_APP = '';
+export const DEFAULT_NAME_SPACE_GIB_APP = 'space_gib';
+export const DEFAULT_DESCRIPTION_SPACE_GIB_APP =
+    `SpaceGib: ibgib durable storage and SaaS provider at ibgib.space.`;
+
+export interface SpaceGibAppAddlMetadata {
+    atom: string;
+    classnameIsh: string;
+    nameIsh: string;
+    idIsh: string;
+}
+
+export interface SpaceGibAppData_V1 extends AppData_V1 {
+    // app-specific settings will be added here
+}
+
+export interface SpaceGibAppRel8ns_V1 extends AppRel8ns_V1 {
+    // app-specific rel8ns will be added here
+}
+
+export interface SpaceGibAppIbGib_V1 extends AppIbGib_V1<SpaceGibAppData_V1, SpaceGibAppRel8ns_V1> {}
+
+export const DEFAULT_SPACE_GIB_APP_DATA_V1: SpaceGibAppData_V1 = {
+    version: '1',
+    uuid: DEFAULT_UUID_SPACE_GIB_APP,
+    name: DEFAULT_NAME_SPACE_GIB_APP,
+    description: DEFAULT_DESCRIPTION_SPACE_GIB_APP,
+    classname: 'SpaceGibApp_V1',
+    icon: 'cube',
+    persistOptsAndResultIbGibs: false,
+    allowPrimitiveArgs: true,
+    catchAllErrors: true,
+    trace: false,
+};
+
+export const DEFAULT_SPACE_GIB_APP_REL8NS_V1: SpaceGibAppRel8ns_V1 | undefined = undefined;