Skip to content

Latest commit

 

History

History
368 lines (287 loc) · 10.9 KB

CONFIG.md

File metadata and controls

368 lines (287 loc) · 10.9 KB

MynahUI Config

You can set the config from the constructor parameters while creating a new instance of mynah-ui.

Note: You cannot set it on runtime. It is getting used just once during the initialization.

...
interface ConfigModel {
    // Do not forget that you have to provide all of them
    // Config allows partial set of texts
    texts: {
        mainTitle?: string;
        feedbackFormTitle?: string;
        feedbackFormOptionsLabel?: string;
        feedbackFormCommentLabel?: string;
        feedbackThanks?: string;
        feedbackReportButtonLabel?: string;
        codeSuggestions?: string;
        files?: string;
        insertAtCursorLabel?: string;
        copy?: string;
        showMore?: string;
        save?: string;
        cancel?: string;
        submit?: string;
        pleaseSelect?: string;
        stopGenerating?: string;
        copyToClipboard?: string;
        noMoreTabsTooltip?: string;
        codeSuggestionWithReferenceTitle?: string;
        spinnerText?: string;
        tabCloseConfirmationMessage?: string;
        tabCloseConfirmationKeepButton?: string;
        tabCloseConfirmationCloseButton?: string;
        noTabsOpen: string; // Supports markdown
        openNewTab: string;
    };
    // Options to show up on the overlay feedback form
    // after user clicks to downvote on a chat item
    // and clicks 'Report' again
    feedbackOptions: Array<{
        label: string;
        value: string;
    }>;
    tabBarButtons?: TabBarMainAction[]; // Tab bar buttons will be shown on the right of the tab
    maxUserInput: number; // max number of chars for the input field
    userInputLengthWarningThreshold: number; // The amount of characters in the input field necessary for the character limit warning to show
    codeInsertToCursorEnabled?: boolean; // show or hide copy buttons on code blocks system wide
    codeCopyToClipboardEnabled?: boolean; // show or hide insert to cursor buttons on code blocks system wide
    autoFocus: boolean; // auto focuses to input panel after every action
    maxTabs: number; // set 1 to hide tabs panel
    showPromptField: boolean; // shows prompt field (default: true)
}
...


tabBarButtons

You can put buttons on the right of the tab bar also with some inner buttons inside a menu. You can do it in two different ways. If you want the buttons globally available for every tab you can use the tabBarButtons in the config. If you want them set individually for different tabs check the DATAMODEL Documentation.

const mynahUI = new MynahUI({
    ...
    config: {
      ...
      tabBarButtons: [
        {
          id: 'clear',
          description: 'Clear messages in this tab',
          icon: MynahIcons.REFRESH,
        },
        {
          id: 'multi',
          icon: MynahIcons.ELLIPSIS,
          items: [
            {
              id: 'menu-action-1',
              text: 'Menu action 1!',
              icon: MynahIcons.CHAT,
            },
            {
              id: 'menu-action-2',
              text: 'Menu action 2!',
              icon: MynahIcons.CODE_BLOCK,
            },
            {
              id: 'menu-action-3',
              text: 'Menu action 3!'
            }
          ]
        }
      ]
    }
    ...
});

mainTitle
mainTitle


texts

All static texts will be shown on UI. Please take a look at each image to identify which text blongs to which item on UI.

mainTitle

Default tab title text if it is not set through store data for that tab.

mainTitle


feedbackFormTitle, feedbackFormOptionsLabel, feedbackFormCommentLabel, submit, cancel

feedbackForm


fileTreeTitle, rootFolderTitle, feedbackFormCommentLabel, submit, cancel

fileTree


pleaseSelect

feedbackForm


feedbackThanks, feedbackReportButtonLabel, showMore

voteAndSourceActions


stopGenerating

stopGenerating


insertAtCursorLabel, copy

copyInsertToCursor


codeSuggestions, files, codeSuggestionWithReferenceTitle

codeFileSuggestions


spinnerText

spinnerText


tabCloseConfirmationMessage, tabCloseConfirmationKeepButton, tabCloseConfirmationCloseButton

tabCloseConfirmation


noMoreTabsTooltip

noMoreTabsTooltip


noTabsOpen, openNewTab

noTabsOpen



feedbackOptions

Feedback type options to be shown on feedback form. defaults:

...
feedbackOptions: [
    {
      value: 'inaccurate-response',
      label: 'Inaccurate response',
    },
    {
      value: 'harmful-content',
      label: 'Harmful content'
    },
    {
      value: 'overlap',
      label: 'Overlaps with existing content'
    },
    {
      value: 'incorrect-syntax',
      label: 'Incorrect syntax'
    },
    {
      value: 'buggy-code',
      label: 'Buggy code'
    },
    {
      value: 'low-quality',
      label: 'Low quality'
    },
    {
      value: 'other',
      label: 'Other'
    }
  ],
...

feedbackOptions



maxTabs

Maximum number of tabs user/system can open in a single instance of mynah-ui.

default: 1000

An important note here is that if you provide 1 to maxTabs, it will not show the tab bar at all. However you still need to add a tab then initially to show a content.

And finally, if you try to add tabs more than given maxTabs amount while initializing the MynahUI with Constructor Properties, it will only generate the tabs till it reaches the maxTabs limit.

Assume that you've provided 1 for maxTabs.

maxTabs1



autoFocus

Just auto focus to prompt input field after every response arrival or initialization.

default: true


feedbackOptions


userInputLengthWarningThreshold

The amount of characters in the prompt input necessary for the character limit warning overlay to show up.

Note

In older versions, the character count used to always show underneath the input, but this was changed in a recent release.

default: 3500

feedbackOptions



maxUserInput

Max number of chars user can insert into the prompt field. But, as might know you can also add code attachments under the prompt field. A treshold of 96 chars will be automatically reduced from the maxUserInput.

So beware that if you want 4000 chars exact, you need to give 4096 to the config.

default: 4096


codeInsertToCursorEnabled and codeCopyToClipboardEnabled (default: true)

These two parameters allow you to make copy and insert buttons disabled system wide. If you want to disable it specifically for a message you can do it through ChatItem object. Please see DATAMODEL Documentation.

codeInsertAndCopy


codeBlockActions

With this parameter, you can add global code block actions to the code blocks. But, you can override them through ChatItem Data Model.

Note

If you want to show that action only for certain coding languages, you can set the array for acceptedLanguages parameter. Keep in mind that it will check an exact mathc. If the incoming language is same with one of the acceptedLanguages list, it will show the action.

By default, we add copy and insert to cursor position ones:

{
  codeBlockActions: {
    ...(codeCopyToClipboardEnabled !== false
      ? {
          copy: {
            id: 'copy',
            label: texts.copy,
            icon: MynahIcons.COPY
          }
        }
      : {}),
    ...(codeInsertToCursorEnabled !== false
      ? {
          'insert-to-cursor': {
            id: 'insert-to-cursor',
            label: texts.insertAtCursorLabel,
            icon: MynahIcons.CURSOR_INSERT
          }
        }
      : {}),
  }
}

codeInsertAndCopy



showPromptField

Show or hide the prompt input field completely. You may want to hide the prompt field by setting showPromptField to false to make the chat work one way only. Just to provide answers or information.

default: true

If you set showPromptField to false

noPrompt