@webiny/ai-powerups 6.4.12-beta.5 → 6.5.0-beta.0

package/admin/presentation/CmsContentGeneration/CmsGenerateContentPresenter.js

@@ -0,0 +1,120 @@
+import { computed, makeAutoObservable, runInAction } from "mobx";
+import { ToolPipelineRunner } from "@webiny/app-admin";
+import { CmsGenerateContentPresenter } from "./abstractions.js";
+import { GenerateEntryContentUseCase } from "../../features/generateEntryContent/index.js";
+import { AiPromptFormFactory } from "../AiPromptFormFactory/abstractions.js";
+const SUBMIT_TIMEOUT_MS = 300000;
+class CmsGenerateContentPresenterImpl {
+    constructor(pipelineRunner, generateEntryContent, formFactory){
+        this.pipelineRunner = pipelineRunner;
+        this.generateEntryContent = generateEntryContent;
+        this.formFactory = formFactory;
+        this._loading = false;
+        this._submitting = false;
+        this._timedOut = false;
+        this._form = null;
+        this._timeoutId = null;
+        this._intervalId = null;
+        this._elapsedSeconds = 0;
+        makeAutoObservable(this, {
+            vm: computed
+        }, {
+            autoBind: true
+        });
+    }
+    get vm() {
+        return {
+            form: this._form ? this._form.vm : null,
+            loading: this._loading,
+            submitting: this._submitting,
+            timedOut: this._timedOut,
+            elapsedSeconds: this._elapsedSeconds
+        };
+    }
+    async init() {
+        this._form = this.formFactory.createForm({
+            promptDescription: "Describe the content you want to generate for this entry."
+        });
+    }
+    async submit(modelId) {
+        if (!this._form) return;
+        const data = await this._form.submit();
+        if (!data) return;
+        runInAction(()=>{
+            this._submitting = true;
+            this._timedOut = false;
+        });
+        this.startTimeout();
+        try {
+            const excludedFileIds = this.formFactory.computeExcludedFileIds(this._form);
+            const additionalFileIds = data.additionalFiles?.map((f)=>f.id) ?? null;
+            await this.generateEntryContent.execute({
+                prompt: data.prompt,
+                modelId,
+                projectId: data.project || null,
+                excludedFileIds,
+                readerPersonaId: data.readerPersona || null,
+                writerPersonaId: data.writerPersona || null,
+                additionalFileIds
+            });
+        } catch  {
+            this.clearTimeout();
+            runInAction(()=>{
+                this._submitting = false;
+            });
+        }
+    }
+    async processAiResponse(responseText) {
+        this.clearTimeout();
+        runInAction(()=>{
+            this._submitting = false;
+        });
+        const aiResponseJson = JSON.parse(responseText);
+        const resolved = await this.pipelineRunner.resolve(aiResponseJson);
+        return resolved;
+    }
+    cancelPrompt() {
+        this.clearTimeout();
+        this._submitting = false;
+    }
+    startTimeout() {
+        this.clearTimeout();
+        this._elapsedSeconds = 0;
+        this._intervalId = setInterval(()=>{
+            runInAction(()=>{
+                this._elapsedSeconds++;
+            });
+        }, 1000);
+        this._timeoutId = setTimeout(()=>{
+            runInAction(()=>{
+                this._submitting = false;
+                this._timedOut = true;
+            });
+            this.clearInterval();
+        }, SUBMIT_TIMEOUT_MS);
+    }
+    clearTimeout() {
+        if (null !== this._timeoutId) {
+            clearTimeout(this._timeoutId);
+            this._timeoutId = null;
+        }
+        this.clearInterval();
+    }
+    clearInterval() {
+        if (null !== this._intervalId) {
+            clearInterval(this._intervalId);
+            this._intervalId = null;
+        }
+    }
+}
+const CmsGenerateContentPresenter_CmsGenerateContentPresenter = CmsGenerateContentPresenter.createImplementation({
+    implementation: CmsGenerateContentPresenterImpl,
+    dependencies: [
+        ToolPipelineRunner,
+        GenerateEntryContentUseCase,
+        AiPromptFormFactory
+    ]
+});
+export { CmsGenerateContentPresenter_CmsGenerateContentPresenter as CmsGenerateContentPresenter };
+
+//# sourceMappingURL=CmsGenerateContentPresenter.js.map

