Selection tool explain (#491)

* hover selection tool Explain * prompt

Author: zeddyemmy

src/config/index.mjs

@@ -215,6 +215,7 @@ export const defaultConfig = {
  userLanguage: getNavigatorLanguage(),
  apiModes: Object.keys(Models),
  selectionTools: [
+ 'explain',
  'translate',
  'translateToEn',
  'translateToZh',
@@ -227,6 +228,7 @@ export const defaultConfig = {
  'ask',
  ],
  selectionToolsDesc: [
+ 'Explain',
  'Translate',
  'Translate (To English)',
  'Translate (Bidirectional)',

src/content-script/selection-tools/index.mjs

@@ -7,10 +7,19 @@ import {
  Translate,
  Braces,
  Globe,
+ ChatTextFill,
 } from 'react-bootstrap-icons'
 import { getPreferredLanguage } from '../../config/language.mjs'
 
 export const config = {
+ explain: {
+ icon: <ChatTextFill />,
+ label: 'Explain',
+ genPrompt: async (selection) => {
+ const preferredLanguage = await getPreferredLanguage()
+ return `Reply in ${preferredLanguage}.Explain the following:\n"${selection}"`
+ },
+ },
  translate: {
  icon: <Translate />,
  label: 'Translate',