From 2f1dc660096208a27bc03449765e52b2dc017e1a Mon Sep 17 00:00:00 2001 From: Kevin F Date: Mon, 18 Nov 2024 11:29:34 +0100 Subject: [PATCH] fix metadata modal --- build/Build.fs | 4 +- src/Client/Modals/Loading.fs | 4 +- .../SharedComponents/Metadata/Generic.fs | 2 - src/Client/SidebarComponents/Navbar.fs | 142 +++++++++--------- 4 files changed, 73 insertions(+), 79 deletions(-) diff --git a/build/Build.fs b/build/Build.fs index 573a6960..2f33f215 100644 --- a/build/Build.fs +++ b/build/Build.fs @@ -136,7 +136,7 @@ module Docker = let dockerImageName = "freymaurer/swate" let dockerContainerName = "swate" - let port = "8080" + let port = "5000" let dockerCreateImage(tag:string option) = run @@ -160,7 +160,7 @@ module Docker = /// Runs full docker compose stack with the swate:new image. /// let DockerTestNewStack() = - let dockerComposeNewPath = Path.getFullName ".db\docker.compose.new.yml" + let dockerComposeNewPath = Path.getFullName ".db/docker.compose.new.yml" run dockerCompose ["-f"; dockerComposeNewPath; "up"] __SOURCE_DIRECTORY__ Target.create "docker-test" (fun _ -> diff --git a/src/Client/Modals/Loading.fs b/src/Client/Modals/Loading.fs index 6ba2f532..216f68aa 100644 --- a/src/Client/Modals/Loading.fs +++ b/src/Client/Modals/Loading.fs @@ -14,11 +14,11 @@ type Loading = static member Modal(?rmv: Browser.Types.MouseEvent -> unit) = Daisy.modal.div [ - prop.className "modal-open" + modal.open' prop.children [ Daisy.modalBackdrop [if rmv.IsSome then prop.onClick rmv.Value] Daisy.modalBox.div [ - prop.className "size-auto flex" + prop.className "size-auto flex min-w-0" prop.children [ Loading.Component ] diff --git a/src/Client/SharedComponents/Metadata/Generic.fs b/src/Client/SharedComponents/Metadata/Generic.fs index f84bc242..81f559b7 100644 --- a/src/Client/SharedComponents/Metadata/Generic.fs +++ b/src/Client/SharedComponents/Metadata/Generic.fs @@ -38,8 +38,6 @@ type Generic = ] ] ] - static member BoxedField (content: ReactElement list) = - Generic.BoxedField (content = content) static member Section (children: ReactElement seq) = Html.section [ diff --git a/src/Client/SidebarComponents/Navbar.fs b/src/Client/SidebarComponents/Navbar.fs index aea9f48c..b7e8c8f7 100644 --- a/src/Client/SidebarComponents/Navbar.fs +++ b/src/Client/SidebarComponents/Navbar.fs @@ -83,83 +83,79 @@ let AddMetaDataButtons refresh (dispatch: Messages.Msg -> unit) = ] let NoMetadataModalContent refresh (dispatch: Messages.Msg -> unit) = - Html.section [ - Components.Forms.Generic.BoxedField [ - Html.h2 "Create Top Level Metadata" - Html.p "Choose one of the following top level meta data types to create" - AddMetaDataButtons refresh dispatch - ] - ] + Components.Forms.Generic.BoxedField (content=[ + Html.h2 "Create Top Level Metadata" + Html.p "Choose one of the following top level meta data types to create" + AddMetaDataButtons refresh dispatch + ]) let UpdateMetadataModalContent excelMetadataType setExcelMetadataType closeModal (dispatch: Messages.Msg -> unit) = - Html.div [ - prop.children [ - match excelMetadataType with - | { Metadata = Some (ArcFiles.Assay assay)} -> - let setAssay (assay: ArcAssay) = - setExcelMetadataType { - excelMetadataType with - Metadata = Some (ArcFiles.Assay assay) - } - let setAssayDataMap (assay: ArcAssay) (dataMap: DataMap option) = - assay.DataMap <- dataMap - Assay.Main(assay, setAssay, setAssayDataMap) - | { Metadata = Some (ArcFiles.Study (study, assays))} -> - let setStudy (study: ArcStudy, assays: ArcAssay list) = - setExcelMetadataType { - excelMetadataType with - Metadata = Some (ArcFiles.Study (study, assays)) - } - let setStudyDataMap (study: ArcStudy) (dataMap: DataMap option) = - study.DataMap <- dataMap - Study.Main(study, assays, setStudy, setStudyDataMap) - | { Metadata = Some (ArcFiles.Investigation investigation)} -> - let setInvestigation (investigation: ArcInvestigation) = - setExcelMetadataType { - excelMetadataType with - Metadata = Some (ArcFiles.Investigation investigation) - } - Investigation.Main(investigation, setInvestigation) - | { Metadata = Some (ArcFiles.Template template)} -> - let setTemplate (template: Template) = - setExcelMetadataType { - excelMetadataType with - Metadata = Some (ArcFiles.Template template) - } - Template.Main(template, setTemplate) - | _ -> Html.none - Html.section [ - prop.className "pt-0" - prop.children [ - Components.Forms.Generic.BoxedField [ - Html.div [ - Daisy.button.a [ - button.primary - prop.text "Update Metadata Type" - prop.onClick (fun _ -> - if excelMetadataType.Metadata.IsSome then - OfficeInterop.UpdateTopLevelMetadata(excelMetadataType.Metadata.Value) - |> OfficeInteropMsg - |> dispatch - closeModal() - else - logw ("Tried updating metadata sheet without given metadata") - ) - ] - Daisy.button.a [ - button.error - prop.text "Delete Metadata Type" - prop.onClick (fun _ -> - OfficeInterop.DeleteTopLevelMetadata + React.fragment [ + match excelMetadataType with + | { Metadata = Some (ArcFiles.Assay assay)} -> + let setAssay (assay: ArcAssay) = + setExcelMetadataType { + excelMetadataType with + Metadata = Some (ArcFiles.Assay assay) + } + let setAssayDataMap (assay: ArcAssay) (dataMap: DataMap option) = + assay.DataMap <- dataMap + Assay.Main(assay, setAssay, setAssayDataMap) + | { Metadata = Some (ArcFiles.Study (study, assays))} -> + let setStudy (study: ArcStudy, assays: ArcAssay list) = + setExcelMetadataType { + excelMetadataType with + Metadata = Some (ArcFiles.Study (study, assays)) + } + let setStudyDataMap (study: ArcStudy) (dataMap: DataMap option) = + study.DataMap <- dataMap + Study.Main(study, assays, setStudy, setStudyDataMap) + | { Metadata = Some (ArcFiles.Investigation investigation)} -> + let setInvestigation (investigation: ArcInvestigation) = + setExcelMetadataType { + excelMetadataType with + Metadata = Some (ArcFiles.Investigation investigation) + } + Investigation.Main(investigation, setInvestigation) + | { Metadata = Some (ArcFiles.Template template)} -> + let setTemplate (template: Template) = + setExcelMetadataType { + excelMetadataType with + Metadata = Some (ArcFiles.Template template) + } + Template.Main(template, setTemplate) + | _ -> Html.none + Components.Forms.Generic.Section [ + Components.Forms.Generic.BoxedField (content= [ + Html.div [ + prop.className "flex flex-col md:flex-row gap-4" + prop.children [ + Daisy.button.a [ + button.primary + prop.text "Update Metadata Type" + prop.onClick (fun _ -> + if excelMetadataType.Metadata.IsSome then + OfficeInterop.UpdateTopLevelMetadata(excelMetadataType.Metadata.Value) |> OfficeInteropMsg |> dispatch closeModal() - ) - ] + else + logw ("Tried updating metadata sheet without given metadata") + ) + ] + Daisy.button.a [ + button.error + prop.text "Delete Metadata Type" + prop.onClick (fun _ -> + OfficeInterop.DeleteTopLevelMetadata + |> OfficeInteropMsg + |> dispatch + closeModal() + ) ] ] ] - ] + ]) ] ] @@ -185,7 +181,7 @@ let SelectModalDialog (closeModal: unit -> unit) (dispatch: Messages.Msg -> unit Loading = false } } - React.useEffectOnce(refreshMetadataState >> Promise.start) + React.useLayoutEffectOnce(refreshMetadataState >> Promise.start) Daisy.modal.div [ // Add the "is-active" class to display the modal modal.active @@ -193,12 +189,12 @@ let SelectModalDialog (closeModal: unit -> unit) (dispatch: Messages.Msg -> unit Daisy.modalBackdrop [ prop.onClick (fun _ -> closeModal()) ] - Daisy.modalBox.form [ - prop.className "overflow-y-auto" + Daisy.modalBox.div [ + prop.className "overflow-y-auto h-[100%]" prop.children [ match excelMetadataType with | { Loading = true } -> - Modals.Loading.Modal() + Modals.Loading.Component | { Metadata = None } -> NoMetadataModalContent refreshMetadataState dispatch | { Metadata = Some metadata } ->