Added monaco editor.

This commit is contained in:
SamTV12345 2024-03-13 15:20:17 +01:00
parent 4485aa6bf8
commit 22ae8111a3
3 changed files with 28 additions and 6 deletions

View file

@ -3,23 +3,26 @@ import {isJSONClean} from "../utils/utils.ts";
import {Trans} from "react-i18next";
import {IconButton} from "../components/IconButton.tsx";
import {RotateCw, Save} from "lucide-react";
import Editor from 'react-monaco-editor';
import Editor from '@monaco-editor/react';
export const SettingsPage = ()=>{
const settingsSocket = useStore(state=>state.settingsSocket)
const settings = useStore(state=>state.settings)
return <div>
<h1><Trans i18nKey="admin_settings.current"/></h1>
<Editor language="json" theme="vs-dark" options={{
comments: {
ignoreEmptyLines: true,
insertSpace: true
},
codeLens:false,
inDiffEditor: false
}} value={settings} onChange={(v)=>{
useStore.getState().setSettings(v)
useStore.getState().setSettings(v!)
}} className="settings"/>
<div className="settings-button-bar">
<IconButton icon={<Save/>} title={<Trans i18nKey="admin_settings.current_save.value"/>} onClick={() => {
<IconButton className="settingsButton" icon={<Save/>} title={<Trans i18nKey="admin_settings.current_save.value"/>} onClick={() => {
if (isJSONClean(settings!)) {
// JSON is clean so emit it to the server
settingsSocket!.emit('saveSettings', settings!);