refactored components that inherit from selected data item base class

COMETwebapp.Tests/Components/EngineeringModel/PublicationsTableTestFixture.cs

@@ -144,7 +144,7 @@ public async Task VerifyPublicationDetails()
 
             Assert.Multiple(() =>
             {
-                Assert.That(this.renderer.Instance.IsPublicationDetailsPopupOpen, Is.EqualTo(true));
+                Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(true));
                 Assert.That(this.renderer.Instance.SelectedRow, Is.EqualTo(this.viewModel.Object.Rows.Items.First()));
             });
         }

COMETwebapp.Tests/Components/SiteDirectory/EngineeringModels/ActiveDomainsTableTestFixture.cs

@@ -120,12 +120,12 @@ public void VerifyOnInitialized()
         [Test]
         public async Task VerifyEditActiveDomains()
         {
-            Assert.That(this.renderer.Instance.IsEditPopupVisible, Is.EqualTo(false));
+            Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(false));
 
             var editActiveDomainsClickableItem = this.renderer.FindComponent<DxToolbarItem>();
             await this.renderer.InvokeAsync(editActiveDomainsClickableItem.Instance.Click.InvokeAsync);
 
-            Assert.That(this.renderer.Instance.IsEditPopupVisible, Is.EqualTo(true));
+            Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(true));
 
             var saveActiveDomainsButton = this.renderer.FindComponents<DxButton>().First(x => x.Instance.Id == "saveActiveDomainsButton");
             await this.renderer.InvokeAsync(saveActiveDomainsButton.Instance.Click.InvokeAsync);
@@ -140,7 +140,7 @@ public async Task VerifyEditActiveDomains()
             Assert.Multiple(() =>
             {
                 this.viewModel.Verify(x => x.ResetSelectedDomainsOfExpertise(), Times.Once);
-                Assert.That(this.renderer.Instance.IsEditPopupVisible, Is.EqualTo(false));
+                Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(false));
             });
         }
     }

COMETwebapp.Tests/Components/SiteDirectory/EngineeringModels/ParticipantsTableTestFixture.cs

@@ -133,7 +133,7 @@ public void VerifyOnInitialized()
             var details = this.renderer.Find("a");
             details.ClickAsync(new MouseEventArgs());
 
-            Assert.That(this.renderer.Instance.IsActiveDomainsDetailsOpen, Is.EqualTo(true));
+            Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(true));
         }
 
         [Test]

COMETwebapp.Tests/Components/SiteDirectory/Roles/ParticipantRolesTableTestFixture.cs

@@ -117,20 +117,20 @@ public async Task VerifyAddParticipantRoleClick()
         [Test]
         public async Task VerifyRowClick()
         {
-            Assert.That(this.renderer.Instance.IsRoleSelected, Is.EqualTo(false));
+            Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(false));
 
             var firstRow = this.viewModel.Object.Rows.Items.First();
             var grid = this.renderer.FindComponent<DxGrid>();
             await this.renderer.InvokeAsync(async () => await grid.Instance.SelectedDataItemChanged.InvokeAsync(firstRow));
 
-            Assert.That(this.renderer.Instance.IsRoleSelected, Is.EqualTo(true));
+            Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(true));
 
             var details = this.renderer.FindComponent<ParticipantRoleDetails>();
             await this.renderer.InvokeAsync(details.Instance.OnSubmit.InvokeAsync);
             this.viewModel.Verify(x => x.CreateOrEditParticipantRole(false), Times.Once);
 
             await this.renderer.InvokeAsync(details.Instance.OnCancel.InvokeAsync);
-            Assert.That(this.renderer.Instance.IsRoleSelected, Is.EqualTo(false));
+            Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(false));
         }
     }
 }

COMETwebapp.Tests/Components/SiteDirectory/Roles/PersonRolesTableTestFixture.cs

