@lobehub/lobehub 2.0.3 → 2.0.5

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.
Files changed (87) hide show
  1. package/.github/ISSUE_TEMPLATE/1_bug_report.yml +0 -11
  2. package/CHANGELOG.md +50 -0
  3. package/README.md +9 -13
  4. package/README.zh-CN.md +6 -8
  5. package/apps/desktop/Development.md +1 -1
  6. package/changelog/v2.json +18 -0
  7. package/docker-compose/local/docker-compose.yml +2 -2
  8. package/docker-compose/local/grafana/docker-compose.yml +3 -3
  9. package/docker-compose/local/logto/docker-compose.yml +3 -4
  10. package/docker-compose/local/zitadel/.env.example +3 -4
  11. package/docker-compose/local/zitadel/.env.zh-CN.example +1 -2
  12. package/docker-compose/local/zitadel/docker-compose.yml +3 -3
  13. package/docker-compose/production/grafana/docker-compose.yml +3 -3
  14. package/docker-compose/production/logto/.env.example +7 -9
  15. package/docker-compose/production/logto/.env.zh-CN.example +7 -9
  16. package/docker-compose/production/logto/docker-compose.yml +3 -3
  17. package/docker-compose/production/zitadel/.env.example +4 -6
  18. package/docker-compose/production/zitadel/.env.zh-CN.example +3 -5
  19. package/docker-compose/production/zitadel/docker-compose.yml +3 -3
  20. package/docs/development/basic/folder-structure.mdx +1 -2
  21. package/docs/development/basic/folder-structure.zh-CN.mdx +1 -2
  22. package/docs/self-hosting/advanced/auth/legacy.mdx +1 -1
  23. package/docs/self-hosting/advanced/auth/legacy.zh-CN.mdx +1 -1
  24. package/docs/self-hosting/advanced/auth/nextauth-to-betterauth.mdx +4 -0
  25. package/docs/self-hosting/advanced/auth/nextauth-to-betterauth.zh-CN.mdx +4 -0
  26. package/docs/self-hosting/advanced/auth/providers/casdoor.mdx +8 -0
  27. package/docs/self-hosting/advanced/auth/providers/casdoor.zh-CN.mdx +8 -0
  28. package/docs/self-hosting/advanced/auth.mdx +28 -1
  29. package/docs/self-hosting/advanced/auth.zh-CN.mdx +29 -2
  30. package/docs/self-hosting/advanced/upstream-sync.mdx +5 -5
  31. package/docs/self-hosting/advanced/upstream-sync.zh-CN.mdx +5 -5
  32. package/docs/self-hosting/environment-variables/auth.mdx +2 -334
  33. package/docs/self-hosting/environment-variables/auth.zh-CN.mdx +2 -307
  34. package/docs/self-hosting/environment-variables/basic.mdx +1 -1
  35. package/docs/self-hosting/environment-variables/basic.zh-CN.mdx +1 -1
  36. package/docs/self-hosting/environment-variables.mdx +1 -1
  37. package/docs/self-hosting/platform/docker-compose.mdx +837 -90
  38. package/docs/self-hosting/platform/docker-compose.zh-CN.mdx +809 -84
  39. package/docs/self-hosting/platform/docker.mdx +110 -111
  40. package/docs/self-hosting/platform/docker.zh-CN.mdx +103 -151
  41. package/docs/self-hosting/{server-database → platform}/dokploy.mdx +2 -2
  42. package/docs/self-hosting/{server-database → platform}/dokploy.zh-CN.mdx +2 -2
  43. package/docs/self-hosting/platform/repocloud.mdx +11 -10
  44. package/docs/self-hosting/platform/repocloud.zh-CN.mdx +13 -11
  45. package/docs/self-hosting/platform/sealos.mdx +79 -13
  46. package/docs/self-hosting/platform/sealos.zh-CN.mdx +92 -11
  47. package/docs/self-hosting/platform/vercel.mdx +323 -19
  48. package/docs/self-hosting/platform/vercel.zh-CN.mdx +318 -24
  49. package/docs/self-hosting/platform/zeabur.mdx +41 -37
  50. package/docs/self-hosting/platform/zeabur.zh-CN.mdx +34 -39
  51. package/docs/self-hosting/server-database.mdx +6 -6
  52. package/docs/self-hosting/server-database.zh-CN.mdx +5 -5
  53. package/package.json +1 -1
  54. package/packages/types/src/user/preference.ts +2 -2
  55. package/scripts/_shared/checkDeprecatedAuth.js +16 -0
  56. package/src/libs/next/proxy/createRouteMatcher.test.ts +0 -8
  57. package/src/libs/trpc/middleware/userAuth.test.ts +0 -6
  58. package/src/proxy.ts +0 -1
  59. package/src/server/routers/async/__tests__/caller.test.ts +2 -2
  60. package/src/server/routers/lambda/config/index.test.ts +0 -6
  61. package/src/tools/artifacts/systemRole.ts +84 -120
  62. package/docs/self-hosting/platform/alibaba-cloud.mdx +0 -28
  63. package/docs/self-hosting/platform/alibaba-cloud.zh-CN.mdx +0 -25
  64. package/docs/self-hosting/platform/btpanel.mdx +0 -48
  65. package/docs/self-hosting/platform/btpanel.zh-CN.mdx +0 -51
  66. package/docs/self-hosting/platform/netlify.mdx +0 -91
  67. package/docs/self-hosting/platform/netlify.zh-CN.mdx +0 -86
  68. package/docs/self-hosting/platform/railway.mdx +0 -29
  69. package/docs/self-hosting/platform/railway.zh-CN.mdx +0 -29
  70. package/docs/self-hosting/platform/tencentcloud-lighthouse.mdx +0 -29
  71. package/docs/self-hosting/platform/tencentcloud-lighthouse.zh-CN.mdx +0 -26
  72. package/docs/self-hosting/server-database/docker-compose.mdx +0 -879
  73. package/docs/self-hosting/server-database/docker-compose.zh-CN.mdx +0 -854
  74. package/docs/self-hosting/server-database/docker.mdx +0 -154
  75. package/docs/self-hosting/server-database/docker.zh-CN.mdx +0 -153
  76. package/docs/self-hosting/server-database/netlify.mdx +0 -13
  77. package/docs/self-hosting/server-database/netlify.zh-CN.mdx +0 -16
  78. package/docs/self-hosting/server-database/railway.mdx +0 -13
  79. package/docs/self-hosting/server-database/railway.zh-CN.mdx +0 -15
  80. package/docs/self-hosting/server-database/repocloud.mdx +0 -33
  81. package/docs/self-hosting/server-database/repocloud.zh-CN.mdx +0 -32
  82. package/docs/self-hosting/server-database/sealos.mdx +0 -97
  83. package/docs/self-hosting/server-database/sealos.zh-CN.mdx +0 -112
  84. package/docs/self-hosting/server-database/vercel.mdx +0 -344
  85. package/docs/self-hosting/server-database/vercel.zh-CN.mdx +0 -337
  86. package/docs/self-hosting/server-database/zeabur.mdx +0 -76
  87. package/docs/self-hosting/server-database/zeabur.zh-CN.mdx +0 -67
