1import { createSignal } from "solid-js";
2import { TextInput } from "../components/text-input.jsx";
3
4export const [hideMedia, setHideMedia] = createSignal(localStorage.hideMedia === "true");
5
6const Settings = () => {
7 return (
8 <div class="flex w-full flex-col gap-3 px-2">
9 <div class="flex items-center gap-1 font-semibold">
10 <span>Settings</span>
11 </div>
12 <div class="flex flex-col gap-2">
13 <div class="flex flex-col gap-0.5">
14 <label for="plcDirectory" class="select-none">
15 PLC Directory
16 </label>
17 <TextInput
18 id="plcDirectory"
19 value={localStorage.plcDirectory || "https://plc.directory"}
20 onInput={(e) => {
21 e.currentTarget.value.length ?
22 (localStorage.plcDirectory = e.currentTarget.value)
23 : localStorage.removeItem("plcDirectory");
24 }}
25 />
26 </div>
27 <div class="flex justify-between">
28 <div class="flex items-center gap-1">
29 <input
30 id="disableMedia"
31 type="checkbox"
32 checked={localStorage.hideMedia === "true"}
33 onChange={(e) => {
34 localStorage.hideMedia = e.currentTarget.checked;
35 setHideMedia(e.currentTarget.checked);
36 }}
37 />
38 <label for="disableMedia" class="select-none">
39 Hide media embeds
40 </label>
41 </div>
42 </div>
43 </div>
44 </div>
45 );
46};
47
48export { Settings };