dsh-plugin-image-workbench 1.1.5 → 1.1.6

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 (172) hide show
  1. package/LICENSE +21 -21
  2. package/README.en.md +5 -3
  3. package/README.md +7 -3
  4. package/client.js +241 -241
  5. package/cordis.patch.yml +14 -14
  6. package/host.js +51 -0
  7. package/install.mjs +333 -387
  8. package/package.json +3 -2
  9. package/scripts/fetch-style-images.mjs +104 -0
  10. package/scripts/vendor-snapshot.py +154 -154
  11. package/server/access.py +26 -26
  12. package/server/app.py +1329 -1329
  13. package/server/catalog.py +147 -147
  14. package/server/composer.py +391 -391
  15. package/server/drafts.py +158 -158
  16. package/server/history.py +575 -575
  17. package/server/imaging.py +172 -172
  18. package/server/pool.py +1335 -1335
  19. package/server/pool_admin.py +921 -921
  20. package/server/pool_service.py +1073 -1073
  21. package/server/requirements.txt +6 -6
  22. package/server/smoke_check.py +402 -402
  23. package/server/static/access.html +202 -202
  24. package/vendor/chatgpt2api/source/.env.example +82 -82
  25. package/vendor/chatgpt2api/source/.python-version +1 -1
  26. package/vendor/chatgpt2api/source/LICENSE +21 -21
  27. package/vendor/chatgpt2api/source/README.md +391 -391
  28. package/vendor/chatgpt2api/source/VERSION +1 -1
  29. package/vendor/chatgpt2api/source/api/__init__.py +2 -2
  30. package/vendor/chatgpt2api/source/api/accounts.py +537 -537
  31. package/vendor/chatgpt2api/source/api/ai.py +217 -217
  32. package/vendor/chatgpt2api/source/api/app.py +62 -62
  33. package/vendor/chatgpt2api/source/api/errors.py +46 -46
  34. package/vendor/chatgpt2api/source/api/image_inputs.py +309 -309
  35. package/vendor/chatgpt2api/source/api/image_tasks.py +120 -120
  36. package/vendor/chatgpt2api/source/api/support.py +134 -134
  37. package/vendor/chatgpt2api/source/api/system.py +365 -365
  38. package/vendor/chatgpt2api/source/assets/kunrouai.svg +50 -50
  39. package/vendor/chatgpt2api/source/config.default.json +108 -108
  40. package/vendor/chatgpt2api/source/main.py +9 -9
  41. package/vendor/chatgpt2api/source/pyproject.toml +27 -27
  42. package/vendor/chatgpt2api/source/scripts/init_proxy_config.py +186 -186
  43. package/vendor/chatgpt2api/source/scripts/migrate_storage.py +163 -163
  44. package/vendor/chatgpt2api/source/scripts/privoxy-warp.conf +13 -13
  45. package/vendor/chatgpt2api/source/scripts/test_outlook_token_mailbox.py +385 -385
  46. package/vendor/chatgpt2api/source/scripts/test_storage.py +129 -129
  47. package/vendor/chatgpt2api/source/scripts/verify_oauth_refresh.py +92 -92
  48. package/vendor/chatgpt2api/source/services/account_service.py +1757 -1757
  49. package/vendor/chatgpt2api/source/services/auth_service.py +253 -253
  50. package/vendor/chatgpt2api/source/services/backup_service.py +671 -671
  51. package/vendor/chatgpt2api/source/services/config.py +667 -667
  52. package/vendor/chatgpt2api/source/services/content_filter.py +242 -242
  53. package/vendor/chatgpt2api/source/services/cpa_service.py +315 -315
  54. package/vendor/chatgpt2api/source/services/editable_file_task_service.py +260 -260
  55. package/vendor/chatgpt2api/source/services/image_service.py +376 -376
  56. package/vendor/chatgpt2api/source/services/image_storage_service.py +405 -405
  57. package/vendor/chatgpt2api/source/services/image_tags_service.py +76 -76
  58. package/vendor/chatgpt2api/source/services/image_task_service.py +550 -550
  59. package/vendor/chatgpt2api/source/services/log_service.py +337 -337
  60. package/vendor/chatgpt2api/source/services/model_service.py +182 -182
  61. package/vendor/chatgpt2api/source/services/oauth_login_service.py +267 -267
  62. package/vendor/chatgpt2api/source/services/openai_backend_api.py +2763 -2763
  63. package/vendor/chatgpt2api/source/services/openai_oauth.py +32 -32
  64. package/vendor/chatgpt2api/source/services/protocol/__init__.py +2 -2
  65. package/vendor/chatgpt2api/source/services/protocol/anthropic_v1_messages.py +307 -307
  66. package/vendor/chatgpt2api/source/services/protocol/chat_completion_cache.py +238 -238
  67. package/vendor/chatgpt2api/source/services/protocol/conversation.py +1644 -1644
  68. package/vendor/chatgpt2api/source/services/protocol/error_response.py +124 -124
  69. package/vendor/chatgpt2api/source/services/protocol/openai_search.py +19 -19
  70. package/vendor/chatgpt2api/source/services/protocol/openai_v1_chat_complete.py +316 -316
  71. package/vendor/chatgpt2api/source/services/protocol/openai_v1_image_edit.py +86 -86
  72. package/vendor/chatgpt2api/source/services/protocol/openai_v1_image_generations.py +42 -42
  73. package/vendor/chatgpt2api/source/services/protocol/openai_v1_models.py +53 -53
  74. package/vendor/chatgpt2api/source/services/protocol/openai_v1_response.py +453 -453
  75. package/vendor/chatgpt2api/source/services/protocol/web_search_tool.py +160 -160
  76. package/vendor/chatgpt2api/source/services/proxy_service.py +648 -648
  77. package/vendor/chatgpt2api/source/services/storage/__init__.py +5 -5
  78. package/vendor/chatgpt2api/source/services/storage/base.py +38 -38
  79. package/vendor/chatgpt2api/source/services/storage/database_storage.py +194 -194
  80. package/vendor/chatgpt2api/source/services/storage/factory.py +104 -104
  81. package/vendor/chatgpt2api/source/services/storage/git_storage.py +183 -183
  82. package/vendor/chatgpt2api/source/services/storage/json_storage.py +95 -95
  83. package/vendor/chatgpt2api/source/services/sub2api_service.py +531 -531
  84. package/vendor/chatgpt2api/source/utils/helper.py +469 -469
  85. package/vendor/chatgpt2api/source/utils/image_tokens.py +346 -346
  86. package/vendor/chatgpt2api/source/utils/log.py +110 -110
  87. package/vendor/chatgpt2api/source/utils/pkce.py +19 -19
  88. package/vendor/chatgpt2api/source/utils/pow.py +207 -207
  89. package/vendor/chatgpt2api/source/utils/sentinel.py +159 -159
  90. package/vendor/chatgpt2api/source/utils/turnstile.py +184 -184
  91. package/vendor/chatgpt2api/source/uv.lock +904 -904
  92. package/vendor/chatgpt2api/source/web/bun.lock +1501 -1501
  93. package/vendor/chatgpt2api/source/web/components.json +24 -24
  94. package/vendor/chatgpt2api/source/web/eslint.config.mjs +17 -17
  95. package/vendor/chatgpt2api/source/web/next.config.ts +40 -40
  96. package/vendor/chatgpt2api/source/web/package.json +58 -58
  97. package/vendor/chatgpt2api/source/web/postcss.config.mjs +5 -5
  98. package/vendor/chatgpt2api/source/web/src/app/accounts/components/account-import-dialog.tsx +925 -925
  99. package/vendor/chatgpt2api/source/web/src/app/accounts/page.tsx +1307 -1307
  100. package/vendor/chatgpt2api/source/web/src/app/debug/components/chat-panel.tsx +224 -224
  101. package/vendor/chatgpt2api/source/web/src/app/debug/components/editable-file-panel.tsx +444 -444
  102. package/vendor/chatgpt2api/source/web/src/app/debug/components/ppt-panel.tsx +9 -9
  103. package/vendor/chatgpt2api/source/web/src/app/debug/components/psd-panel.tsx +9 -9
  104. package/vendor/chatgpt2api/source/web/src/app/debug/components/search-panel.tsx +172 -172
  105. package/vendor/chatgpt2api/source/web/src/app/debug/components/skill-panel.tsx +169 -169
  106. package/vendor/chatgpt2api/source/web/src/app/debug/components/types.ts +39 -39
  107. package/vendor/chatgpt2api/source/web/src/app/debug/page.tsx +59 -59
  108. package/vendor/chatgpt2api/source/web/src/app/globals.css +230 -230
  109. package/vendor/chatgpt2api/source/web/src/app/image/components/image-composer.tsx +542 -542
  110. package/vendor/chatgpt2api/source/web/src/app/image/components/image-results.tsx +554 -554
  111. package/vendor/chatgpt2api/source/web/src/app/image/components/image-sidebar.tsx +176 -176
  112. package/vendor/chatgpt2api/source/web/src/app/image/page.tsx +1799 -1799
  113. package/vendor/chatgpt2api/source/web/src/app/image-manager/page.tsx +732 -732
  114. package/vendor/chatgpt2api/source/web/src/app/layout.tsx +50 -50
  115. package/vendor/chatgpt2api/source/web/src/app/login/page.tsx +101 -101
  116. package/vendor/chatgpt2api/source/web/src/app/logs/page.tsx +356 -356
  117. package/vendor/chatgpt2api/source/web/src/app/page.tsx +30 -30
  118. package/vendor/chatgpt2api/source/web/src/app/settings/components/api-docs-card.tsx +341 -341
  119. package/vendor/chatgpt2api/source/web/src/app/settings/components/backup-settings-card.tsx +447 -447
  120. package/vendor/chatgpt2api/source/web/src/app/settings/components/base-url-card.tsx +71 -71
  121. package/vendor/chatgpt2api/source/web/src/app/settings/components/config-card.tsx +491 -491
  122. package/vendor/chatgpt2api/source/web/src/app/settings/components/cpa-pool-dialog.tsx +108 -108
  123. package/vendor/chatgpt2api/source/web/src/app/settings/components/cpa-pools-card.tsx +169 -169
  124. package/vendor/chatgpt2api/source/web/src/app/settings/components/import-browser-dialog.tsx +185 -185
  125. package/vendor/chatgpt2api/source/web/src/app/settings/components/proxy-runtime-card.tsx +379 -379
  126. package/vendor/chatgpt2api/source/web/src/app/settings/components/proxy-settings-card.tsx +127 -127
  127. package/vendor/chatgpt2api/source/web/src/app/settings/components/proxy-settings.tsx +200 -200
  128. package/vendor/chatgpt2api/source/web/src/app/settings/components/settings-header.tsx +12 -12
  129. package/vendor/chatgpt2api/source/web/src/app/settings/components/sub2api-connections.tsx +886 -886
  130. package/vendor/chatgpt2api/source/web/src/app/settings/components/third-party-apps-card.tsx +81 -81
  131. package/vendor/chatgpt2api/source/web/src/app/settings/components/user-keys-card.tsx +422 -422
  132. package/vendor/chatgpt2api/source/web/src/app/settings/page.tsx +135 -135
  133. package/vendor/chatgpt2api/source/web/src/app/settings/store.ts +1069 -1069
  134. package/vendor/chatgpt2api/source/web/src/components/date-range-filter.tsx +49 -49
  135. package/vendor/chatgpt2api/source/web/src/components/header-actions.tsx +24 -24
  136. package/vendor/chatgpt2api/source/web/src/components/image-lightbox.tsx +434 -434
  137. package/vendor/chatgpt2api/source/web/src/components/image-thumbnail.tsx +46 -46
  138. package/vendor/chatgpt2api/source/web/src/components/theme-script.tsx +18 -18
  139. package/vendor/chatgpt2api/source/web/src/components/theme-toggle.tsx +14 -14
  140. package/vendor/chatgpt2api/source/web/src/components/top-nav.tsx +263 -263
  141. package/vendor/chatgpt2api/source/web/src/components/ui/animated-theme-toggler.tsx +256 -256
  142. package/vendor/chatgpt2api/source/web/src/components/ui/badge.tsx +41 -41
  143. package/vendor/chatgpt2api/source/web/src/components/ui/button.tsx +59 -59
  144. package/vendor/chatgpt2api/source/web/src/components/ui/calendar.tsx +46 -46
  145. package/vendor/chatgpt2api/source/web/src/components/ui/card.tsx +61 -61
  146. package/vendor/chatgpt2api/source/web/src/components/ui/checkbox.tsx +27 -27
  147. package/vendor/chatgpt2api/source/web/src/components/ui/dia-text-reveal.tsx +267 -267
  148. package/vendor/chatgpt2api/source/web/src/components/ui/dialog.tsx +132 -132
  149. package/vendor/chatgpt2api/source/web/src/components/ui/field.tsx +13 -13
  150. package/vendor/chatgpt2api/source/web/src/components/ui/input.tsx +19 -19
  151. package/vendor/chatgpt2api/source/web/src/components/ui/label.tsx +24 -24
  152. package/vendor/chatgpt2api/source/web/src/components/ui/morphing-text.tsx +149 -149
  153. package/vendor/chatgpt2api/source/web/src/components/ui/popover.tsx +38 -38
  154. package/vendor/chatgpt2api/source/web/src/components/ui/select.tsx +175 -175
  155. package/vendor/chatgpt2api/source/web/src/components/ui/sheet.tsx +143 -143
  156. package/vendor/chatgpt2api/source/web/src/components/ui/table.tsx +29 -29
  157. package/vendor/chatgpt2api/source/web/src/components/ui/tabs.tsx +91 -91
  158. package/vendor/chatgpt2api/source/web/src/components/ui/text-3d-flip.tsx +269 -269
  159. package/vendor/chatgpt2api/source/web/src/components/ui/textarea.tsx +18 -18
  160. package/vendor/chatgpt2api/source/web/src/components/version-release-dialog.tsx +127 -127
  161. package/vendor/chatgpt2api/source/web/src/constants/common-env.ts +6 -6
  162. package/vendor/chatgpt2api/source/web/src/hooks/use-version-check.ts +85 -85
  163. package/vendor/chatgpt2api/source/web/src/lib/api.ts +926 -926
  164. package/vendor/chatgpt2api/source/web/src/lib/auth-session.ts +26 -26
  165. package/vendor/chatgpt2api/source/web/src/lib/release.ts +25 -25
  166. package/vendor/chatgpt2api/source/web/src/lib/request.ts +93 -93
  167. package/vendor/chatgpt2api/source/web/src/lib/use-auth-guard.ts +89 -89
  168. package/vendor/chatgpt2api/source/web/src/lib/utils.ts +6 -6
  169. package/vendor/chatgpt2api/source/web/src/store/auth.ts +112 -112
  170. package/vendor/chatgpt2api/source/web/src/store/editable-file-history.ts +33 -33
  171. package/vendor/chatgpt2api/source/web/src/store/image-conversations.ts +318 -318
  172. package/vendor/chatgpt2api/source/web/tsconfig.json +42 -42