package/admin/presentation/CmsContentGeneration/CmsGenerateContentPresenter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/presentation/CmsContentGeneration/CmsGenerateContentPresenter.js","sources":["../../../../src/admin/presentation/CmsContentGeneration/CmsGenerateContentPresenter.ts"],"sourcesContent":["import { makeAutoObservable, computed, runInAction } from \"mobx\";\nimport { ToolPipelineRunner } from \"@webiny/app-admin\";\nimport type { FormModel } from \"@webiny/app-admin\";\nimport type { FileValue } from \"@webiny/app-admin/features/formModel/abstractions.js\";\nimport { CmsGenerateContentPresenter as Abstraction } from \"./abstractions.js\";\nimport { GenerateEntryContentUseCase } from \"~/admin/features/generateEntryContent/index.js\";\nimport { AiPromptFormFactory } from \"~/admin/presentation/AiPromptFormFactory/abstractions.js\";\n\nconst SUBMIT_TIMEOUT_MS = 300_000;\n\nclass CmsGenerateContentPresenterImpl implements Abstraction.Interface {\n    private _loading = false;\n    private _submitting = false;\n    private _timedOut = false;\n    private _form: FormModel.Interface | null = null;\n    private _timeoutId: ReturnType<typeof setTimeout> | null = null;\n    private _intervalId: ReturnType<typeof setInterval> | null = null;\n    private _elapsedSeconds = 0;\n\n    constructor(\n        private pipelineRunner: ToolPipelineRunner.Interface,\n        private generateEntryContent: GenerateEntryContentUseCase.Interface,\n        private formFactory: AiPromptFormFactory.Interface\n    ) {\n        makeAutoObservable(this, { vm: computed }, { autoBind: true });\n    }\n\n    get vm(): Abstraction.ViewModel {\n        return {\n            form: this._form ? this._form.vm : null,\n            loading: this._loading,\n            submitting: this._submitting,\n            timedOut: this._timedOut,\n            elapsedSeconds: this._elapsedSeconds\n        };\n    }\n\n    async init(): Promise<void> {\n        this._form = this.formFactory.createForm({\n            promptDescription: \"Describe the content you want to generate for this entry.\"\n        });\n    }\n\n    async submit(modelId: string): Promise<void> {\n        if (!this._form) {\n            return;\n        }\n\n        const data = await this._form.submit<{\n            prompt: string;\n            project?: string;\n            includedFiles?: string[];\n            readerPersona?: string;\n            writerPersona?: string;\n            additionalFiles?: FileValue[];\n        }>();\n\n        if (!data) {\n            return;\n        }\n\n        runInAction(() => {\n            this._submitting = true;\n            this._timedOut = false;\n        });\n\n        this.startTimeout();\n\n        try {\n            const excludedFileIds = this.formFactory.computeExcludedFileIds(this._form);\n            const additionalFileIds = data.additionalFiles?.map(f => f.id) ?? null;\n\n            await this.generateEntryContent.execute({\n                prompt: data.prompt,\n                modelId,\n                projectId: data.project || null,\n                excludedFileIds,\n                readerPersonaId: data.readerPersona || null,\n                writerPersonaId: data.writerPersona || null,\n                additionalFileIds\n            });\n        } catch {\n            this.clearTimeout();\n            runInAction(() => {\n                this._submitting = false;\n            });\n        }\n    }\n\n    async processAiResponse(responseText: string): Promise<Record<string, unknown>> {\n        this.clearTimeout();\n        runInAction(() => {\n            this._submitting = false;\n        });\n\n        const aiResponseJson = JSON.parse(responseText);\n        const resolved = await this.pipelineRunner.resolve(aiResponseJson);\n        return resolved as Record<string, unknown>;\n    }\n\n    cancelPrompt(): void {\n        this.clearTimeout();\n        this._submitting = false;\n    }\n\n    private startTimeout(): void {\n        this.clearTimeout();\n        this._elapsedSeconds = 0;\n        this._intervalId = setInterval(() => {\n            runInAction(() => {\n                this._elapsedSeconds++;\n            });\n        }, 1000);\n        this._timeoutId = setTimeout(() => {\n            runInAction(() => {\n                this._submitting = false;\n                this._timedOut = true;\n            });\n            this.clearInterval();\n        }, SUBMIT_TIMEOUT_MS);\n    }\n\n    private clearTimeout(): void {\n        if (this._timeoutId !== null) {\n            clearTimeout(this._timeoutId);\n            this._timeoutId = null;\n        }\n        this.clearInterval();\n    }\n\n    private clearInterval(): void {\n        if (this._intervalId !== null) {\n            clearInterval(this._intervalId);\n            this._intervalId = null;\n        }\n    }\n}\n\nexport const CmsGenerateContentPresenter = Abstraction.createImplementation({\n    implementation: CmsGenerateContentPresenterImpl,\n    dependencies: [ToolPipelineRunner, GenerateEntryContentUseCase, AiPromptFormFactory]\n});\n"],"names":["SUBMIT_TIMEOUT_MS","CmsGenerateContentPresenterImpl","pipelineRunner","generateEntryContent","formFactory","makeAutoObservable","computed","modelId","data","runInAction","excludedFileIds","additionalFileIds","f","responseText","aiResponseJson","JSON","resolved","setInterval","setTimeout","clearTimeout","clearInterval","CmsGenerateContentPresenter","Abstraction","ToolPipelineRunner","GenerateEntryContentUseCase","AiPromptFormFactory"],"mappings":";;;;;AAQA,MAAMA,oBAAoB;AAE1B,MAAMC;IASF,YACYC,cAA4C,EAC5CC,oBAA2D,EAC3DC,WAA0C,CACpD;aAHUF,cAAc,GAAdA;aACAC,oBAAoB,GAApBA;aACAC,WAAW,GAAXA;aAXJ,QAAQ,GAAG;aACX,WAAW,GAAG;aACd,SAAS,GAAG;aACZ,KAAK,GAA+B;aACpC,UAAU,GAAyC;aACnD,WAAW,GAA0C;aACrD,eAAe,GAAG;QAOtBC,mBAAmB,IAAI,EAAE;YAAE,IAAIC;QAAS,GAAG;YAAE,UAAU;QAAK;IAChE;IAEA,IAAI,KAA4B;QAC5B,OAAO;YACH,MAAM,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG;YACnC,SAAS,IAAI,CAAC,QAAQ;YACtB,YAAY,IAAI,CAAC,WAAW;YAC5B,UAAU,IAAI,CAAC,SAAS;YACxB,gBAAgB,IAAI,CAAC,eAAe;QACxC;IACJ;IAEA,MAAM,OAAsB;QACxB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC;YACrC,mBAAmB;QACvB;IACJ;IAEA,MAAM,OAAOC,OAAe,EAAiB;QACzC,IAAI,CAAC,IAAI,CAAC,KAAK,EACX;QAGJ,MAAMC,OAAO,MAAM,IAAI,CAAC,KAAK,CAAC,MAAM;QASpC,IAAI,CAACA,MACD;QAGJC,YAAY;YACR,IAAI,CAAC,WAAW,GAAG;YACnB,IAAI,CAAC,SAAS,GAAG;QACrB;QAEA,IAAI,CAAC,YAAY;QAEjB,IAAI;YACA,MAAMC,kBAAkB,IAAI,CAAC,WAAW,CAAC,sBAAsB,CAAC,IAAI,CAAC,KAAK;YAC1E,MAAMC,oBAAoBH,KAAK,eAAe,EAAE,IAAII,CAAAA,IAAKA,EAAE,EAAE,KAAK;YAElE,MAAM,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC;gBACpC,QAAQJ,KAAK,MAAM;gBACnBD;gBACA,WAAWC,KAAK,OAAO,IAAI;gBAC3BE;gBACA,iBAAiBF,KAAK,aAAa,IAAI;gBACvC,iBAAiBA,KAAK,aAAa,IAAI;gBACvCG;YACJ;QACJ,EAAE,OAAM;YACJ,IAAI,CAAC,YAAY;YACjBF,YAAY;gBACR,IAAI,CAAC,WAAW,GAAG;YACvB;QACJ;IACJ;IAEA,MAAM,kBAAkBI,YAAoB,EAAoC;QAC5E,IAAI,CAAC,YAAY;QACjBJ,YAAY;YACR,IAAI,CAAC,WAAW,GAAG;QACvB;QAEA,MAAMK,iBAAiBC,KAAK,KAAK,CAACF;QAClC,MAAMG,WAAW,MAAM,IAAI,CAAC,cAAc,CAAC,OAAO,CAACF;QACnD,OAAOE;IACX;IAEA,eAAqB;QACjB,IAAI,CAAC,YAAY;QACjB,IAAI,CAAC,WAAW,GAAG;IACvB;IAEQ,eAAqB;QACzB,IAAI,CAAC,YAAY;QACjB,IAAI,CAAC,eAAe,GAAG;QACvB,IAAI,CAAC,WAAW,GAAGC,YAAY;YAC3BR,YAAY;gBACR,IAAI,CAAC,eAAe;YACxB;QACJ,GAAG;QACH,IAAI,CAAC,UAAU,GAAGS,WAAW;YACzBT,YAAY;gBACR,IAAI,CAAC,WAAW,GAAG;gBACnB,IAAI,CAAC,SAAS,GAAG;YACrB;YACA,IAAI,CAAC,aAAa;QACtB,GAAGT;IACP;IAEQ,eAAqB;QACzB,IAAI,AAAoB,SAApB,IAAI,CAAC,UAAU,EAAW;YAC1BmB,aAAa,IAAI,CAAC,UAAU;YAC5B,IAAI,CAAC,UAAU,GAAG;QACtB;QACA,IAAI,CAAC,aAAa;IACtB;IAEQ,gBAAsB;QAC1B,IAAI,AAAqB,SAArB,IAAI,CAAC,WAAW,EAAW;YAC3BC,cAAc,IAAI,CAAC,WAAW;YAC9B,IAAI,CAAC,WAAW,GAAG;QACvB;IACJ;AACJ;AAEO,MAAMC,0DAA8BC,4BAAAA,oBAAgC,CAAC;IACxE,gBAAgBrB;IAChB,cAAc;QAACsB;QAAoBC;QAA6BC;KAAoB;AACxF"}

