feat: Add component GitHub #1739 (#1871)

### What problem does this PR solve?

feat: Add component GitHub #1739

### Type of change

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

web/src/assets/svg/github.svg

@@ -0,0 +1,6 @@
+<svg t="1723100125495" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5615"
+    width="200" height="200">
+    <path
+        d="M938.666667 512a426.666667 426.666667 0 0 1-291.84 404.48 22.186667 22.186667 0 0 1-19.2-2.986667 21.76 21.76 0 0 1-8.96-17.493333v-113.92a170.666667 170.666667 0 0 0-21.333334-87.893333 10.666667 10.666667 0 0 1 0-11.52 11.52 11.52 0 0 1 8.533334-5.973334c104.106667-10.666667 162.133333-52.053333 162.133333-164.693333a200.96 200.96 0 0 0-50.773333-143.36 183.466667 183.466667 0 0 0 8.106666-51.2 184.746667 184.746667 0 0 0-6.4-46.08 20.906667 20.906667 0 0 0-22.613333-15.36 189.866667 189.866667 0 0 0-104.106667 50.346667 422.826667 422.826667 0 0 0-160.426666 0A189.866667 189.866667 0 0 0 327.68 256a20.906667 20.906667 0 0 0-22.613333 15.36A184.746667 184.746667 0 0 0 298.666667 317.44a183.466667 183.466667 0 0 0 8.106666 51.2A200.96 200.96 0 0 0 256 512c0 118.613333 64.426667 158.293333 182.613333 168.106667a158.293333 158.293333 0 0 0-29.44 65.28v5.12a29.013333 29.013333 0 0 0 0 5.973333 25.173333 25.173333 0 0 1-27.306666 21.76 42.666667 42.666667 0 0 1-18.346667-5.12 227.84 227.84 0 0 1-60.586667-53.76 430.506667 430.506667 0 0 0-34.133333-34.56 116.906667 116.906667 0 0 0-25.173333-16.64 20.906667 20.906667 0 0 0-20.48 0 21.333333 21.333333 0 0 0-9.813334 17.92v2.56a21.333333 21.333333 0 0 0 9.813334 17.92 193.706667 193.706667 0 0 1 39.253333 44.8 282.026667 282.026667 0 0 0 67.84 73.386667 105.813333 105.813333 0 0 0 59.733333 17.92h15.36V896a21.76 21.76 0 0 1-8.96 17.493333 22.186667 22.186667 0 0 1-19.2 2.986667A426.666667 426.666667 0 1 1 938.666667 512z"
+        p-id="5616"></path>
+</svg>

web/src/locales/en.ts