@@ -117,20 +117,20 @@ public async Task VerifyAddPersonRoleClick()
         [Test]
         public async Task VerifyRowClick()
         {
-            Assert.That(this.renderer.Instance.IsRoleSelected, Is.EqualTo(false));
+            Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(false));
 
             var firstRow = this.viewModel.Object.Rows.Items.First();
             var grid = this.renderer.FindComponent<DxGrid>();
             await this.renderer.InvokeAsync(async () => await grid.Instance.SelectedDataItemChanged.InvokeAsync(firstRow));
 
-            Assert.That(this.renderer.Instance.IsRoleSelected, Is.EqualTo(true));
+            Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(true));
 
             var details = this.renderer.FindComponent<PersonRoleDetails>();
             await this.renderer.InvokeAsync(details.Instance.OnSubmit.InvokeAsync);
             this.viewModel.Verify(x => x.CreateOrEditPersonRole(false), Times.Once);
 
             await this.renderer.InvokeAsync(details.Instance.OnCancel.InvokeAsync);
-            Assert.That(this.renderer.Instance.IsRoleSelected, Is.EqualTo(false));
+            Assert.That(this.renderer.Instance.IsOnEditMode, Is.EqualTo(false));
         }
     }
 }

COMETwebapp/Components/Common/DataItemDetailsComponent.razor

@@ -0,0 +1,31 @@
+<!------------------------------------------------------------------------------
+Copyright (c) 2023-2024 RHEA System S.A.
+    Authors: Sam Gerené, Alex Vorobiev, Alexander van Delft, Jaime Bernar, Antoine Théate, João Rua
+    This file is part of CDP4-COMET WEB Community Edition
+     The CDP4-COMET WEB Community Edition is the RHEA Web Application implementation of ECSS-E-TM-10-25 Annex A and Annex C.
+    The CDP4-COMET WEB Community Edition is free software; you can redistribute it and/or
+    modify it under the terms of the GNU Affero General Public
+    License as published by the Free Software Foundation; either
+    version 3 of the License, or (at your option) any later version.
+    The CDP4-COMET WEB Community Edition is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+    Affero General Public License for more details.
+    You should have received a copy of the GNU Affero General Public License
+    along with this program. If not, see http://www.gnu.org/licenses/.
+------------------------------------------------------------------------------->
+
+@namespace COMETwebapp.Components.Common
+
+<div class="data-item-details-section">
+    @if (this.IsSelected)
+    {
+        @this.ChildContent
+    }
+    else
+    {
+        <h5>Select an item to view or edit</h5>
+        <img src="images/comet-logo-black.png" class="data-item-details-image" alt="Comet Web"/>
+    }
+</div>
+

COMETwebapp/Components/Common/DataItemDetailsComponent.razor.cs

@@ -0,0 +1,46 @@
+// --------------------------------------------------------------------------------------------------------------------
+// <copyright file="DataItemDetailsComponent.razor.cs" company="RHEA System S.A.">
+//    Copyright (c) 2023-2024 RHEA System S.A.
+//
+//    Authors: Sam Gerené, Alex Vorobiev, Alexander van Delft, Jaime Bernar, Antoine Théate, João Rua
+//
+//    This file is part of CDP4-COMET WEB Community Edition
+//    The CDP4-COMET WEB Community Edition is the RHEA Web Application implementation of ECSS-E-TM-10-25 Annex A and Annex C.
+//
+//    The CDP4-COMET WEB Community Edition is free software; you can redistribute it and/or
+//    modify it under the terms of the GNU Affero General Public
+//    License as published by the Free Software Foundation; either
+//    version 3 of the License, or (at your option) any later version.
+//
+//    The CDP4-COMET WEB Community Edition is distributed in the hope that it will be useful,
+//    but WITHOUT ANY WARRANTY; without even the implied warranty of
+//    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+//    Affero General Public License for more details.
+//
+//    You should have received a copy of the GNU Affero General Public License
+//    along with this program.  If not, see <http://www.gnu.org/licenses/>.
+// </copyright>
+// --------------------------------------------------------------------------------------------------------------------
+
+namespace COMETwebapp.Components.Common
+{
+    using Microsoft.AspNetCore.Components;
+
+    /// <summary>
+    /// The <see cref="DataItemDetailsComponent" /> is used to display the details of a selected data item
+    /// </summary>
+    public partial class DataItemDetailsComponent
+    {
+        /// <summary>
+        /// Value asserting that the <see cref="DataItemDetailsComponent" /> is selected or not
+        /// </summary>
+        [Parameter]
+        public bool IsSelected { get; set; }
+
+        /// <summary>
+        /// The child content of the component
+        /// </summary>
+        [Parameter]
+        public RenderFragment ChildContent { get; set; }
+    }
+}