package/admin/presentation/CmsContentGeneration/Extension.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const CmsContentGeneration: () => React.JSX.Element | null;

package/admin/presentation/CmsContentGeneration/Extension.js

@@ -0,0 +1,27 @@
+import react from "react";
+import { AdminConfig, RegisterFeature, useWcp } from "@webiny/app-admin";
+import { InternalContentEntryEditorConfig } from "@webiny/app-headless-cms/admin/config/contentEntries/index.js";
+import { CmsGenerateContentButton } from "./CmsGenerateContentButton.js";
+import { CMS_GENERATE_CONTENT_DIALOG, CmsGenerateContentDialog } from "./CmsGenerateContentDialog.js";
+import { CmsGenerateContentFeature } from "./feature.js";
+import { GenerateEntryContentFeature } from "../../features/generateEntryContent/index.js";
+const { Actions: Actions } = InternalContentEntryEditorConfig;
+const CmsContentGeneration = ()=>{
+    const wcp = useWcp();
+    if (!wcp.canUseAiEntryGeneration()) return null;
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(RegisterFeature, {
+        feature: CmsGenerateContentFeature
+    }), /*#__PURE__*/ react.createElement(RegisterFeature, {
+        feature: GenerateEntryContentFeature
+    }), /*#__PURE__*/ react.createElement(AdminConfig, null, /*#__PURE__*/ react.createElement(AdminConfig.Dialog, {
+        name: CMS_GENERATE_CONTENT_DIALOG,
+        element: /*#__PURE__*/ react.createElement(CmsGenerateContentDialog, null)
+    })), /*#__PURE__*/ react.createElement(InternalContentEntryEditorConfig, null, /*#__PURE__*/ react.createElement(Actions.ButtonAction, {
+        name: "generateEntryContent",
+        before: "save",
+        element: /*#__PURE__*/ react.createElement(CmsGenerateContentButton, null)
+    })));
+};
+export { CmsContentGeneration };
+
+//# sourceMappingURL=Extension.js.map

package/admin/presentation/CmsContentGeneration/Extension.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/presentation/CmsContentGeneration/Extension.js","sources":["../../../../src/admin/presentation/CmsContentGeneration/Extension.tsx"],"sourcesContent":["import React from \"react\";\nimport { AdminConfig, RegisterFeature, useWcp } from \"@webiny/app-admin\";\nimport { InternalContentEntryEditorConfig } from \"@webiny/app-headless-cms/admin/config/contentEntries/index.js\";\nimport { CmsGenerateContentButton } from \"~/admin/presentation/CmsContentGeneration/CmsGenerateContentButton.js\";\nimport {\n    CmsGenerateContentDialog,\n    CMS_GENERATE_CONTENT_DIALOG\n} from \"~/admin/presentation/CmsContentGeneration/CmsGenerateContentDialog.js\";\nimport { CmsGenerateContentFeature } from \"~/admin/presentation/CmsContentGeneration/feature.js\";\nimport { GenerateEntryContentFeature } from \"~/admin/features/generateEntryContent/index.js\";\n\nconst { Actions } = InternalContentEntryEditorConfig;\n\nexport const CmsContentGeneration = () => {\n    const wcp = useWcp();\n\n    if (!wcp.canUseAiEntryGeneration()) {\n        return null;\n    }\n\n    return (\n        <>\n            <RegisterFeature feature={CmsGenerateContentFeature} />\n            <RegisterFeature feature={GenerateEntryContentFeature} />\n            <AdminConfig>\n                <AdminConfig.Dialog\n                    name={CMS_GENERATE_CONTENT_DIALOG}\n                    element={<CmsGenerateContentDialog />}\n                />\n            </AdminConfig>\n            <InternalContentEntryEditorConfig>\n                <Actions.ButtonAction\n                    name={\"generateEntryContent\"}\n                    before={\"save\"}\n                    element={<CmsGenerateContentButton />}\n                />\n            </InternalContentEntryEditorConfig>\n        </>\n    );\n};\n"],"names":["Actions","InternalContentEntryEditorConfig","CmsContentGeneration","wcp","useWcp","RegisterFeature","CmsGenerateContentFeature","GenerateEntryContentFeature","AdminConfig","CMS_GENERATE_CONTENT_DIALOG","CmsGenerateContentDialog","CmsGenerateContentButton"],"mappings":";;;;;;;AAWA,MAAM,EAAEA,SAAAA,OAAO,EAAE,GAAGC;AAEb,MAAMC,uBAAuB;IAChC,MAAMC,MAAMC;IAEZ,IAAI,CAACD,IAAI,uBAAuB,IAC5B,OAAO;IAGX,OAAO,WAAP,GACI,wDACI,oBAACE,iBAAeA;QAAC,SAASC;sBAC1B,oBAACD,iBAAeA;QAAC,SAASE;sBAC1B,oBAACC,aAAWA,MAAAA,WAAAA,GACR,oBAACA,YAAY,MAAM;QACf,MAAMC;QACN,uBAAS,oBAACC,0BAAwBA;uBAG1C,oBAACT,kCAAgCA,MAAAA,WAAAA,GAC7B,oBAACD,QAAQ,YAAY;QACjB,MAAM;QACN,QAAQ;QACR,uBAAS,oBAACW,0BAAwBA;;AAKtD"}

package/admin/presentation/CmsContentGeneration/abstractions.d.ts

@@ -0,0 +1,20 @@
+import type { IFormVM } from "@webiny/app-admin/features/formModel/abstractions.js";
+export interface ICmsGenerateContentVm {
+    form: IFormVM | null;
+    loading: boolean;
+    submitting: boolean;
+    timedOut: boolean;
+    elapsedSeconds: number;
+}
+export interface ICmsGenerateContentPresenter {
+    readonly vm: ICmsGenerateContentVm;
+    init(): Promise<void>;
+    submit(modelId: string): Promise<void>;
+    cancelPrompt(): void;
+    processAiResponse(responseText: string): Promise<Record<string, unknown>>;
+}
+export declare const CmsGenerateContentPresenter: import("@webiny/di").Abstraction<ICmsGenerateContentPresenter>;
+export declare namespace CmsGenerateContentPresenter {
+    type Interface = ICmsGenerateContentPresenter;
+    type ViewModel = ICmsGenerateContentVm;
+}

package/admin/presentation/CmsContentGeneration/abstractions.js