@@ -667,6 +667,9 @@ The above is the content you need to summarize.`,
       authKey: 'Auth key',
       sourceLang: 'Source language',
       targetLang: 'Target language',
+      gitHub: 'GitHub',
+      githubDescription:
+        'This component is used to search the repository from https://github.com/. Top N specifies the number of search results to be adjusted.',
     },
     footer: {
       profile: 'All rights reserved @ React',

web/src/locales/zh-traditional.ts

@@ -625,6 +625,9 @@ export default {
       authKey: '授權鍵',
       sourceLang: '原始語言',
       targetLang: '目標語言',
+      gitHub: 'GitHub',
+      gitHubDescription:
+        '此元件用於從 https://github.com/ 搜尋儲存庫。 Top N 指定要調整的搜尋結果的數量。',
     },
     footer: {
       profile: '“保留所有權利 @ react”',

web/src/locales/zh.ts

@@ -643,6 +643,9 @@ export default {
       authKey: '授权键',
       sourceLang: '源语言',
       targetLang: '目标语言',
+      gitHub: 'GitHub',
+      githubDescription:
+        '该组件用于从 https://github.com/ 搜索仓库。Top N 指定需要调整的搜索结果数量。',
     },
     footer: {
       profile: 'All rights reserved @ React',

web/src/pages/flow/constant.tsx

@@ -3,6 +3,7 @@ import { ReactComponent as BaiduIcon } from '@/assets/svg/baidu.svg';
 import { ReactComponent as BingIcon } from '@/assets/svg/bing.svg';
 import { ReactComponent as DeepLIcon } from '@/assets/svg/deepl.svg';
 import { ReactComponent as DuckIcon } from '@/assets/svg/duck.svg';
+import { ReactComponent as GithubIcon } from '@/assets/svg/github.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';
@@ -48,6 +49,7 @@ export enum Operator {
   Bing = 'Bing',
   GoogleScholar = 'GoogleScholar',
   DeepL = 'DeepL',
+  GitHub = 'GitHub',
 }
 
 export const operatorIconMap = {
@@ -69,6 +71,7 @@ export const operatorIconMap = {
   [Operator.Bing]: BingIcon,
   [Operator.GoogleScholar]: GoogleScholarIcon,
   [Operator.DeepL]: DeepLIcon,
+  [Operator.GitHub]: GithubIcon,
 };
 
 export const operatorMap = {
@@ -153,6 +156,7 @@ export const operatorMap = {
   [Operator.Bing]: {},
   [Operator.GoogleScholar]: {},
   [Operator.DeepL]: {},
+  [Operator.GitHub]: {},
 };
 
 export const componentMenuList = [
@@ -207,6 +211,9 @@ export const componentMenuList = [
   {
     name: Operator.DeepL,
   },
+  {
+    name: Operator.GitHub,
+  },
 ];
 
 export const initialRetrievalValues = {
@@ -316,6 +323,10 @@ export const initialDeepLValues = {
   auth_key: 'relevance',
 };
 
+export const initialGithubValues = {
+  top_n: 5,
+};
+
 export const CategorizeAnchorPointPositions = [
   { top: 1, right: 34 },
   { top: 8, right: 18 },
@@ -381,6 +392,7 @@ export const RestrictedUpstreamMap = {
   [Operator.Bing]: [Operator.Begin, Operator.Retrieval],
   [Operator.GoogleScholar]: [Operator.Begin, Operator.Retrieval],
   [Operator.DeepL]: [Operator.Begin, Operator.Retrieval],
+  [Operator.GitHub]: [Operator.Begin, Operator.Retrieval],
 };
 
 export const NodeMap = {
@@ -402,6 +414,7 @@ export const NodeMap = {
   [Operator.Bing]: 'ragNode',
   [Operator.GoogleScholar]: 'ragNode',
   [Operator.DeepL]: 'ragNode',
+  [Operator.GitHub]: 'ragNode',
 };
 
 export const LanguageOptions = [

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

@@ -12,6 +12,7 @@ import CategorizeForm from '../categorize-form';
 import { Operator } from '../constant';
 import DuckDuckGoForm from '../duckduckgo-form';
 import GenerateForm from '../generate-form';
+import GithubForm from '../github-form';
 import GoogleForm from '../google-form';
 import GoogleScholarForm from '../google-scholar-form';
 import { useHandleFormValuesChange, useHandleNodeNameChange } from '../hooks';
@@ -50,6 +51,7 @@ const FormMap = {
   [Operator.Bing]: BingForm,
   [Operator.GoogleScholar]: GoogleScholarForm,
   [Operator.DeepL]: DeepLForm,
+  [Operator.GitHub]: GithubForm,
 };
 
 const EmptyContent = () => <div>empty</div>;

web/src/pages/flow/github-form/index.tsx

@@ -0,0 +1,20 @@
+import TopNItem from '@/components/top-n-item';
+import { Form } from 'antd';
+import { IOperatorForm } from '../interface';
+
+const GithubForm = ({ onValuesChange, form }: IOperatorForm) => {
+  return (
+    <Form
+      name="basic"
+      labelCol={{ span: 6 }}
+      wrapperCol={{ span: 18 }}
+      autoComplete="off"
+      form={form}
+      onValuesChange={onValuesChange}
+    >
+      <TopNItem initialValue={5}></TopNItem>
+    </Form>
+  );
+};
+
+export default GithubForm;

web/src/pages/flow/hooks.ts

@@ -38,6 +38,7 @@ import {
   initialDeepLValues,
   initialDuckValues,
   initialGenerateValues,
+  initialGithubValues,
   initialGoogleScholarValues,
   initialGoogleValues,
   initialKeywordExtractValues,
@@ -101,6 +102,7 @@ export const useInitializeOperatorParams = () => {
       [Operator.Bing]: initialBingValues,
       [Operator.GoogleScholar]: initialGoogleScholarValues,
       [Operator.DeepL]: initialDeepLValues,
+      [Operator.GitHub]: initialGithubValues,
     };
   }, [llmId]);