@lobehub/chat 0.26.1 → 0.27.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -2,6 +2,39 @@
2
2
 
3
3
  # Changelog
4
4
 
5
+ ## [Version 0.27.0](https://github.com/lobehub/lobe-chat/compare/v0.26.1...v0.27.0)
6
+
7
+ <sup>Released on **2023-07-29**</sup>
8
+
9
+ #### ✨ Features
10
+
11
+ - **misc**: 优化搜索引擎插件交互展示.
12
+
13
+ #### 💄 Styles
14
+
15
+ - **misc**: 优化兜底结果展示.
16
+
17
+ <br/>
18
+
19
+ <details>
20
+ <summary><kbd>Improvements and Fixes</kbd></summary>
21
+
22
+ #### What's improved
23
+
24
+ - **misc**: 优化搜索引擎插件交互展示 ([4751084](https://github.com/lobehub/lobe-chat/commit/4751084))
25
+
26
+ #### Styles
27
+
28
+ - **misc**: 优化兜底结果展示 ([9da45d6](https://github.com/lobehub/lobe-chat/commit/9da45d6))
29
+
30
+ </details>
31
+
32
+ <div align="right">
33
+
34
+ [![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
35
+
36
+ </div>
37
+
5
38
  ### [Version 0.26.1](https://github.com/lobehub/lobe-chat/compare/v0.26.0...v0.26.1)
6
39
 
7
40
  <sup>Released on **2023-07-29**</sup>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lobehub/chat",
3
- "version": "0.26.1",
3
+ "version": "0.27.0",
4
4
  "description": "Lobe Chat is an open-source chatbot client using LangChain, Typescript and Next.js",
5
5
  "keywords": [
6
6
  "chatbot",
@@ -40,7 +40,7 @@ const PluginResult = memo<FunctionMessageProps>(({ content }) => {
40
40
  <Icon icon={open ? LucideChevronUp : LucideChevronDown} />
41
41
  </Flexbox>
42
42
  {open && (
43
- <Highlighter language={'json'} style={{ maxHeight: 200 }}>
43
+ <Highlighter language={'json'} style={{ maxHeight: 200, maxWidth: 600 }}>
44
44
  {data}
45
45
  </Highlighter>
46
46
  )}
@@ -1,8 +1,11 @@
1
1
  import { PluginRender } from '@/plugins/type';
2
2
 
3
+ import searchEngine from './searchEngine';
4
+ import SearchEngineRender from './searchEngine/Render';
3
5
  import getWeather from './weather';
4
6
  import WeatherRender from './weather/Render';
5
7
 
6
8
  export const PluginsRender: Record<string, PluginRender> = {
7
9
  [getWeather.name]: WeatherRender,
10
+ [searchEngine.name]: SearchEngineRender,
8
11
  };
@@ -0,0 +1,85 @@
1
+ import { createStyles } from 'antd-style';
2
+ import Link from 'next/link';
3
+ import { memo } from 'react';
4
+ import { Flexbox } from 'react-layout-kit';
5
+
6
+ import { PluginRenderProps } from '@/plugins/type';
7
+
8
+ import { Result } from './type';
9
+
10
+ const useStyles = createStyles(({ css, token, cx }) => {
11
+ const title = css`
12
+ margin-top: 4px;
13
+ font-size: 16px;
14
+ `;
15
+ return {
16
+ container: css`
17
+ :not(:last-child) {
18
+ border-bottom: 1px solid ${token.colorBorder};
19
+ }
20
+ `,
21
+ desc: css`
22
+ color: ${token.colorTextTertiary};
23
+ `,
24
+ displayLink: css`
25
+ color: ${token.colorTextQuaternary};
26
+ `,
27
+ favicon: css`
28
+ border-radius: 50%;
29
+ `,
30
+ link: css`
31
+ &:hover {
32
+ .${cx(title)} {
33
+ text-decoration: underline;
34
+ }
35
+ }
36
+ `,
37
+ title,
38
+ };
39
+ });
40
+
41
+ const Render = memo<PluginRenderProps<Result>>(({ content }) => {
42
+ const { styles } = useStyles();
43
+ return (
44
+ <Flexbox gap={8}>
45
+ <Flexbox>
46
+ {content.map((item) => (
47
+ <Flexbox
48
+ className={styles.container}
49
+ distribution={'space-between'}
50
+ horizontal
51
+ key={item.link}
52
+ padding={12}
53
+ >
54
+ <Flexbox>
55
+ <Link className={styles.link} href={item.link!} target={'_blank'}>
56
+ <Flexbox>
57
+ <Flexbox align={'center'} gap={12} horizontal>
58
+ {item.favicon && (
59
+ <img
60
+ alt={item.title || item.link}
61
+ className={styles.favicon}
62
+ height={24}
63
+ src={item.favicon}
64
+ width={24}
65
+ />
66
+ )}
67
+ <Flexbox>
68
+ <Flexbox className={styles.desc}>{item.source}</Flexbox>
69
+ <Flexbox className={styles.displayLink}>{item.displayed_link}</Flexbox>
70
+ </Flexbox>
71
+ </Flexbox>
72
+ <Flexbox className={styles.title}>{item.title}</Flexbox>
73
+ </Flexbox>
74
+ </Link>
75
+ <Flexbox className={styles.desc}>
76
+ {item.date ? `${item.date} - ${item.content}` : item.content}
77
+ </Flexbox>
78
+ </Flexbox>
79
+ </Flexbox>
80
+ ))}
81
+ </Flexbox>
82
+ </Flexbox>
83
+ );
84
+ });
85
+ export default Render;
@@ -30,6 +30,8 @@ const fetchResult: PluginRunner<{ keywords: string }, Result> = async ({ keyword
30
30
  return results.map((r) => ({
31
31
  content: r.snippet,
32
32
  date: r.date,
33
+ displayed_link: r.displayed_link,
34
+ favicon: r.favicon,
33
35
  link: r.link,
34
36
  source: r.source,
35
37
  title: r.title,
@@ -1,11 +1,13 @@
1
1
  export type OrganicResults = OrganicResult[];
2
2
 
3
3
  export interface SearchItem {
4
- content?: string;
4
+ content: string;
5
5
  date?: string;
6
- link?: string;
6
+ displayed_link?: string;
7
+ favicon?: string;
8
+ link: string;
7
9
  source?: string;
8
- title?: string;
10
+ title: string;
9
11
  }
10
12
  export type Result = SearchItem[];
11
13