@@ -0,0 +1,5 @@
+import { createAbstraction } from "@webiny/feature/admin";
+const CmsGenerateContentPresenter = createAbstraction("CmsContentGeneration/Presenter");
+export { CmsGenerateContentPresenter };
+
+//# sourceMappingURL=abstractions.js.map

package/admin/presentation/CmsContentGeneration/abstractions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/presentation/CmsContentGeneration/abstractions.js","sources":["../../../../src/admin/presentation/CmsContentGeneration/abstractions.ts"],"sourcesContent":["import { createAbstraction } from \"@webiny/feature/admin\";\nimport type { IFormVM } from \"@webiny/app-admin/features/formModel/abstractions.js\";\n\nexport interface ICmsGenerateContentVm {\n    form: IFormVM | null;\n    loading: boolean;\n    submitting: boolean;\n    timedOut: boolean;\n    elapsedSeconds: number;\n}\n\nexport interface ICmsGenerateContentPresenter {\n    readonly vm: ICmsGenerateContentVm;\n    init(): Promise<void>;\n    submit(modelId: string): Promise<void>;\n    cancelPrompt(): void;\n    processAiResponse(responseText: string): Promise<Record<string, unknown>>;\n}\n\nexport const CmsGenerateContentPresenter = createAbstraction<ICmsGenerateContentPresenter>(\n    \"CmsContentGeneration/Presenter\"\n);\n\nexport namespace CmsGenerateContentPresenter {\n    export type Interface = ICmsGenerateContentPresenter;\n    export type ViewModel = ICmsGenerateContentVm;\n}\n"],"names":["CmsGenerateContentPresenter","createAbstraction"],"mappings":";AAmBO,MAAMA,8BAA8BC,kBACvC"}

package/admin/presentation/CmsContentGeneration/feature.d.ts

@@ -0,0 +1,3 @@
+export declare const CmsGenerateContentFeature: import("@webiny/feature/admin").FeatureDefinition<{
+    presenter: import("./abstractions.js").ICmsGenerateContentPresenter;
+}, []>;

package/admin/presentation/CmsContentGeneration/feature.js

@@ -0,0 +1,17 @@
+import { createFeature } from "@webiny/feature/admin";
+import { CmsGenerateContentPresenter } from "./abstractions.js";
+import { CmsGenerateContentPresenter as external_CmsGenerateContentPresenter_js_CmsGenerateContentPresenter } from "./CmsGenerateContentPresenter.js";
+const CmsGenerateContentFeature = createFeature({
+    name: "CmsContentGeneration/Presenter",
+    register (container) {
+        container.register(external_CmsGenerateContentPresenter_js_CmsGenerateContentPresenter);
+    },
+    resolve (container) {
+        return {
+            presenter: container.resolve(CmsGenerateContentPresenter)
+        };
+    }
+});
+export { CmsGenerateContentFeature };
+
+//# sourceMappingURL=feature.js.map

package/admin/presentation/CmsContentGeneration/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/presentation/CmsContentGeneration/feature.js","sources":["../../../../src/admin/presentation/CmsContentGeneration/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { CmsGenerateContentPresenter as Abstraction } from \"./abstractions.js\";\nimport { CmsGenerateContentPresenter } from \"./CmsGenerateContentPresenter.js\";\n\nexport const CmsGenerateContentFeature = createFeature({\n    name: \"CmsContentGeneration/Presenter\",\n    register(container) {\n        container.register(CmsGenerateContentPresenter);\n    },\n    resolve(container) {\n        return {\n            presenter: container.resolve(Abstraction)\n        };\n    }\n});\n"],"names":["CmsGenerateContentFeature","createFeature","container","CmsGenerateContentPresenter","Abstraction"],"mappings":";;;AAIO,MAAMA,4BAA4BC,cAAc;IACnD,MAAM;IACN,UAASC,SAAS;QACdA,UAAU,QAAQ,CAACC;IACvB;IACA,SAAQD,SAAS;QACb,OAAO;YACH,WAAWA,UAAU,OAAO,CAACE;QACjC;IACJ;AACJ"}

package/admin/presentation/CmsEntryWizard/CmsEntryWizard.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+export declare const CmsEntryWizard: (() => React.JSX.Element) & {
+    displayName: string;
+};

package/admin/presentation/CmsEntryWizard/CmsEntryWizard.js

@@ -0,0 +1,113 @@
+import react, { useEffect, useRef } from "react";
+import { observer } from "mobx-react-lite";
+import { FormView } from "@webiny/app-admin";
+import { BetaBadge, Button, Heading, OverlayLoader, useToast } from "@webiny/admin-ui";
+import { useFeature } from "@webiny/app";
+import { useWebsockets } from "@webiny/app-websockets";
+import { useModel } from "@webiny/app-headless-cms/admin/components/ModelProvider/useModel.js";
+import { useContentEntryFormPresenter } from "@webiny/app-headless-cms/exports/admin/cms/entry/editor.js";
+import { CmsGenerateContentFeature } from "../CmsContentGeneration/feature.js";
+import { decompressGzipBase64 } from "../WbContentGeneration/decompressGzipBase64.js";
+function formatElapsed(totalSeconds) {
+    const minutes = Math.floor(totalSeconds / 60);
+    const seconds = totalSeconds % 60;
+    return `${minutes}:${seconds.toString().padStart(2, "0")}`;
+}
+const WS_ACTION_CONTENT = "aiPowerUps.generateEntryContent.content";
+const WS_ACTION_ERROR = "aiPowerUps.generateEntryContent.error";
+const CmsEntryWizard = observer(()=>{
+    const { presenter } = useFeature(CmsGenerateContentFeature);
+    const formPresenter = useContentEntryFormPresenter();
+    const { model } = useModel();
+    const vm = presenter.vm;
+    const wasSubmitting = useRef(false);
+    const websockets = useWebsockets();
+    const toast = useToast();
+    useEffect(()=>{
+        presenter.init().catch((err)=>{
+            console.error("Failed to initialize AI entry wizard", err);
+        });
+    }, []);
+    useEffect(()=>{
+        const contentSubscription = websockets.onMessage(WS_ACTION_CONTENT, async (message)=>{
+            const responseText = await decompressGzipBase64(message.data.value);
+            try {
+                const entryValues = await presenter.processAiResponse(responseText);
+                formPresenter.newEntry(entryValues);
+            } catch (e) {
+                console.error("Failed to process AI response", e);
+                toast.showWarningToast({
+                    title: "Failed to process AI response",
+                    description: "Open the console for more details."
+                });
+                presenter.cancelPrompt();
+            }
+        });
+        const errorSubscription = websockets.onMessage(WS_ACTION_ERROR, async (message)=>{
+            toast.showWarningToast({
+                title: "Failed to generate content",
+                description: message.data.message
+            });
+            presenter.cancelPrompt();
+        });
+        return ()=>{
+            contentSubscription.off();
+            errorSubscription.off();
+        };
+    }, []);
+    useEffect(()=>{
+        wasSubmitting.current && !vm.submitting && vm.timedOut;
+        wasSubmitting.current = vm.submitting;
+    }, [
+        vm.submitting
+    ]);
+    useEffect(()=>{
+        if (vm.timedOut) toast.showWarningToast({
+            title: "Request timed out",
+            description: "The AI generation took too long. Please try again."
+        });
+    }, [
+        vm.timedOut
+    ]);
+    const handleSubmit = async ()=>{
+        await presenter.submit(model.modelId);
+    };
+    const handleSkip = ()=>{
+        formPresenter.newEntry();
+    };
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "flex justify-center pt-xl"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "bg-neutral-base rounded-lg p-lg flex flex-col gap-md",
+        style: {
+            width: 600
+        }
+    }, /*#__PURE__*/ react.createElement(Heading, {
+        level: 4,
+        className: "flex items-center gap-sm"
+    }, "Generate Entry Content ", /*#__PURE__*/ react.createElement(BetaBadge, null)), /*#__PURE__*/ react.createElement("p", {
+        className: "text-neutral-muted"
+    }, "Use AI to generate content for this entry. Configure the prompt and click Generate, or skip to create an empty entry."), vm.loading ? /*#__PURE__*/ react.createElement(OverlayLoader, {
+        text: "Loading..."
+    }) : null, vm.submitting ? /*#__PURE__*/ react.createElement(OverlayLoader, {
+        className: "bg-neutral-base/90",
+        text: /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement("div", null, "Generating content... ", formatElapsed(vm.elapsedSeconds)), /*#__PURE__*/ react.createElement("div", {
+            className: "text-sm text-neutral-muted pt-xs"
+        }, "Content generation can take a few minutes, depending on the model you're using."))
+    }) : null, vm.form ? /*#__PURE__*/ react.createElement(FormView, {
+        name: "CmsEntryWizard",
+        form: vm.form
+    }) : null, /*#__PURE__*/ react.createElement("div", {
+        className: "flex justify-end gap-sm"
+    }, /*#__PURE__*/ react.createElement(Button, {
+        variant: "secondary",
+        onClick: handleSkip
+    }, "Skip"), /*#__PURE__*/ react.createElement(Button, {
+        variant: "primary",
+        onClick: handleSubmit,
+        disabled: vm.loading || vm.submitting
+    }, "Generate"))));
+});
+export { CmsEntryWizard };
+
+//# sourceMappingURL=CmsEntryWizard.js.map

