mirror of
https://github.com/blakeblackshear/frigate.git
synced 2025-01-21 00:06:44 +01:00
Clean up config editor (#11474)
* clean up config editor * remove unneeded size
This commit is contained in:
parent
cc3bbcc303
commit
910c85b1c0
@ -11,6 +11,8 @@ import copy from "copy-to-clipboard";
|
||||
import { useTheme } from "@/context/theme-provider";
|
||||
import { Toaster } from "@/components/ui/sonner";
|
||||
import { toast } from "sonner";
|
||||
import { LuCopy, LuSave } from "react-icons/lu";
|
||||
import { MdOutlineRestartAlt } from "react-icons/md";
|
||||
|
||||
type SaveOptions = "saveonly" | "restart";
|
||||
|
||||
@ -69,6 +71,7 @@ function ConfigEditor() {
|
||||
}
|
||||
|
||||
copy(editorRef.current.getValue());
|
||||
toast.success("Config copied to clipboard.", { position: "top-center" });
|
||||
}, [editorRef]);
|
||||
|
||||
useEffect(() => {
|
||||
@ -117,7 +120,6 @@ function ConfigEditor() {
|
||||
|
||||
return () => {
|
||||
configRef.current = null;
|
||||
editorRef.current = null;
|
||||
modelRef.current = null;
|
||||
};
|
||||
});
|
||||
@ -127,37 +129,51 @@ function ConfigEditor() {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="absolute bottom-16 left-0 right-0 top-2 md:left-2">
|
||||
<div className="mr-1 justify-between lg:flex">
|
||||
<Heading as="h2">Config</Heading>
|
||||
<div>
|
||||
<Button size="sm" className="mx-1" onClick={() => handleCopyConfig()}>
|
||||
Copy Config
|
||||
<div className="absolute bottom-2 left-0 right-0 top-2 md:left-2">
|
||||
<div className="relative h-full overflow-hidden">
|
||||
<div className="mr-1 flex items-center justify-between">
|
||||
<Heading as="h2" className="mb-0 ml-1 md:ml-0">
|
||||
Config Editor
|
||||
</Heading>
|
||||
<div className="flex flex-row gap-1">
|
||||
<Button
|
||||
size="sm"
|
||||
className="flex items-center gap-2"
|
||||
onClick={() => handleCopyConfig()}
|
||||
>
|
||||
<LuCopy className="text-secondary-foreground" />
|
||||
<span className="hidden md:block">Copy Config</span>
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
className="mx-1"
|
||||
className="flex items-center gap-2"
|
||||
onClick={() => onHandleSaveConfig("restart")}
|
||||
>
|
||||
Save & Restart
|
||||
<div className="relative size-5">
|
||||
<LuSave className="absolute left-0 top-0 size-3 text-secondary-foreground" />
|
||||
<MdOutlineRestartAlt className="absolute size-4 translate-x-1 translate-y-1/2 text-secondary-foreground" />
|
||||
</div>
|
||||
<span className="hidden md:block">Save & Restart</span>
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
className="mx-1"
|
||||
className="flex items-center gap-2"
|
||||
onClick={() => onHandleSaveConfig("saveonly")}
|
||||
>
|
||||
Save Only
|
||||
<LuSave className="text-secondary-foreground" />
|
||||
<span className="hidden md:block">Save Only</span>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{error && (
|
||||
<div className="overflow-scroll whitespace-pre-wrap p-4 text-danger">
|
||||
<div className="mt-2 max-h-[30%] overflow-auto whitespace-pre-wrap border-2 border-muted bg-background_alt p-4 text-sm text-danger md:max-h-full">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div ref={configRef} className="mt-2 h-full" />
|
||||
<div ref={configRef} className="mt-2 h-[calc(100%-2.75rem)]" />
|
||||
</div>
|
||||
<Toaster closeButton={true} />
|
||||
</div>
|
||||
);
|
||||
|
Loading…
Reference in New Issue
Block a user