@onereach/channel-transformer/src/channels/rwc/fromGeneric/v4/items/select.ts

Convert data model between different channels (Slack, Microsoft Teams, Generic...)

import { IGenericSelect } from '../../../../generic/types';
import { IRWCOption, IRWCMessage, IRWCAnswerComponent } from '../../../types';
import { getAnswerComponent } from '../../../helpers/answer-types';

export const transformSelect = ({ props }: IGenericSelect, desiredType?: string): IRWCMessage => {
  const options: Array<IRWCOption> = props?.options?.map(op => ({
    label: op.label || op.value,
    value: op.value || op.label
  })) || [];

  const { multiple } = props;
  if (multiple) {
    const answerComponent: IRWCAnswerComponent = getAnswerComponent('rwc-checkbox-group');
    const selected = options.filter(op => op.value === props.value?.value || props.value);
    const defaultValue = selected.map(o => o.label);
    
    answerComponent.vBind = {
      ...props.rwc,
      options,
      defaultValue,
      placeholder: props.placeholder
    };
  
    const result: IRWCMessage = {
      message: props.label,
      answerComponent
    };

    return result;
  }

  const selected = options.find(op => op.value === props.value?.value || props.value);
  const defaultValue = selected?.label || "No option";
  const cmpType = desiredType || props.rwc?.type || (options.length > 10 ? 'rwc-dropdown' : 'rwc-menu');
  const answerComponent: IRWCAnswerComponent = getAnswerComponent(cmpType);
  answerComponent.vBind = {
    options,
    defaultValue,
    ...props.rwc
  };
  
  if (props.placeholder) {
    const placeholderProp = cmpType === 'rwc-dropdown' ? 'dropdownPlaceholder' : 'placeholder';
    answerComponent.vBind[placeholderProp] = props.placeholder;
  }

  const result: IRWCMessage = {
    message: props.label || '',
    answerComponent
  };

  return result;
};