package/admin/presentation/CmsEntryWizard/CmsEntryWizard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/presentation/CmsEntryWizard/CmsEntryWizard.js","sources":["../../../../src/admin/presentation/CmsEntryWizard/CmsEntryWizard.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { FormView } from \"@webiny/app-admin\";\nimport { BetaBadge } from \"@webiny/admin-ui\";\nimport { Button, Heading, OverlayLoader, useToast } from \"@webiny/admin-ui\";\nimport { useFeature } from \"@webiny/app\";\nimport type { IncomingGenericData } from \"@webiny/app-websockets\";\nimport { useWebsockets } from \"@webiny/app-websockets\";\nimport { useModel } from \"@webiny/app-headless-cms/admin/components/ModelProvider/useModel.js\";\nimport { useContentEntryFormPresenter } from \"@webiny/app-headless-cms/exports/admin/cms/entry/editor.js\";\nimport { CmsGenerateContentFeature } from \"~/admin/presentation/CmsContentGeneration/feature.js\";\nimport { decompressGzipBase64 } from \"~/admin/presentation/WbContentGeneration/decompressGzipBase64.js\";\n\nfunction formatElapsed(totalSeconds: number): string {\n    const minutes = Math.floor(totalSeconds / 60);\n    const seconds = totalSeconds % 60;\n    return `${minutes}:${seconds.toString().padStart(2, \"0\")}`;\n}\n\nconst WS_ACTION_CONTENT = \"aiPowerUps.generateEntryContent.content\";\nconst WS_ACTION_ERROR = \"aiPowerUps.generateEntryContent.error\";\n\ninterface GenerateEntryContentMessage extends IncomingGenericData {\n    action: typeof WS_ACTION_CONTENT;\n    data: {\n        compression: \"gzip\";\n        value: string;\n    };\n}\n\ninterface GenerateEntryContentErrorMessage extends IncomingGenericData {\n    action: typeof WS_ACTION_ERROR;\n    data: {\n        message: string;\n    };\n}\n\nexport const CmsEntryWizard = observer(() => {\n    const { presenter } = useFeature(CmsGenerateContentFeature);\n    const formPresenter = useContentEntryFormPresenter();\n    const { model } = useModel();\n    const vm = presenter.vm;\n    const wasSubmitting = useRef(false);\n    const websockets = useWebsockets();\n    const toast = useToast();\n\n    useEffect(() => {\n        presenter.init().catch(err => {\n            console.error(\"Failed to initialize AI entry wizard\", err);\n        });\n    }, []);\n\n    useEffect(() => {\n        const contentSubscription = websockets.onMessage<GenerateEntryContentMessage>(\n            WS_ACTION_CONTENT,\n            async message => {\n                const responseText = await decompressGzipBase64(message.data.value);\n                try {\n                    const entryValues = await presenter.processAiResponse(responseText);\n                    formPresenter.newEntry(entryValues);\n                } catch (e) {\n                    console.error(\"Failed to process AI response\", e);\n                    toast.showWarningToast({\n                        title: \"Failed to process AI response\",\n                        description: \"Open the console for more details.\"\n                    });\n                    presenter.cancelPrompt();\n                }\n            }\n        );\n\n        const errorSubscription = websockets.onMessage<GenerateEntryContentErrorMessage>(\n            WS_ACTION_ERROR,\n            async message => {\n                toast.showWarningToast({\n                    title: \"Failed to generate content\",\n                    description: message.data.message\n                });\n                presenter.cancelPrompt();\n            }\n        );\n\n        return () => {\n            contentSubscription.off();\n            errorSubscription.off();\n        };\n    }, []);\n\n    useEffect(() => {\n        if (wasSubmitting.current && !vm.submitting && !vm.timedOut) {\n            // Generation completed successfully — form was created via newEntry()\n        }\n        wasSubmitting.current = vm.submitting;\n    }, [vm.submitting]);\n\n    useEffect(() => {\n        if (vm.timedOut) {\n            toast.showWarningToast({\n                title: \"Request timed out\",\n                description: \"The AI generation took too long. Please try again.\"\n            });\n        }\n    }, [vm.timedOut]);\n\n    const handleSubmit = async () => {\n        await presenter.submit(model.modelId);\n    };\n\n    const handleSkip = () => {\n        formPresenter.newEntry();\n    };\n\n    return (\n        <div className=\"flex justify-center pt-xl\">\n            <div\n                className=\"bg-neutral-base rounded-lg p-lg flex flex-col gap-md\"\n                style={{ width: 600 }}\n            >\n                <Heading level={4} className=\"flex items-center gap-sm\">\n                    Generate Entry Content <BetaBadge />\n                </Heading>\n                <p className=\"text-neutral-muted\">\n                    Use AI to generate content for this entry. Configure the prompt and click\n                    Generate, or skip to create an empty entry.\n                </p>\n                {vm.loading ? <OverlayLoader text={\"Loading...\"} /> : null}\n                {vm.submitting ? (\n                    <OverlayLoader\n                        className={\"bg-neutral-base/90\"}\n                        text={\n                            <>\n                                <div>Generating content... {formatElapsed(vm.elapsedSeconds)}</div>\n                                <div className=\"text-sm text-neutral-muted pt-xs\">\n                                    Content generation can take a few minutes, depending on the\n                                    model you&apos;re using.\n                                </div>\n                            </>\n                        }\n                    />\n                ) : null}\n                {vm.form ? <FormView name=\"CmsEntryWizard\" form={vm.form} /> : null}\n                <div className=\"flex justify-end gap-sm\">\n                    <Button variant=\"secondary\" onClick={handleSkip}>\n                        Skip\n                    </Button>\n                    <Button\n                        variant=\"primary\"\n                        onClick={handleSubmit}\n                        disabled={vm.loading || vm.submitting}\n                    >\n                        Generate\n                    </Button>\n                </div>\n            </div>\n        </div>\n    );\n});\n"],"names":["formatElapsed","totalSeconds","minutes","Math","seconds","WS_ACTION_CONTENT","WS_ACTION_ERROR","CmsEntryWizard","observer","presenter","useFeature","CmsGenerateContentFeature","formPresenter","useContentEntryFormPresenter","model","useModel","vm","wasSubmitting","useRef","websockets","useWebsockets","toast","useToast","useEffect","err","console","contentSubscription","message","responseText","decompressGzipBase64","entryValues","e","errorSubscription","handleSubmit","handleSkip","Heading","BetaBadge","OverlayLoader","FormView","Button"],"mappings":"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"}

