administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-03 09:45:22 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Add code editor

Browse Source
This commit is contained in:
Nick Mowen 2022-12-05 21:09:38 -07:00
parent f45651fe2f
commit 31753aec96
6 changed files with 975 additions and 173 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1131
web/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

2
web/package.json
View File

@ -22,7 +22,7 @@
"preact-router": "^4.1.0", "preact-router": "^4.1.0",
"react": "npm:@preact/compat@^17.1.2", "react": "npm:@preact/compat@^17.1.2",
"react-dom": "npm:@preact/compat@^17.1.2", "react-dom": "npm:@preact/compat@^17.1.2",
"react-editor-js": "^2.1.0", "@uiw/react-textarea-code-editor": "^2.0.6",
"swr": "^1.3.0", "swr": "^1.3.0",
"video.js": "^7.20.3", "video.js": "^7.20.3",
"videojs-playlist": "^5.0.0", "videojs-playlist": "^5.0.0",

2
web/src/Sidebar.jsx
View File

@ -44,8 +44,10 @@ export default function Sidebar() {
</Match> </Match>
{birdseye?.enabled ? <Destination href="/birdseye" text="Birdseye" /> : null} {birdseye?.enabled ? <Destination href="/birdseye" text="Birdseye" /> : null}
<Destination href="/events" text="Events" /> <Destination href="/events" text="Events" />
<Separator />
<Destination href="/storage" text="Storage" /> <Destination href="/storage" text="Storage" />
<Destination href="/system" text="System" /> <Destination href="/system" text="System" />
<Destination href="/config" text="Config" />
<Separator /> <Separator />
<div className="flex flex-grow" /> <div className="flex flex-grow" />
{ENV !== 'production' ? ( {ENV !== 'production' ? (

1
web/src/app.tsx
View File

@ -37,6 +37,7 @@ export default function App() {
/> />
<AsyncRoute path="/storage" getComponent={Routes.getStorage} /> <AsyncRoute path="/storage" getComponent={Routes.getStorage} />
<AsyncRoute path="/system" getComponent={Routes.getSystem} /> <AsyncRoute path="/system" getComponent={Routes.getSystem} />
<AsyncRoute path="/config" getComponent={Routes.getConfig} />
<AsyncRoute path="/styleguide" getComponent={Routes.getStyleGuide} /> <AsyncRoute path="/styleguide" getComponent={Routes.getStyleGuide} />
<Cameras default path="/" /> <Cameras default path="/" />
</Router> </Router>

7
web/src/routes/Config.jsx
View File

@ -1,12 +1,13 @@
import { h, Fragment } from 'preact'; import { h, Fragment } from 'preact';
import useSWR from 'swr'; import useSWR from 'swr';
import { createReactEditorJS } from 'react-editor-js'; import CodeEditor from '@uiw/react-textarea-code-editor';
import ActivityIndicator from '../components/ActivityIndicator'; import ActivityIndicator from '../components/ActivityIndicator';
import Heading from '../components/Heading'; import Heading from '../components/Heading';
import { useState } from 'preact/hooks';
export default function Config() { export default function Config() {
const { data: config } = useSWR('config/raw'); const { data: config } = useSWR('config/raw');
const ReactEditorJS = createReactEditorJS(); const [newCode, setNewCode] = useState(config);
if (!config) { if (!config) {
return <ActivityIndicator />; return <ActivityIndicator />;
@ -16,7 +17,7 @@ export default function Config() {
<div className="space-y-4 p-2 px-4"> <div className="space-y-4 p-2 px-4">
<Heading>Config</Heading> <Heading>Config</Heading>
<ReactEditorJS defaultValue={config} /> <CodeEditor value={config} language="yaml" onChange={(e) => setNewCode(e.target.value)} />
</div> </div>
); );
} }

5
web/src/routes/index.js
View File

@ -38,6 +38,11 @@ export async function getStorage(_url, _cb, _props) {
return module.default; return module.default;
} }
export async function getConfig(_url, _cb, _props) {
const module = await import('./Config.jsx');
return module.default;
}
export async function getStyleGuide(_url, _cb, _props) { export async function getStyleGuide(_url, _cb, _props) {
const module = await import('./StyleGuide.jsx'); const module = await import('./StyleGuide.jsx');
return module.default; return module.default;