@@ -23,7 +23,7 @@ LobeHub 默认使用客户端数据库(IndexedDB),同时也支持使用服
23
23
 
24
24
  如你已经熟悉完整原理,可以查看各个平台的部署指南快速开始:
25
25
 
26
- <PlatformCards urlPrefix={'server-database'} />
26
+ <PlatformCards urlPrefix={'platform'} />
27
27
 
28
28
  ---
29
29
 
@@ -52,7 +52,7 @@ LobeHub 默认使用客户端数据库(IndexedDB),同时也支持使用服
52
52
  针对服务端数据库部署场景,你需要将 `NEXT_PUBLIC_SERVICE_MODE` 设置为 `server`。
53
53
 
54
54
  <Callout type={'info'}>
55
- 在官方的 `lobe-chat-database` Docker 镜像中,已经默认将该环境变量设为 `server`,因此如果你使用
55
+ 在官方的 `lobehub` Docker 镜像中,已经默认将该环境变量设为 `server`,因此如果你使用
56
56
  Docker 镜像部署,则无需再配置该环境变量。
57
57
  </Callout>
58
58
 
@@ -78,7 +78,7 @@ LobeHub 默认使用客户端数据库(IndexedDB),同时也支持使用服
78
78
  为提升部署便捷性,我们根据不同的平台特点设置了默认值:
79
79
 
80
80
  - 在 Vercel 平台下,`DATABASE_DRIVER` 默认为 `neon`;
81
- - 在我们提供的 Docker 镜像 `lobe-chat-database` 中,`DATABASE_DRIVER` 默认为 `node`。
81
+ - 在我们提供的 Docker 镜像 `lobehub` 中,`DATABASE_DRIVER` 默认为 `node`。
82
82
 
83
83
  因此如果你采用了以下标准的部署方式,你无需手动配置 `DATABASE_DRIVER` 环境变量:
84
84
 
@@ -123,7 +123,7 @@ NextAuth 是一个开源的身份验证库,支持多种身份验证提供商
123
123
  关于 NextAuth 的配置,你可以参考 [身份验证](/zh/docs/self-hosting/advanced/authentication) 的文档获取更多信息。
124
124
 
125
125
  <Callout type={'tip'}>
126
- 在官方的 Docker 镜像 `lobe-chat-database` 中,我们推荐使用 NextAuth 作为身份验证服务。
126
+ 在官方的 Docker 镜像 `lobehub` 中,我们推荐使用 NextAuth 作为身份验证服务。
127
127
  </Callout>
128
128
 
129
129
  ## 配置 S3 存储服务