package/admin/presentation/CmsEntryWizard/CmsEntryWizardGate.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+export declare const CmsEntryWizardGate: (() => React.JSX.Element) & {
+    displayName: string;
+};

package/admin/presentation/CmsEntryWizard/CmsEntryWizardGate.js

@@ -0,0 +1,19 @@
+import react, { useEffect } from "react";
+import { observer } from "mobx-react-lite";
+import { useModel } from "@webiny/app-headless-cms/admin/components/ModelProvider/useModel.js";
+import { useContentEntryFormPresenter } from "@webiny/app-headless-cms/exports/admin/cms/entry/editor.js";
+import { CmsEntryWizard } from "./CmsEntryWizard.js";
+const CmsEntryWizardGate = observer(()=>{
+    const { model } = useModel();
+    const formPresenter = useContentEntryFormPresenter();
+    const showWizard = model.settings?.aiEntryWizard === true;
+    useEffect(()=>{
+        if (!showWizard) formPresenter.newEntry();
+    }, [
+        showWizard
+    ]);
+    return /*#__PURE__*/ react.createElement(CmsEntryWizard, null);
+});
+export { CmsEntryWizardGate };
+
+//# sourceMappingURL=CmsEntryWizardGate.js.map

package/admin/presentation/CmsEntryWizard/CmsEntryWizardGate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/presentation/CmsEntryWizard/CmsEntryWizardGate.js","sources":["../../../../src/admin/presentation/CmsEntryWizard/CmsEntryWizardGate.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { useModel } from \"@webiny/app-headless-cms/admin/components/ModelProvider/useModel.js\";\nimport { useContentEntryFormPresenter } from \"@webiny/app-headless-cms/exports/admin/cms/entry/editor.js\";\nimport { CmsEntryWizard } from \"./CmsEntryWizard.js\";\n\nexport const CmsEntryWizardGate = observer(() => {\n    const { model } = useModel();\n    const formPresenter = useContentEntryFormPresenter();\n\n    const showWizard = model.settings?.aiEntryWizard === true;\n\n    useEffect(() => {\n        if (!showWizard) {\n            formPresenter.newEntry();\n        }\n    }, [showWizard]);\n\n    return <CmsEntryWizard />;\n});\n"],"names":["CmsEntryWizardGate","observer","model","useModel","formPresenter","useContentEntryFormPresenter","showWizard","useEffect","CmsEntryWizard"],"mappings":";;;;;AAMO,MAAMA,qBAAqBC,SAAS;IACvC,MAAM,EAAEC,KAAK,EAAE,GAAGC;IAClB,MAAMC,gBAAgBC;IAEtB,MAAMC,aAAaJ,MAAM,QAAQ,EAAE,kBAAkB;IAErDK,UAAU;QACN,IAAI,CAACD,YACDF,cAAc,QAAQ;IAE9B,GAAG;QAACE;KAAW;IAEf,OAAO,WAAP,GAAO,oBAACE,gBAAcA;AAC1B"}

package/admin/presentation/CmsEntryWizard/Extension.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const CmsEntryWizardExtension: () => React.JSX.Element;

package/admin/presentation/CmsEntryWizard/Extension.js

@@ -0,0 +1,10 @@
+import react from "react";
+import { InternalContentEntryEditorConfig } from "@webiny/app-headless-cms/admin/config/contentEntries/index.js";
+import { CmsEntryWizardGate } from "./CmsEntryWizardGate.js";
+const CmsEntryWizardExtension = ()=>/*#__PURE__*/ react.createElement(InternalContentEntryEditorConfig, null, /*#__PURE__*/ react.createElement(InternalContentEntryEditorConfig.NewEntryWizard, {
+        name: "aiEntryWizard",
+        element: /*#__PURE__*/ react.createElement(CmsEntryWizardGate, null)
+    }));
+export { CmsEntryWizardExtension };
+
+//# sourceMappingURL=Extension.js.map

package/admin/presentation/CmsEntryWizard/Extension.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/presentation/CmsEntryWizard/Extension.js","sources":["../../../../src/admin/presentation/CmsEntryWizard/Extension.tsx"],"sourcesContent":["import React from \"react\";\nimport { InternalContentEntryEditorConfig } from \"@webiny/app-headless-cms/admin/config/contentEntries/index.js\";\nimport { CmsEntryWizardGate } from \"./CmsEntryWizardGate.js\";\n\nexport const CmsEntryWizardExtension = () => {\n    return (\n        <InternalContentEntryEditorConfig>\n            <InternalContentEntryEditorConfig.NewEntryWizard\n                name={\"aiEntryWizard\"}\n                element={<CmsEntryWizardGate />}\n            />\n        </InternalContentEntryEditorConfig>\n    );\n};\n"],"names":["CmsEntryWizardExtension","InternalContentEntryEditorConfig","CmsEntryWizardGate"],"mappings":";;;AAIO,MAAMA,0BAA0B,IAC5B,WAAP,GACI,oBAACC,kCAAgCA,MAAAA,WAAAA,GAC7B,oBAACA,iCAAiC,cAAc;QAC5C,MAAM;QACN,uBAAS,oBAACC,oBAAkBA"}

package/admin/presentation/ConnectionsSettings.d.ts

