feat: add a few default options in admin/Home (#39)
Meng Zhang
GitHub
parent
1c61ef3944
commit
350b719db9
|
|
@ -16,5 +16,37 @@ st.set_page_config(page_title="Tabby Admin - Home")
|
|||
|
||||
st.markdown("## Tabby")
|
||||
st.markdown(" ".join(map(make_badge_markdown, SERVICES)))
|
||||
st.markdown("---")
|
||||
|
||||
monaco.st_monaco()
|
||||
SNIPPETS = {
|
||||
"Clear": "# Write some code ...",
|
||||
"Fibonacci": "def fib(n):",
|
||||
"Parse JSON": """def parse_json_lines(filename: str) -> List[Any]:
|
||||
output = []
|
||||
with open(filename, "r", encoding="utf-8") as f:
|
||||
""",
|
||||
"Data ORM": """import birdchirp
|
||||
|
||||
from birdchirp.model.chirp import chirp
|
||||
from birdchirp.db.mysql import MysqlDb
|
||||
|
||||
class User:
|
||||
def __init__(self, user_id):
|
||||
self.user_id = user_id
|
||||
self.db = MysqlDb()
|
||||
|
||||
def get_avatar""",
|
||||
}
|
||||
|
||||
|
||||
def code_editor():
|
||||
code = ""
|
||||
cols = st.columns(len(SNIPPETS))
|
||||
for col, (k, v) in zip(cols, SNIPPETS.items()):
|
||||
with col:
|
||||
if st.button(k):
|
||||
code = v
|
||||
monaco.st_monaco(key="default", code=code)
|
||||
|
||||
|
||||
code_editor()
|
||||
|
|
|
|||
|
|
@ -30,8 +30,8 @@ else:
|
|||
# `declare_component` and call it done. The wrapper allows us to customize
|
||||
# our component's API: we can pre-process its input args, post-process its
|
||||
# output value, and add a docstring for users.
|
||||
def st_monaco(tabby_server_url="http://localhost:5000", key=None):
|
||||
_editor_func(tabby_server_url=tabby_server_url, key=key)
|
||||
def st_monaco(key, tabby_server_url=None, code=None):
|
||||
_editor_func(tabby_server_url=tabby_server_url, code=code, key=key)
|
||||
|
||||
|
||||
# Add some test code to play with the component while it's in development.
|
||||
|
|
@ -40,5 +40,9 @@ def st_monaco(tabby_server_url="http://localhost:5000", key=None):
|
|||
if not _RELEASE:
|
||||
import streamlit as st
|
||||
|
||||
tabby_server_url = st.text_input("Tabby Server URL", value="http://localhost:5000")
|
||||
st_monaco(tabby_server_url)
|
||||
code = st.text_input("code")
|
||||
set_code = st.button("Set code")
|
||||
if set_code:
|
||||
st_monaco(code=code, key="1")
|
||||
else:
|
||||
st_monaco(key="1")
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
{
|
||||
"files": {
|
||||
"main.js": "./static/js/main.15818978.js",
|
||||
"main.js": "./static/js/main.c14dfe27.js",
|
||||
"index.html": "./index.html"
|
||||
},
|
||||
"entrypoints": [
|
||||
"static/js/main.15818978.js"
|
||||
"static/js/main.c14dfe27.js"
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
<!doctype html><html lang="en"><head><title>Streamlit Component</title><meta charset="UTF-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Streamlit Component"/><link rel="stylesheet" href="bootstrap.min.css"/><script defer="defer" src="./static/js/main.15818978.js"></script></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
|
||||
<!doctype html><html lang="en"><head><title>Streamlit Component</title><meta charset="UTF-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Streamlit Component"/><link rel="stylesheet" href="bootstrap.min.css"/><script defer="defer" src="./static/js/main.c14dfe27.js"></script></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -1,20 +1,19 @@
|
|||
import axios from "axios"
|
||||
import { useRenderData } from "streamlit-component-lib-react-hooks"
|
||||
|
||||
import React, { useEffect } from "react"
|
||||
import React, { useRef, useEffect} from "react"
|
||||
import Editor, { useMonaco } from "@monaco-editor/react"
|
||||
|
||||
const PythonParseJSON = `def parse_json_lines(filename: str) -> List[Any]:
|
||||
output = []
|
||||
with open(filename, "r", encoding="utf-8") as f:
|
||||
`
|
||||
|
||||
let TabbyServerURL = "http://localhost:5000"
|
||||
|
||||
export default function MonacoEditor() {
|
||||
const renderData = useRenderData()
|
||||
|
||||
TabbyServerURL = renderData.args.tabby_server_url
|
||||
if (renderData.args.tabby_server_url) {
|
||||
TabbyServerURL = renderData.args.tabby_server_url
|
||||
} else {
|
||||
TabbyServerURL = `${window.location.protocol}//${window.location.hostname}:5000`
|
||||
}
|
||||
|
||||
const monaco = useMonaco()
|
||||
useEffect(() => {
|
||||
|
|
@ -31,12 +30,19 @@ export default function MonacoEditor() {
|
|||
)
|
||||
}, [monaco])
|
||||
|
||||
const editorRef = useRef(null)
|
||||
useEffect(() => {
|
||||
if (renderData.args.code && editorRef.current) {
|
||||
editorRef.current.getModel().setValue(renderData.args.code)
|
||||
}
|
||||
}, [renderData.args.code, editorRef])
|
||||
|
||||
return (
|
||||
<div style={{ height: 400 }}>
|
||||
<Editor
|
||||
theme="vs-dark"
|
||||
defaultLanguage="python"
|
||||
defaultValue={PythonParseJSON}
|
||||
onMount={(editor) => (editorRef.current = editor)}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
Loading…
Reference in New Issue