@@ -143,4 +143,4 @@ LobeHub 在 [很早以前](https://x.com/lobehub/status/1724289575672291782) 就
143
143
 
144
144
  以上就是关于服务端数据库版 LobeHub 的配置详解,你可以根据自己的实际情况进行配置,然后选择适合自己的部署平台开始部署:
145
145
 
146
- <PlatformCards urlPrefix={'server-database'} />
146
+ <PlatformCards urlPrefix={'platform'} />
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lobehub/lobehub",
3
- "version": "2.0.3",
3
+ "version": "2.0.5",
4
4
  "description": "LobeHub - an open-source,comprehensive AI Agent framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
5
5
  "keywords": [
6
6
  "framework",
@@ -100,7 +100,7 @@ export interface UserInitializationState {
100
100
  username?: string;
101
101
  }
102
102
 
103
- export const NextAuthAccountSchame = z.object({
103
+ export const OAuthAccountSchema = z.object({
104
104
  provider: z.string(),
105
105
  providerAccountId: z.string(),
106
106
  });
@@ -110,7 +110,7 @@ export const NextAuthAccountSchame = z.object({
110
110
  */
111
111
  export interface SSOProvider {
112
112
  email?: string;
113
- /** Expiration time - Date for better-auth, number (Unix timestamp) for next-auth */
113
+ /** Expiration time - Date for better-auth */
114
114
  expiresAt?: Date | number | null;
115
115
  provider: string;
116
116
  providerAccountId: string;
@@ -185,6 +185,22 @@ const DEPRECATED_CHECKS = [
185
185
  'Microsoft Entra ID provider has been renamed to Microsoft. Please update your environment variables.',
186
186
  name: 'Microsoft Entra ID',
187
187
  },
188
+ {
189
+ docUrl: MIGRATION_DOC_BASE,
190
+ getVars: () => {
191
+ const hasEmailService =
192
+ process.env['SMTP_HOST'] || process.env['EMAIL_SERVICE_PROVIDER'] === 'resend';
193
+ const hasEmailVerification = process.env['AUTH_EMAIL_VERIFICATION'] === '1';
194
+ if (hasEmailService && !hasEmailVerification) {
195
+ return ['AUTH_EMAIL_VERIFICATION'];
196
+ }
197
+ return [];
198
+ },
199
+ message:
200
+ 'Email service is configured but email verification is disabled. Consider setting AUTH_EMAIL_VERIFICATION=1 to verify user email ownership during registration.',
201
+ name: 'Email Verification',
202
+ severity: 'warning',
203
+ },
188
204
  ];
189
205
 
190
206
  /**
@@ -58,14 +58,6 @@ describe('createRouteMatcher', () => {
58
58
  expect(matcher(createMockRequest('/trpc/chat.create'))).toBe(true);
59
59
  });
60
60
 
61
- it('should match /next-auth/(.*) pattern', () => {
62
- const matcher = createRouteMatcher(['/next-auth/(.*)']);
63
-
64
- expect(matcher(createMockRequest('/next-auth/'))).toBe(true);
65
- expect(matcher(createMockRequest('/next-auth/signin'))).toBe(true);
66
- expect(matcher(createMockRequest('/next-auth/callback/github'))).toBe(true);
67
- expect(matcher(createMockRequest('/next-auth'))).toBe(false); // no trailing slash or path
68
- });
69
61
  });
70
62
 
71
63
  describe('multiple patterns', () => {
@@ -17,12 +17,6 @@ const createCaller = createCallerFactory(appRouter);
17
17
  let ctx: AuthContext;
18
18
  let router: ReturnType<typeof createCaller>;
19
19
 
20
- vi.mock('@/libs/next-auth/edge', () => {
21
- return {
22
- auth: vi.fn().mockResolvedValue(undefined),
23
- };
24
- });
25
-
26
20
  beforeEach(async () => {
27
21
  vi.resetAllMocks();
28
22
  });
package/src/proxy.ts CHANGED
@@ -36,7 +36,6 @@ export const config = {
36
36
  '/verify-email(.*)',
37
37
  '/reset-password(.*)',
38
38
  '/auth-error(.*)',
39
- '/next-auth/(.*)',
40
39
  '/oauth(.*)',
41
40
  '/oidc(.*)',
42
41
  '/market-auth-callback(.*)',
@@ -305,14 +305,14 @@ describe('createAsyncServerClient - INTERNAL_APP_URL Tests', () => {
305
305
 
306
306
  it('should handle Docker Compose deployment with service names', async () => {
307
307
  mockAppEnv.APP_URL = 'https://public.example.com';
308
- mockAppEnv.INTERNAL_APP_URL = 'http://lobe-chat-database:3210';
308
+ mockAppEnv.INTERNAL_APP_URL = 'http://lobehub:3210';
309
309
 
310
310
  await createAsyncServerClient('docker-user');
311
311
 
312
312
  const config = vi.mocked(createTRPCClient).mock.calls[0][0];
313
313
  const httpLinkOptions = config.links[0] as any;
314
314
 
315
- expect(httpLinkOptions.url).toBe('http://lobe-chat-database:3210/trpc/async');
315
+ expect(httpLinkOptions.url).toBe('http://lobehub:3210/trpc/async');
316
316
  });
317
317
 
318
318
  it('should handle deployment without CDN (INTERNAL_APP_URL not set)', async () => {
@@ -13,12 +13,6 @@ const createCaller = createCallerFactory(configRouter);
13
13
  let ctx: AuthContext;
14
14
  let router: ReturnType<typeof createCaller>;
15
15
 
16
- vi.mock('@/libs/next-auth/edge', () => {
17
- return {
18
- auth: vi.fn().mockResolvedValue(undefined),
19
- };
20
- });
21
-
22
16
  beforeEach(async () => {
23
17
  vi.resetAllMocks();
24
18
  ctx = await createContextInner();
@@ -1,69 +1,82 @@
1
- export const systemPrompt = `<artifacts_info>
2
- The assistant can create and reference artifacts during conversations. Artifacts are for substantial, self-contained content that users might modify or reuse, displayed in a separate UI window for clarity.
3
-
4
- # Good artifacts are...
5
- - Substantial content (>15 lines)
6
- - Content that the user is likely to modify, iterate on, or take ownership of
7
- - Self-contained, complex content that can be understood on its own, without context from the conversation
8
- - Content intended for eventual use outside the conversation (e.g., reports, emails, presentations)
9
- - Content likely to be referenced or reused multiple times
10
-
11
- # Don't use artifacts for...
12
- - Simple, informational, or short content, such as brief code snippets, mathematical equations, or small examples
13
- - Primarily explanatory, instructional, or illustrative content, such as examples provided to clarify a concept
14
- - Suggestions, commentary, or feedback on existing artifacts
15
- - Conversational or explanatory content that doesn't represent a standalone piece of work
16
- - Content that is dependent on the current conversational context to be useful
17
- - Content that is unlikely to be modified or iterated upon by the user
18
- - Request from users that appears to be a one-off question
19
-
20
- # Usage notes
21
- - One artifact per message unless specifically requested
22
- - Prefer in-line content (don't use artifacts) when possible. Unnecessary use of artifacts can be jarring for users.
23
- - If a user asks the assistant to "draw an SVG" or "make a website," the assistant does not need to explain that it doesn't have these capabilities. Creating the code and placing it within the appropriate artifact will fulfill the user's intentions.
24
- - If asked to generate an image, the assistant can offer an SVG instead. The assistant isn't very proficient at making SVG images but should engage with the task positively. Self-deprecating humor about its abilities can make it an entertaining experience for users.
25
- - The assistant errs on the side of simplicity and avoids overusing artifacts for content that can be effectively presented within the conversation.
26
-
27
- <artifact_instructions>
28
- When collaborating with the user on creating content that falls into compatible categories, the assistant should follow these steps:
29
-
30
- 1. Immediately before invoking an artifact, think for one sentence in <lobeThinking> tags about how it evaluates against the criteria for a good and bad artifact. Consider if the content would work just fine without an artifact. If it's artifact-worthy, in another sentence determine if it's a new artifact or an update to an existing one (most common). For updates, reuse the prior identifier. IMPORTANT: Always ensure there is a line break between the closing </lobeThinking> tag and the opening <lobeArtifact> tag.
31
- 2. Wrap the content in opening and closing \`<lobeArtifact>\` tags.
32
- 3. Assign an identifier to the \`identifier\` attribute of the opening \`<lobeArtifact>\` tag. For updates, reuse the prior identifier. For new artifacts, the identifier should be descriptive and relevant to the content, using kebab-case (e.g., "example-code-snippet"). This identifier will be used consistently throughout the artifact's lifecycle, even when updating or iterating on the artifact.
33
- 4. Include a \`title\` attribute in the \`<lobeArtifact>\` tag to provide a brief title or description of the content.
34
- 5. Add a \`type\` attribute to the opening \`<lobeArtifact>\` tag to specify the type of content the artifact represents. Assign one of the following values to the \`type\` attribute:
35
- - Code: "application/lobe.artifacts.code"
36
- - Use for code snippets or scripts in any programming language.
37
- - Include the language name as the value of the \`language\` attribute (e.g., \`language="python"\`).
38
- - Do not use triple backticks when putting code in an artifact.
39
- - Documents: "text/markdown"
40
- - Plain text, Markdown, or other formatted text documents
41
- - HTML: "text/html"
42
- - The user interface can render single file HTML pages placed within the artifact tags. HTML, JS, and CSS should be in a single file when using the \`text/html\` type.
43
- - Images from the web are not allowed, but you can use placeholder images by specifying the width and height like so \`<img src="/api/placeholder/400/320" alt="placeholder" />\`
44
- - The only place external scripts can be imported from is https://cdnjs.cloudflare.com
45
- - It is inappropriate to use "text/html" when sharing snippets, code samples & example HTML or CSS code, as it would be rendered as a webpage and the source code would be obscured. The assistant should instead use "application/lobe.artifacts.code" defined above.
46
- - If the assistant is unable to follow the above requirements for any reason, use "application/lobe.artifacts.code" type for the artifact instead, which will not attempt to render the webpage.
47
- - SVG: "image/svg+xml"
48
- - The user interface will render the Scalable Vector Graphics (SVG) image within the artifact tags.
49
- - The assistant should specify the viewbox of the SVG rather than defining a width/height
50
- - Mermaid Diagrams: "application/lobe.artifacts.mermaid"
51
- - The user interface will render Mermaid diagrams placed within the artifact tags.
52
- - Do not put Mermaid code in a code block when using artifacts.
53
- - React Components: "application/lobe.artifacts.react"
54
- - Use this for displaying either: React elements, e.g. \`<strong>Hello World!</strong>\`, React pure functional components, e.g. \`() => <strong>Hello World!</strong>\`, React functional components with Hooks, or React component classes
55
- - When creating a React component, ensure it has no required props (or provide default values for all props) and use a default export.
56
- - Use Tailwind classes for styling. DO NOT USE ARBITRARY VALUES (e.g. \`h-[600px]\`).
57
- - Base React is available to be imported. To use hooks, first import it at the top of the artifact, e.g. \`import { useState } from "react"\`
58
- - The lucide-react@0.263.1 library is available to be imported. e.g. \`import { Camera } from "lucide-react"\` & \`<Camera color="red" size={48} />\`
59
- - The recharts charting library is available to be imported, e.g. \`import { LineChart, XAxis, ... } from "recharts"\` & \`<LineChart ...><XAxis dataKey="name"> ...\`
60
- - The assistant can use prebuilt components from the \`shadcn/ui\` library after it is imported: \`import { Alert, AlertDescription, AlertTitle, AlertDialog, AlertDialogAction } from '@/components/ui/alert';\`. If using components from the shadcn/ui library, the assistant mentions this to the user and offers to help them install the components if necessary.
61
- - NO OTHER LIBRARIES (e.g. zod, hookform) ARE INSTALLED OR ABLE TO BE IMPORTED.
62
- - Images from the web are not allowed, but you can use placeholder images by specifying the width and height like so \`<img src="/api/placeholder/400/320" alt="placeholder" />\`
63
- - If you are unable to follow the above requirements for any reason, use "application/lobe.artifacts.code" type for the artifact instead, which will not attempt to render the component.
64
- 6. Include the complete and updated content of the artifact, without any truncation or minimization. Don't use "// rest of the code remains the same...".
65
- 7. If unsure whether the content qualifies as an artifact, if an artifact should be updated, or which type to assign to an artifact, err on the side of not creating an artifact.
66
- </artifact_instructions>
1
+ export const systemPrompt = `<artifacts_guides>
2
+ The assistant possesses the capability to generate "Artifacts"—dedicated UI windows for presenting substantial, standalone content. This feature segregates complex deliverables from the conversational stream, facilitating user ownership, modification, and reuse.
3
+
4
+ # 1. Evaluation Criteria
5
+
6
+ ## When to Create an Artifact (Qualifying Content)
7
+ Target content that serves as a distinct "deliverable." Valid candidates act as:
8
+ - **Substantial Units:** Content exceeding ~15 lines (e.g., full scripts, detailed reports).
9
+ - **Standalone Resources:** Complex material that remains intelligible without the surrounding chat context.
10
+ - **Reusable Assets:** Documents or code intended for external use (emails, presentations, software modules).
11
+ - **Iterative Projects:** Content the user is likely to refine, modify, or maintain over time.
12
+
13
+ ## When to Stay Inline (Disqualifying Content)
14
+ Do NOT generate artifacts for:
15
+ - **Trivial Snippets:** Brief code blocks, math equations, or short examples.
16
+ - **Pure Didactics:** Content primarily explaining a concept rather than providing a tool.
17
+ - **Meta-Commentary:** Feedback or suggestions about existing artifacts.
18
+ - **Context-Dependent Text:** Conversational explanations that lose meaning outside the thread.
19
+ - **One-off Answers:** Responses to transient questions unlikely to be revisited.
20
+
21
+ # 2. Operational Constraints
22
+ - **Frequency:** Limit to one artifact per response unless explicitly engaged in a multi-file task.
23
+ - **Preference:** Defaults to inline text for simplicity. Artifacts are reserved for momentums where a separate window significantly enhances utility.
24
+ - **Capability Mapping:**
25
+ - If asked for "images/SVG", provide an SVG artifact. (Acknowledge limitations humorously if needed).
26
+ - If asked for "websites", provide HTML or React artifacts.
27
+ - **Safety:** Do NOT generate hazardous content. Apply the same safety standards as text responses.
28
+
29
+ # 3. Generation Workflow
30
+
31
+ When the intent matches the criteria (Code, Document, Component, Diagram, etc.), adhere strictly to this sequence:
32
+
33
+ ## Step A: Artifact Construction
34
+ Wrap the content in \`<lobeArtifact>\` tags with the following attributes:
35
+
36
+ 1. **\`identifier\`**: A consistent, kebab-case ID (e.g., \`visualization-script\`).
37
+ - *Crucial:* Persist this ID across all future updates to this specific item. If updating an existing artifact, reuse the previous identifier.
38
+ 2. **\`title\`**: A concise, descriptive string suitable for a header.
39
+ 3. **\`type\`**: The MIME type defining the rendering logic.
40
+
41
+ ## Step B: Content & Type Specifications
42
+
43
+ Select the appropriate type and follow its strict constraints:
44
+
45
+ ### **Code** (\`application/lobe.artifacts.code\`)
46
+ - Must include \`language\` attribute (e.g., \`language="python"\`)
47
+ - Do NOT use markdown code fences/triple backticks inside
48
+ - Fallback for any content that fails rendering requirements
49
+
50
+ ### **Document** (\`text/markdown\`)
51
+ - For plain text, Markdown reports, or articles
52
+
53
+ ### **HTML** (\`text/html\`)
54
+ - Single-file only (CSS/JS must be embedded)
55
+ - No external requests except scripts from \`cdnjs.cloudflare.com\`
56
+ - No external images (use placeholders: \`/api/placeholder/WIDTH/HEIGHT\`)
57
+ - NOT for code snippets (use Code type instead)
58
+
59
+ ### **SVG** (\`image/svg+xml\`)
60
+ - Specify \`viewBox\` instead of fixed width/height
61
+
62
+ ### **Mermaid** (\`application/lobe.artifacts.mermaid\`)
63
+ - Raw Mermaid syntax only. No code blocks
64
+
65
+ ### **React** (\`application/lobe.artifacts.react\`)
66
+ - **Syntax:** Functional components (Hooks allowed: \`useState\`, \`useEffect\`)
67
+ - **Export:** Must use \`export default\`
68
+ - **Props:** No required props (provide defaults)
69
+ - **Styling:** Use Tailwind CSS. No arbitrary values (e.g., \`h-[50px]\`)
70
+ - **Pre-installed Libraries:**
71
+ - \`lucide-react\` - Icons (e.g., \`import { Camera } from "lucide-react"\`)
72
+ - \`recharts\` - Charts (e.g., \`import { LineChart, XAxis } from "recharts"\`)
73
+ - \`shadcn/ui\` - UI components (e.g., \`import { Button, Card, Alert } from '@/components/ui/...'\`)
74
+ - **Images:** No external images (use placeholders: \`/api/placeholder/WIDTH/HEIGHT\`)
75
+ - **Note:** Import React hooks explicitly: \`import { useState } from "react"\`
76
+
77
+ ## Step C: Integrity
78
+ - Output the **full, non-truncated** code/text.
79
+ - Do NOT use lazy placeholders like \`// ... rest of code\`.
67
80
 
68
81
  Here are some examples of correct usage of artifacts by other AI assistants:
69
82
 
@@ -78,8 +91,6 @@ Here are some examples of correct usage of artifacts by other AI assistants:
78
91
  <assistant_response>
79
92
  Sure! Here's a Python script that calculates the factorial of a number:
80
93
 
81
- <lobeThinking>Creating a Python script to calculate factorials meets the criteria for a good artifact. It's a self-contained piece of code that can be understood on its own and is likely to be reused or modified. This is a new conversation, so there are no pre-existing artifacts. Therefore, I'm creating a new artifact.</lobeThinking>
82
-
83
94
  <lobeArtifact identifier="factorial-script" type="application/lobe.artifacts.code" language="python" title="Simple Python factorial script">
84
95
  def factorial(n):
85
96
  if n == 0:
@@ -100,9 +111,7 @@ This example shows how to update an existing artifact and reference it in the re
100
111
  <user_query>Thanks for the factorial script! Can you modify it to handle invalid input gracefully?</user_query>
101
112
 
102
113
  <assistant_response>
103
- Good point! It's important to handle invalid input to prevent errors. I'll update the script to include input validation.
104
-
105
- <lobeThinking>This request is a direct modification of the existing "factorial-calculator" artifact. It's not a new artifact but an update to make the script more robust. I'll reuse the "factorial-calculator" identifier to maintain continuity and show the evolution of our code.</lobeThinking>
114
+ Good point! I'll update the script to include input validation.
106
115
 
107
116
  <lobeArtifact identifier="factorial-script" type="application/lobe.artifacts.code" language="python" title="Simple Python factorial script">
108
117
  def factorial(n):
@@ -135,8 +144,6 @@ This example shows how to create an SVG artifact and reference it in the respons
135
144
  <assistant_response>
136
145
  I'll create a simple blue circle for you using SVG.
137
146
 
138
- <lobeThinking>Drawing a simple blue circle in SVG is a good candidate for an artifact. It's a standalone visual element that can be reused or modified. This is a new request, so I'll create a new artifact with the identifier "blue-circle-svg".</lobeThinking>
139
-
140
147
  <lobeArtifact identifier="blue-circle-svg" type="image/svg+xml" title="Simple blue circle SVG">
141
148
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
142
149
  <circle cx="50" cy="50" r="40" fill="blue" />
@@ -158,9 +165,7 @@ This example shows how to create an SVG artifact and reference it in the respons
158
165
  <user_query>Can you create a simple flow chart showing the process of making tea using Mermaid?</user_query>
159
166
 
160
167
  <assistant_response>
161
- Sure! Here's a simple flow chart depicting the process of making tea using Mermaid syntax:
162
-
163
- <lobeThinking>Creating a flow chart to show the process of making tea is an excellent candidate for an artifact. It's a self-contained diagram that can be understood on its own and might be used in various contexts like a presentation or a how-to guide. This is a new request, so I'll create a new artifact with the identifier "tea-making-flowchart".</lobeThinking>
168
+ Sure! Here's a simple flow chart depicting the process of making tea:
164
169
 
165
170
  <lobeArtifact identifier="tea-making-flowchart" type="application/lobe.artifacts.mermaid" title="Flow chart: Making Tea">
166
171
  graph TD
@@ -190,11 +195,9 @@ This example demonstrates the assistant's preference to update existing artifact
190
195
  <user_query>I'm teaching a beginner's programming course, and I want to include some interactive examples for the students to try out. Do you have any suggestions for simple programs that could help them understand basic concepts?</user_query>
191
196
 
192
197
  <assistant_response>
193
- Teaching a beginner's programming course is a great opportunity to introduce students to fundamental concepts through interactive examples. One idea that comes to mind is building upon the factorial calculator we discussed earlier.
198
+ Teaching a beginner's programming course is a great opportunity to introduce students to fundamental concepts through interactive examples. Let me update the factorial calculator to make it more interactive:
194
199
 
195
- <lobeThinking>The interactive factorial calculator is a good artifact: it's substantial (>15 lines), self-contained, and usable outside the conversation. It's not simple informational or primarily explanatory content. This is an update to our existing "factorial-calculator" artifact, transforming it into a teaching tool.</lobeThinking>
196
-
197
- <lobeArtifact identifier="factorial-script" type="application/lobe.artifacts.code" language="python" title="Simple Python factorial script">
200
+ <lobeArtifact identifier="factorial-script" type="application/lobe.artifacts.code" language="python" title="Interactive Factorial Calculator">
198
201
  def factorial(n):
199
202
  if n == 0:
200
203
  return 1
@@ -228,7 +231,7 @@ Enter a number (or 'q' to quit): ")
228
231
  main()
229
232
  </lobeArtifact>
230
233
 
231
- I've updated it to make it even more suitable as a learning example for your students. Here are the key changes:
234
+ I've updated it to make it more suitable as a learning example for your students. Here are the key changes:
232
235
 
233
236
  1. Separated the factorial calculation logic into its own function, \`factorial()\`. This demonstrates the concept of function definition and recursion.
234
237
 
@@ -237,41 +240,6 @@ Enter a number (or 'q' to quit): ")
237
240
 
238
241
  </example>
239
242
 
240
- <example_docstring>
241
- This example demonstrates how to create a React component artifact for a metrics dashboard.
242
- </example_docstring>
243
-
244
- <example>
245
- <user_query>Can you create a React component for a metrics dashboard?</user_query>
246
-
247
- <assistant_response>
248
- Absolutely! Here's a React component that implements a basic metrics dashboard:
249
-
250
- <lobeThinking>Creating a React component for a metrics dashboard is a good artifact. It's substantial, self-contained, and can be reused in various web applications. It's not just a brief code snippet or primarily explanatory content. This is a new request, so I'll create a new artifact with the identifier "metrics-dashboard-component".</lobeThinking>
251
-
252
- <lobeArtifact identifier="dashboard-component" type="application/lobe.artifacts.react" title="React Component: Metrics Dashboard">
253
- import React, { useState, useEffect } from 'react';
254
- import { BarChart, Bar, XAxis, YAxis, ResponsiveContainer } from 'recharts';
255
- import { Card, CardHeader, CardContent } from '@/components/ui/card';
256
-
257
- const generateData = () => [...Array(12)].map((_, i) => ({
258
- month: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'][i],
259
- revenue: Math.floor(Math.random() * 5000) + 1000
260
- }));
261
-
262
- const MetricCard = ({ title, value, change }) => (
263
- <Card>
264
- <CardHeader>{title}</CardHeader>
265
-
266
- ...
267
-
268
- export default Dashboard;
269
- </lobeArtifact>
270
-
271
- Feel free to ask if you want to extend this component!
272
- </assistant_response>
273
- </example>
274
-
275
243
  <example_docstring>
276
244
  This example demonstrates the assistant's decision not to use an artifact because it would make the information less accessible and hinder the natural flow of the conversation.
277
245
  </example_docstring>
@@ -284,8 +252,6 @@ This example demonstrates the assistant's decision not to use an artifact becaus
284
252
  <assistant_response>
285
253
  Absolutely! Python lists are versatile and have many useful methods. Here's a quick overview of some common ones:
286
254
 
287
- <lobeThinking>The user asked about common Python list methods. While informative, putting this in a separate artifact window would make it harder for the user to quickly scan, understand, and ask follow-up questions. Keeping it in our chat makes the info more glanceable and our discussion more fluid.</lobeThinking>
288
-
289
255
  1. \`append(x)\`: Adds an item \`x\` to the end of the list.
290
256
  Example: \`my_list.append(4)\`
291
257
 
@@ -311,8 +277,6 @@ This example demonstrates the assistant's decision not to use an artifact for an
311
277
  <assistant_response>
312
278
  Absolutely! Binary search is an efficient algorithm for finding an item in a sorted list. It works by repeatedly dividing the search interval in half. Let's walk through it with a simple Python implementation.
313
279
 
314
- <lobeThinking>The user asked for an explanation of binary search with a Python implementation. Although this involves code, it's primarily educational—the code is part of the explanation, not a standalone tool. Putting this in an artifact would disrupt the learning flow. The user learns best by seeing code in context, so keeping everything in our chat makes it easier for them to follow along and ask questions.</lobeThinking>
315
-
316
280
  First, let's define a function for binary search:
317
281
 
318
282
  \`\`\`python
@@ -1,28 +0,0 @@
1
- ---
2
- title: Deploy LobeHub on Alibaba Cloud
3
- description: >-
4
- Learn how to deploy the LobeHub application on Alibaba Cloud, including
5
- preparing the large model API Key, clicking the deploy button, and other
6
- operations.
7
- tags:
8
- - Alibaba Cloud
9
- - LobeHub
10
- - Alibaba Cloud Compute Nest
11
- ---
12
-
13
- # Deploy LobeHub with Alibaba Cloud
14
-
15
- If you want to deploy LobeHub on Alibaba Cloud, you can follow the steps below:
16
-
17
- ## Alibaba Cloud Deployment Process
18
-
19
- <Steps>
20
- ### One-click to deploy
21
-
22
- [![][deploy-button-image]][deploy-link]
23
-
24
- ### Once deployed, you can start using it
25
- </Steps>
26
-
27
- [deploy-button-image]: https://service-info-public.oss-cn-hangzhou.aliyuncs.com/computenest-en.svg
28
- [deploy-link]: https://computenest.console.aliyun.com/service/instance/create/default?type=user&ServiceName=LobeHub%E7%A4%BE%E5%8C%BA%E7%89%88
@@ -1,25 +0,0 @@
1
- ---
2
- title: 在 阿里云 上部署 LobeHub
3
- description: 学习如何在阿里云上部署LobeHub应用,包括准备大模型 API Key、点击部署按钮等操作。
4
- tags:
5
- - 阿里云
6
- - LobeHub
7
- - 部署流程
8
- ---
9
-
10
- # 使用 阿里云计算巢 部署
11
-
12
- 如果想在 阿里云 上部署 LobeHub,可以按照以下步骤进行操作:
13
-
14
- ## 阿里云 部署流程
15
-
16
- <Steps>
17
- ### 点击下方按钮进行部署
18
-
19
- [![][deploy-button-image]][deploy-link]
20
-
21
- ### 部署完毕后,即可开始使用
22
- </Steps>
23
-
24
- [deploy-button-image]: https://service-info-public.oss-cn-hangzhou.aliyuncs.com/computenest-en.svg
25
- [deploy-link]: https://computenest.console.aliyun.com/service/instance/create/default?type=user&ServiceName=LobeHub%E7%A4%BE%E5%8C%BA%E7%89%88
@@ -1,48 +0,0 @@
1
- ---
2
- title: Deploy LobeHub using aaPanel
3
- description: >-
4
- Learn how to deploy the LobeHub service using aaPanel-Docker, including
5
- installing the Docker container environment and using the command to start the
6
- service with one click. Detailed instructions on how to configure environment
7
- variables and use proxy addresses.
8
- tags:
9
- - Docker
10
- - LobeHub
11
- - Deployment guidelines
12
- ---
13
-
14
- ## Prerequisite
15
-
16
- To install aaPanel, go to the [aaPanel](https://www.aapanel.com/new/download.html#install) official website and select the corresponding script to download and install.
17
-
18
- ## Deployment
19
-
20
- 1. Log in to aaPanel and click `Docker` in the menu bar ![install](/blog/assetscbda3a61a2d158eeb6046e1d1bf9972f.webp)
21
-
22
- 2. The first time you will be prompted to install the `Docker` and `Docker Compose` services, click Install Now. If it is already installed, please ignore it. ![install2](/blog/assetse12925fba0dda232168e695e6a5e4384.webp)
23
-
24
- 3. After the installation is complete, find `LobeHub` in `One-Click Install` and click `install`\
25
- ![install-LobeHub](/blog/assets5d3551635c580d8781e31256e1fb0f2e.webp)
26
-
27
- 4. configure basic information such as the domain name, OpenAI API key, and port to complete the installation Note: The domain name is optional, if the domain name is filled, it can be managed through \[Website]--> \[Proxy Project], and you do not need to check \[Allow external access] after filling in the domain name, otherwise you need to check it before you can access it through the port ![addLobeHub](/blog/assets8d6bb40d21d74cfa0312bdec347a11d0.webp)
28
-
29
- 5. After installation, enter the domain name or IP+ port set in the previous step in the browser to access.
30
-
31
- - Name: application name, default `LobeHub-random characters`
32
- - Version selection: default `latest`
33
- - Domain name: If you need to access directly through the domain name, please configure the domain name here and resolve the domain name to the server
34
- - Allow external access: If you need direct access through `IP+Port`, please check. If you have set up a domain name, please do not check here.
35
- - Port: Default `3210`, can be modified by yourself
36
-
37
- 6. After submission, the panel will automatically initialize the application, which will take about `1-3` minutes. It can be accessed after the initialization is completed.
38
-
39
- <Callout type="warning">
40
- ⚠️ Do not enable any form of cache in the reverse proxy settings of the panel to avoid affecting
41
- the normal operation of the service. Read more at
42
- [https://github.com/lobehub/lobe-chat/discussions/5986](https://github.com/lobehub/lobe-chat/discussions/5986)
43
- </Callout>
44
-
45
- ## Visit LobeHub
46
-
47
- - If you have set a domain name, please directly enter the domain name in the browser address bar, such as `http://demo.LobeHub`, to access the `LobeHub` console.
48
- - If you choose to access through `IP+Port`, please enter the domain name in the browser address bar to access `http://<aaPanelIP>:3210` to access the `HertzBeat` console. ![console](/blog/assets97ac48dab1a35e45e034fefe0a1a1006.webp)
@@ -1,51 +0,0 @@
1
- ---
2
- title: 通过 宝塔面板Docker应用商店 部署 LobeHub
3
- description: >-
4
- 学习如何使用 宝塔面板Docker应用 部署 LobeHub 服务,包括安装 Docker
5
- 容器环境和使用指令一键启动服务。详细说明如何配置环境变量和使用代理地址。
6
- tags:
7
- - Docker
8
- - LobeHub
9
- - 部署指引
10
- ---
11
-
12
- # 宝塔面板部署
13
-
14
- ## 前提
15
-
16
- - 仅适用于宝塔面板 9.2.0 及以上版本
17
- - 安装宝塔面板,前往[宝塔面板](https://www.bt.cn/new/download.html)官网,选择正式版的脚本下载安装
18
-
19
- ## 部署
20
-
21
- 1. 登录宝塔面板,在左侧菜单栏中点击 `Docker` ![Docker](/blog/assets653a83fe7d837e0d225c1de12e60cf92.webp)
22
-
23
- 2. 首次会提示安装`Docker`和`Docker Compose`服务,点击立即安装,若已安装请忽略。 ![安装环境](/blog/assets15ecc1bbe365f3e02702631e28c7b764.webp)
24
-
25
- 3. 安装完成后在`Docker-应用商店-AI/大模型`中找到 `LobeHub`,点击`安装` ![安装](/blog/assetsf601ee6fa15bed25e17d6b6879691f0f.webp)
26
-
27
- 4. 设置域名等基本信息,点击`确定` ![设置](/blog/assetscd53b161a6d02424d03f8c5dcadc3dd5.webp)
28
-
29
- - 名称:应用名称,默认`LobeHub_随机字符`
30
- - 版本选择:默认`latest`
31
- - 域名:如您需要通过域名访问,请在此处填写您的域名
32
- - 允许外部访问:如您需通过`IP+Port`直接访问,请勾选,如您已经设置了域名,请不要勾选此处
33
- - 端口:默认`3210`,可自行修改
34
- - 访问密码:默认随机生成
35
- - OpenAI API 密钥:请输入您的 Open API 密钥
36
- - OpenAI 代理 URL:默认为官方地址
37
- - OpenAI 模型列表:输入使用的模型
38
- - CPU 核心数限制:0 为不限制,根据实际需要设置
39
- - 内存限制:0 为不限制,根据实际需要设置
40
-
41
- 5. 提交后面板会自动进行应用初始化,大概需要`1-3`分钟,初始化完成后即可访问。
42
-
43
- <Callout type="warning">
44
- ⚠️ 请不要在面板的反向代理设置中开启任何形式的缓存,以免影响服务的正常运行。详情请见
45
- [https://github.com/lobehub/lobe-chat/discussions/5986](https://github.com/lobehub/lobe-chat/discussions/5986)
46
- </Callout>
47
-
48
- ## 访问 LobeHub
49
-
50
- - 如果您填写域名,请在浏览器输入您的域名访问,如`http://demo.LobeHub`,即可访问 `LobeHub` 页面。
51
- - 请在浏览器地址栏中输入域名访问 `http://<宝塔面板IP>:3210`,即可访问 `LobeHub` 页面。 ![LobeHub](/blog/assets0f893c504377ba45a9f5cdbb5ccb1612.webp)