@@ -0,0 +1,25 @@
+import { AiPowerUpsSettingsGroup } from "./AiPowerUpsSettings/settingsGroup.js";
+import { ListModelsUseCase, ListModelsRepository } from "../../admin/features/listModels/abstractions.js";
+/**
+ * One row per API key. The model select moved to Model roles, so adding a second Anthropic model no
+ * longer means pasting the same key twice.
+ */
+declare class ConnectionsSettingsImpl implements AiPowerUpsSettingsGroup.Interface {
+    private useCase;
+    private repository;
+    name: string;
+    label: string;
+    description: string;
+    constructor(useCase: ListModelsUseCase.Interface, repository: ListModelsRepository.Interface);
+    init(): Promise<void>;
+    buildForm(form: AiPowerUpsSettingsGroup.FormBuilder): void;
+    /**
+     * Derived from the registered SDK factories rather than hardcoded, so a project that registers
+     * its own `AiSdkFactory` shows up here without a change to this file.
+     */
+    private getVendorOptions;
+}
+export declare const ConnectionsSettings: typeof ConnectionsSettingsImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("./AiPowerUpsSettings/settingsGroup.js").IAiPowerUpsSettingsGroup>;
+};
+export {};

package/admin/presentation/ConnectionsSettings.js

@@ -0,0 +1,52 @@
+import { generateAlphaNumericId } from "@webiny/utils";
+import { AiPowerUpsSettingsGroup } from "./AiPowerUpsSettings/settingsGroup.js";
+import { ListModelsRepository, ListModelsUseCase } from "../features/listModels/abstractions.js";
+class ConnectionsSettingsImpl {
+    constructor(useCase, repository){
+        this.useCase = useCase;
+        this.repository = repository;
+        this.name = "connections";
+        this.label = "Connections";
+        this.description = "API keys for the AI vendors this project uses.";
+    }
+    async init() {
+        await this.useCase.execute();
+    }
+    buildForm(form) {
+        form.fields((fields)=>({
+                presets: fields.object().label("Connections").renderer("objectAccordionMultiple", {
+                    container: false,
+                    addItemLabel: "Add connection",
+                    itemTitle: (data, index)=>String(data.name || `Connection #${index + 1}`)
+                }).fields((f)=>({
+                        id: f.text().hidden().defaultValue(()=>generateAlphaNumericId(10)),
+                        name: f.text().label("Name").required("Name is required").description("How this connection appears when picking a model. Name it after the key, not the vendor, so two keys for the same vendor stay distinguishable."),
+                        sdkName: f.text().label("Vendor").required("Vendor is required").description("Which provider this key belongs to.").options(()=>this.getVendorOptions()).renderer("select"),
+                        apiKey: f.text().label("API Key").required("API Key is required").description("Encrypted at rest. Only the last few characters are shown after saving.")
+                    })).list()
+            }));
+        form.layout((layout)=>[
+                layout.row("presets")
+            ]);
+    }
+    getVendorOptions() {
+        const seen = new Map();
+        for (const model of this.repository.getModels())seen.set(model.providerId, model.providerName);
+        return [
+            ...seen.entries()
+        ].map(([value, label])=>({
+                label,
+                value
+            }));
+    }
+}
+const ConnectionsSettings = AiPowerUpsSettingsGroup.createImplementation({
+    implementation: ConnectionsSettingsImpl,
+    dependencies: [
+        ListModelsUseCase,
+        ListModelsRepository
+    ]
+});
+export { ConnectionsSettings };
+
+//# sourceMappingURL=ConnectionsSettings.js.map

package/admin/presentation/ConnectionsSettings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/presentation/ConnectionsSettings.js","sources":["../../../src/admin/presentation/ConnectionsSettings.ts"],"sourcesContent":["import { generateAlphaNumericId } from \"@webiny/utils\";\nimport { AiPowerUpsSettingsGroup } from \"./AiPowerUpsSettings/settingsGroup.js\";\nimport {\n    ListModelsUseCase,\n    ListModelsRepository\n} from \"~/admin/features/listModels/abstractions.js\";\n\n/**\n * One row per API key. The model select moved to Model roles, so adding a second Anthropic model no\n * longer means pasting the same key twice.\n */\nclass ConnectionsSettingsImpl implements AiPowerUpsSettingsGroup.Interface {\n    name = \"connections\";\n    label = \"Connections\";\n    description = \"API keys for the AI vendors this project uses.\";\n\n    constructor(\n        private useCase: ListModelsUseCase.Interface,\n        private repository: ListModelsRepository.Interface\n    ) {}\n\n    async init(): Promise<void> {\n        await this.useCase.execute();\n    }\n\n    buildForm(form: AiPowerUpsSettingsGroup.FormBuilder): void {\n        form.fields(fields => ({\n            presets: fields\n                .object()\n                .label(\"Connections\")\n                .renderer(\"objectAccordionMultiple\", {\n                    container: false,\n                    addItemLabel: \"Add connection\",\n                    itemTitle: (data, index) => String(data.name || `Connection #${index + 1}`)\n                })\n                .fields(f => ({\n                    id: f\n                        .text()\n                        .hidden()\n                        .defaultValue(() => generateAlphaNumericId(10)),\n                    name: f\n                        .text()\n                        .label(\"Name\")\n                        .required(\"Name is required\")\n                        .description(\n                            \"How this connection appears when picking a model. Name it after the key, not the vendor, so two keys for the same vendor stay distinguishable.\"\n                        ),\n                    sdkName: f\n                        .text()\n                        .label(\"Vendor\")\n                        .required(\"Vendor is required\")\n                        .description(\"Which provider this key belongs to.\")\n                        .options(() => this.getVendorOptions())\n                        .renderer(\"select\"),\n                    apiKey: f\n                        .text()\n                        .label(\"API Key\")\n                        .required(\"API Key is required\")\n                        .description(\n                            \"Encrypted at rest. Only the last few characters are shown after saving.\"\n                        )\n                }))\n                .list()\n        }));\n\n        form.layout(layout => [layout.row(\"presets\")]);\n    }\n\n    /**\n     * Derived from the registered SDK factories rather than hardcoded, so a project that registers\n     * its own `AiSdkFactory` shows up here without a change to this file.\n     */\n    private getVendorOptions() {\n        const seen = new Map<string, string>();\n\n        for (const model of this.repository.getModels()) {\n            seen.set(model.providerId, model.providerName);\n        }\n\n        return [...seen.entries()].map(([value, label]) => ({ label, value }));\n    }\n}\n\nexport const ConnectionsSettings = AiPowerUpsSettingsGroup.createImplementation({\n    implementation: ConnectionsSettingsImpl,\n    dependencies: [ListModelsUseCase, ListModelsRepository]\n});\n"],"names":["ConnectionsSettingsImpl","useCase","repository","form","fields","data","index","String","f","generateAlphaNumericId","layout","seen","Map","model","value","label","ConnectionsSettings","AiPowerUpsSettingsGroup","ListModelsUseCase","ListModelsRepository"],"mappings":";;;AAWA,MAAMA;IAKF,YACYC,OAAoC,EACpCC,UAA0C,CACpD;aAFUD,OAAO,GAAPA;aACAC,UAAU,GAAVA;aANZ,IAAI,GAAG;aACP,KAAK,GAAG;aACR,WAAW,GAAG;IAKX;IAEH,MAAM,OAAsB;QACxB,MAAM,IAAI,CAAC,OAAO,CAAC,OAAO;IAC9B;IAEA,UAAUC,IAAyC,EAAQ;QACvDA,KAAK,MAAM,CAACC,CAAAA,SAAW;gBACnB,SAASA,OACJ,MAAM,GACN,KAAK,CAAC,eACN,QAAQ,CAAC,2BAA2B;oBACjC,WAAW;oBACX,cAAc;oBACd,WAAW,CAACC,MAAMC,QAAUC,OAAOF,KAAK,IAAI,IAAI,CAAC,YAAY,EAAEC,QAAQ,GAAG;gBAC9E,GACC,MAAM,CAACE,CAAAA,IAAM;wBACV,IAAIA,EACC,IAAI,GACJ,MAAM,GACN,YAAY,CAAC,IAAMC,uBAAuB;wBAC/C,MAAMD,EACD,IAAI,GACJ,KAAK,CAAC,QACN,QAAQ,CAAC,oBACT,WAAW,CACR;wBAER,SAASA,EACJ,IAAI,GACJ,KAAK,CAAC,UACN,QAAQ,CAAC,sBACT,WAAW,CAAC,uCACZ,OAAO,CAAC,IAAM,IAAI,CAAC,gBAAgB,IACnC,QAAQ,CAAC;wBACd,QAAQA,EACH,IAAI,GACJ,KAAK,CAAC,WACN,QAAQ,CAAC,uBACT,WAAW,CACR;oBAEZ,IACC,IAAI;YACb;QAEAL,KAAK,MAAM,CAACO,CAAAA,SAAU;gBAACA,OAAO,GAAG,CAAC;aAAW;IACjD;IAMQ,mBAAmB;QACvB,MAAMC,OAAO,IAAIC;QAEjB,KAAK,MAAMC,SAAS,IAAI,CAAC,UAAU,CAAC,SAAS,GACzCF,KAAK,GAAG,CAACE,MAAM,UAAU,EAAEA,MAAM,YAAY;QAGjD,OAAO;eAAIF,KAAK,OAAO;SAAG,CAAC,GAAG,CAAC,CAAC,CAACG,OAAOC,MAAM,GAAM;gBAAEA;gBAAOD;YAAM;IACvE;AACJ;AAEO,MAAME,sBAAsBC,wBAAwB,oBAAoB,CAAC;IAC5E,gBAAgBjB;IAChB,cAAc;QAACkB;QAAmBC;KAAqB;AAC3D"}