COMETwebapp/Components/Common/DataItemDetailsComponent.razor.css

@@ -0,0 +1,10 @@
+.data-item-details-section {
+    width: 50%;
+    padding: 30px;
+}
+
+.data-item-details-image {
+    margin: auto;
+    display: block;
+    width: 300px;
+}

COMETwebapp/Components/Common/SelectedDataItemBase.razor.cs

@@ -53,6 +53,11 @@ public abstract partial class SelectedDataItemBase<T, TRow> : DisposableComponen
         /// </summary>
         public bool ShouldCreateThing { get; protected set; }
 
+        /// <summary>
+        /// Gets or sets the condition to check if the current component is on edit mode
+        /// </summary>
+        public bool IsOnEditMode { get; protected set; }
+
         /// <summary>
         /// Gets or sets the grid control that is being customized.
         /// </summary>

COMETwebapp/Components/EngineeringModel/CommonFileStoresTable.razor

@@ -14,12 +14,11 @@ Copyright (c) 2023-2024 RHEA System S.A.
     You should have received a copy of the GNU Affero General Public License
     along with this program. If not, see http://www.gnu.org/licenses/.
 ------------------------------------------------------------------------------->
-
 @using COMETwebapp.Components.EngineeringModel.FileStore
 @inherits SelectedDataItemBase<CommonFileStore, CommonFileStoreRowViewModel>
 
 <LoadingComponent IsVisible="@(this.ViewModel.IsLoading)">
-    <div style="display: flex; justify-content: space-between;">
+    <div class="d-flex justify-content-between">
         <DxGrid @ref="this.Grid"
                 Data="this.ViewModel.Rows.Items"
                 ColumnResizeMode="GridColumnResizeMode.ColumnsContainer"
@@ -37,7 +36,8 @@ Copyright (c) 2023-2024 RHEA System S.A.
                 PagerNavigationMode="PagerNavigationMode.Auto"
                 PageSizeSelectorVisible="true"
                 PageSizeSelectorItems="@(new int[] { 20, 35, 50 })"
-                PageSizeSelectorAllRowsItemVisible="true">
+                PageSizeSelectorAllRowsItemVisible="true"
+                CssClass="height-fit-content">
             <Columns>
                 <DxGridDataColumn FieldName="@nameof(CommonFileStoreRowViewModel.Name)" MinWidth="150" />
                 <DxGridDataColumn FieldName="@nameof(CommonFileStoreRowViewModel.CreatedOn)" MinWidth="80" SearchEnabled="false" />
@@ -67,18 +67,14 @@ Copyright (c) 2023-2024 RHEA System S.A.
             </EditFormTemplate>
         </DxGrid>
 
-        @if (this.IsOnEditMode)
-        {
-            <div style="width: 70%; padding: 30px;">
-                <CommonFileStoresForm ViewModel="@this.ViewModel"
-                                      @bind-IsVisible="@this.IsOnEditMode"
-                                      ShouldCreate="false"/>
-                <DxButton Click="this.OnSeeFolderFileStructureClick">
-                    See Folder-File Structure
-                </DxButton>
-            </div>
-        }
-
+        <DataItemDetailsComponent IsSelected="@this.IsOnEditMode">
+            <CommonFileStoresForm ViewModel="@this.ViewModel"
+                                  @bind-IsVisible="@this.IsOnEditMode"
+                                  ShouldCreate="false"/>
+            <DxButton Click="this.OnSeeFolderFileStructureClick">
+                See Folder-File Structure
+            </DxButton>
+        </DataItemDetailsComponent>
     </div>
 </LoadingComponent>
 

