Epic ai rebased

.github/workflows/gradle.yml

@@ -10,7 +10,7 @@ jobs:
  runs-on: ubuntu-latest
 
  outputs:
- publish: ${{ steps.publish_vars.outputs.release != 'true' && (github.ref == 'refs/heads/master' || startsWith(github.ref, 'refs/heads/4.')) }}
+ publish: ${{ steps.publish_vars.outputs.release != 'true' && (github.ref == 'refs/heads/master' || startsWith(github.ref, 'refs/heads/4.') || startsWith(github.ref, 'refs/heads/epic-ai')) }}
  repo: ${{ steps.publish_vars.outputs.repo }}
 
  steps:

src/main/resources/assets/admin/common/js/ai/AiHelper.ts

@@ -0,0 +1,120 @@
+import {PropertyPath} from '../data/PropertyPath';
+import {Element} from '../dom/Element';
+import {Store} from '../store/Store';
+import {i18n} from '../util/Messages';
+import {AiHelperState} from './AiHelperState';
+import {AiActionButton} from './ui/AiActionButton';
+
+export interface AiHelperConfig {
+ dataPathElement: Element;
+ getPathFunc: () => PropertyPath;
+ icon?: {
+ container: Element;
+ };
+ label?: string;
+ setValueFunc?: (value: string) => void;
+}
+
+const AI_HELPERS_KEY = 'AiHelpers';
+Store.instance().set(AI_HELPERS_KEY, []);
+
+export class AiHelper {
+
+ public static DATA_ATTR = 'data-path';
+
+ private readonly config: AiHelperConfig;
+
+ private readonly aiIcon?: AiActionButton;
+
+ private state: AiHelperState = AiHelperState.DEFAULT;
+
+ constructor(config: AiHelperConfig) {
+ this.config = config;
+
+ const updatePathCall = setInterval(() => {
+ this.updateInputElDataPath();
+ }, 1000);
+
+ this.config.dataPathElement.onRemoved(() => {
+ clearInterval(updatePathCall);
+ const helper: AiHelper[] = Store.instance().get(AI_HELPERS_KEY) ?? [];
+ Store.instance().set(AI_HELPERS_KEY, helper.filter(h => h !== this));
+ });
+
+ Store.instance().get(AI_HELPERS_KEY).push(this);
+
+ if (this.config.icon) {
+ this.aiIcon = new AiActionButton();
+ this.config.icon.container.appendChild(this.aiIcon);
+ }
+ }
+
+ private updateInputElDataPath(): void {
+ const dataPath = AiHelper.convertToPath(this.config.getPathFunc());
+ this.config.dataPathElement.getEl().setAttribute(AiHelper.DATA_ATTR, dataPath);
+ this.aiIcon?.setDataPath(dataPath);
+ }
+
+ setState(state: AiHelperState): this {
+ if (state === this.state) {
+ return this;
+ }
+
+ this.state = state;
+ this.aiIcon?.setState(state);
+
+ if (state === AiHelperState.COMPLETED || state === AiHelperState.FAILED) {
+ setTimeout(() => {
+ if (this.state === AiHelperState.COMPLETED || this.state === AiHelperState.FAILED) {
+ this.setState(AiHelperState.DEFAULT);
+ }
+ }, 1000);
+
+ this.config.dataPathElement.getEl().setDisabled(false);
+ this.config.dataPathElement.removeClass('ai-helper-mask');
+ this.resetTitle();
+ } else if (state === AiHelperState.PROCESSING) {
+ this.config.dataPathElement.getEl().setDisabled(true);
+ this.config.dataPathElement.addClass('ai-helper-mask');
+ this.updateTitle();
+ }
+
+ return this;
+ }
+
+ setValue(value: string): this {
+ this.config.setValueFunc?.(value);
+ return this;
+ }
+
+ getDataPath(): string {
+ return this.config.dataPathElement.getEl().getAttribute(AiHelper.DATA_ATTR);
+ }
+
+ public static convertToPath(path: PropertyPath): string {
+ return path?.toString().replace(/\./g, '/') || '';
+ }
+
+ public static getAiHelperByPath(dataPath: string): AiHelper | undefined {
+ return Store.instance().get(AI_HELPERS_KEY).find(helper => helper.getDataPath() === dataPath);
+ }
+
+ private updateTitle(): void {
+ const parent = this.config.dataPathElement.getEl().getParent();
+
+ if (parent.hasAttribute('title') && !parent.hasAttribute('data-title')) {
+ parent.setAttribute('data-title', parent.getTitle());
+ }
+
+ parent.setTitle(i18n('ai.field.processing', this.config.label));
+ }
+
+ private resetTitle(): void {
+ const parent = this.config.dataPathElement.getEl().getParent();
+ parent.removeAttribute('title');
+
+ if (parent.hasAttribute('data-title')) {
+ parent.setTitle(parent.getAttribute('data-title'));
+ }
+ }
+}

src/main/resources/assets/admin/common/js/ai/AiHelperState.ts

