diff --git a/gameyfin/src/main/frontend/components/administration/LibraryManagement.tsx b/gameyfin/src/main/frontend/components/administration/LibraryManagement.tsx
index 7fb4e0c..5f67a4e 100644
--- a/gameyfin/src/main/frontend/components/administration/LibraryManagement.tsx
+++ b/gameyfin/src/main/frontend/components/administration/LibraryManagement.tsx
@@ -68,6 +68,7 @@ function LibraryManagementLayout({getConfig, formik}: any) {
+
diff --git a/gameyfin/src/main/frontend/components/general/modals/LibraryCreationModal.tsx b/gameyfin/src/main/frontend/components/general/modals/LibraryCreationModal.tsx
index 6e86fde..53fc469 100644
--- a/gameyfin/src/main/frontend/components/general/modals/LibraryCreationModal.tsx
+++ b/gameyfin/src/main/frontend/components/general/modals/LibraryCreationModal.tsx
@@ -15,9 +15,10 @@ import LibraryDto from "Frontend/generated/de/grimsi/gameyfin/libraries/dto/Libr
import {LibraryEndpoint} from "Frontend/generated/endpoints";
import Input from "Frontend/components/general/input/Input";
import PathPickerModal from "Frontend/components/general/modals/PathPickerModal";
-import {Minus, Plus, XCircle} from "@phosphor-icons/react";
+import {ArrowRight, Minus, Plus, XCircle} from "@phosphor-icons/react";
import * as Yup from "yup";
import {SmallInfoField} from "Frontend/components/general/SmallInfoField";
+import DirectoryMappingDto from "Frontend/generated/de/grimsi/gameyfin/libraries/dto/DirectoryMappingDto";
interface LibraryCreationModalProps {
libraries: LibraryDto[];
@@ -57,7 +58,7 @@ export default function LibraryCreationModal({
return (
<>
-
+
{(onClose) => (
{(formik) => {
- function addDirectory(directory: string) {
+ function addDirectoryMapping(directory: DirectoryMappingDto) {
formik.setFieldValue("directories", [...formik.values.directories, directory]);
}
- function removeDirectory(directory: string) {
- formik.setFieldValue("directories", formik.values.directories.filter((d: string) => d !== directory));
+ function removeDirectoryMapping(directory: DirectoryMappingDto) {
+ formik.setFieldValue("directories", formik.values.directories.filter((d: DirectoryMappingDto) => d.internalPath !== directory.internalPath));
}
return (
@@ -103,11 +104,38 @@ export default function LibraryCreationModal({
- {formik.values.directories.map((directory: string) => (
-
- {directory}
-
-
diff --git a/gameyfin/src/main/frontend/components/general/modals/PathPickerModal.tsx b/gameyfin/src/main/frontend/components/general/modals/PathPickerModal.tsx
index 7b87631..2529a95 100644
--- a/gameyfin/src/main/frontend/components/general/modals/PathPickerModal.tsx
+++ b/gameyfin/src/main/frontend/components/general/modals/PathPickerModal.tsx
@@ -3,45 +3,58 @@ import {Form, Formik} from "formik";
import React, {useEffect, useState} from "react";
import Input from "Frontend/components/general/input/Input";
import FileTreeView from "Frontend/components/general/input/FileTreeView";
+import DirectoryMappingDto from "Frontend/generated/de/grimsi/gameyfin/libraries/dto/DirectoryMappingDto";
+import {ArrowRight} from "@phosphor-icons/react";
interface PathPickerModalProps {
- returnSelectedPath: (path: string) => void;
+ returnSelectedPath: (path: DirectoryMappingDto) => void;
isOpen: boolean;
onOpenChange: () => void;
}
export default function PathPickerModal({returnSelectedPath, isOpen, onOpenChange}: PathPickerModalProps) {
- const [currentlySelectedPath, setCurrentlySelectedPath] = useState("");
+ const [internalPath, setInternalPath] = useState("");
+ const [externalPath, setExternalPath] = useState("");
return (
-
+
{(onClose) => (
- {
- returnSelectedPath(values.path);
- setCurrentlySelectedPath("");
+ {
+ returnSelectedPath(values);
+ setInternalPath("");
+ setExternalPath("");
onClose();
}}>
{(formik) => {
useEffect(() => {
- formik.setFieldValue("path", currentlySelectedPath);
- }, [currentlySelectedPath]);
+ formik.setFieldValue("internalPath", internalPath);
+ }, [internalPath]);
return (