diff --git a/config/config.ts b/config/config.ts index f5474751..8633f558 100644 --- a/config/config.ts +++ b/config/config.ts @@ -14,7 +14,7 @@ const isProduction = env === 'production'; const t = Date.now(); export default defineConfig({ proxy: { - ...proxy('http://192.168.50.2') + ...proxy('http://192.168.50.3') }, history: { type: 'hash' diff --git a/src/components/icon-font/iconfont/iconfont.css b/src/components/icon-font/iconfont/iconfont.css index a28a5d2e..a7a25f11 100644 --- a/src/components/icon-font/iconfont/iconfont.css +++ b/src/components/icon-font/iconfont/iconfont.css @@ -1,9 +1,9 @@ @font-face { font-family: iconfont; /* Project id 4613488 */ src: - url('iconfont.woff2?t=1732245003614') format('woff2'), - url('iconfont.woff?t=1732245003614') format('woff'), - url('iconfont.ttf?t=1732245003614') format('truetype'); + url('iconfont.woff2?t=1732806927800') format('woff2'), + url('iconfont.woff?t=1732806927800') format('woff'), + url('iconfont.ttf?t=1732806927800') format('truetype'); } .iconfont { @@ -14,6 +14,14 @@ -moz-osx-font-smoothing: grayscale; } +.icon-random::before { + content: '\e603'; +} + +.icon-suijisenlin::before { + content: '\e60e'; +} + .icon-stop2::before { content: '\e8db'; } diff --git a/src/components/icon-font/iconfont/iconfont.js b/src/components/icon-font/iconfont/iconfont.js index 06c2b5dc..8ef116da 100644 --- a/src/components/icon-font/iconfont/iconfont.js +++ b/src/components/icon-font/iconfont/iconfont.js @@ -1,17 +1,17 @@ (window._iconfont_svg_string_4613488 = - ''), + ''), ((h) => { var a = (l = (l = document.getElementsByTagName('script'))[ l.length - 1 ]).getAttribute('data-injectcss'), l = l.getAttribute('data-disable-injectsvg'); if (!l) { - var z, + var c, + z, t, - c, i, - v, - m = function (a, l) { + m, + v = function (a, l) { l.parentNode.insertBefore(a, l); }; if (a && !h.__iconfont__svg__cssinject__) { @@ -24,7 +24,7 @@ console && console.log(a); } } - (z = function () { + (c = function () { var a, l = document.createElement('div'); (l.innerHTML = h._iconfont_svg_string_4613488), @@ -36,20 +36,20 @@ (l.style.overflow = 'hidden'), (l = l), (a = document.body).firstChild - ? m(l, a.firstChild) + ? v(l, a.firstChild) : a.appendChild(l)); }), document.addEventListener ? ~['complete', 'loaded', 'interactive'].indexOf(document.readyState) - ? setTimeout(z, 0) - : ((t = function () { - document.removeEventListener('DOMContentLoaded', t, !1), z(); + ? setTimeout(c, 0) + : ((z = function () { + document.removeEventListener('DOMContentLoaded', z, !1), c(); }), - document.addEventListener('DOMContentLoaded', t, !1)) + document.addEventListener('DOMContentLoaded', z, !1)) : document.attachEvent && - ((c = z), + ((t = c), (i = h.document), - (v = !1), + (m = !1), p(), (i.onreadystatechange = function () { 'complete' == i.readyState && @@ -57,7 +57,7 @@ })); } function o() { - v || ((v = !0), c()); + m || ((m = !0), t()); } function p() { try { diff --git a/src/components/icon-font/iconfont/iconfont.json b/src/components/icon-font/iconfont/iconfont.json index 206b0e84..347f51f8 100644 --- a/src/components/icon-font/iconfont/iconfont.json +++ b/src/components/icon-font/iconfont/iconfont.json @@ -5,6 +5,20 @@ "css_prefix_text": "icon-", "description": "", "glyphs": [ + { + "icon_id": "13059398", + "name": "随机", + "font_class": "random", + "unicode": "e603", + "unicode_decimal": 58883 + }, + { + "icon_id": "5978743", + "name": "random-forest", + "font_class": "suijisenlin", + "unicode": "e60e", + "unicode_decimal": 58894 + }, { "icon_id": "15617444", "name": "stop", diff --git a/src/components/icon-font/iconfont/iconfont.ttf b/src/components/icon-font/iconfont/iconfont.ttf index 133aed60..5d5095b5 100644 Binary files a/src/components/icon-font/iconfont/iconfont.ttf and b/src/components/icon-font/iconfont/iconfont.ttf differ diff --git a/src/components/icon-font/iconfont/iconfont.woff b/src/components/icon-font/iconfont/iconfont.woff index 6f5237b3..486e5a41 100644 Binary files a/src/components/icon-font/iconfont/iconfont.woff and b/src/components/icon-font/iconfont/iconfont.woff differ diff --git a/src/components/icon-font/iconfont/iconfont.woff2 b/src/components/icon-font/iconfont/iconfont.woff2 index f68c1e52..7312b975 100644 Binary files a/src/components/icon-font/iconfont/iconfont.woff2 and b/src/components/icon-font/iconfont/iconfont.woff2 differ diff --git a/src/components/speech-content/speech-item.tsx b/src/components/speech-content/speech-item.tsx index 7290fef6..35e3021e 100644 --- a/src/components/speech-content/speech-item.tsx +++ b/src/components/speech-content/speech-item.tsx @@ -82,8 +82,8 @@ const SpeechItem: React.FC = (props) => {
{props.format} - - {props.speed}x + {/* + {props.speed}x */}
= ({ intl }) => { const currentVersion = getAtomStorage(GPUStackVersionAtom)?.version; const isProd = - currentVersion !== '0.0.0' && currentVersion?.indexOf('rc') === -1; + currentVersion?.indexOf('rc') === -1 && + currentVersion?.indexOf('0.0.0') === -1; const uiVersion = document.documentElement.getAttribute('data-version'); @@ -39,7 +40,7 @@ const VersionInfo: React.FC<{ intl: any }> = ({ intl }) => { {' '} {intl.formatMessage({ id: 'common.footer.version.server' })} - {currentVersion === '0.0.0' + {currentVersion.indexOf('0.0.0') > -1 ? getAtomStorage(GPUStackVersionAtom)?.git_commit : getAtomStorage(GPUStackVersionAtom)?.version} @@ -55,7 +56,7 @@ const VersionInfo: React.FC<{ intl: any }> = ({ intl }) => { {latestVersion && latestVersion !== currentVersion && - latestVersion !== '0.0.0' + latestVersion.indexOf('0.0.0') === -1 ? intl.formatMessage( { id: 'users.version.update' }, { version: latestVersion } diff --git a/src/layouts/index.tsx b/src/layouts/index.tsx index fff8919d..1b57c7cc 100644 --- a/src/layouts/index.tsx +++ b/src/layouts/index.tsx @@ -182,7 +182,7 @@ export default (props: any) => { initialState?.currentUser?.is_admin && updateCheck.latest_version && updateCheck.latest_version !== version?.version && - updateCheck.latest_version !== '0.0.0' && + updateCheck.latest_version?.indexOf('0.0.0') === -1 && updateCheck.latest_version?.indexOf('rc') === -1 ); }, [updateCheck, version, initialState]); diff --git a/src/locales/en-US/playground.ts b/src/locales/en-US/playground.ts index 883b52a0..d5e8b608 100644 --- a/src/locales/en-US/playground.ts +++ b/src/locales/en-US/playground.ts @@ -109,5 +109,6 @@ export default { 'In the chart, the distance between points indicates the similarity between the corresponding documents. Closer points mean higher similarity.', 'playground.audio.button.play': 'Play', 'playground.audio.button.download': 'Download', - 'playground.audio.button.stop': 'Stop' + 'playground.audio.button.stop': 'Stop', + 'playground.image.prompt.random': 'Random Prompt' }; diff --git a/src/locales/zh-CN/playground.ts b/src/locales/zh-CN/playground.ts index 165b02ed..1a38e8b7 100644 --- a/src/locales/zh-CN/playground.ts +++ b/src/locales/zh-CN/playground.ts @@ -106,5 +106,6 @@ export default { '在图表中,点之间的距离表示相应文档之间的相似度。点越近意味着相似度越高。', 'playground.audio.button.play': '播放', 'playground.audio.button.download': '下载', - 'playground.audio.button.stop': '停止' + 'playground.audio.button.stop': '停止', + 'playground.image.prompt.random': '随机提示词' }; diff --git a/src/pages/playground/components/ground-images.tsx b/src/pages/playground/components/ground-images.tsx index 5bfb2ca8..3e9ce863 100644 --- a/src/pages/playground/components/ground-images.tsx +++ b/src/pages/playground/components/ground-images.tsx @@ -1,4 +1,5 @@ import AlertInfo from '@/components/alert-info'; +import IconFont from '@/components/icon-font'; import FieldComponent from '@/components/seal-form/field-component'; import SealInput from '@/components/seal-form/seal-input'; import SealSelect from '@/components/seal-form/seal-select'; @@ -25,7 +26,7 @@ import React, { useState } from 'react'; import { CREAT_IMAGE_API } from '../apis'; -import { OpenAIViewCode } from '../config'; +import { OpenAIViewCode, promptList } from '../config'; import { ImageAdvancedParamsConfig, ImageconstExtraConfig, @@ -124,6 +125,7 @@ const GroundImages: React.FC = forwardRef((props, ref) => { const requestToken = useRef(null); const [currentPrompt, setCurrentPrompt] = useState(''); const form = useRef(null); + const inputRef = useRef(null); const size = Form.useWatch('size', form.current?.form); @@ -142,6 +144,20 @@ const GroundImages: React.FC = forwardRef((props, ref) => { }; }); + const generateNumber = (min: number, max: number) => { + return Math.floor(Math.random() * (max - min + 1) + min); + }; + + const handleRandomPrompt = useCallback(() => { + const randomIndex = generateNumber(0, promptList.length - 1); + const randomPrompt = promptList[randomIndex]; + inputRef.current?.handleInputChange({ + target: { + value: randomPrompt + } + }); + }, []); + const setImageSize = useCallback(() => { let size: Record = { with: 256, @@ -497,10 +513,15 @@ const GroundImages: React.FC = forwardRef((props, ref) => { )}
= forwardRef((props, ref) => { shouldResetMessage={false} clearAll={handleClear} tools={ - - {intl.formatMessage({ id: 'playground.image.prompt' })} - + <> + + {intl.formatMessage({ id: 'playground.image.prompt' })} + + + + + } />
diff --git a/src/pages/playground/components/ground-stt.tsx b/src/pages/playground/components/ground-stt.tsx index 1d23ee60..e3dc70d9 100644 --- a/src/pages/playground/components/ground-stt.tsx +++ b/src/pages/playground/components/ground-stt.tsx @@ -270,7 +270,7 @@ const GroundLeft: React.FC = forwardRef((props, ref) => {
{audioData ? ( -
+
= forwardRef((props, ref) => { duration={audioData.duration} >
+
+ + + +
) : ( renderAniamtion() @@ -327,22 +352,6 @@ const GroundLeft: React.FC = forwardRef((props, ref) => {
-
- - - -
void; handleAbortFetch: () => void; updateLayout?: (value: { span: number; count: number }) => void; @@ -89,411 +97,425 @@ interface MessageInputProps { defaultSize?: { minRows: number; maxRows: number }; } -const MessageInput: React.FC = ({ - handleSubmit, - handleAbortFetch, - presetPrompt, - clearAll, - updateLayout, - addMessage, - onCheck, - loading, - disabled, - isEmpty, - submitIcon, - placeholer, - tools, - style, - checkLabel, - defaultSize = { minRows: 3, maxRows: 8 }, - shouldResetMessage = true, - actions = ['clear', 'layout', 'role', 'upload', 'add', 'paste'] -}) => { - const { TextArea } = Input; - const intl = useIntl(); - const [open, setOpen] = useState(false); - const [focused, setFocused] = useState(false); - const [message, setMessage] = useState({ - role: Roles.User, - content: '', - imgs: [] - }); - const imgCountRef = useRef(0); - const inputRef = useRef(null); - - const isDisabled = useMemo(() => { - return disabled - ? true - : !message.content && isEmpty && !message.imgs?.length; - }, [disabled, message, isEmpty]); - - const resetMessage = () => { - setMessage({ - role: message.role, +const MessageInput: React.FC = forwardRef( + ( + { + handleSubmit, + handleAbortFetch, + presetPrompt, + clearAll, + updateLayout, + addMessage, + onCheck, + loading, + disabled, + isEmpty, + submitIcon, + placeholer, + tools, + style, + checkLabel, + defaultSize = { minRows: 3, maxRows: 8 }, + shouldResetMessage = true, + actions = ['clear', 'layout', 'role', 'upload', 'add', 'paste'] + }, + ref + ) => { + const { TextArea } = Input; + const intl = useIntl(); + const [open, setOpen] = useState(false); + const [focused, setFocused] = useState(false); + const [message, setMessage] = useState({ + role: Roles.User, content: '', imgs: [] }); - }; + const imgCountRef = useRef(0); + const inputRef = useRef(null); - const handleInputChange = (e: any) => { - console.log('input change:', e.target?.value); - setMessage({ - ...message, - content: e.target?.value - }); - }; - const handleSendMessage = () => { - handleSubmit({ ...message }); - if (shouldResetMessage) { - resetMessage(); - } - }; - const onStop = () => { - handleAbortFetch(); - }; - const handleLayoutChange = (value: { span: number; count: number }) => { - updateLayout?.(value); - }; + const isDisabled = useMemo(() => { + return disabled + ? true + : !message.content && isEmpty && !message.imgs?.length; + }, [disabled, message, isEmpty]); - const handleToggleRole = () => { - setMessage({ - ...message, - role: message.role === Roles.User ? Roles.Assistant : Roles.User - }); - }; + const resetMessage = () => { + setMessage({ + role: message.role, + content: '', + imgs: [] + }); + }; - const handleClearAll = (e: any) => { - e.stopPropagation(); - clearAll(); - setMessage({ - role: Roles.User, - content: '', - imgs: [] - }); - }; + const handleInputChange = (e: any) => { + console.log('input change:', e.target?.value); + setMessage({ + ...message, + content: e.target?.value + }); + }; + const handleSendMessage = () => { + handleSubmit({ ...message }); + if (shouldResetMessage) { + resetMessage(); + } + }; + const onStop = () => { + handleAbortFetch(); + }; + const handleLayoutChange = (value: { span: number; count: number }) => { + updateLayout?.(value); + }; - const handleAddMessage = (e?: any) => { - e?.preventDefault(); - addMessage?.({ ...message }); - resetMessage(); - setFocused(true); - setTimeout(() => { - inputRef.current?.focus?.(); - }, 100); - }; + const handleToggleRole = () => { + setMessage({ + ...message, + role: message.role === Roles.User ? Roles.Assistant : Roles.User + }); + }; - const getPasteContent = useCallback( - async (event: any) => { - const clipboardData = event.clipboardData || window.clipboardData; - const items = clipboardData.items; - const imgPromises: Promise[] = []; + const handleClearAll = (e: any) => { + e.stopPropagation(); + clearAll(); + setMessage({ + role: Roles.User, + content: '', + imgs: [] + }); + }; - for (let i = 0; i < items.length; i++) { - let item = items[i]; + const handleAddMessage = (e?: any) => { + e?.preventDefault(); + addMessage?.({ ...message }); + resetMessage(); + setFocused(true); + setTimeout(() => { + inputRef.current?.focus?.(); + }, 100); + }; - if (item.kind === 'file' && item.type.indexOf('image') !== -1) { - const file = item.getAsFile(); - const imgPromise = new Promise((resolve, reject) => { - const reader = new FileReader(); - reader.onload = function (event) { - const base64String = event.target?.result as string; - if (base64String) { - resolve(base64String); - } else { - reject('Failed to convert image to base64'); - } - }; - reader.readAsDataURL(file); - }); - imgPromises.push(imgPromise); - } else if (item.kind === 'string') { - // string - } - } + const getPasteContent = useCallback( + async (event: any) => { + const clipboardData = event.clipboardData || window.clipboardData; + const items = clipboardData.items; + const imgPromises: Promise[] = []; - try { - const imgs = await Promise.all(imgPromises); + for (let i = 0; i < items.length; i++) { + let item = items[i]; - if (imgs.length) { - const list = _.map(imgs, (img: string) => { - imgCountRef.current += 1; - return { - uid: imgCountRef.current, - dataUrl: img - }; - }); - setMessage({ - ...message, - imgs: [...(message.imgs || []), ...list] - }); + if (item.kind === 'file' && item.type.indexOf('image') !== -1) { + const file = item.getAsFile(); + const imgPromise = new Promise((resolve, reject) => { + const reader = new FileReader(); + reader.onload = function (event) { + const base64String = event.target?.result as string; + if (base64String) { + resolve(base64String); + } else { + reject('Failed to convert image to base64'); + } + }; + reader.readAsDataURL(file); + }); + imgPromises.push(imgPromise); + } else if (item.kind === 'string') { + // string + } } - } catch (error) { - console.error('Error processing images:', error); - } - }, - [message] - ); - // ========== upload image ========== - const handleUpdateImgList = ( - list: { uid: number | string; dataUrl: string }[] - ) => { - setMessage({ - ...message, - imgs: [...(message.imgs || []), ...list] - }); - }; + try { + const imgs = await Promise.all(imgPromises); - const handleDeleteImg = (uid: number | string) => { - const list = _.filter( - message.imgs, - (item: MessageItem) => item.uid !== uid + if (imgs.length) { + const list = _.map(imgs, (img: string) => { + imgCountRef.current += 1; + return { + uid: imgCountRef.current, + dataUrl: img + }; + }); + setMessage({ + ...message, + imgs: [...(message.imgs || []), ...list] + }); + } + } catch (error) { + console.error('Error processing images:', error); + } + }, + [message] ); - setMessage({ - ...message, - imgs: list - }); - }; - const handleOnPaste = (e: any) => { - const text = e.clipboardData.getData('text'); - if (!text) { - e.preventDefault(); - getPasteContent(e); - } - }; + // ========== upload image ========== + const handleUpdateImgList = ( + list: { uid: number | string; dataUrl: string }[] + ) => { + setMessage({ + ...message, + imgs: [...(message.imgs || []), ...list] + }); + }; + + const handleDeleteImg = (uid: number | string) => { + const list = _.filter( + message.imgs, + (item: MessageItem) => item.uid !== uid + ); + setMessage({ + ...message, + imgs: list + }); + }; - const handleDeleteLastImage = useCallback(() => { - if (message.imgs && message.imgs?.length > 0) { - const newImgList = [...(message.imgs || [])]; - const lastImage = newImgList.pop(); - if (lastImage) { - handleDeleteImg(lastImage.uid); + const handleOnPaste = (e: any) => { + const text = e.clipboardData.getData('text'); + if (!text) { + e.preventDefault(); + getPasteContent(e); } - } - }, [message.imgs, handleDeleteImg]); + }; - const handleKeyDown = useCallback( - (event: any) => { - if ( - event.key === 'Backspace' && - message.content === '' && - message.imgs && - message.imgs?.length > 0 - ) { - // inputref blur - event.preventDefault(); - handleDeleteLastImage(); + const handleDeleteLastImage = useCallback(() => { + if (message.imgs && message.imgs?.length > 0) { + const newImgList = [...(message.imgs || [])]; + const lastImage = newImgList.pop(); + if (lastImage) { + handleDeleteImg(lastImage.uid); + } } - }, - [message, handleDeleteLastImage] - ); + }, [message.imgs, handleDeleteImg]); - const handleSelectPrompt = (list: CurrentMessage[]) => { - presetPrompt?.(list); - }; + const handleKeyDown = useCallback( + (event: any) => { + if ( + event.key === 'Backspace' && + message.content === '' && + message.imgs && + message.imgs?.length > 0 + ) { + // inputref blur + event.preventDefault(); + handleDeleteLastImage(); + } + }, + [message, handleDeleteLastImage] + ); - useHotkeys( - HotKeys.SUBMIT, - (e: any) => { - console.log('submit message', loading); - e.preventDefault(); - handleSendMessage(); - }, - { - enabled: !loading && !isDisabled, - enableOnFormTags: focused, - preventDefault: true - } - ); - useHotkeys( - HotKeys.ADD, - (e: any) => { - e.preventDefault(); - e.stopPropagation(); - handleAddMessage(); - }, - { - enabled: !loading, - enableOnFormTags: focused, - preventDefault: true - } - ); + const handleSelectPrompt = (list: CurrentMessage[]) => { + presetPrompt?.(list); + }; - useHotkeys( - HotKeys.FOCUS, - () => { - inputRef.current?.focus?.({ - cursor: 'end' - }); - }, - { preventDefault: true } - ); + useImperativeHandle(ref, () => ({ + handleInputChange: handleInputChange + })); + + useHotkeys( + HotKeys.SUBMIT, + (e: any) => { + console.log('submit message', loading); + e.preventDefault(); + handleSendMessage(); + }, + { + enabled: !loading && !isDisabled, + enableOnFormTags: focused, + preventDefault: true + } + ); + useHotkeys( + HotKeys.ADD, + (e: any) => { + e.preventDefault(); + e.stopPropagation(); + handleAddMessage(); + }, + { + enabled: !loading, + enableOnFormTags: focused, + preventDefault: true + } + ); + + useHotkeys( + HotKeys.FOCUS, + () => { + inputRef.current?.focus?.({ + cursor: 'end' + }); + }, + { preventDefault: true } + ); - return ( -
-
-
- { - <> - {actions.includes('role') && ( - <> - + + + )} + {actions.includes('upload') && message.role === Roles.User && ( + } - > - {intl.formatMessage({ id: `playground.${message.role}` })} - - - - )} - {actions.includes('upload') && message.role === Roles.User && ( - + )} + + } + {tools} + {actions.includes('check') && ( + + {checkLabel} + + )} + {actions.includes('clear') && ( + + - - )} + onClick={handleClearAll} + > + + )} - {actions.includes('layout') && updateLayout && ( - <> - - {layoutOptions.map((option) => ( - - - - ))} - - )} -
-
- {actions.includes('add') && ( - - [{KeyMap.ADD.textKeybinding}]{' '} + > + + + ))} + + )} +
+
+ {actions.includes('add') && ( + + [{KeyMap.ADD.textKeybinding}]{' '} + {intl.formatMessage({ id: 'common.button.add' })} + + } + > + - - )} - {!loading ? ( - - [{KeyMap.SUBMIT.textKeybinding}]{' '} - {intl.formatMessage({ id: 'common.button.submit' })} - - } - > + + + )} + {!loading ? ( + + [{KeyMap.SUBMIT.textKeybinding}]{' '} + {intl.formatMessage({ id: 'common.button.submit' })} + + } + > + + + ) : ( - + icon={ + + } + > + )} +
+
+ +
+ {actions.includes('paste') ? ( + ) : ( - + + )} + {!message.content && !focused && ( + )}
+ setOpen(false)} + onSelect={handleSelectPrompt} + >
- -
- {actions.includes('paste') ? ( - - ) : ( - - )} - {!message.content && !focused && ( - - )} -
- setOpen(false)} - onSelect={handleSelectPrompt} - > -
- ); -}; + ); + } +); export default MessageInput; diff --git a/src/pages/playground/config/index.ts b/src/pages/playground/config/index.ts index b7295123..990a3bcf 100644 --- a/src/pages/playground/config/index.ts +++ b/src/pages/playground/config/index.ts @@ -121,3 +121,15 @@ export const OpenAIViewCode = { logcommand: 'data[0].b64_json' } }; + +export const promptList = [ + 'a lovely cat.', + "Digital art, portrait of an anthropomorphic roaring Tiger warrior with full armor, close up in the middle of a battle, behind him there is a banner with the text 'Open Source'.", + 'An astronaut riding a green horse.', + "a female character with long, flowing hair that appears to be made of ethereal, swirling patterns resembling the Northern Lights or Aurora Borealis. The background is dominated by deep blues and purples, creating a mysterious and dramatic atmosphere. The character's face is serene, with pale skin and striking features. She wears a dark-colored outfit with subtle patterns. The overall style of the artwork is reminiscent of fantasy or supernatural genres.", + "A whimsical and creative image depicting a hybrid creature that is a mix of a waffle and a hippopotamus, basking in a river of melted butter amidst a breakfast-themed landscape. It features the distinctive, bulky body shape of a hippo. However, instead of the usual grey skin, the creature's body resembles a golden-brown, crispy waffle fresh off the griddle. The skin is textured with the familiar grid pattern of a waffle, each square filled with a glistening sheen of syrup. The environment combines the natural habitat of a hippo with elements of a breakfast table setting, a river of warm, melted butter, with oversized utensils or plates peeking out from the lush, pancake-like foliage in the background, a towering pepper mill standing in for a tree. As the sun rises in this fantastical world, it casts a warm, buttery glow over the scene. The creature, content in its butter river, lets out a yawn. Nearby, a flock of birds take flight.", + 'A cinematic shot of a baby racoon wearing an intricate italian priest robe.', + 'Create portraits of characters in the style of classical oil painting, Capturing the essence of Chinese aristocracy in the Han Dynasty period. This portrait should feature a Chinese male character dressed in exquisite and gorgeous Chinese Han style clothing, with a dignified demeanor. The background should be a simple and elegant wallpaper pattern, with the face and upper body of the character as the focus. The lighting should be soft and diffuse, highlighting the characteristics of the character and the complex details of the clothing. The color palette should be rich and warm, with red, gold, and dark green.', + 'photo of a young woman with long, wavy brown hair tied in a bun and glasses. She has a fair complexion and is wearing subtle makeup, emphasizing her eyes and lips. She is dressed in a black top. The background appears to be an urban setting with a building facade, and the sunlight casts a warm glow on her face.', + 'A portrait of women with blue eyes.' +]; diff --git a/src/pages/resources/components/add-worker.tsx b/src/pages/resources/components/add-worker.tsx index 9ee1ea18..1b01a7dc 100644 --- a/src/pages/resources/components/add-worker.tsx +++ b/src/pages/resources/components/add-worker.tsx @@ -62,6 +62,11 @@ const AddWorker: React.FC = (props) => { theme="dark" code={addWorkerGuide.win.registerWorker(origin)} > +

Docker

+

3. {intl.formatMessage({ id: 'resources.worker.add.step3' })}

diff --git a/src/pages/resources/config/index.ts b/src/pages/resources/config/index.ts index f2b09829..844afa62 100644 --- a/src/pages/resources/config/index.ts +++ b/src/pages/resources/config/index.ts @@ -28,5 +28,12 @@ export const addWorkerGuide = { registerWorker(server: string) { return `Invoke-Expression "& { $((Invoke-WebRequest -Uri "https://get.gpustack.ai" -UseBasicParsing).Content) } --server-url ${server} --token mytoken"`; } + }, + docker: { + getToken: + 'Get-Content -Path (Join-Path -Path $env:APPDATA -ChildPath "gpustack\\token") -Raw', + registerWorker(server: string) { + return `docker run -d --gpus all --ipc=host --network=host gpustack/gpustack --server-url ${server} --token mytoken`; + } } };