COMETwebapp/Components/EngineeringModel/CommonFileStoresTable.razor.cs

@@ -47,11 +47,6 @@ public partial class CommonFileStoresTable : SelectedDataItemBase<CommonFileStor
         [Parameter, Required]
         public ICommonFileStoreTableViewModel ViewModel { get; set; }
 
-        /// <summary>
-        /// Gets the value to check if component is on edit mode
-        /// </summary>
-        public bool IsOnEditMode { get; private set; }
-
         /// <summary>
         /// Gets the value to check if the folder file structure component is visible
         /// </summary>

COMETwebapp/Components/EngineeringModel/OptionsTable.razor

@@ -14,11 +14,10 @@ Copyright (c) 2023-2024 RHEA System S.A.
     You should have received a copy of the GNU Affero General Public License
     along with this program. If not, see http://www.gnu.org/licenses/.
 ------------------------------------------------------------------------------->
-@using COMETwebapp.ViewModels.Components.EngineeringModel.Rows
-@inherits SelectedDataItemBase<CDP4Common.EngineeringModelData.Option, OptionRowViewModel>
+@inherits SelectedDataItemBase<Option, OptionRowViewModel>
 
 <LoadingComponent IsVisible="@(this.ViewModel.IsLoading)">
-    <div style="display: flex; justify-content: space-between;">
+    <div class="d-flex justify-content-between">
         <DxGrid @ref="this.Grid"
                 Data="this.ViewModel.Rows.Items"
                 ColumnResizeMode="GridColumnResizeMode.ColumnsContainer"
@@ -37,7 +36,8 @@ Copyright (c) 2023-2024 RHEA System S.A.
                 PagerNavigationMode="PagerNavigationMode.Auto"
                 PageSizeSelectorVisible="true"
                 PageSizeSelectorItems="@(new int[] { 20, 35, 50 })"
-                PageSizeSelectorAllRowsItemVisible="true">
+                PageSizeSelectorAllRowsItemVisible="true"
+                CssClass="height-fit-content">
             <Columns>
                 <DxGridDataColumn FieldName="@nameof(OptionRowViewModel.Name)" MinWidth="150"/>
                 <DxGridDataColumn FieldName="@nameof(OptionRowViewModel.ShortName)" MinWidth="80" SearchEnabled="false"/>
@@ -68,15 +68,11 @@ Copyright (c) 2023-2024 RHEA System S.A.
             </EditFormTemplate>
         </DxGrid>
 
-        @if (this.IsOnEditMode)
-        {
-            <div style="width: 70%; padding: 30px;">     
-                <OptionsForm ViewModel="@this.ViewModel"
-                             @bind-IsVisible="@this.IsOnEditMode"
-                             ShouldCreate="false"/>
-            </div>
-        }
-
+        <DataItemDetailsComponent IsSelected="@this.IsOnEditMode">
+            <OptionsForm ViewModel="@this.ViewModel"
+                         @bind-IsVisible="@this.IsOnEditMode"
+                         ShouldCreate="false"/>
+        </DataItemDetailsComponent>
     </div>
 </LoadingComponent>
 

COMETwebapp/Components/EngineeringModel/OptionsTable.razor.cs

@@ -47,11 +47,6 @@ public partial class OptionsTable : SelectedDataItemBase<Option, OptionRowViewMo
         [Parameter, Required]
         public IOptionsTableViewModel ViewModel { get; set; }
 
-        /// <summary>
-        /// Gets the value to check if component is on edit mode
-        /// </summary>
-        public bool IsOnEditMode { get; private set; }
-
         /// <summary>
         /// Method invoked when the component is ready to start, having received its
         /// initial parameters from its parent in the render tree.

COMETwebapp/Components/EngineeringModel/PublicationsTable.razor

@@ -73,7 +73,7 @@ Copyright (c) 2023-2024 RHEA System S.A.
 
 </LoadingComponent>
 
