2024-06-27 03:27:40 -04:00
|
|
|
import Component from "@glimmer/component";
|
|
|
|
import { tracked } from "@glimmer/tracking";
|
2024-06-27 18:59:51 -04:00
|
|
|
import { fn } from "@ember/helper";
|
|
|
|
import { on } from "@ember/modifier";
|
2024-06-27 03:27:40 -04:00
|
|
|
import { action } from "@ember/object";
|
|
|
|
import didInsert from "@ember/render-modifiers/modifiers/did-insert";
|
|
|
|
import didUpdate from "@ember/render-modifiers/modifiers/did-update";
|
2024-06-27 18:59:51 -04:00
|
|
|
import { service } from "@ember/service";
|
2024-07-17 05:58:50 -04:00
|
|
|
import AceEditor from "discourse/components/ace-editor";
|
2024-06-27 03:27:40 -04:00
|
|
|
import BackButton from "discourse/components/back-button";
|
|
|
|
import DButton from "discourse/components/d-button";
|
|
|
|
import DTooltip from "discourse/components/d-tooltip";
|
2024-06-27 18:59:51 -04:00
|
|
|
import withEventValue from "discourse/helpers/with-event-value";
|
2024-06-27 03:27:40 -04:00
|
|
|
import { popupAjaxError } from "discourse/lib/ajax-error";
|
|
|
|
import I18n from "discourse-i18n";
|
|
|
|
import ComboBox from "select-kit/components/combo-box";
|
|
|
|
import AiToolParameterEditor from "./ai-tool-parameter-editor";
|
|
|
|
import AiToolTestModal from "./modal/ai-tool-test-modal";
|
|
|
|
|
2024-06-27 18:59:51 -04:00
|
|
|
const ACE_EDITOR_MODE = "javascript";
|
|
|
|
const ACE_EDITOR_THEME = "chrome";
|
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
export default class AiToolEditor extends Component {
|
|
|
|
@service router;
|
|
|
|
@service dialog;
|
|
|
|
@service modal;
|
|
|
|
@service toasts;
|
|
|
|
|
|
|
|
@tracked isSaving = false;
|
|
|
|
@tracked editingModel = null;
|
|
|
|
@tracked showDelete = false;
|
|
|
|
@tracked selectedPreset = null;
|
|
|
|
|
|
|
|
get presets() {
|
|
|
|
return this.args.presets.map((preset) => {
|
|
|
|
return {
|
|
|
|
name: preset.preset_name,
|
|
|
|
id: preset.preset_id,
|
|
|
|
};
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
get showPresets() {
|
|
|
|
return !this.selectedPreset && this.args.model.isNew;
|
|
|
|
}
|
|
|
|
|
2024-06-27 18:59:51 -04:00
|
|
|
@action
|
|
|
|
updateModel() {
|
|
|
|
this.editingModel = this.args.model.workingCopy();
|
|
|
|
this.showDelete = !this.args.model.isNew;
|
|
|
|
}
|
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
@action
|
|
|
|
configurePreset() {
|
|
|
|
this.selectedPreset = this.args.presets.findBy("preset_id", this.presetId);
|
|
|
|
this.editingModel = this.args.model.workingCopy();
|
|
|
|
this.editingModel.setProperties(this.selectedPreset);
|
|
|
|
this.showDelete = false;
|
|
|
|
}
|
|
|
|
|
|
|
|
@action
|
|
|
|
async save() {
|
|
|
|
this.isSaving = true;
|
|
|
|
|
|
|
|
try {
|
2024-06-27 18:59:51 -04:00
|
|
|
const data = this.editingModel.getProperties(
|
|
|
|
"name",
|
|
|
|
"description",
|
|
|
|
"parameters",
|
|
|
|
"script",
|
|
|
|
"summary"
|
2024-06-27 03:27:40 -04:00
|
|
|
);
|
|
|
|
|
2024-06-27 18:59:51 -04:00
|
|
|
await this.args.model.save(data);
|
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
this.toasts.success({
|
|
|
|
data: { message: I18n.t("discourse_ai.tools.saved") },
|
|
|
|
duration: 2000,
|
|
|
|
});
|
|
|
|
if (!this.args.tools.any((tool) => tool.id === this.args.model.id)) {
|
|
|
|
this.args.tools.pushObject(this.args.model);
|
|
|
|
}
|
|
|
|
|
|
|
|
this.router.transitionTo(
|
|
|
|
"adminPlugins.show.discourse-ai-tools.show",
|
|
|
|
this.args.model
|
|
|
|
);
|
|
|
|
} catch (e) {
|
|
|
|
popupAjaxError(e);
|
|
|
|
} finally {
|
|
|
|
this.isSaving = false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@action
|
|
|
|
delete() {
|
|
|
|
return this.dialog.confirm({
|
|
|
|
message: I18n.t("discourse_ai.tools.confirm_delete"),
|
2024-06-27 18:59:51 -04:00
|
|
|
didConfirm: async () => {
|
|
|
|
await this.args.model.destroyRecord();
|
|
|
|
|
|
|
|
this.args.tools.removeObject(this.args.model);
|
|
|
|
this.router.transitionTo("adminPlugins.show.discourse-ai-tools.index");
|
2024-06-27 03:27:40 -04:00
|
|
|
},
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
@action
|
|
|
|
openTestModal() {
|
|
|
|
this.modal.show(AiToolTestModal, {
|
|
|
|
model: {
|
|
|
|
tool: this.editingModel,
|
|
|
|
},
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
<template>
|
|
|
|
<BackButton
|
|
|
|
@route="adminPlugins.show.discourse-ai-tools"
|
2024-07-16 13:23:17 -04:00
|
|
|
@label="discourse_ai.tools.back"
|
2024-06-27 03:27:40 -04:00
|
|
|
/>
|
|
|
|
|
|
|
|
<form
|
|
|
|
{{didInsert this.updateModel @model.id}}
|
2024-06-27 18:59:51 -04:00
|
|
|
{{didUpdate this.updateModel @model.id}}
|
|
|
|
class="form-horizontal ai-tool-editor"
|
2024-06-27 03:27:40 -04:00
|
|
|
>
|
|
|
|
{{#if this.showPresets}}
|
|
|
|
<div class="control-group">
|
|
|
|
<label>{{I18n.t "discourse_ai.tools.presets"}}</label>
|
|
|
|
<ComboBox
|
|
|
|
@value={{this.presetId}}
|
|
|
|
@content={{this.presets}}
|
|
|
|
class="ai-tool-editor__presets"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="control-group ai-llm-editor__action_panel">
|
|
|
|
<DButton
|
|
|
|
@action={{this.configurePreset}}
|
2024-06-27 18:59:51 -04:00
|
|
|
@label="discourse_ai.tools.next.title"
|
|
|
|
class="ai-tool-editor__next"
|
|
|
|
/>
|
2024-06-27 03:27:40 -04:00
|
|
|
</div>
|
|
|
|
{{else}}
|
|
|
|
<div class="control-group">
|
|
|
|
<label>{{I18n.t "discourse_ai.tools.name"}}</label>
|
2024-06-27 18:59:51 -04:00
|
|
|
<input
|
|
|
|
{{on "input" (withEventValue (fn (mut this.editingModel.name)))}}
|
|
|
|
value={{this.editingModel.name}}
|
|
|
|
type="text"
|
2024-06-27 03:27:40 -04:00
|
|
|
class="ai-tool-editor__name"
|
|
|
|
/>
|
|
|
|
<DTooltip
|
|
|
|
@icon="question-circle"
|
|
|
|
@content={{I18n.t "discourse_ai.tools.name_help"}}
|
|
|
|
/>
|
|
|
|
</div>
|
2024-06-27 18:59:51 -04:00
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
<div class="control-group">
|
|
|
|
<label>{{I18n.t "discourse_ai.tools.description"}}</label>
|
2024-06-27 18:59:51 -04:00
|
|
|
<textarea
|
|
|
|
{{on
|
|
|
|
"input"
|
|
|
|
(withEventValue (fn (mut this.editingModel.description)))
|
|
|
|
}}
|
2024-06-27 03:27:40 -04:00
|
|
|
placeholder={{I18n.t "discourse_ai.tools.description_help"}}
|
2024-06-27 18:59:51 -04:00
|
|
|
class="ai-tool-editor__description input-xxlarge"
|
|
|
|
>{{this.editingModel.description}}</textarea>
|
2024-06-27 03:27:40 -04:00
|
|
|
</div>
|
2024-06-27 18:59:51 -04:00
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
<div class="control-group">
|
|
|
|
<label>{{I18n.t "discourse_ai.tools.summary"}}</label>
|
2024-06-27 18:59:51 -04:00
|
|
|
<input
|
|
|
|
{{on "input" (withEventValue (fn (mut this.editingModel.summary)))}}
|
|
|
|
value={{this.editingModel.summary}}
|
|
|
|
type="text"
|
2024-06-27 03:27:40 -04:00
|
|
|
class="ai-tool-editor__summary input-xxlarge"
|
|
|
|
/>
|
|
|
|
<DTooltip
|
|
|
|
@icon="question-circle"
|
|
|
|
@content={{I18n.t "discourse_ai.tools.summary_help"}}
|
|
|
|
/>
|
|
|
|
</div>
|
2024-06-27 18:59:51 -04:00
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
<div class="control-group">
|
|
|
|
<label>{{I18n.t "discourse_ai.tools.parameters"}}</label>
|
|
|
|
<AiToolParameterEditor @parameters={{this.editingModel.parameters}} />
|
|
|
|
</div>
|
2024-06-27 18:59:51 -04:00
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
<div class="control-group">
|
|
|
|
<label>{{I18n.t "discourse_ai.tools.script"}}</label>
|
|
|
|
<AceEditor
|
|
|
|
@content={{this.editingModel.script}}
|
2024-08-27 07:52:55 -04:00
|
|
|
@onChange={{fn (mut this.editingModel.script)}}
|
2024-06-27 18:59:51 -04:00
|
|
|
@mode={{ACE_EDITOR_MODE}}
|
|
|
|
@theme={{ACE_EDITOR_THEME}}
|
2024-06-27 03:27:40 -04:00
|
|
|
@editorId="ai-tool-script-editor"
|
|
|
|
/>
|
|
|
|
</div>
|
2024-06-27 18:59:51 -04:00
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
<div class="control-group ai-tool-editor__action_panel">
|
|
|
|
<DButton
|
|
|
|
@action={{this.openTestModal}}
|
2024-06-27 18:59:51 -04:00
|
|
|
@label="discourse_ai.tools.test"
|
|
|
|
class="ai-tool-editor__test-button"
|
|
|
|
/>
|
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
<DButton
|
|
|
|
@action={{this.save}}
|
2024-06-27 18:59:51 -04:00
|
|
|
@label="discourse_ai.tools.save"
|
2024-06-27 03:27:40 -04:00
|
|
|
@disabled={{this.isSaving}}
|
2024-06-27 18:59:51 -04:00
|
|
|
class="btn-primary ai-tool-editor__save"
|
|
|
|
/>
|
|
|
|
|
2024-06-27 03:27:40 -04:00
|
|
|
{{#if this.showDelete}}
|
|
|
|
<DButton
|
|
|
|
@action={{this.delete}}
|
2024-06-27 18:59:51 -04:00
|
|
|
@label="discourse_ai.tools.delete"
|
2024-06-27 03:27:40 -04:00
|
|
|
class="btn-danger ai-tool-editor__delete"
|
2024-06-27 18:59:51 -04:00
|
|
|
/>
|
2024-06-27 03:27:40 -04:00
|
|
|
{{/if}}
|
|
|
|
</div>
|
|
|
|
{{/if}}
|
|
|
|
</form>
|
|
|
|
</template>
|
|
|
|
}
|