@miso.ai/client-sdk-ui 1.11.0-beta.9 → 1.11.1-beta.0

package/src/workflow/hybrid-search-views.js

@@ -0,0 +1,124 @@
+import { ROLE } from '../constants.js';
+
+function getSubworkflowByRole(role) {
+  // TODO: ROLE.ERROR
+  switch (role) {
+    case ROLE.PRODUCTS:
+    case ROLE.TOTAL:
+    case ROLE.FACETS:
+    case ROLE.KEYWORDS:
+    case ROLE.MORE:
+      return 'results';
+    default:
+      return 'answer';
+  }
+}
+
+export default class HybridSearchViewsActor {
+
+  constructor(workflow) {
+    this._workflow = workflow;
+    this._containers = new Set();
+  }
+
+  get(role) {
+    return this._getSubviews(role).get(role);
+  }
+
+  addContainer(element) {
+    if (this._containers.has(element)) {
+      return;
+    }
+    this._containers.add(element);
+
+    const { components } = element;
+    for (const component of components) {
+      this.addComponent(component);
+    }
+  }
+
+  removeContainer(element) {
+    for (const subworkflow of this._workflow._subworkflows) {
+      subworkflow._views.removeContainer(element);
+    }
+    this._containers.delete(element);
+  }
+
+  addComponent(element) {
+    this._getViewByElement(element).element = element;
+    this._addContainerToSubviews(element._container, element);
+  }
+
+  removeComponent(element) {
+    this._getViewByElement(element).element = undefined;
+    this._removeContainerFromSubviewsIfNecessary(element._container);
+  }
+
+  updateComponentRole(element, oldRole, newRole) {
+    // TODO
+  }
+
+  refreshElement(element) {
+    const view = element.isContainer ? this._containers.get(element) : this._getViewByElement(element);
+    view && view.refresh({ force: true });
+  }
+
+  // helpers //
+  _getSubworkflow(role) {
+    return this._workflow._getSubworkflow(getSubworkflowByRole(role));
+  }
+
+  _getAllSubviews() {
+    return this._workflow._subworkflows.flatMap(subworkflow => subworkflow._views);
+  }
+
+  _getSubviews(role) {
+    return this._getSubworkflow(role)._views;
+  }
+
+  _getViewByElement(element) {
+    let { role } = element;
+    if (!role) {
+      throw new Error('Component must have a role');
+    }
+    return this.get(role);
+  }
+
+  _addContainerToSubviews(container, child) {
+    if (!container) {
+      return;
+    }
+    const { role } = child;
+    const subviews = this._getSubviews(role);
+    if (subviews._containers.has(container)) {
+      return;
+    }
+    // check if the container is in other subviews
+    for (const otherSubviews of this._getAllSubviews()) {
+      if (otherSubviews === subviews) {
+        continue;
+      }
+      if (otherSubviews._containers.has(container)) {
+        // find the conflicting element
+        for (const component of container.components) {
+          if (otherSubviews.containsElement(component)) {
+            throw new Error(`<${container.tagName}> cannot contain both <${component.tagName}> and <${child.tagName}>, for they don't share the same data lifecycle.`);
+          }
+        }
+        throw new Error(`Failed to add container <${container.tagName}> with child component <${child.tagName}>.`);
+      }
+    }
+    // add the container to the subviews
+    subviews.addContainer(container);
+  }
+
+  _removeContainerFromSubviewsIfNecessary(container) {
+    if (!container || container.components.length > 0) {
+      return;
+    }
+    for (const subviews of this._getAllSubviews()) {
+      subviews.removeContainer(container);
+    }
+  }
+
+}

package/src/workflow/hybrid-search.js

@@ -1,70 +1,70 @@
 import { API } from '@miso.ai/commons';
 import { InteractionsActor } from '../actor/index.js';
 import Workflow from './base.js';
+import SearchBasedWorkflow from './search-based.js';
 import AnswerBasedWorkflow from './answer-based.js';
 import { ROLE } from '../constants.js';
-import { SearchBoxLayout, ListLayout, TextLayout, FacetsLayout } from '../layout/index.js';
+import { SearchBoxLayout, TextLayout } from '../layout/index.js';
 import HybridSearchAnswer from './hybrid-search-answer.js';
 import HybridSearchResults from './hybrid-search-results.js';
