feat: Add GoogleScholar #918 (#1818)

### What problem does this PR solve?
feat: Add GoogleScholar #918
### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/flow/constant.tsx

@@ -2,6 +2,7 @@ import { ReactComponent as ArXivIcon } from '@/assets/svg/arxiv.svg';
 import { ReactComponent as BaiduIcon } from '@/assets/svg/baidu.svg';
 import { ReactComponent as BingIcon } from '@/assets/svg/bing.svg';
 import { ReactComponent as DuckIcon } from '@/assets/svg/duck.svg';
+import { ReactComponent as GoogleScholarIcon } from '@/assets/svg/google-scholar.svg';
 import { ReactComponent as GoogleIcon } from '@/assets/svg/google.svg';
 import { ReactComponent as KeywordIcon } from '@/assets/svg/keyword.svg';
 import { ReactComponent as PubMedIcon } from '@/assets/svg/pubmed.svg';
@@ -44,6 +45,7 @@ export enum Operator {
   ArXiv = 'ArXiv',
   Google = 'Google',
   Bing = 'Bing',
+  GoogleScholar = 'GoogleScholar',
 }
 
 export const operatorIconMap = {
@@ -63,6 +65,7 @@ export const operatorIconMap = {
   [Operator.ArXiv]: ArXivIcon,
   [Operator.Google]: GoogleIcon,
   [Operator.Bing]: BingIcon,
+  [Operator.GoogleScholar]: GoogleScholarIcon,
 };
 
 export const operatorMap = {
@@ -145,6 +148,7 @@ export const operatorMap = {
     backgroundColor: 'pink',
   },
   [Operator.Bing]: {},
+  [Operator.GoogleScholar]: {},
 };
 
 export const componentMenuList = [
@@ -193,6 +197,9 @@ export const componentMenuList = [
   {
     name: Operator.Bing,
   },
+  {
+    name: Operator.GoogleScholar,
+  },
 ];
 
 export const initialRetrievalValues = {
@@ -291,6 +298,12 @@ export const initialBingValues = {
   language: 'en',
 };
 
+export const initialGoogleScholarValues = {
+  top_n: 5,
+  sort_by: 'relevance',
+  patents: true,
+};
+
 export const CategorizeAnchorPointPositions = [
   { top: 1, right: 34 },
   { top: 8, right: 18 },
@@ -354,6 +367,7 @@ export const RestrictedUpstreamMap = {
   [Operator.ArXiv]: [Operator.Begin, Operator.Retrieval],
   [Operator.Google]: [Operator.Begin, Operator.Retrieval],
   [Operator.Bing]: [Operator.Begin, Operator.Retrieval],
+  [Operator.GoogleScholar]: [Operator.Begin, Operator.Retrieval],
 };
 
 export const NodeMap = {
@@ -373,6 +387,7 @@ export const NodeMap = {
   [Operator.ArXiv]: 'ragNode',
   [Operator.Google]: 'ragNode',
   [Operator.Bing]: 'ragNode',
+  [Operator.GoogleScholar]: 'ragNode',
 };
 
 export const LanguageOptions = [

web/src/pages/flow/flow-drawer/index.tsx

@@ -13,6 +13,7 @@ import { Operator } from '../constant';
 import DuckDuckGoForm from '../duckduckgo-form';
 import GenerateForm from '../generate-form';
 import GoogleForm from '../google-form';
+import GoogleScholarForm from '../google-scholar-form';
 import { useHandleFormValuesChange, useHandleNodeNameChange } from '../hooks';
 import KeywordExtractForm from '../keyword-extract-form';
 import MessageForm from '../message-form';
@@ -46,6 +47,7 @@ const FormMap = {
   [Operator.ArXiv]: ArXivForm,
   [Operator.Google]: GoogleForm,
   [Operator.Bing]: BingForm,
+  [Operator.GoogleScholar]: GoogleScholarForm,
 };
 
 const EmptyContent = () => <div>empty</div>;

web/src/pages/flow/google-scholar-form/index.tsx

@@ -0,0 +1,78 @@
+import TopNItem from '@/components/top-n-item';
+import { useTranslate } from '@/hooks/common-hooks';
+import { DatePicker, DatePickerProps, Form, Select, Switch } from 'antd';
+import dayjs from 'dayjs';
+import { useCallback, useMemo } from 'react';
+import { IOperatorForm } from '../interface';
+
+const YearPicker = ({
+  onChange,
+  value,
+}: {
+  onChange?: (val: number | undefined) => void;
+  value?: number | undefined;
+}) => {
+  const handleChange: DatePickerProps['onChange'] = useCallback(
+    (val: any) => {
+      const nextVal = val?.format('YYYY');
+      onChange?.(nextVal ? Number(nextVal) : undefined);
+    },
+    [onChange],
+  );
+  // The year needs to be converted into a number and saved to the backend
+  const nextValue = useMemo(() => {
+    if (value) {
+      return dayjs(value.toString());
+    }
+    return undefined;
+  }, [value]);
+
+  return <DatePicker picker="year" onChange={handleChange} value={nextValue} />;
+};
+
+const GoogleScholarForm = ({ onValuesChange, form }: IOperatorForm) => {
+  const { t } = useTranslate('flow');
+
+  const options = useMemo(() => {
+    return ['data', 'relevance'].map((x) => ({
+      value: x,
+      label: t(x),
+    }));
+  }, [t]);
+
+  return (
+    <Form
+      name="basic"
+      labelCol={{ span: 6 }}
+      wrapperCol={{ span: 18 }}
+      autoComplete="off"
+      form={form}
+      onValuesChange={onValuesChange}
+    >
+      <TopNItem initialValue={5}></TopNItem>
+      <Form.Item
+        label={t('sortBy')}
+        name={'sort_by'}
+        initialValue={'relevance'}
+      >
+        <Select options={options}></Select>
+      </Form.Item>
+      <Form.Item label={t('yearLow')} name={'year_low'}>
+        <YearPicker />
+      </Form.Item>
+      <Form.Item label={t('yearHigh')} name={'year_high'}>
+        <YearPicker />
+      </Form.Item>
+      <Form.Item
+        label={t('patents')}
+        name={'patents'}
+        valuePropName="checked"
+        initialValue={true}
+      >
+        <Switch></Switch>
+      </Form.Item>
+    </Form>
+  );
+};
+
+export default GoogleScholarForm;

web/src/pages/flow/hooks.ts

@@ -37,6 +37,7 @@ import {
   initialCategorizeValues,
   initialDuckValues,
   initialGenerateValues,
+  initialGoogleScholarValues,
   initialGoogleValues,
   initialKeywordExtractValues,
   initialMessageValues,
@@ -97,6 +98,7 @@ export const useInitializeOperatorParams = () => {
       [Operator.ArXiv]: initialArXivValues,
       [Operator.Google]: initialGoogleValues,
       [Operator.Bing]: initialBingValues,
+      [Operator.GoogleScholar]: initialGoogleScholarValues,
     };
   }, [llmId]);