-
Notifications
You must be signed in to change notification settings - Fork 40
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Backward patch from Dashboard 0.2.1 release (#341)
- Loading branch information
Showing
10 changed files
with
250 additions
and
152 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -24,11 +24,12 @@ jobs: | |
| git config user.email "[email protected]" | ||
| - name: Run chart-releaser | ||
| uses: powerfooI/[email protected].1 | ||
| uses: powerfooI/[email protected].2 | ||
| env: | ||
| CR_TOKEN: "${{ secrets.GITHUB_TOKEN }}" | ||
| with: | ||
| mark_as_latest: false | ||
| skip_existing: true | ||
| pages_branch: master | ||
| pages_index_path: docsite/static/index.yaml | ||
| pages_index_path: docsite/static/index.yaml | ||
| pr: true | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,96 +1,116 @@ | ||
| import { Terminal } from '@xterm/xterm' | ||
| import { Button, Modal } from 'antd' | ||
| import React from 'react' | ||
| import { intl } from '@/utils/intl'; | ||
| import { Terminal } from '@xterm/xterm'; | ||
| import { Button, Modal } from 'antd'; | ||
| import React from 'react'; | ||
|
|
||
| export interface ITerminal { | ||
| terminalId: string | ||
| onClose?: () => void | ||
| onConnected?: () => void | ||
| terminalId: string; | ||
| onClose?: () => void; | ||
| onConnected?: () => void; | ||
| } | ||
|
|
||
| function devLog(...args: any[]) { | ||
| if (process.env.NODE_ENV === 'development') { | ||
| console.log(...args) | ||
| console.log(...args); | ||
| } | ||
| } | ||
|
|
||
| export const OBTerminal: React.FC<ITerminal> = (props) => { | ||
| const { terminalId } = props | ||
| const ref = React.useRef<HTMLDivElement>(null) | ||
| const [ws, setWs] = React.useState<WebSocket | null>(null) | ||
| const { terminalId } = props; | ||
| const ref = React.useRef<HTMLDivElement>(null); | ||
| const [ws, setWs] = React.useState<WebSocket | null>(null); | ||
|
|
||
| React.useEffect(() => { | ||
| if (ref.current) { | ||
| const term = new Terminal({ | ||
| cols: 160, | ||
| rows: 60, | ||
| }) | ||
| term.open(ref.current) | ||
| }); | ||
| term.open(ref.current); | ||
|
|
||
| if (term.options.fontSize) { | ||
| const containerWidth = ref.current.clientWidth | ||
| const containerWidth = ref.current.clientWidth; | ||
|
|
||
| const cols = Math.floor(containerWidth / 9.2) | ||
| const rows = Math.floor(cols / 4) | ||
| term.resize(cols, rows) | ||
| const ws = new WebSocket(`ws://${location.host}/api/v1/terminal/${terminalId}?cols=${cols}&rows=${rows}`) | ||
| term.write('Hello from \x1B[1;3;31mOceanBase\x1B[0m\r\n') | ||
| const cols = Math.floor(containerWidth / 9.2); | ||
| const rows = Math.floor(cols / 4); | ||
| term.resize(cols, rows); | ||
| const ws = new WebSocket( | ||
| `ws://${location.host}/api/v1/terminal/${terminalId}?cols=${cols}&rows=${rows}`, | ||
| ); | ||
| term.write('Hello from \x1B[1;3;31mOceanBase\x1B[0m\r\n'); | ||
|
|
||
| ws.onopen = function () { | ||
| devLog('Websocket connection open ...') | ||
| devLog('Websocket connection open ...'); | ||
| // ws.send(JSON.stringify({ type: 'ping' })) | ||
| term.onData(function (data) { | ||
| ws.send(data) | ||
| }) | ||
| props.onConnected?.() | ||
| setWs(ws) | ||
| ws.send(data); | ||
| }); | ||
| props.onConnected?.(); | ||
| setWs(ws); | ||
|
|
||
| window.addEventListener('beforeunload', () => { | ||
| if (ws) { | ||
| ws.close() | ||
| props.onClose?.() | ||
| setWs(null) | ||
| ws.close(); | ||
| props.onClose?.(); | ||
| setWs(null); | ||
| } | ||
| }) | ||
| } | ||
| }); | ||
| }; | ||
|
|
||
| ws.onmessage = function (event) { | ||
| term.write(event.data) | ||
| } | ||
| term.write(event.data); | ||
| }; | ||
|
|
||
| ws.onclose = function () { | ||
| devLog('Connection closed.') | ||
| term.write('\r\nConnection closed.\r\n') | ||
| } | ||
| devLog('Connection closed.'); | ||
| term.write('\r\nConnection closed.\r\n'); | ||
| }; | ||
|
|
||
| ws.onerror = function (evt) { | ||
| console.error('WebSocket error observed:', evt) | ||
| } | ||
| console.error('WebSocket error observed:', evt); | ||
| }; | ||
| } | ||
| } | ||
|
|
||
| return () => { | ||
| window.removeEventListener('beforeunload', () => { }) | ||
| } | ||
| }, []) | ||
| window.removeEventListener('beforeunload', () => {}); | ||
| }; | ||
| }, []); | ||
|
|
||
| return ( | ||
| <> | ||
| {ws && <div style={{ marginBottom: 12 }}> | ||
| <Button danger type="primary" onClick={() => { | ||
| Modal.confirm({ | ||
| title: '断开连接', | ||
| content: '确定要断开连接吗？', | ||
| okType: 'danger', | ||
| onOk: () => { | ||
| ws.close() | ||
| props.onClose?.() | ||
| setWs(null) | ||
| } | ||
| }) | ||
| }}>断开连接</Button> | ||
| </div>} | ||
| {ws && ( | ||
| <div style={{ marginBottom: 12 }}> | ||
| <Button | ||
| danger | ||
| type="primary" | ||
| onClick={() => { | ||
| Modal.confirm({ | ||
| title: intl.formatMessage({ | ||
| id: 'Dashboard.components.Terminal.Disconnect', | ||
| defaultMessage: '断开连接', | ||
| }), | ||
| content: intl.formatMessage({ | ||
| id: 'Dashboard.components.Terminal.Disconnect1', | ||
| defaultMessage: '确定要断开连接吗？', | ||
| }), | ||
| okType: 'danger', | ||
| onOk: () => { | ||
| ws.close(); | ||
| props.onClose?.(); | ||
| setWs(null); | ||
| }, | ||
| }); | ||
| }} | ||
| > | ||
| {intl.formatMessage({ | ||
| id: 'Dashboard.components.Terminal.Disconnect', | ||
| defaultMessage: '断开连接', | ||
| })} | ||
| </Button> | ||
| </div> | ||
| )} | ||
| <div ref={ref} /> | ||
| </> | ||
| ) | ||
| } | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.