@@ -0,0 +1,6 @@
+export enum AiHelperState {
+ DEFAULT = 'default',
+ PROCESSING = 'processing',
+ COMPLETED = 'completed',
+ FAILED = 'failed',
+}

src/main/resources/assets/admin/common/js/ai/event/EnonicAiContentOperatorOpenDialogEvent.ts

@@ -0,0 +1,27 @@
+import {ClassHelper} from '../../ClassHelper';
+import {Event} from '../../event/Event';
+
+export class EnonicAiContentOperatorOpenDialogEvent
+ extends Event {
+
+ private readonly sourceDataPath?: string;
+
+ constructor(dataPath?: string) {
+ super();
+
+ this.sourceDataPath = dataPath;
+ }
+
+ getSourceDataPath(): string | undefined {
+ return this.sourceDataPath;
+ }
+
+ static on(handler: (event: EnonicAiContentOperatorOpenDialogEvent) => void) {
+ Event.bind(ClassHelper.getFullName(this), handler);
+ }
+
+ static un(handler?: (event: EnonicAiContentOperatorOpenDialogEvent) => void) {
+ Event.unbind(ClassHelper.getFullName(this), handler);
+ }
+
+}

src/main/resources/assets/admin/common/js/ai/ui/AiActionButton.ts

@@ -0,0 +1,63 @@
+import * as Q from 'q';
+import {DivEl} from '../../dom/DivEl';
+import {Button} from '../../ui/button/Button';
+import {i18n} from '../../util/Messages';
+import {AiHelperState} from '../AiHelperState';
+import {EnonicAiContentOperatorOpenDialogEvent} from '../event/EnonicAiContentOperatorOpenDialogEvent';
+
+export class AiActionButton
+ extends DivEl {
+
+ private static readonly BASE_CLASS = 'ai-button-container';
+
+ private dataPath?: string;
+
+ private button: Button;
+
+ private loader: DivEl;
+
+ constructor() {
+ super();
+
+ this.initElements();
+ this.initListeners();
+ }
+
+ protected initElements(): void {
+ this.button = new Button().addClass(`${AiActionButton.BASE_CLASS}-icon ai-icon`) as Button;
+ this.loader = new DivEl(`${AiActionButton.BASE_CLASS}-loader`);
+ this.setTitle(i18n('ai.action.contentOperator.use'));
+ this.setState(AiHelperState.DEFAULT);
+ }
+
+ setState(state: AiHelperState): this {
+ this.setClass(`${AiActionButton.BASE_CLASS} ${state}`);
+
+ return this;
+ }
+
+ setDataPath(dataPath: string): AiActionButton {
+ this.dataPath = dataPath;
+ return this;
+ }
+
+ getDataPath(): string {
+ return this.dataPath;
+ }
+
+ protected initListeners(): void {
+ this.button.onClicked(() => {
+ if (this.dataPath) {
+ new EnonicAiContentOperatorOpenDialogEvent(this.dataPath).fire();
+ }
+ });
+ }
+
+ doRender(): Q.Promise<boolean> {
+ return super.doRender().then((rendered: boolean) => {
+ this.appendChildren(this.loader, this.button);
+
+ return rendered;
+ });
+ }
+}

src/main/resources/assets/admin/common/js/form/FormContext.ts

@@ -14,11 +14,14 @@ export class FormContext {
 
  private validationErrors: ValidationError[];
 
+ private readonly aiEditable: boolean;
+
  constructor(builder: FormContextBuilder) {
  this.showEmptyFormItemSetOccurrences = builder.showEmptyFormItemSetOccurrences;
  this.formState = builder.formState;
  this.language = builder.language;
  this.validationErrors = builder.validationErrors || [];
+ this.aiEditable = builder.aiEditable ?? false;
  }
 
  static create(): FormContextBuilder {
@@ -71,6 +74,11 @@ export class FormContext {
  setLanguage(lang: string) {
  this.language = lang;
  }
+
+ isAiEditable(): boolean {
+ return this.aiEditable;
+ }
+
 }
 
 export class FormContextBuilder {
@@ -83,26 +91,33 @@ export class FormContextBuilder {
 
  validationErrors: ValidationError[];
 
- public setShowEmptyFormItemSetOccurrences(value: boolean): FormContextBuilder {
+ aiEditable: boolean;
+
+ public setShowEmptyFormItemSetOccurrences(value: boolean): this {
  this.showEmptyFormItemSetOccurrences = value;
  return this;
  }
 
- public setFormState(value: FormState): FormContextBuilder {
+ public setFormState(value: FormState): this {
  this.formState = value;
  return this;
  }
 
- public setLanguage(lang: string): FormContextBuilder {
+ public setLanguage(lang: string): this {
  this.language = lang;
  return this;
  }
 
- public setValidationErrors(value: ValidationError[]): FormContextBuilder {
+ public setValidationErrors(value: ValidationError[]): this {
  this.validationErrors = value;
  return this;
  }
 
+ public setAiEditable(value: boolean): this {
+ this.aiEditable = value;
+ return this;
+ }
+
  public build(): FormContext {
  return new FormContext(this);
  }