+import HybridSearchViewsActor from './hybrid-search-views.js';
 
 const DEFAULT_API_OPTIONS = Object.freeze({
-  ...AnswerBasedWorkflow.DEFAULT_API_OPTIONS,
+  group: API.GROUP.ASK,
   name: API.NAME.SEARCH,
   payload: {
     ...AnswerBasedWorkflow.DEFAULT_API_OPTIONS.payload,
+    ...SearchBasedWorkflow.DEFAULT_API_OPTIONS.payload,
     source_fl: ['cover_image', 'url', 'created_at', 'updated_at', 'published_at', 'title'],
-    fl: ['cover_image', 'url', 'created_at', 'updated_at', 'published_at', 'title'],
   },
 });
 
 const DEFAULT_LAYOUTS = Object.freeze({
   ...AnswerBasedWorkflow.DEFAULT_LAYOUTS,
+  ...SearchBasedWorkflow.DEFAULT_LAYOUTS,
   [ROLE.QUERY]: [SearchBoxLayout.type, { placeholder: '' }],
   [ROLE.QUESTION]: [TextLayout.type, { raw: true }],
-  [ROLE.PRODUCTS]: [ListLayout.type, { itemType: 'article' }],
-  [ROLE.KEYWORDS]: [TextLayout.type, { raw: true }],
-  [ROLE.HITS]: [TextLayout.type, { raw: true, format: 'number' }],
-  [ROLE.FACETS]: [FacetsLayout.type],
 });
 
 const DEFAULT_TRACKERS = Object.freeze({
   ...AnswerBasedWorkflow.DEFAULT_TRACKERS,
+  ...SearchBasedWorkflow.DEFAULT_TRACKERS,
+});
+
+const DEFAULT_PAGINATION = Object.freeze({
+  ...SearchBasedWorkflow.DEFAULT_PAGINATION,
+  active: true,
+});
+
+const DEFAULT_AUTOCOMPLETE_OPTIONS = Object.freeze({
+  api: {
+    group: API.GROUP.ASK,
+    name: API.NAME.SEARCH_AUTOCOMPLETE,
+    payload: {
+      completion_fields: ['suggested_queries'],
+    },
+  },
 });
 
 const DEFAULT_OPTIONS = Object.freeze({
   ...AnswerBasedWorkflow.DEFAULT_OPTIONS,
+  ...SearchBasedWorkflow.DEFAULT_OPTIONS,
   api: DEFAULT_API_OPTIONS,
   layouts: DEFAULT_LAYOUTS,
   trackers: DEFAULT_TRACKERS,
+  autocomplete: DEFAULT_AUTOCOMPLETE_OPTIONS,
+  pagination: DEFAULT_PAGINATION,
 });
 
