Local Libraries in Settings

This commit is contained in:
2025-03-19 22:44:11 +01:00
parent ecd76712d8
commit 2092db2ba3
8 changed files with 95 additions and 19 deletions

View File

@ -1,4 +1,8 @@
import {ReactElement} from "react";
import {ReactElement, useState} from "react";
import INewLibraryRecord, {Validate} from "./records/INewLibraryRecord";
import Loader from "../Loader";
import LocalLibraryFunctions from "../LocalLibraryFunctions";
import "../../styles/localLibrary.css";
export default interface ILocalLibrary {
localLibraryId: string;
@ -6,9 +10,36 @@ export default interface ILocalLibrary {
libraryName: string;
}
export function LocalLibrary(library: ILocalLibrary) : ReactElement {
return (<div key={library.localLibraryId}>
<p className={"LocalLibraryFunctions-Name"}>{library.libraryName}</p>
<p className={"LocalLibraryFunctions-Path"}>{library.basePath}</p>
export function LocalLibraryItem({apiUri, library} : {apiUri: string, library: ILocalLibrary | null}) : ReactElement {
const [loading, setLoading] = useState<boolean>(false);
const [record, setRecord] = useState<INewLibraryRecord>({
path: library?.basePath ?? "",
name: library?.libraryName ?? ""
});
return (<div className="LocalLibraryFunctions">
<label htmlFor="LocalLibraryFunctions-Name">Library Name</label>
<input id="LocalLibraryFunctions-Name" className="LocalLibraryFunctions-Name" placeholder="Library Name" defaultValue={library ? library.libraryName : "New Library"}
onChange={(e) => setRecord({...record, name: e.currentTarget.value})}/>
<label htmlFor="LocalLibraryFunctions-Path">Library Path</label>
<input id="LocalLibraryFunctions-Path" className="LocalLibraryFunctions-Path" placeholder="Library Path" defaultValue={library ? library.basePath : ""}
onChange={(e) => setRecord({...record, path: e.currentTarget.value})}/>
{library
? <button className="LocalLibraryFunctions-Action" onClick={() => {
if(record === null || Validate(record) === false)
return;
setLoading(true);
LocalLibraryFunctions.UpdateLibrary(apiUri, library.localLibraryId, record)
.finally(() => setLoading(false));
}}>Edit</button>
: <button className="LocalLibraryFunctions-Action" onClick={() => {
if(record === null || Validate(record) === false)
return;
setLoading(true);
LocalLibraryFunctions.CreateLibrary(apiUri, record)
.finally(() => setLoading(false));
}}>Add</button>
}
<Loader loading={loading} style={{width:"40px",height:"40px"}}/>
</div>);
}

View File

@ -20,8 +20,9 @@ export function NotificationConnectorItem({apiUri, notificationConnector} : {api
const [selectedConnectorElement, setSelectedConnectorElement] = useState<ReactElement>(<DefaultItem apiUri={apiUri} notificationConnector={null} />);
return <>
<p>New Notification Connector</p>
return <div>
<div>New Notification Connector</div>
<label>Type</label>
<select defaultValue="default" onChange={(e) => {
switch (e.currentTarget.value){
case "default": setSelectedConnectorElement(<DefaultItem apiUri={apiUri} notificationConnector={null} />); break;
@ -36,7 +37,7 @@ export function NotificationConnectorItem({apiUri, notificationConnector} : {api
<option value="lunasea">Lunasea</option>
</select>
{selectedConnectorElement}
</>;
</div>;
}
function DefaultItem({apiUri, notificationConnector}:{apiUri: string, notificationConnector: INotificationConnector | null}) : ReactElement {

View File

@ -1,4 +1,12 @@
export default interface INewLibraryRecord {
path: string;
name: string;
}
export function Validate(record: INewLibraryRecord) : boolean {
if(record.path.length < 1)
return false;
if(record.name.length < 1)
return false;
return true;
}