@@ -1,9 +1,9 @@
1
- "use client";
2
-
3
- import { EditableFilePanel } from "./editable-file-panel";
4
-
5
- const defaultPrompt = "需要制作一份《2026年Q2 电商运营工作汇报》PPT,用于公司管理层季度会议汇报,整体页数控制在 8 页以内,风格偏商务科技感。重点体现销售增长、用户增长、广告投放效果以及618活动成果,并通过折线图、柱状图、环形图、漏斗图呈现。";
6
-
7
- export function PptPanel() {
8
- return <EditableFilePanel title="PPT生成" kind="ppt" endpoint="/v1/ppt/generations" defaultPrompt={defaultPrompt} />;
9
- }
1
+ "use client";
2
+
3
+ import { EditableFilePanel } from "./editable-file-panel";
4
+
5
+ const defaultPrompt = "需要制作一份《2026年Q2 电商运营工作汇报》PPT,用于公司管理层季度会议汇报,整体页数控制在 8 页以内,风格偏商务科技感。重点体现销售增长、用户增长、广告投放效果以及618活动成果,并通过折线图、柱状图、环形图、漏斗图呈现。";
6
+
7
+ export function PptPanel() {
8
+ return <EditableFilePanel title="PPT生成" kind="ppt" endpoint="/v1/ppt/generations" defaultPrompt={defaultPrompt} />;
9
+ }
@@ -1,9 +1,9 @@
1
- "use client";
2
-
3
- import { EditableFilePanel } from "./editable-file-panel";
4
-
5
- const defaultPrompt = "按原图位置拆分海报元素并合成可编辑 PSD,保留背景和每个元素图层位置,同时输出每个图层素材 zip。";
6
-
7
- export function PsdPanel() {
8
- return <EditableFilePanel title="PSD生成" kind="psd" endpoint="/v1/psd/generations" defaultPrompt={defaultPrompt} imageRequired />;
9
- }
1
+ "use client";
2
+
3
+ import { EditableFilePanel } from "./editable-file-panel";
4
+
5
+ const defaultPrompt = "按原图位置拆分海报元素并合成可编辑 PSD,保留背景和每个元素图层位置,同时输出每个图层素材 zip。";
6
+
7
+ export function PsdPanel() {
8
+ return <EditableFilePanel title="PSD生成" kind="psd" endpoint="/v1/psd/generations" defaultPrompt={defaultPrompt} imageRequired />;
9
+ }
@@ -1,172 +1,172 @@
1
- "use client";
2
-
3
- import { useEffect, useState } from "react";
4
- import { ExternalLink, Globe2, LoaderCircle, Search } from "lucide-react";
5
- import ReactMarkdown from "react-markdown";
6
- import remarkGfm from "remark-gfm";
7
-
8
- import { httpRequest } from "@/lib/request";
9
- import { cn } from "@/lib/utils";
10
-
11
- import type { SearchResult } from "./types";
12
-
13
- const normalizeMarkdown = (text: string) =>
14
- text
15
- .replace(/\ue200url\ue202([^\ue202\ue201]*)\ue202([^\ue201]*)\ue201/g, "[$1]($2)")
16
- .replace(/\ue200cite\ue202[^\ue201]*\ue201/g, "")
17
- .replace(/\ue200[^\ue201]*\ue201/g, "")
18
- .replace(/\ue200[^\ue201]*$/g, "")
19
- .replace(/\n{3,}/g, "\n\n")
20
- .trim();
21
-
22
- const cleanUrl = (url: string) => url.replace(/[\ue200-\ue202].*$/g, "").trim();
23
-
24
- const sourceKind = (url: string) => {
25
- const host = (() => {
26
- try {
27
- return new URL(url).hostname;
28
- } catch {
29
- return "";
30
- }
31
- })();
32
- return host.includes("github.com") ? "github" : "web";
33
- };
34
-
35
- function MarkdownResult({ content }: { content: string }) {
36
- return (
37
- <ReactMarkdown
38
- remarkPlugins={[remarkGfm]}
39
- components={{
40
- a: ({ className, ...props }) => <a className={cn("font-medium text-blue-700 underline decoration-blue-300 underline-offset-4 hover:text-blue-900 dark:text-blue-300 dark:decoration-blue-700", className)} target="_blank" rel="noreferrer" {...props} />,
41
- h1: ({ className, ...props }) => <h1 className={cn("mt-8 mb-4 text-2xl font-semibold tracking-tight text-stone-950 first:mt-0 dark:text-stone-50", className)} {...props} />,
42
- h2: ({ className, ...props }) => <h2 className={cn("mt-8 mb-4 border-b border-stone-200 pb-2 text-xl font-semibold tracking-tight text-stone-950 first:mt-0 dark:border-white/10 dark:text-stone-50", className)} {...props} />,
43
- h3: ({ className, ...props }) => <h3 className={cn("mt-6 mb-3 text-lg font-semibold text-stone-900 dark:text-stone-100", className)} {...props} />,
44
- p: ({ className, ...props }) => <p className={cn("my-4 leading-8 text-stone-800 dark:text-stone-200", className)} {...props} />,
45
- ul: ({ className, ...props }) => <ul className={cn("my-4 list-disc space-y-2 pl-6 leading-7 text-stone-800 dark:text-stone-200", className)} {...props} />,
46
- ol: ({ className, ...props }) => <ol className={cn("my-4 list-decimal space-y-2 pl-6 leading-7 text-stone-800 dark:text-stone-200", className)} {...props} />,
47
- blockquote: ({ className, ...props }) => <blockquote className={cn("my-5 border-l-4 border-stone-300 bg-white/70 py-3 pr-4 pl-5 text-stone-700 dark:border-white/20 dark:bg-white/[0.04] dark:text-stone-300", className)} {...props} />,
48
- code: ({ className, ...props }) => <code className={cn("rounded bg-stone-100 px-1.5 py-0.5 font-mono text-[0.9em] text-stone-800 dark:bg-white/10 dark:text-stone-100", className)} {...props} />,
49
- pre: ({ className, ...props }) => <pre className={cn("my-5 overflow-x-auto rounded-xl border border-stone-200 bg-stone-950 p-4 text-sm text-stone-50 dark:border-white/10", className)} {...props} />,
50
- table: ({ className, ...props }) => <div className="my-5 overflow-x-auto rounded-xl border border-stone-200 dark:border-white/10"><table className={cn("w-full border-collapse text-sm", className)} {...props} /></div>,
51
- th: ({ className, ...props }) => <th className={cn("border-b border-stone-200 bg-stone-100 px-3 py-2 text-left font-semibold dark:border-white/10 dark:bg-white/10", className)} {...props} />,
52
- td: ({ className, ...props }) => <td className={cn("border-b border-stone-100 px-3 py-2 align-top dark:border-white/10", className)} {...props} />,
53
- }}
54
- >
55
- {content}
56
- </ReactMarkdown>
57
- );
58
- }
59
-
60
- export function SearchPanel() {
61
- const [prompt, setPrompt] = useState("帮我搜索 chatgpt2api 相关项目");
62
- const [result, setResult] = useState<SearchResult | null>(null);
63
- const [loading, setLoading] = useState(false);
64
- const [error, setError] = useState("");
65
- const [elapsedMs, setElapsedMs] = useState(0);
66
- const [startedAt, setStartedAt] = useState(0);
67
- const searched = loading || !!result || !!error;
68
-
69
- useEffect(() => {
70
- if (!loading || !startedAt) return;
71
- const timer = window.setInterval(() => setElapsedMs(Date.now() - startedAt), 100);
72
- return () => window.clearInterval(timer);
73
- }, [loading, startedAt]);
74
-
75
- const runSearch = async () => {
76
- const value = prompt.trim();
77
- if (!value || loading) return;
78
- const start = Date.now();
79
- setStartedAt(start);
80
- setElapsedMs(0);
81
- setLoading(true);
82
- setError("");
83
- setResult(null);
84
- try {
85
- setResult(await httpRequest<SearchResult>("/v1/search", { method: "POST", body: { prompt: value } }));
86
- } catch (err) {
87
- setError(err instanceof Error ? err.message : String(err));
88
- } finally {
89
- setElapsedMs(Date.now() - start);
90
- setLoading(false);
91
- }
92
- };
93
-
94
- return (
95
- <section className={cn("mx-auto flex min-h-[calc(100vh-142px)] w-full max-w-6xl flex-col px-4 transition-all", searched ? "py-5" : "justify-center")}>
96
- <div className={cn("mx-auto w-full max-w-3xl", searched && "sticky top-3 z-10")}>
97
- {!searched ? (
98
- <p className="mb-5 text-center text-sm text-stone-500 dark:text-stone-400">利用ChatGPT先进的网页搜索功能进行搜索</p>
99
- ) : null}
100
- <form
101
- className={cn("mx-auto flex w-full items-center gap-3 rounded-full border border-stone-200 bg-white/95 backdrop-blur transition-all dark:border-white/10 dark:bg-stone-950/90", searched ? "px-4 py-2" : "px-5 py-3")}
102
- onSubmit={(event) => {
103
- event.preventDefault();
104
- void runSearch();
105
- }}
106
- >
107
- <img src="/openai.svg" alt="" aria-hidden="true" className="size-5 shrink-0 opacity-80 dark:invert" />
108
- <input
109
- value={prompt}
110
- onChange={(event) => setPrompt(event.target.value)}
111
- placeholder="搜索网页"
112
- className={cn("min-w-0 flex-1 bg-transparent text-[15px] text-stone-900 outline-none placeholder:text-stone-400 dark:text-stone-100 dark:placeholder:text-stone-500", searched ? "h-8" : "h-10")}
113
- />
114
- <button type="submit" disabled={loading || !prompt.trim()} className="inline-flex size-8 shrink-0 items-center justify-center rounded-full text-stone-800 transition hover:bg-stone-100 disabled:cursor-not-allowed disabled:text-stone-300 dark:text-stone-100 dark:hover:bg-white/10 dark:disabled:text-stone-600">
115
- {loading ? <LoaderCircle className="size-4 animate-spin" /> : <Search className="size-4" />}
116
- </button>
117
- </form>
118
- </div>
119
-
120
- {searched ? <div className="mx-auto w-full max-w-6xl flex-1 pt-6">
121
- {loading ? (
122
- <div className="mx-auto flex max-w-3xl items-center gap-3 rounded-2xl border border-stone-200 bg-white/75 px-4 py-3 text-sm text-stone-600 dark:border-white/10 dark:bg-white/[0.03] dark:text-stone-300">
123
- <LoaderCircle className="size-4 animate-spin" />
124
- 搜索中... {(elapsedMs / 1000).toFixed(1)}s
125
- </div>
126
- ) : null}
127
-
128
- {error ? <div className="rounded-2xl border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-700 dark:border-rose-900/60 dark:bg-rose-950/25 dark:text-rose-300">{error}</div> : null}
129
-
130
- {result ? (
131
- <article className="grid gap-8 pb-12 lg:grid-cols-[minmax(0,1fr)_320px]">
132
- <div className="min-w-0">
133
- <div className="mb-5 flex flex-wrap items-center gap-2 text-xs text-stone-500 dark:text-stone-400">
134
- <span className="rounded-full border border-stone-200 bg-white px-3 py-1 dark:border-white/10 dark:bg-white/[0.03]">{result.status || "done"}</span>
135
- <span className="rounded-full border border-stone-200 bg-white px-3 py-1 dark:border-white/10 dark:bg-white/[0.03]">{(elapsedMs / 1000).toFixed(2)}s</span>
136
- <span className="rounded-full border border-stone-200 bg-white px-3 py-1 dark:border-white/10 dark:bg-white/[0.03]">{result.sources?.length || 0} sources</span>
137
- </div>
138
- <div className="text-[15px]">
139
- <MarkdownResult content={normalizeMarkdown(result.answer || "")} />
140
- </div>
141
- </div>
142
- {result.sources?.length ? (
143
- <aside className="lg:sticky lg:top-24 lg:self-start">
144
- <div className="mb-3 text-sm font-semibold text-stone-900 dark:text-stone-100">来源</div>
145
- <div className="divide-y divide-stone-200 dark:divide-white/10">
146
- {result.sources.map((source, index) => {
147
- const url = cleanUrl(source.url || "");
148
- const kind = sourceKind(url);
149
- return (
150
- <a key={`${url || index}`} href={url} target="_blank" rel="noreferrer" className="flex gap-3 py-3 text-xs transition hover:text-stone-950 dark:hover:text-stone-50">
151
- <span className="mt-0.5 flex size-5 shrink-0 items-center justify-center text-stone-600 dark:text-stone-300">
152
- {kind === "github" ? <img src="/github.svg" alt="" aria-hidden="true" className="size-3.5 dark:invert" /> : <Globe2 className="size-3.5" />}
153
- </span>
154
- <span className="min-w-0">
155
- <span className="line-clamp-2 font-medium leading-5 text-stone-800 dark:text-stone-200">{source.title || url || "source"}</span>
156
- <span className="mt-1 flex items-center gap-1 truncate text-stone-500 dark:text-stone-400">
157
- <ExternalLink className="size-3 shrink-0" />
158
- {url}
159
- </span>
160
- </span>
161
- </a>
162
- );
163
- })}
164
- </div>
165
- </aside>
166
- ) : null}
167
- </article>
168
- ) : null}
169
- </div> : null}
170
- </section>
171
- );
172
- }
1
+ "use client";
2
+
3
+ import { useEffect, useState } from "react";
4
+ import { ExternalLink, Globe2, LoaderCircle, Search } from "lucide-react";
5
+ import ReactMarkdown from "react-markdown";
6
+ import remarkGfm from "remark-gfm";
7
+
8
+ import { httpRequest } from "@/lib/request";
9
+ import { cn } from "@/lib/utils";
10
+
11
+ import type { SearchResult } from "./types";
12
+
13
+ const normalizeMarkdown = (text: string) =>
14
+ text
15
+ .replace(/\ue200url\ue202([^\ue202\ue201]*)\ue202([^\ue201]*)\ue201/g, "[$1]($2)")
16
+ .replace(/\ue200cite\ue202[^\ue201]*\ue201/g, "")
17
+ .replace(/\ue200[^\ue201]*\ue201/g, "")
18
+ .replace(/\ue200[^\ue201]*$/g, "")
19
+ .replace(/\n{3,}/g, "\n\n")
20
+ .trim();
21
+
22
+ const cleanUrl = (url: string) => url.replace(/[\ue200-\ue202].*$/g, "").trim();
23
+
24
+ const sourceKind = (url: string) => {
25
+ const host = (() => {
26
+ try {
27
+ return new URL(url).hostname;
28
+ } catch {
29
+ return "";
30
+ }
31
+ })();
32
+ return host.includes("github.com") ? "github" : "web";
33
+ };
34
+
35
+ function MarkdownResult({ content }: { content: string }) {
36
+ return (
37
+ <ReactMarkdown
38
+ remarkPlugins={[remarkGfm]}
39
+ components={{
40
+ a: ({ className, ...props }) => <a className={cn("font-medium text-blue-700 underline decoration-blue-300 underline-offset-4 hover:text-blue-900 dark:text-blue-300 dark:decoration-blue-700", className)} target="_blank" rel="noreferrer" {...props} />,
41
+ h1: ({ className, ...props }) => <h1 className={cn("mt-8 mb-4 text-2xl font-semibold tracking-tight text-stone-950 first:mt-0 dark:text-stone-50", className)} {...props} />,
42
+ h2: ({ className, ...props }) => <h2 className={cn("mt-8 mb-4 border-b border-stone-200 pb-2 text-xl font-semibold tracking-tight text-stone-950 first:mt-0 dark:border-white/10 dark:text-stone-50", className)} {...props} />,
43
+ h3: ({ className, ...props }) => <h3 className={cn("mt-6 mb-3 text-lg font-semibold text-stone-900 dark:text-stone-100", className)} {...props} />,
44
+ p: ({ className, ...props }) => <p className={cn("my-4 leading-8 text-stone-800 dark:text-stone-200", className)} {...props} />,
45
+ ul: ({ className, ...props }) => <ul className={cn("my-4 list-disc space-y-2 pl-6 leading-7 text-stone-800 dark:text-stone-200", className)} {...props} />,
46
+ ol: ({ className, ...props }) => <ol className={cn("my-4 list-decimal space-y-2 pl-6 leading-7 text-stone-800 dark:text-stone-200", className)} {...props} />,
47
+ blockquote: ({ className, ...props }) => <blockquote className={cn("my-5 border-l-4 border-stone-300 bg-white/70 py-3 pr-4 pl-5 text-stone-700 dark:border-white/20 dark:bg-white/[0.04] dark:text-stone-300", className)} {...props} />,
48
+ code: ({ className, ...props }) => <code className={cn("rounded bg-stone-100 px-1.5 py-0.5 font-mono text-[0.9em] text-stone-800 dark:bg-white/10 dark:text-stone-100", className)} {...props} />,
49
+ pre: ({ className, ...props }) => <pre className={cn("my-5 overflow-x-auto rounded-xl border border-stone-200 bg-stone-950 p-4 text-sm text-stone-50 dark:border-white/10", className)} {...props} />,
50
+ table: ({ className, ...props }) => <div className="my-5 overflow-x-auto rounded-xl border border-stone-200 dark:border-white/10"><table className={cn("w-full border-collapse text-sm", className)} {...props} /></div>,
51
+ th: ({ className, ...props }) => <th className={cn("border-b border-stone-200 bg-stone-100 px-3 py-2 text-left font-semibold dark:border-white/10 dark:bg-white/10", className)} {...props} />,
52
+ td: ({ className, ...props }) => <td className={cn("border-b border-stone-100 px-3 py-2 align-top dark:border-white/10", className)} {...props} />,
53
+ }}
54
+ >
55
+ {content}
56
+ </ReactMarkdown>
57
+ );
58
+ }
59
+
60
+ export function SearchPanel() {
61
+ const [prompt, setPrompt] = useState("帮我搜索 chatgpt2api 相关项目");
62
+ const [result, setResult] = useState<SearchResult | null>(null);
63
+ const [loading, setLoading] = useState(false);
64
+ const [error, setError] = useState("");
65
+ const [elapsedMs, setElapsedMs] = useState(0);
66
+ const [startedAt, setStartedAt] = useState(0);
67
+ const searched = loading || !!result || !!error;
68
+
69
+ useEffect(() => {
70
+ if (!loading || !startedAt) return;
71
+ const timer = window.setInterval(() => setElapsedMs(Date.now() - startedAt), 100);
72
+ return () => window.clearInterval(timer);
73
+ }, [loading, startedAt]);
74
+
75
+ const runSearch = async () => {
76
+ const value = prompt.trim();
77
+ if (!value || loading) return;
78
+ const start = Date.now();
79
+ setStartedAt(start);
80
+ setElapsedMs(0);
81
+ setLoading(true);
82
+ setError("");
83
+ setResult(null);
84
+ try {
85
+ setResult(await httpRequest<SearchResult>("/v1/search", { method: "POST", body: { prompt: value } }));
86
+ } catch (err) {
87
+ setError(err instanceof Error ? err.message : String(err));
88
+ } finally {
89
+ setElapsedMs(Date.now() - start);
90
+ setLoading(false);
91
+ }
92
+ };
93
+
94
+ return (
95
+ <section className={cn("mx-auto flex min-h-[calc(100vh-142px)] w-full max-w-6xl flex-col px-4 transition-all", searched ? "py-5" : "justify-center")}>
96
+ <div className={cn("mx-auto w-full max-w-3xl", searched && "sticky top-3 z-10")}>
97
+ {!searched ? (
98
+ <p className="mb-5 text-center text-sm text-stone-500 dark:text-stone-400">利用ChatGPT先进的网页搜索功能进行搜索</p>
99
+ ) : null}
100
+ <form
101
+ className={cn("mx-auto flex w-full items-center gap-3 rounded-full border border-stone-200 bg-white/95 backdrop-blur transition-all dark:border-white/10 dark:bg-stone-950/90", searched ? "px-4 py-2" : "px-5 py-3")}
102
+ onSubmit={(event) => {
103
+ event.preventDefault();
104
+ void runSearch();
105
+ }}
106
+ >
107
+ <img src="/openai.svg" alt="" aria-hidden="true" className="size-5 shrink-0 opacity-80 dark:invert" />
108
+ <input
109
+ value={prompt}
110
+ onChange={(event) => setPrompt(event.target.value)}
111
+ placeholder="搜索网页"
112
+ className={cn("min-w-0 flex-1 bg-transparent text-[15px] text-stone-900 outline-none placeholder:text-stone-400 dark:text-stone-100 dark:placeholder:text-stone-500", searched ? "h-8" : "h-10")}
113
+ />
114
+ <button type="submit" disabled={loading || !prompt.trim()} className="inline-flex size-8 shrink-0 items-center justify-center rounded-full text-stone-800 transition hover:bg-stone-100 disabled:cursor-not-allowed disabled:text-stone-300 dark:text-stone-100 dark:hover:bg-white/10 dark:disabled:text-stone-600">
115
+ {loading ? <LoaderCircle className="size-4 animate-spin" /> : <Search className="size-4" />}
116
+ </button>
117
+ </form>
118
+ </div>
119
+
120
+ {searched ? <div className="mx-auto w-full max-w-6xl flex-1 pt-6">
121
+ {loading ? (
122
+ <div className="mx-auto flex max-w-3xl items-center gap-3 rounded-2xl border border-stone-200 bg-white/75 px-4 py-3 text-sm text-stone-600 dark:border-white/10 dark:bg-white/[0.03] dark:text-stone-300">
123
+ <LoaderCircle className="size-4 animate-spin" />
124
+ 搜索中... {(elapsedMs / 1000).toFixed(1)}s
125
+ </div>
126
+ ) : null}
127
+
128
+ {error ? <div className="rounded-2xl border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-700 dark:border-rose-900/60 dark:bg-rose-950/25 dark:text-rose-300">{error}</div> : null}
129
+
130
+ {result ? (
131
+ <article className="grid gap-8 pb-12 lg:grid-cols-[minmax(0,1fr)_320px]">
132
+ <div className="min-w-0">
133
+ <div className="mb-5 flex flex-wrap items-center gap-2 text-xs text-stone-500 dark:text-stone-400">
134
+ <span className="rounded-full border border-stone-200 bg-white px-3 py-1 dark:border-white/10 dark:bg-white/[0.03]">{result.status || "done"}</span>
135
+ <span className="rounded-full border border-stone-200 bg-white px-3 py-1 dark:border-white/10 dark:bg-white/[0.03]">{(elapsedMs / 1000).toFixed(2)}s</span>
136
+ <span className="rounded-full border border-stone-200 bg-white px-3 py-1 dark:border-white/10 dark:bg-white/[0.03]">{result.sources?.length || 0} sources</span>
137
+ </div>
138
+ <div className="text-[15px]">
139
+ <MarkdownResult content={normalizeMarkdown(result.answer || "")} />
140
+ </div>
141
+ </div>
142
+ {result.sources?.length ? (
143
+ <aside className="lg:sticky lg:top-24 lg:self-start">
144
+ <div className="mb-3 text-sm font-semibold text-stone-900 dark:text-stone-100">来源</div>
145
+ <div className="divide-y divide-stone-200 dark:divide-white/10">
146
+ {result.sources.map((source, index) => {
147
+ const url = cleanUrl(source.url || "");
148
+ const kind = sourceKind(url);
149
+ return (
150
+ <a key={`${url || index}`} href={url} target="_blank" rel="noreferrer" className="flex gap-3 py-3 text-xs transition hover:text-stone-950 dark:hover:text-stone-50">
151
+ <span className="mt-0.5 flex size-5 shrink-0 items-center justify-center text-stone-600 dark:text-stone-300">
152
+ {kind === "github" ? <img src="/github.svg" alt="" aria-hidden="true" className="size-3.5 dark:invert" /> : <Globe2 className="size-3.5" />}
153
+ </span>
154
+ <span className="min-w-0">
155
+ <span className="line-clamp-2 font-medium leading-5 text-stone-800 dark:text-stone-200">{source.title || url || "source"}</span>
156
+ <span className="mt-1 flex items-center gap-1 truncate text-stone-500 dark:text-stone-400">
157
+ <ExternalLink className="size-3 shrink-0" />
158
+ {url}
159
+ </span>
160
+ </span>
161
+ </a>
162
+ );
163
+ })}
164
+ </div>
165
+ </aside>
166
+ ) : null}
167
+ </article>
168
+ ) : null}
169
+ </div> : null}
170
+ </section>
171
+ );
172
+ }