-const ROLES_CONFIG = Object.freeze({
-  [ROLE.QUESTION]: {
-    mapping: ROLE.KEYWORDS,
-  },
-  [ROLE.FACETS]: {
-    mapping: 'facet_counts',
-  },
-});
-
-const SUBWORKFLOW = Object.freeze({
-  ANSWER: 'answer',
-  RESULTS: 'results',
+const ROLES_OPTIONS = Object.freeze({
+  main: ROLE.PRODUCTS,
+  members: Object.keys(DEFAULT_LAYOUTS),
+  mappings: Object.freeze({
+    ...AnswerBasedWorkflow.ROLES_OPTIONS.mappings,
+    ...SearchBasedWorkflow.ROLES_OPTIONS.mappings,
+  }),
 });
 
-function getSubworkflowByRole(role) {
-  // TODO: ROLE.ERROR
-  switch (role) {
-    case ROLE.PRODUCTS:
-    case ROLE.HITS:
-    case ROLE.FACETS:
-    case ROLE.KEYWORDS:
-      return SUBWORKFLOW.RESULTS;
-    default:
-      return SUBWORKFLOW.ANSWER;
-  }
-}
-
 export default class HybridSearch extends Workflow {
 
   constructor(plugin, client) {
@@ -72,8 +72,7 @@ export default class HybridSearch extends Workflow {
       name: 'hybrid-search',
       plugin,
       client,
-      roles: Object.keys(DEFAULT_LAYOUTS),
-      rolesConfig: ROLES_CONFIG,
+      roles: ROLES_OPTIONS,
       defaults: DEFAULT_OPTIONS,
     });
   }
@@ -88,9 +87,9 @@ export default class HybridSearch extends Workflow {
 
   _getSubworkflow(name) {
     switch (name) {
-      case SUBWORKFLOW.ANSWER:
+      case 'answer':
         return this._answer;
-      case SUBWORKFLOW.RESULTS:
+      case 'results':
         return this._results;
       default:
         throw new Error(`Invalid subworkflow: ${name}`);
@@ -106,18 +105,14 @@ export default class HybridSearch extends Workflow {
     this._interactions = new InteractionsActor(hub, { client, options });
   }
 
-  _initReset() {
-    this._results.reset();
-    this._answer.reset();
+  _initSession() {
+    this._results._sessions.restart();
+    this._answer._sessions.restart();
   }
 
-  restart({ answer = true } = {}) {
-    const previousSession = this.session;
-    this._sessions.restart();
-    const { session } = this;
-    if (!answer) {
-      session._answer = previousSession._answer || previousSession;
-    }
+  // configuration //
+  useLink(fn, options) {
+    this._answer.useLink(fn, options);
     return this;
   }
 
@@ -130,6 +125,10 @@ export default class HybridSearch extends Workflow {
     return this._results._views.filters;
   }
 
+  get autocomplete() {
+    return this._answer.autocomplete;
+  }
+
   // query //
   autoQuery(options) {
     this._answer.autoQuery(options);
@@ -140,8 +139,8 @@ export default class HybridSearch extends Workflow {
   }
 
   // interactions //
-  _preprocessInteraction(payload) {
-    return this._answer._preprocessInteraction(payload);
+  _defaultProcessInteraction(payload, args) {
+    return this._answer._defaultProcessInteraction(payload, args);
   }
 
   // destroy //
@@ -153,112 +152,3 @@ export default class HybridSearch extends Workflow {
   }
 
 }
-
-class HybridSearchViewsActor {
-
-  constructor(workflow) {
-    this._workflow = workflow;
-    this._containers = new Set();
-  }
-
-  get(role) {
-    return this._getSubviews(role).get(role);
-  }
-
-  addContainer(element) {
-    if (this._containers.has(element)) {
-      return;
-    }
-    this._containers.add(element);
-
-    const { components } = element;
-    for (const component of components) {
-      this.addComponent(component);
-    }
-  }
-
-  removeContainer(element) {
-    for (const subworkflow of this._workflow._subworkflows) {
-      subworkflow._views.removeContainer(element);
-    }
-    this._containers.delete(element);
-  }
-
-  addComponent(element) {
-    this._getViewByElement(element).element = element;
-    this._addContainerToSubviews(element._container, element);
-  }
-
-  removeComponent(element) {
-    this._getViewByElement(element).element = undefined;
-    this._removeContainerFromSubviewsIfNecessary(element._container);
-  }
-
-  updateComponentRole(element, oldRole, newRole) {
-    // TODO
-  }
-
-  refreshElement(element) {
-    const view = element.isContainer ? this._containers.get(element) : this._getViewByElement(element);
-    view && view.refresh({ force: true });
-  }
-
-  // helpers //
-  _getSubworkflow(role) {
-    return this._workflow._getSubworkflow(getSubworkflowByRole(role));
-  }
-
-  _getAllSubviews() {
-    return this._workflow._subworkflows.flatMap(subworkflow => subworkflow._views);
-  }
-
-  _getSubviews(role) {
-    return this._getSubworkflow(role)._views;
-  }
-
-  _getViewByElement(element) {
-    let { role } = element;
-    if (!role) {
-      throw new Error('Component must have a role');
-    }
-    return this.get(role);
-  }
-
-  _addContainerToSubviews(container, child) {
-    if (!container) {
-      return;
-    }
-    const { role } = child;
-    const subviews = this._getSubviews(role);
-    if (subviews._containers.has(container)) {
-      return;
-    }
-    // check if the container is in other subviews
-    for (const otherSubviews of this._getAllSubviews()) {
-      if (otherSubviews === subviews) {
-        continue;
-      }
-      if (otherSubviews._containers.has(container)) {
-        // find the conflicting element
-        for (const component of container.components) {
-          if (otherSubviews.containsElement(component)) {
-            throw new Error(`<${container.tagName}> cannot contain both <${component.tagName}> and <${child.tagName}>, for they don't share the same data lifecycle.`);
-          }
-        }
-        throw new Error(`Failed to add container <${container.tagName}> with child component <${child.tagName}>.`);
-      }
-    }
-    // add the container to the subviews
-    subviews.addContainer(container);
-  }
-
-  _removeContainerFromSubviewsIfNecessary(container) {
-    if (!container || container.components.length > 0) {
-      return;
-    }
-    for (const subviews of this._getAllSubviews()) {
-      subviews.removeContainer(container);
-    }
-  }
-
-}

package/src/workflow/options.js

@@ -110,15 +110,14 @@ export function normalizeInteractionsOptions(options) {
   return { ...options, preprocess };
 }
 
-export function normalizeAutocompleteOptions(options) {
+export function normalizePaginationOptions(options) {
   if (options === undefined) {
-    throw new Error(`Expect autocomplete options to be an object or a boolean value: ${options}`);
+    throw new Error(`Expect pagination options to be an object or a boolean value: ${options}`);
   }
   if (typeof options === 'boolean') {
-    options = { actor: options };
+    options = { active: options };
   }
-  const processData = normalizeDataProcessorOptions(options.processData);
-  return { ...options, processData };
+  return options;
 }
 
 // merge //
@@ -206,17 +205,33 @@ export function mergeInteractionsOptions(...optionsList) {
   }));
 }
 
-export function mergeAutocompleteOptions(...optionsList) {
+export function mergePaginationOptions(...optionsList) {
   if (optionsList[optionsList.length - 1] === false) {
     return false;
   }
+  return mergeOptions(optionsList, (merged, options) => Object.assign(merged, options));
+}
+
+export function mergeAutocompleteOptions(...optionsList) {
   return mergeOptions(optionsList, (merged, options) => Object.assign(merged, {
     ...options,
     api: mergeApiOptions(merged.api, options.api),
-    processData: mergeDataProcessorOptions(merged.processData, options.processData),
   }));
 }
 
+export function mergeRolesOptions(base, overrides) {
+  return Object.freeze({
+    ...base,
+    ...overrides,
+    members: mergeRolesMembers(base.members, overrides.members),
+    mappings: Object.freeze({ ...base.mappings, ...overrides.mappings }),
+  });
+}
+
+function mergeRolesMembers(base = [], overrides = []) {
+  return [...new Set([...base, ...overrides])];
+}
+
 
 
 // manifest //
@@ -247,9 +262,9 @@ const FEATURES = [
     merge: mergeInteractionsOptions,
   },
   {
-    key: 'autocomplete',
-    normalize: normalizeAutocompleteOptions,
-    merge: mergeAutocompleteOptions,
+    key: 'pagination',
+    normalize: normalizePaginationOptions,
+    merge: mergePaginationOptions,
   },
 ];
 
@@ -272,7 +287,7 @@ export class WorkflowOptions {
 
   constructor(context = {}, defaults = {}) {
     this._events = new EventEmitter({ target: this });
-    this._defaults = defaults;
+    this._defaults = defaults; // TODO: we should call normalize() on defaults
     this._context = context || {};
     this._locals = {};
 

package/src/workflow/processors.js

@@ -1,9 +1,14 @@
 import { trimObj } from '@miso.ai/commons';
-import { STATUS } from '../constants.js';
+import { STATUS, ROLE, EVENT_TYPE, isPerformanceEventType, isProductRole } from '../constants.js';
+
+// data //
+export function getRevision(data) {
+  return data && data.value && data.value.revision;
+}
 
 export function writeDataStatus(data) {
   const status = getStatus(data);
-  const ongoing = status === STATUS.READY ? !!data.ongoing : undefined;
+  const ongoing = status === STATUS.READY ? data.ongoing : undefined;
   return trimObj({ status, ongoing, ...data }); // let orinigal data override status and ongoing
 }
 
@@ -74,7 +79,14 @@ export function writeAnswerStageToMeta(data) {
   };
 }
 
-export function composeFiltersPayload(filters) {
+export function writeFiltersToPayload(payload = {}, filters) {
+  return trimObj({
+    ...payload,
+    ...composeFiltersPayload(filters),
+  });
+}
+
+function composeFiltersPayload(filters) {
   if (!filters) {
     return undefined;
   }
@@ -100,3 +112,139 @@ function composeFacetFilters(facets) {
   }
   return Object.keys(filters).length ? filters : undefined;
 }
+
+export function retainFacetCountsInData(data, currentFacetCounts) {
+  if (!currentFacetCounts) {
+    return data;
+  }
+  const { status, value } = data;
+  switch (status) {
+    case STATUS.INITIAL:
+    case STATUS.LOADING:
+      break;
+    default:
+      return data;
+  }
+  if (value && value.facet_counts) {
+    return data;
+  }
+  return {
+    ...data,
+    value: {
+      ...value,
+      facet_counts: currentFacetCounts,
+    },
+  };
+}
+
+export function concatItemsFromMoreResponse(oldData, newData, { role = ROLE.PRODUCTS } = {}) {
+  if (!newData.value) {
+    return oldData;
+  }
+  const { [role]: oldProducts = [], facet_counts, total } = oldData.value;
+  const { [role]: newProducts = [] } = newData.value;
+  // keep old exhaustion flag, just in case
+  // TODO
+
+  // use old values of facet_counts and total, for they are affected by product_id exclusion
+  return {
+    ...newData,
+    facet_counts,
+    total,
+    value: {
+      ...newData.value,
+      [role]: [...oldProducts, ...newProducts],
+    },
+  }
+}
+
+export function writeExhaustionToData(data, { role = ROLE.PRODUCTS } = {}) {
+  const { status, request, value } = data;
+  // keep track of the exhaustion state
+  if (status !== STATUS.READY || !request || !value) {
+    return data;
+  }
+  const { [role]: items } = value;
+  if (!items) {
+    return data;
+  }
+  const { rows } = request.payload;
+  const { length } = items;
+  const exhausted = length < rows;
+  if (!exhausted) {
+    return data;
+  }
+  return {
+    ...data,
+    meta: {
+      ...data.meta,
+      exhausted: true,
+    },
+  };
+}
+
+// interactions //
+export function buildBaseInteraction(args) {
+  const { role, type, items } = args;
+  const payload = {
+    type: type === 'viewable' ? 'viewable_impression' : type,
+    context: {
+      custom_context: trimObj({
+        property: role,
+      }),
+    },
+  };
+
+  if (isPerformanceEventType(type)) {
+    if (isProductRole(role)) {
+      payload.product_ids = (items || []).map(v => typeof v === 'string' ? v : v.product_id).filter(v => v);
+    } else {
+      payload.product_ids = [];
+      payload.context.custom_context.items = (items || []).map(v => v.text || v.id || v);
+    }
+  }
+
+  switch (type) {
+    case EVENT_TYPE.SUBMIT:
+      payload.context.custom_context.value = args.value;
+      break;
+    case EVENT_TYPE.FEEDBACK:
+      payload.context.custom_context.value = payload.value = args.value;
+      payload.context.custom_context.result_type = payload.result_type = args.result_type;
+      break;
+  }
+
+  return trimObj(payload);
+}
+
+export function writeAffiliationInfoToInteraction(payload, args) {
+  if (args.role !== ROLE.AFFILIATION) {
+    return payload;
+  }
+  const { items } = args;
+  const channel = (items[0] && items[0].channel) || undefined;
+  const positions = items.map(v => v.position);
+  return mergeInteraction(payload, {
+    context: {
+      custom_context: {
+        channel,
+        positions,
+      },
+    },
+  });
+}
+
+export function mergeInteraction(base = {}, patch = {}) {
+  return trimObj({
+    ...base,
+    ...patch,
+    context:trimObj({
+      ...base.context,
+      ...patch.context,
+      custom_context: trimObj({
+        ...(base.context && base.context.custom_context),
+        ...(patch.context && patch.context.custom_context),
+      }),
+    }),
+  });
+}