package/admin/presentation/ModelRolesSettings.d.ts

@@ -0,0 +1,29 @@
+import { AiPowerUpsSettingsGroup } from "./AiPowerUpsSettings/settingsGroup.js";
+import { ListModelsUseCase, ListModelsRepository } from "../../admin/features/listModels/abstractions.js";
+/**
+ * Three selects, and for most projects this is the whole AI configuration: one connection, one
+ * model per role. Everything else in these settings is opt-in.
+ */
+declare class ModelRolesSettingsImpl implements AiPowerUpsSettingsGroup.Interface {
+    private useCase;
+    private repository;
+    name: string;
+    label: string;
+    description: string;
+    constructor(useCase: ListModelsUseCase.Interface, repository: ListModelsRepository.Interface);
+    init(): Promise<void>;
+    buildForm(form: AiPowerUpsSettingsGroup.FormBuilder): void;
+    private getConnections;
+    private getConnectionOptions;
+    private getSelectedConnection;
+    /**
+     * Filtered by the chosen connection's vendor. Listing every model regardless would let someone
+     * pair an OpenAI model with an Anthropic key, which then fails at request time with a provider
+     * auth error that says nothing about the real mistake.
+     */
+    private getModelOptions;
+}
+export declare const ModelRolesSettings: typeof ModelRolesSettingsImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("./AiPowerUpsSettings/settingsGroup.js").IAiPowerUpsSettingsGroup>;
+};
+export {};

package/admin/presentation/ModelRolesSettings.js

@@ -0,0 +1,67 @@
+import { AiPowerUpsSettingsGroup } from "./AiPowerUpsSettings/settingsGroup.js";
+import { ListModelsRepository, ListModelsUseCase } from "../features/listModels/abstractions.js";
+import { AI_MODEL_ROLE_DISPLAY } from "./modelRoles.js";
+class ModelRolesSettingsImpl {
+    constructor(useCase, repository){
+        this.useCase = useCase;
+        this.repository = repository;
+        this.name = "modelRoles";
+        this.label = "Model roles";
+        this.description = "Which model does the cheap work, the main work, and the image work.";
+    }
+    async init() {
+        await this.useCase.execute();
+    }
+    buildForm(form) {
+        form.fields((fields)=>({
+                roles: fields.object().label("Roles").renderer("passthrough").fields((f)=>Object.fromEntries(AI_MODEL_ROLE_DISPLAY.map((role)=>[
+                            role.id,
+                            f.object().label(role.label).renderer("objectAccordionSingle", {
+                                itemTitle: ()=>role.label,
+                                itemDescription: ()=>role.description,
+                                open: true
+                            }).fields((rf)=>({
+                                    connectionId: rf.text().label("Connection").description("Which API key runs this role.").options(({ form })=>this.getConnectionOptions(form)),
+                                    model: rf.text().label("Model").description("Only models from the selected connection's vendor are listed.").disabledWhen(({ form })=>!this.getSelectedConnection(form, role.id)).options(({ form })=>this.getModelOptions(form, role.id))
+                                }))
+                        ])))
+            }));
+        form.layout((layout)=>[
+                layout.row("roles")
+            ]);
+    }
+    getConnections(form) {
+        const data = form.getData();
+        return data.connections?.presets ?? [];
+    }
+    getConnectionOptions(form) {
+        return this.getConnections(form).filter((c)=>c.id && c.name).map((c)=>({
+                label: c.name,
+                value: c.id
+            }));
+    }
+    getSelectedConnection(form, roleId) {
+        const data = form.getData();
+        const connectionId = data.modelRoles?.roles?.[roleId]?.connectionId;
+        if (!connectionId) return;
+        return this.getConnections(form).find((c)=>c.id === connectionId);
+    }
+    getModelOptions(form, roleId) {
+        const connection = this.getSelectedConnection(form, roleId);
+        if (!connection) return [];
+        return this.repository.getModels().filter((model)=>model.providerId === connection.sdkName).map((model)=>({
+                label: model.modelName,
+                value: `${model.providerId}/${model.modelId}`
+            }));
+    }
+}
+const ModelRolesSettings = AiPowerUpsSettingsGroup.createImplementation({
+    implementation: ModelRolesSettingsImpl,
+    dependencies: [
+        ListModelsUseCase,
+        ListModelsRepository
+    ]
+});
+export { ModelRolesSettings };
+
+//# sourceMappingURL=ModelRolesSettings.js.map