@miso.ai/client-sdk-ui 1.11.0-beta.1 → 1.11.0-beta.10

package/src/workflow/ask.js

@@ -2,7 +2,8 @@ import { defineValues, trimObj, API } from '@miso.ai/commons';
 import AnswerBasedWorkflow from './answer-based.js';
 import { fields } from '../actor/index.js';
 import { ROLE, ORGANIC_QUESTION_SOURCE } from '../constants.js';
-import { OptionListLayout, ListLayout, TextLayout } from '../layout/index.js';
+import { OptionListLayout, ListLayout, SearchBoxLayout } from '../layout/index.js';
+import { mergeInteraction } from './processors.js';
 
 const DEFAULT_API_OPTIONS = Object.freeze({
   ...AnswerBasedWorkflow.DEFAULT_API_OPTIONS,
@@ -15,6 +16,7 @@ const DEFAULT_API_OPTIONS = Object.freeze({
 
 const DEFAULT_LAYOUTS = Object.freeze({
   ...AnswerBasedWorkflow.DEFAULT_LAYOUTS,
+  [ROLE.QUERY]: [SearchBoxLayout.type, { templates: { buttonIcon: 'send' } }],
   [ROLE.RELATED_RESOURCES]: [ListLayout.type, { incremental: true, itemType: 'article' }],
   [ROLE.QUERY_SUGGESTIONS]: OptionListLayout.type,
 });
@@ -36,13 +38,15 @@ const DEFAULT_OPTIONS = Object.freeze({
   trackers: DEFAULT_TRACKERS,
 });
 
+const ROLES_OPTIONS = AnswerBasedWorkflow.ROLES_OPTIONS;
+
 export default class Ask extends AnswerBasedWorkflow {
 
   constructor(context, parentQuestionId) {
     super({
       name: 'ask',
       context,
-      roles: Object.keys(DEFAULT_LAYOUTS),
+      roles: ROLES_OPTIONS,
       defaults: DEFAULT_OPTIONS,
       parentQuestionId,
     });
@@ -64,16 +68,17 @@ export default class Ask extends AnswerBasedWorkflow {
     if (!previous) {
       return;
     }
+    // TODO: write question_source from payload._meta, so we don't need to write it to session.meta
     const values = previous.states[fields.data()].value;
     const value = values.suggested_followup_questions || values.followup_questions || [];
     this._hub.update(fields.suggestions(), { value: value.map(text => ({ text })) });
   }
 
-  _initReset(args) {
+  _initSession(args) {
     // register at context
     args.parentQuestionId && this._context._byPqid.set(args.parentQuestionId, this);
     this._context._events.emit('create', this);
-    super._initReset(args);
+    super._initSession(args);
   }
 
   // lifecycle //
@@ -119,30 +124,33 @@ export default class Ask extends AnswerBasedWorkflow {
   }
 
   // interactions //
-  _preprocessInteraction(payload) {
-    payload = super._preprocessInteraction(payload) || {};
-
-    const { context = {} } = payload;
-    const { ...custom_context } = context.custom_context || {};
-    let { rootQuestionId, parentQuestionId, questionId } = this;
-
-    if (custom_context.property === ROLE.QUERY_SUGGESTIONS) {
-      questionId = parentQuestionId;
-      parentQuestionId = this.previous && this.previous.parentQuestionId;
-      custom_context.property = 'suggested_followup_questions';
-      custom_context.question_source = this.previous && this.previous.session.meta.question_source;
+  _writeAskPropertiesToInteraction(payload, args) {
+    const root_question_id = this.rootQuestionId;
+    let { property } = (payload.context && payload.context.custom_context) || {};
+    let question_id, parent_question_id, question_source;
+
+    if (args.role === ROLE.QUERY_SUGGESTIONS) {
+      property = 'suggested_followup_questions';
+      parent_question_id = this.previous && this.previous.parentQuestionId;
+      question_id = this.parentQuestionId;
+      question_source = this.previous && this.previous.session.meta.question_source;
+    } else {
+      parent_question_id = this.parentQuestionId;
+      question_id = this.questionId;
+      question_source = this._getQuestionSourceFromViewState(args);
     }
-    custom_context.question_id = questionId;
-    custom_context.root_question_id = rootQuestionId;
-    custom_context.parent_question_id = parentQuestionId;
 
-    return {
-      ...payload,
+    return mergeInteraction(payload, {
       context: {
-        ...context,
-        custom_context: trimObj(custom_context),
-      },
-    };
+        custom_context: {
+          property,
+          root_question_id,
+          parent_question_id,
+          question_id,
+          question_source,
+        },
+      }
+    });
   }
 
   // helpers //

package/src/workflow/asks.js

@@ -55,7 +55,7 @@ export default class Asks extends WorkflowContext {
 
     // reset root workflow
     if (root) {
-      this._root.reset();
+      this._root.restart();
     }
   }
 

package/src/workflow/autocompletable.js

@@ -0,0 +1,29 @@
+import { mixin } from '@miso.ai/commons';
+import { fields } from '../actor/index.js';
+import Autocomplete from './autocomplete.js';
+
+export function makeAutocompletable(prototype) {
+  mixin(prototype, AutocompletableMixin.prototype);
+}
+
+export class AutocompletableMixin {
+
+  _initAutocomplete(args) {
+    this._autocomplete = new Autocomplete(this, { defaults: args.defaults.autocomplete });
+  }
+
+  get autocomplete() {
+    return this._autocomplete;
+  }
+
+  updateCompletions(data) {
+    this._hub.update(fields.completions(), data);
+    return this;
+  }
+
+  _destroyAutocomplete() {
+    this._autocomplete && this._autocomplete._destroy();
+    this._autocomplete = undefined;
+  }
+
+}

package/src/workflow/autocomplete.js

@@ -0,0 +1,113 @@
+import { STATUS } from '../constants.js';
+import { fields } from '../actor/index.js';
+import Workflow from './base.js';
+
+const ROLES_OPTIONS = Object.freeze({
+  members: [],
+});
+
+function shimDefaults({ layouts, trackers, ...options } = {}) {
+  return {
+    active: false,
+    ...options,
+    layouts: {},
+    trackers: {},
+  };
+}
+
+function sameInputValue(a, b) {
+  return getInputValue(a) === getInputValue(b);
+}
+
+function getInputValue(args) {
+  return (args && args.value && args.value.trim()) || undefined;
+}
+
+export default class Autocomplete extends Workflow {
+
+  constructor(superworkflow, { defaults, ...args } = {}) {
+    super({
+      name: 'autocomplete',
+      plugin: superworkflow._plugin,
+      client: superworkflow._client,
+      defaults: shimDefaults(defaults),
+      roles: ROLES_OPTIONS,
+      superworkflow,
+      ...args,
+    });
+  }
+
+  _initProperties(args) {
+    super._initProperties(args);
+    this._superworkflow = args.superworkflow;
+    this._active = args.defaults.active;
+  }
+
+  _initSubscriptions(args) {
+    // TODO: how to sync options updates
+    super._initSubscriptions(args);
+    this._unsubscribes = [
+      ...this._unsubscribes,
+      args.superworkflow._hub.on(fields.input(), args => this._query(args)),
+    ];
+  }
+
+  // API //
+  get enabled() {
+    return this._active;
+  }
+
+  enable() {
+    this._active = true;
+  }
+
+  disable() {
+    this._active = false;
+  }
+
+  // query //
+  _query(args) {
+    if (!this._active || sameInputValue(args, this._args)) {
+      return;
+    }
+    this._args = args;
+
+    // start a new session
+    this.restart();
+    const { session } = this;
+    session.meta.input = args;
+
+    // if input value is blank, emit empty response
+    if (!getInputValue(args)) {
+      this._updateCompletions({ session, status: STATUS.INITIAL });
+      return;
+    }
+
+    // payload
+    const payload = this._buildPayload(args);
+
+    // request
+    this._request({ payload });
+  }
+
+  _buildPayload(args) {
+    return { q: getInputValue(args) };
+  }
+
+  // data //
+  _updateDataInHub(data) {
+    if (data.value) {
+      data = {
+        ...data,
+        value: data.value.completions,
+      };
+    }
+    // update completion field in superworkflow hub
+    this._updateCompletions(data);
+  }
+
+  _updateCompletions(data) {
+    this._superworkflow.updateCompletions(data);
+  }
+
+}

package/src/workflow/base.js

@@ -3,42 +3,52 @@ import { Hub, SessionMaker, DataActor, ViewsActor, InteractionsActor, fields } f
 import * as sources from '../source.js';
 import { STATUS, ROLE } from '../constants.js';
 import { ContainerLayout, ErrorLayout } from '../layout/index.js';
-import { injectLogger } from './utils.js';
-import { WorkflowOptions, mergeLayoutsOptions, mergeInteractionsOptions, makeConfigurable } from './options.js';
-import { writeDataStatus, writeMisoIdToMeta, addDataInstructions } from './processors.js';
+import { WorkflowOptions, mergeApiOptions, makeConfigurable } from './options.js';
+import { getRevision, writeDataStatus, writeMisoIdToMeta, buildBaseInteraction, writeAffiliationInfoToInteraction, mergeInteraction } from './processors.js';
+
+// TODO: just bury this into hub
+function injectLogger(hub, callback) {
+  const { update, trigger } = hub;
+  hub.update = (name, state, options) => {
+    if (!options || !options.silent) {
+      callback('update', name, state, options);
+    }
+    return update.call(hub, name, state, options);
+  }
+  hub.trigger = (...args) => {
+    callback('trigger', ...args);
+    return trigger.apply(hub, args);
+  }
+  return hub;
+}
+
+const DEFAULT_API_OPTIONS = Object.freeze({});
 
 const DEFAULT_LAYOUTS = Object.freeze({
   [ROLE.CONTAINER]: ContainerLayout.type,
   [ROLE.ERROR]: ErrorLayout.type,
 });
 
-const ROLES_CONFIG = Object.freeze({
-  [ROLE.ERROR]: {
-    mapping: data => data.error,
-  },
-});
+const DEFAULT_TRACKERS = Object.freeze({});
 
-function mergeDefaults(workflow, { layouts, interactions, ...defaults } = {}) {
-  const DEFAULT_INTERACTIONS = {
-    preprocess: [payload => workflow._preprocessInteraction(payload)],
-  };
-  return {
-    ...defaults,
-    layouts: mergeLayoutsOptions(DEFAULT_LAYOUTS, layouts),
-    interactions: mergeInteractionsOptions(DEFAULT_INTERACTIONS, interactions),
-  };
-}
+const DEFAULT_OPTIONS = Object.freeze({
+  api: DEFAULT_API_OPTIONS,
+  layouts: DEFAULT_LAYOUTS,
+  trackers: DEFAULT_TRACKERS,
+});
 
-function getRevision(data) {
-  return data && data.value && data.value.revision;
-}
+const ROLES_OPTIONS = Object.freeze({
+  mappings: {
+    [ROLE.ERROR]: data => data.error,
+  },
+});
 
 export default class Workflow extends Component {
 
   constructor(args) {
     super(args.name || 'workflow', args.plugin);
 
-    let { context, plugin, client } = args;
+    let { context, plugin, client, options } = args;
     this._context = context;
     this._plugin = plugin = plugin || context._plugin;
     this._client = client = client || context._client;
@@ -46,43 +56,45 @@ export default class Workflow extends Component {
 
     this._name = args.name;
     this._roles = args.roles;
-    this._rolesConfig = { ...ROLES_CONFIG, ...args.rolesConfig };
 
     this._extensions = plugin._getExtensions(client);
-    this._options = new WorkflowOptions(context && context._options, mergeDefaults(this, args.defaults));
+    this._defaults = args.defaults;
+    this._options = options || new WorkflowOptions(context && context._options, args.defaults);
     this._hub = injectLogger(new Hub(), (...args) => this._log(...args));
 
     this._initProperties(args);
     this._initActors(args);
     this._initSubscriptions(args);
-    this._initReset(args);
+    this._initSession(args);
   }
 
   _initProperties() {}
 
-  _initActors() {
+  _initActors({ name, roles }) {
     const hub = this._hub;
     const client = this._client;
-    const roles = this._roles;
-    const rolesConfig = this._rolesConfig;
     const options = this._options;
     const extensions = this._extensions;
     const layouts = this._plugin.layouts;
 
     this._sessions = new SessionMaker(hub);
     this._data = new DataActor(hub, { source: sources.api(client), options });
-    this._views = new ViewsActor(hub, { extensions, layouts, roles, rolesConfig, options, workflow: this._name });
+    this._views = new ViewsActor(hub, { extensions, layouts, roles, options, workflow: name });
     this._interactions = new InteractionsActor(hub, { client, options });
   }
 
-  _initSubscriptions() {
+  _initSubscriptions({ roles }) {
     this._unsubscribes = [
       this._hub.on(fields.response(), data => this.updateData(data)),
+      this._hub.on(fields.tracker(), args => this._onTracker(args)),
     ];
+    if (roles.main) {
+      this._unsubscribes.push(this._hub.on(fields.view(roles.main), state => this._onMainViewUpdate(state)));
+    }
   }
 
-  _initReset() {
-    this.reset();
+  _initSession() {
+    this.restart();
   }
 
   get uuid() {
@@ -90,12 +102,7 @@ export default class Workflow extends Component {
   }
 
   get session() {
-    return this._hub.states.session;
-  }
-
-  get active() {
-    const { session } = this;
-    return !!session && session.active;
+    return this._hub.states[fields.session()];
   }
 
   get states() {
@@ -112,23 +119,52 @@ export default class Workflow extends Component {
   }
 
   // lifecycle //
-  reset() {
-    this._sessions.new();
+  restart() {
+    this._emitInterruptEventIfNecessary();
+    this._sessions.restart();
     return this;
   }
 
-  start() {
-    this._sessions.start();
-    return this;
+  _emitInterruptEventIfNecessary() {
+    const { main } = this._roles;
+    if (!main) {
+      return;
+    }
+    const state = this._hub.states[fields.view(main)] || {};
+    if (state.session && state.status === STATUS.LOADING) {
+      // it's interrupted by a new question
+      this._emitLifecycleEvent('interrupt', state);
+      this._emitLifecycleEvent('finally', state);
+    }
   }
 
-  restart() {
-    this._sessions.restart();
-    return this;
+  _onMainViewUpdate(state) {
+    const { status } = state;
+    const done = status === STATUS.READY;
+    const erroneous = status === STATUS.ERRONEOUS;
+    const eventName = erroneous ? 'error' : status;
+    this._emitLifecycleEvent(eventName, state);
+    if (done) {
+      this._emitLifecycleEvent('done', state);
+    }
+    if (done || erroneous) {
+      this._emitLifecycleEvent('finally', state);
+    }
+  }
+
+  _emitLifecycleEvent(name, event) {
+    this._emit(name, event);
+  }
+
+  // request //
+  _request(options = {}) {
+    const { session } = this;
+    const event = mergeApiOptions(this._options.resolved.api, { ...options, session });
+    this._hub.update(fields.request(), event);
   }
 
-  // states //
-  updateData(data, { instructions } = {}) {
+  // data //
+  updateData(data) {
     if (!data) {
       throw new Error(`Data is required.`);
     }
@@ -152,43 +188,33 @@ export default class Workflow extends Component {
       }
     }
 
-    this._sessions.start(); // in case session not started yet
+    this._updateData(data);
 
-    data = writeDataStatus(data);
+    return this;
+  }
+
+  _updateData(data) {
     data = this._defaultProcessData(data);
     for (const process of this._options.resolved.dataProcessor) {
       data = process(data);
     }
 
-    // write data instructions from function args
-    data = addDataInstructions(data, instructions);
-    data = this._mergeDataIfNecessary(data);
-
-    this._hub.update(fields.data(), data);
-
-    return this;
+    this._updateDataInHub(data);
   }
 
   _defaultProcessData(data) {
-    return writeMisoIdToMeta(data);
+    data = writeDataStatus(data);
+    data = writeMisoIdToMeta(data);
+    return data;
   }
 
-  _mergeDataIfNecessary(data) {
-    if (!data._inst || !data._inst.merge) {
-      return data;
-    }
-    return {
-      ...this._hub.states[fields.data()],
-      ...data,
-    };
+  _updateDataInHub(data) {
+    this._hub.update(fields.data(), data);
   }
 
-  _handleResponseObject() {}
-
   // TODO: notifyViewUpdateAll()
 
   notifyViewUpdate(role, state) {
-    this._assertActive();
     state = {
       status: STATUS.READY,
       session: this.session,
@@ -203,28 +229,54 @@ export default class Workflow extends Component {
     return this._views.trackers;
   }
 
-  _preprocessInteraction({
-    context: {
-      custom_context,
-      ...context
-    } = {},
-    ...payload
-  } = {}) {
-    const {
-      group: api_group,
-      name: api_name,
-    } = this._options.resolved.api;
-    return {
-      ...payload,
+  _onTracker(args) {
+    const payload = this._buildInteraction(args);
+    this._sendInteraction(payload);
+  }
+
+  _buildInteraction(args) {
+    let payload = buildBaseInteraction(args);
+    payload = this._defaultProcessInteraction(payload, args);
+    const { preprocess = [] } = this._options.resolved.interactions;
+    for (const p of preprocess) {
+      payload = p(payload, args);
+    }
+    return payload;
+  }
+
+  _defaultProcessInteraction(payload, args) {
+    payload = this._writeApiInfoToInteraction(payload, args);
+    payload = this._writeMisoIdToInteraction(payload, args);
+    payload = writeAffiliationInfoToInteraction(payload, args);
+    return payload;
+  }
+
+  _writeApiInfoToInteraction(payload) {
+    const { group, name } = this._options.resolved.api;
+    return mergeInteraction(payload, {
       context: {
-        ...context,
         custom_context: {
-          api_group,
-          api_name,
-          ...custom_context,
+          api_group: group,
+          api_name: name,
         },
       },
-    };
+    });
+  }
+
+  _writeMisoIdToInteraction(payload, args) {
+    // TODO: ad-hoc, try to pass info from tracker
+    const state = this._hub.states[fields.view(args.role)] || {};
+    const miso_id = (state.meta && state.meta.miso_id) || undefined;
+    return miso_id ? mergeInteraction(payload, { miso_id }) : payload;
+  }
+
+  _sendInteraction(payload) {
+    const { handle } = this._options.resolved.interactions;
+    if (typeof handle === 'function') {
+      handle(payload);
+    } else {
+      this._hub.trigger(fields.interaction(), payload);
+    }
   }
 
   // destroy //
@@ -255,12 +307,14 @@ export default class Workflow extends Component {
     }
   }
 
-  _assertActive() {
-    if (!this.active) {
-      throw new Error(`Unit is not active yet. Call unit.start() to activate it.`)
-    }
-  }
-
 }
 
 makeConfigurable(Workflow.prototype);
+
+Object.assign(Workflow, {
+  DEFAULT_API_OPTIONS,
+  DEFAULT_LAYOUTS,
+  DEFAULT_TRACKERS,
+  DEFAULT_OPTIONS,
+  ROLES_OPTIONS,
+});