@pb33f/cowboy-components 0.7.10 → 0.7.11

package/dist/components/the-doctor/the-doctor.d.ts

@@ -55,6 +55,7 @@ import { ModelController } from '../../controllers/model-controller.js';
 import { DiagnosticController } from '../../controllers/diagnostic-controller.js';
 import { StateController } from '../../controllers/state-controller.js';
 import { WorkspaceController } from "../../controllers/workspace-controller";
+import { WalletController } from "../../controllers/wallet-controller.js";
 export declare const GraphBag = "pb33f-doctor-graph";
 export declare const PanelStateBag = "pb33f-doctor-panel-state";
 export declare const RolodexResponseBag = "pb33f-doctor-rolodex-response";
@@ -180,6 +181,7 @@ export declare class TheDoctor extends LitElement {
     readonly diagnosticController: DiagnosticController;
     readonly stateController: StateController;
     readonly workspaceController: WorkspaceController;
+    readonly walletController: WalletController;
     editorMap: Map<string, SpecEditor>;
     selectedEditorTab: string;
     sidebarClosed: boolean;
@@ -219,6 +221,7 @@ export declare class TheDoctor extends LitElement {
     filterTreeModel(event: CustomEvent<ExplorerEqualizerChangedEvent>): void;
     exportRuleset(): void;
     addToastEvent(event: CustomEvent<AddToastEvent>): void;
+    creditStreamUpdated(event: CustomEvent): void;
     sendToast(toast: Toast): void;
     updateInspectorDivider(): void;
     updateExplorerDivider(): void;

package/dist/components/the-doctor/the-doctor.js

@@ -16,7 +16,7 @@ import '@shoelace-style/shoelace/dist/components/avatar/avatar.js';
 import { customElement, property, query, state } from "lit/decorators.js";
 import { html, LitElement } from "lit";
 import { SpecEditor } from "../editor/editor.js";
-import { ActiveView, AddToast, ArchiveURLRequested, BuiltInRulesetChanged, CreditEmpty, CustomRulesetEnabled, DocumentReferenceClicked, EditorClicked, EditorUpdated, ExplorerEqualizerChanged, ExplorerEqualizerFiltered, ExplorerNodeClicked, ExportRuleset, LoadRenderedNodeIntoInspector, ModelTreeNodeClicked, NodeReferenceClicked, NukeWorkspaceEvent, OpenProblemDrawer, OpenSettings, ProblemClicked, Reboot, RolodexRootFileSelected, RolodexTreeNodeClicked, RuleClicked, RulesetSaved, RuleViolationClicked, StartSessionFailed, } from "../../events/doctor.js";
+import { ActiveView, AddToast, ArchiveURLRequested, BuiltInRulesetChanged, CreditEmpty, CustomRulesetEnabled, DocumentReferenceClicked, EditorClicked, EditorUpdated, ExplorerEqualizerChanged, ExplorerEqualizerFiltered, ExplorerNodeClicked, ExportRuleset, LoadRenderedNodeIntoInspector, ModelTreeNodeClicked, NodeReferenceClicked, NukeWorkspaceEvent, OpenProblemDrawer, OpenSettings, ProblemClicked, Reboot, RolodexRootFileSelected, RolodexTreeNodeClicked, RuleClicked, RulesetSaved, RuleViolationClicked, StartSessionFailed, CreditStreamUpdated, } from "../../events/doctor.js";
 import { ProblemDetailsDrawer } from "../problem-list/details-drawer.js";
 import { CreateBagManager } from "@pb33f/saddlebag";
 import { LintingService } from "../../services/linting-service.js";
@@ -67,7 +67,9 @@ import { ModelController } from '../../controllers/model-controller.js';
 import { DiagnosticController } from '../../controllers/diagnostic-controller.js';
 import { StateController } from '../../controllers/state-controller.js';
 import { WorkspaceController } from "../../controllers/workspace-controller";
+import { WalletController } from "../../controllers/wallet-controller.js";
 import { WorkspaceService } from '../../services/workspace-service.js';
+import { WalletService } from '../../services/wallet-service.js';
 export const GraphBag = "pb33f-doctor-graph";
 export const PanelStateBag = "pb33f-doctor-panel-state";
 export const RolodexResponseBag = "pb33f-doctor-rolodex-response";
@@ -116,6 +118,7 @@ let TheDoctor = class TheDoctor extends LitElement {
         AuthService.doctorEndpoint = this.doctorEndpoint;
         TimelineService.doctorEndpoint = this.doctorEndpoint;
         WorkspaceService.doctorEndpoint = this.doctorEndpoint;
+        WalletService.doctorEndpoint = this.doctorEndpoint;
         this.timeVortex = new TimeVortex();
         // bus it up
         this.bus = CreateBus();
@@ -159,6 +162,7 @@ let TheDoctor = class TheDoctor extends LitElement {
         this.problemController = new ProblemController(this);
         this.docsController = new DocsController(this);
         this.diagnosticController = new DiagnosticController(this);
+        this.walletController = new WalletController(this);
         this.workspaceController = new WorkspaceController(this);
         this.settingsComponent = new DoctorSettings();
         this.editorMap = new Map();
@@ -205,6 +209,8 @@ let TheDoctor = class TheDoctor extends LitElement {
             if (this.authController.authenticated) {
                 this.workspaceController.getWorkspaces();
             }
+            // update workspace view to reflect new credit balance
+            this.workspaceController.workspaceView.requestUpdate();
         };
         // create auth controller
         this.authController = new AuthController(this, sessionCallback, true);
@@ -226,6 +232,8 @@ let TheDoctor = class TheDoctor extends LitElement {
         this.addEventListener(RulesetSaved, this.ruleController.rulesetSaved.bind(this.ruleController));
         // @ts-ignore
         this.addEventListener(AddToast, this.addToastEvent);
+        // @ts-ignore
+        this.addEventListener(CreditStreamUpdated, this.creditStreamUpdated.bind(this));
         this.addEventListener(ExportRuleset, this.exportRuleset);
         // @ts-ignore
         this.addEventListener(RuleClicked, this.ruleController.ruleClicked.bind(this.ruleController));
@@ -363,6 +371,14 @@ let TheDoctor = class TheDoctor extends LitElement {
     addToastEvent(event) {
         this.sendToast(event.detail.toast);
     }
+    creditStreamUpdated(event) {
+        // Update session credits
+        if (this.authController?.session) {
+            this.authController.session.creditsRemaining = event.detail.credits;
+        }
+        // Trigger workspace view update directly
+        this.workspaceController.workspaceView.requestUpdate();
+    }
     sendToast(toast) {
         this.toastManager.addToastManually(toast);
     }

package/dist/components/workspaces/workspace-view.css.js

@@ -36,5 +36,18 @@ export default css `
         display: inline-block;
     }
 
+    sl-button > strong {
+        color: inherit;
+    }
+    
+    strong {
+        font-family: var(--font-stack-bold), sans-serif;
+        color: var(--primary-color)
+    }
+
+    strong.secondary {
+        font-family: var(--font-stack-bold), sans-serif;
+        color: var(--secondary-color)
+    }
 
 `;

package/dist/components/workspaces/workspace-view.d.ts

@@ -1,5 +1,6 @@
 import { TheDoctor } from "../the-doctor/the-doctor.js";
 import { WorkspaceController } from "../../controllers/workspace-controller.js";
+import { WalletController } from "../../controllers/wallet-controller.js";
 import { Workspace } from "../../model/workspace.js";
 import { Formable } from "../../model/formable.js";
 import { WorkspaceForm } from "./workspace-form.js";
@@ -11,11 +12,14 @@ export declare class WorkspacesView extends Formable {
     mutateWorkspaceActive: boolean;
     workspaces: Workspace[];
     wsController: WorkspaceController;
+    walletController: WalletController;
     workspaceForm: WorkspaceForm;
     destroyDialog: WorkspaceDestroyView;
-    constructor(doc: TheDoctor, wsController: WorkspaceController);
+    constructor(doc: TheDoctor, wsController: WorkspaceController, walletController: WalletController);
     private setupDestroyDialogEvents;
     private setupWorkspaceFormEvents;
+    private setupWalletEvents;
+    private handleDailyCreditRequest;
     private handleWorkspaceFormComplete;
     openCreateWorkspaceDialog(): void;
     selectWorkspace(workspace: Workspace): void;

package/dist/components/workspaces/workspace-view.js

@@ -9,24 +9,27 @@ import { customElement, state } from "lit/decorators.js";
 import { Formable } from "../../model/formable.js";
 import { WorkspaceForm } from "./workspace-form.js";
 import { WorkspaceDestroyView } from "./workspace-destroy-dialog.js";
-import { DeleteWorkspace, SwitchWorkspace, FormSubmitComplete, RefreshWorkspaces, CreateWorkspace, UpdateWorkspace } from "../../events/doctor.js";
+import { DeleteWorkspace, SwitchWorkspace, FormSubmitComplete, RefreshWorkspaces, CreateWorkspace, UpdateWorkspace, DailyCreditRequested, DailyCreditApplied, DailyCreditErrorChanged } from "../../events/doctor.js";
 import { AttentionType } from "../attention-box/attention-box.js";
 import listsCss from "../../css/lists.css.js";
 import workspaceViewCss from "./workspace-view.css.js";
 import badgesCss from "../../css/badges.css.js";
 import linksCss from "../../css/links.css.js";
 import tooltipCss from "../../css/tooltip.css.js";
+import hrCss from "../../css/hr.css.js";
 let WorkspacesView = class WorkspacesView extends Formable {
-    constructor(doc, wsController) {
+    constructor(doc, wsController, walletController) {
         super(doc);
         this.doc = doc;
         this.wsController = wsController;
+        this.walletController = walletController;
         this.active = false;
         this.mutateWorkspaceActive = false;
         this.workspaceForm = new WorkspaceForm();
         this.destroyDialog = new WorkspaceDestroyView();
         this.setupDestroyDialogEvents();
         this.setupWorkspaceFormEvents();
+        this.setupWalletEvents();
     }
     setupDestroyDialogEvents() {
         this.destroyDialog.addEventListener('cancel', () => this.handleDestroyCancel());
@@ -51,6 +54,16 @@ let WorkspacesView = class WorkspacesView extends Formable {
             }));
         });
     }
+    setupWalletEvents() {
+        this.walletController.addEventListener(DailyCreditApplied, () => this.requestUpdate());
+        this.walletController.addEventListener(DailyCreditErrorChanged, () => this.requestUpdate());
+    }
+    handleDailyCreditRequest() {
+        this.walletController.dispatchEvent(new CustomEvent(DailyCreditRequested, {
+            bubbles: true,
+            composed: true
+        }));
+    }
     handleWorkspaceFormComplete(_) {
         // Refresh the workspace list after create/update
         this.wsController.dispatchEvent(new CustomEvent(RefreshWorkspaces, {
@@ -178,12 +191,39 @@ let WorkspacesView = class WorkspacesView extends Formable {
                         `;
         })}
                 </ul>
+
+                <hr/>
+                <h3>
+                    <span style="color: var(--terminal-text)">$</span> 
+                    Free Daily Credit <span style="color: var(--terminal-text)">$</span>
+                </h3>
+                
+                <p>
+                    Every day, authenticated users get a free daily allowance that is <strong class="secondary">way higher</strong> 
+                    than anonymous users. All you have to do is <strong class="secondary">push the button.</strong>  
+                </p>
+                
+                ${this.walletController.canRequestCredit ? html `
+                    <sl-button @click="${this.handleDailyCreditRequest}">
+                        <strong>$</strong> Claim <strong>FREE</strong> daily credit! <strong>$</strong>
+                    </sl-button>
+                ` : html `
+                    <sl-button disabled variant="${this.walletController.dailyCreditError ? 'danger' : 'default'}">
+                        Daily free credit claimed!
+                    </sl-button>
+                `}
+                
+                ${this.walletController.creditStatusText ? html `
+                    <span style="margin-left: 10px; font-size: 0.9em;">
+                        ${this.walletController.creditStatusText}
+                    </span>
+                ` : ''}
             </div>
 
         `;
     }
 };
-WorkspacesView.styles = [...Formable.styles, workspaceViewCss, badgesCss, linksCss, listsCss, tooltipCss];
+WorkspacesView.styles = [...Formable.styles, workspaceViewCss, badgesCss, linksCss, listsCss, tooltipCss, hrCss];
 __decorate([
     state()
 ], WorkspacesView.prototype, "active", void 0);

package/dist/controllers/broker-controller.js

@@ -1,5 +1,6 @@
 import { DefaultDocument } from "../components/the-doctor/the-doctor.js";
 import { Command, CreditStreamChannel, DoctorServiceChannel, isBrokerResponse, QueuePrefix, SpecStreamChannel } from "../model/channels.js";
+import { CreditStreamUpdated } from "../events/doctor.js";
 export class BrokerController extends EventTarget {
     constructor(doc) {
         super();
@@ -100,7 +101,14 @@ export class BrokerController extends EventTarget {
     creditStreamHandler() {
         return (msg) => {
             if (msg.payload?.payload != null) {
-                this.doc.creditTicker.credits = parseInt(msg.payload.payload);
+                const newCredits = parseInt(msg.payload.payload);
+                this.doc.creditTicker.credits = newCredits;
+                // Dispatch event to the doctor for credit stream updates
+                this.doc.dispatchEvent(new CustomEvent(CreditStreamUpdated, {
+                    bubbles: true,
+                    composed: true,
+                    detail: { credits: newCredits }
+                }));
             }
         };
     }

package/dist/controllers/wallet-controller.d.ts

@@ -0,0 +1,13 @@
+import { TheDoctor } from "../components/the-doctor/the-doctor.js";
+import { AuthController } from "./auth-controller.js";
+import { TemplateResult } from "lit";
+export declare class WalletController extends EventTarget {
+    readonly doc: TheDoctor;
+    authController: AuthController | null;
+    dailyCreditError: boolean;
+    constructor(doc: TheDoctor);
+    get creditsRemaining(): number;
+    get canRequestCredit(): boolean;
+    get creditStatusText(): TemplateResult;
+    requestDailyCredit(): void;
+}

package/dist/controllers/wallet-controller.js

@@ -0,0 +1,93 @@
+import { WalletService } from "../services/wallet-service.js";
+import { AddToast, DailyCreditRequested, DailyCreditApplied, DailyCreditErrorChanged } from "../events/doctor.js";
+import { ToastType } from "../model/toast.js";
+import { AuthController } from "./auth-controller.js";
+import { html } from "lit";
+export class WalletController extends EventTarget {
+    constructor(doc) {
+        super();
+        this.dailyCreditError = false;
+        this.doc = doc;
+        this.authController = AuthController.getInstance();
+        this.addEventListener(DailyCreditRequested, this.requestDailyCredit.bind(this));
+    }
+    get creditsRemaining() {
+        return this.authController?.session?.creditsRemaining || 0;
+    }
+    get canRequestCredit() {
+        return !this.dailyCreditError && this.creditsRemaining < 10;
+    }
+    get creditStatusText() {
+        if (this.dailyCreditError) {
+            return html `Free credit <strong>already claimed</strong> for today!`;
+        }
+        if (this.creditsRemaining >= 10) {
+            const remaining = this.creditsRemaining - 9;
+            return html `spend <strong>${remaining}</strong> ${remaining > 1 ? 'credits' : 'credit'} to qualify.`;
+        }
+        return html ``;
+    }
+    requestDailyCredit() {
+        if (!this.canRequestCredit) {
+            return;
+        }
+        WalletService.applyDailyCredit().then((wallet) => {
+            if (this.authController?.session) {
+                this.authController.session.creditsRemaining = wallet.balance;
+            }
+            this.doc.dispatchEvent(new CustomEvent(AddToast, {
+                bubbles: true,
+                composed: true,
+                detail: {
+                    toast: {
+                        id: crypto.randomUUID(),
+                        title: "Daily credit applied",
+                        type: ToastType.SUCCESS,
+                        body: `Daily credit applied! You now have ${wallet.balance} credits.`
+                    }
+                }
+            }));
+            this.dispatchEvent(new CustomEvent(DailyCreditApplied, {
+                bubbles: true,
+                composed: true,
+                detail: { wallet }
+            }));
+        }).catch((e) => {
+            if (e.status === 403) {
+                this.dailyCreditError = true;
+                // Dispatch event to trigger UI update
+                this.dispatchEvent(new CustomEvent(DailyCreditErrorChanged, {
+                    bubbles: true,
+                    composed: true,
+                    detail: { error: true }
+                }));
+                this.doc.dispatchEvent(new CustomEvent(AddToast, {
+                    bubbles: true,
+                    composed: true,
+                    detail: {
+                        toast: {
+                            id: crypto.randomUUID(),
+                            title: "Unable to request free credit",
+                            type: ToastType.ERROR,
+                            body: e.detail || "You already claimed your daily credit. Try again tomorrow!"
+                        }
+                    }
+                }));
+            }
+            else {
+                this.doc.dispatchEvent(new CustomEvent(AddToast, {
+                    bubbles: true,
+                    composed: true,
+                    detail: {
+                        toast: {
+                            id: crypto.randomUUID(),
+                            title: "Unable to request free credit",
+                            type: ToastType.ERROR,
+                            body: e.detail || `Failed to apply daily credit`
+                        }
+                    }
+                }));
+            }
+        });
+    }
+}

package/dist/controllers/workspace-controller.js

@@ -8,7 +8,7 @@ export class WorkspaceController extends EventTarget {
         super();
         this.doc = doc;
         this.bus = CreateBus();
-        this.workspaceView = new WorkspacesView(this.doc, this);
+        this.workspaceView = new WorkspacesView(this.doc, this, this.doc.walletController);
         this.addEventListener(RefreshWorkspaces, this.getWorkspaces.bind(this));
         // @ts-ignore
         this.addEventListener(SwitchWorkspace, this.switchWorkspace.bind(this));