-<DxPopup @bind-Visible="@this.IsPublicationDetailsPopupOpen" HeaderText="Published Parameters" Width="60%" CloseOnOutsideClick="false">
+<DxPopup @bind-Visible="@this.IsOnEditMode" HeaderText="Published Parameters" Width="60%" CloseOnOutsideClick="false">
     <DxGrid Data="@(this.ViewModel.GetPublishedParametersRows(this.SelectedRow.Thing))"
             ColumnResizeMode="GridColumnResizeMode.ColumnsContainer"
             ShowAllRows="true">

COMETwebapp/Components/EngineeringModel/PublicationsTable.razor.cs

@@ -54,11 +54,6 @@ public partial class PublicationsTable : SelectedDataItemBase<Publication, Publi
         /// </summary>
         public PublicationRowViewModel SelectedRow { get; private set; }
 
-        /// <summary>
-        /// Gets the value to check if the publication details popup is open
-        /// </summary>
-        public bool IsPublicationDetailsPopupOpen { get; private set; }
-
         /// <summary>
         /// Method invoked when the component is ready to start, having received its
         /// initial parameters from its parent in the render tree.
@@ -78,7 +73,7 @@ protected override void OnInitialized()
         private void OnSelectedDataItemChanged(PublicationRowViewModel row)
         {
             this.SelectedRow = row;
-            this.IsPublicationDetailsPopupOpen = true;
+            this.IsOnEditMode = true;
         }
 
         /// <summary>

COMETwebapp/Components/SiteDirectory/DomainsOfExpertiseForm.razor

@@ -0,0 +1,46 @@
+<!------------------------------------------------------------------------------
+Copyright (c) 2023-2024 RHEA System S.A.
+    Authors: Sam Gerené, Alex Vorobiev, Alexander van Delft, Jaime Bernar, Antoine Théate, João Rua
+    This file is part of CDP4-COMET WEB Community Edition
+     The CDP4-COMET WEB Community Edition is the RHEA Web Application implementation of ECSS-E-TM-10-25 Annex A and Annex C.
+    The CDP4-COMET WEB Community Edition is free software; you can redistribute it and/or
+    modify it under the terms of the GNU Affero General Public
+    License as published by the Free Software Foundation; either
+    version 3 of the License, or (at your option) any later version.
+    The CDP4-COMET WEB Community Edition is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+    Affero General Public License for more details.
+    You should have received a copy of the GNU Affero General Public License
+    along with this program. If not, see http://www.gnu.org/licenses/.
+------------------------------------------------------------------------------->
+@inherits SelectedDataItemForm
+
+<EditForm Context="editFormContext" Model="@(this.ViewModel.Thing)" OnValidSubmit="@(this.OnValidSubmit)">
+    <FluentValidationValidator />
+    <DxFormLayout CssClass="w-100">
+        <DxFormLayoutItem Caption="Shortname:" ColSpanMd="10">
+            <DxTextBox @bind-Text="@this.ViewModel.Thing.ShortName"/>
+        </DxFormLayoutItem>
+        <DxFormLayoutItem Caption="Name:" ColSpanMd="10">
+            <DxTextBox @bind-Text="@this.ViewModel.Thing.Name"/>
+        </DxFormLayoutItem>
+        <DxFormLayoutItem Caption="Deprecated:" ColSpanMd="6">
+            <DxCheckBox @bind-Checked="@this.ViewModel.Thing.IsDeprecated"/>
+        </DxFormLayoutItem>
+    </DxFormLayout>
+    <div class="pt-3"></div>
+    <ValidationSummary />
+    <div class="dxbl-grid-edit-form-buttons">
+        <DxButton Id="saveCommonFileStoreButton"
+                  SubmitFormOnClick="true">
+            Save
+        </DxButton>
+
+        <DxButton Id="cancelCommonFileStoreButton"
+                  Click="@(() => this.OnCancel())"
+                  RenderStyle="ButtonRenderStyle.Secondary">
+            Cancel
+        </DxButton>
+    </div>
+</EditForm>