Skip to content

Commit

Permalink
Feat #660 Style components (#681)
Browse files Browse the repository at this point in the history
Styles updated, following the same colors, sizes and font from Figma
  • Loading branch information
joao4all authored Jun 21, 2024
1 parent 4bca94a commit a3e6845
Show file tree
Hide file tree
Showing 28 changed files with 567 additions and 128 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -22,4 +22,6 @@
@namespace COMET.Web.Common.Components.Applications
@inherits GenericApplicationTemplate<COMET.Web.Common.ViewModels.Components.Applications.IApplicationTemplateViewModel>

@this.Body
<div class="template-container">
@this.Body
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,9 @@ else
<DxTextBox ReadOnly="true" Text="@($"Active Model : {this.ViewModel.SelectedThing.EngineeringModelSetup.Name}")" SizeMode="SizeMode.Large" CssClass="m-bottom-20px" ></DxTextBox>
}
<CascadingValue Value="this.ViewModel.SelectedThing">
<div class="template-container">
@this.Body
</div>
</CascadingValue>
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ else
<DxTextBox ReadOnly="true" Text="@($"Active Model : {this.ViewModel.SelectedIterationData?.IterationName}")" SizeMode="SizeMode.Large" CssClass="m-bottom-20px" ></DxTextBox>
}
<CascadingValue Value="this.ViewModel.SelectedThing">
<div>
<div class="template-container">
@this.Body
</div>
</CascadingValue>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,7 @@ public void VerifyComponent()

Assert.Multiple(() =>
{
Assert.That(header.Attributes["class"]?.Value, Is.EqualTo("header-text"));
Assert.That(header.Attributes["class"]?.Value, Does.Contain("header-text"));
Assert.That(header.HasAttribute("style"), Is.True);
});

Expand Down
117 changes: 117 additions & 0 deletions COMETwebapp.Tests/Pages/ReferenceData/ReferenceDataPageTestFixture.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
// --------------------------------------------------------------------------------------------------------------------
// <copyright file="ReferenceDataPageTestFixture.cs" company="Starion Group S.A.">
// Copyright (c) 2024 Starion Group S.A.
//
// Authors: Sam Gerené, Alex Vorobiev, Alexander van Delft, Jaime Bernar, Théate Antoine, João Rua
//
// This file is part of COMET WEB Community Edition
// The COMET WEB Community Edition is the Starion Group Web Application implementation of ECSS-E-TM-10-25 Annex A and Annex C.
//
// The 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 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.Tests.Pages.ReferenceData
{
using Bunit;

using CDP4Dal;

using COMET.Web.Common.Model.Configuration;
using COMET.Web.Common.Services.ConfigurationService;
using COMET.Web.Common.Services.SessionManagement;
using COMET.Web.Common.Test.Helpers;
using COMET.Web.Common.ViewModels.Components.Applications;

using COMETwebapp.Components.ReferenceData.MeasurementScales;
using COMETwebapp.Components.ReferenceData.ParameterTypes;
using COMETwebapp.Pages.ReferenceData;
using COMETwebapp.ViewModels.Components.ReferenceData.MeasurementScales;
using COMETwebapp.ViewModels.Components.ReferenceData.ParameterTypes;
using COMETwebapp.ViewModels.Components.ReferenceData.Rows;

using DynamicData;

using Microsoft.AspNetCore.Components.Web;
using Microsoft.Extensions.DependencyInjection;

using Moq;

using NUnit.Framework;

using TestContext = Bunit.TestContext;

[TestFixture]
public class ReferenceDataPageTestFixture
{
private TestContext context;
private Mock<IParameterTypeTableViewModel> parameterTypesTableViewModel;
private Mock<IMeasurementScalesTableViewModel> measurementScalesTableViewModel;
private Mock<ISessionService> sessionService;
private IRenderedComponent<ReferenceDataPage> renderer;

[SetUp]
public void Setup()
{
this.context = new TestContext();

this.parameterTypesTableViewModel = new Mock<IParameterTypeTableViewModel>();
this.parameterTypesTableViewModel.Setup(x => x.Rows).Returns(new SourceList<ParameterTypeRowViewModel>());

this.measurementScalesTableViewModel = new Mock<IMeasurementScalesTableViewModel>();
this.measurementScalesTableViewModel.Setup(x => x.Rows).Returns(new SourceList<MeasurementScaleRowViewModel>());

this.sessionService = new Mock<ISessionService>();
this.sessionService.Setup(x => x.Session).Returns(new Mock<ISession>().Object);

var configuration = new Mock<IConfigurationService>();
configuration.Setup(x => x.ServerConfiguration).Returns(new ServerConfiguration());

this.context.ConfigureDevExpressBlazor();
this.context.Services.AddSingleton(this.sessionService.Object);
this.context.Services.AddSingleton(this.parameterTypesTableViewModel.Object);
this.context.Services.AddSingleton(this.measurementScalesTableViewModel.Object);
this.context.Services.AddSingleton(configuration.Object);
this.context.Services.AddSingleton<IApplicationTemplateViewModel, ApplicationTemplateViewModel>();

this.renderer = this.context.RenderComponent<ReferenceDataPage>();
}

[TearDown]
public void Teardown()
{
this.context.CleanContext();
}

[Test]
public async Task VerifyReferenceDataPage()
{
Assert.Multiple(() =>
{
Assert.That(this.renderer.Instance, Is.Not.Null);
Assert.That(this.renderer.Instance.SelectedComponent, Is.EqualTo(typeof(ParameterTypeTable)));
this.parameterTypesTableViewModel.Verify(x => x.InitializeViewModel(), Times.Once);
});

var toolBarItem = this.renderer.FindAll("button").ElementAt(1);
await this.renderer.InvokeAsync(() => toolBarItem.ClickAsync(new MouseEventArgs()));

Assert.Multiple(() =>
{
Assert.That(this.renderer.Instance.SelectedComponent, Is.EqualTo(typeof(MeasurementScalesTable)));
this.measurementScalesTableViewModel.Verify(x => x.InitializeViewModel(), Times.Once);
});
}
}
}
117 changes: 117 additions & 0 deletions COMETwebapp.Tests/Pages/SiteDirectory/SiteDirectoryPageTestFixture.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
// --------------------------------------------------------------------------------------------------------------------
// <copyright file="SiteDirectoryPageTestFixture.cs" company="Starion Group S.A.">
// Copyright (c) 2024 Starion Group S.A.
//
// Authors: Sam Gerené, Alex Vorobiev, Alexander van Delft, Jaime Bernar, Théate Antoine, João Rua
//
// This file is part of COMET WEB Community Edition
// The COMET WEB Community Edition is the Starion Group Web Application implementation of ECSS-E-TM-10-25 Annex A and Annex C.
//
// The 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 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.Tests.Pages.SiteDirectory
{
using Bunit;

using CDP4Dal;

using COMET.Web.Common.Model.Configuration;
using COMET.Web.Common.Services.ConfigurationService;
using COMET.Web.Common.Services.SessionManagement;
using COMET.Web.Common.Test.Helpers;
using COMET.Web.Common.ViewModels.Components.Applications;

using COMETwebapp.Components.SiteDirectory;
using COMETwebapp.Components.SiteDirectory.EngineeringModel;
using COMETwebapp.Pages.SiteDirectory;
using COMETwebapp.ViewModels.Components.SiteDirectory.DomainsOfExpertise;
using COMETwebapp.ViewModels.Components.SiteDirectory.EngineeringModels;
using COMETwebapp.ViewModels.Components.SiteDirectory.Rows;

using DynamicData;

using Microsoft.AspNetCore.Components.Web;
using Microsoft.Extensions.DependencyInjection;

using Moq;

using NUnit.Framework;

using TestContext = Bunit.TestContext;

[TestFixture]
public class SiteDirectoryPageTestFixture
{
private TestContext context;
private Mock<IEngineeringModelsTableViewModel> engineeringModelsTableViewModel;
private Mock<IDomainsOfExpertiseTableViewModel> domainsOfExpertiseTableViewModel;
private Mock<ISessionService> sessionService;
private IRenderedComponent<DirectoryPage> renderer;

[SetUp]
public void Setup()
{
this.context = new TestContext();

this.engineeringModelsTableViewModel = new Mock<IEngineeringModelsTableViewModel>();
this.engineeringModelsTableViewModel.Setup(x => x.Rows).Returns(new SourceList<EngineeringModelRowViewModel>());

this.domainsOfExpertiseTableViewModel = new Mock<IDomainsOfExpertiseTableViewModel>();
this.domainsOfExpertiseTableViewModel.Setup(x => x.Rows).Returns(new SourceList<DomainOfExpertiseRowViewModel>());

this.sessionService = new Mock<ISessionService>();
this.sessionService.Setup(x => x.Session).Returns(new Mock<ISession>().Object);

var configuration = new Mock<IConfigurationService>();
configuration.Setup(x => x.ServerConfiguration).Returns(new ServerConfiguration());

this.context.ConfigureDevExpressBlazor();
this.context.Services.AddSingleton(this.sessionService.Object);
this.context.Services.AddSingleton(this.engineeringModelsTableViewModel.Object);
this.context.Services.AddSingleton(this.domainsOfExpertiseTableViewModel.Object);
this.context.Services.AddSingleton(configuration.Object);
this.context.Services.AddSingleton<IApplicationTemplateViewModel, ApplicationTemplateViewModel>();

this.renderer = this.context.RenderComponent<DirectoryPage>();
}

[TearDown]
public void Teardown()
{
this.context.CleanContext();
}

[Test]
public async Task VerifySiteDirectoryPage()
{
Assert.Multiple(() =>
{
Assert.That(this.renderer.Instance, Is.Not.Null);
Assert.That(this.renderer.Instance.SelectedComponent, Is.EqualTo(typeof(EngineeringModelsTable)));
this.engineeringModelsTableViewModel.Verify(x => x.InitializeViewModel(), Times.Once);
});

var toolBarItem = this.renderer.FindAll("button").ElementAt(1);
await this.renderer.InvokeAsync(() => toolBarItem.ClickAsync(new MouseEventArgs()));

Assert.Multiple(() =>
{
Assert.That(this.renderer.Instance.SelectedComponent, Is.EqualTo(typeof(DomainsOfExpertiseTable)));
this.domainsOfExpertiseTableViewModel.Verify(x => x.InitializeViewModel(), Times.Once);
});
}
}
}
2 changes: 1 addition & 1 deletion COMETwebapp/Components/BookEditor/BookEditorColumn.razor
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
<div class="book-editor-column @columnConditionalClass">
<div class="column-header">
<button class="icon collapse-button @this.CollapseButtonIconClass" @onclick="@(async () => await this.OnCollapseClicked.InvokeAsync())"></button>
<h5 style="background-color:@this.HeaderHexColor" class="header-text">@this.HeaderTitle</h5>
<h5 style="background-color:@this.HeaderHexColor" class="header-text p-2">@this.HeaderTitle</h5>
<button class="icon icon-plus add-item-button @buttonDisabledClass" @onclick="@(async () => await this.OnCreateNewItemClick.InvokeAsync())" disabled="@this.IsAddButtonDisabled"></button>
</div>
<div class="column-content">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ Copyright (c) 2023-2024 Starion Group S.A.
Text="@(this.ButtonDisplayText)"
Click="@(() => this.OnButtonClick.Invoke())"
IconCssClass="oi oi-plus"
RenderStyle="ButtonRenderStyle.Primary"
RenderStyle="ButtonRenderStyle.Dark"
style="width: 200px;"/>
}
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
.data-items-panel-container {
max-height: 90vh;
position: sticky;
top: 0px;
top: 10px;
}

.data-item-details-image {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,8 @@ Copyright (c) 2023-2024 Starion Group S.A.
IconCssClass="oi oi-pencil"
Click="@(() => this.OnEditFolderClick(row))"
SizeMode="SizeMode.Small"
CssClass="float-end"/>
CssClass="float-end"
RenderStyle="ButtonRenderStyle.Dark"/>
}
</div>}
</NodeTextTemplate>
Expand Down
8 changes: 4 additions & 4 deletions COMETwebapp/Components/Tabs/OpenTab.razor
Original file line number Diff line number Diff line change
Expand Up @@ -28,10 +28,10 @@
<DxFormLayoutItem ColSpanLg="12">
<div style="display:flex; flex-direction: column; align-items: center;">
<FeatherSmile Size="42"
Color="currentColor"
Color="var(--colors-primary-500)"
StrokeWidth="1.8f"/>
<h5 class="font-weight-bold mt-1">You have no model selected</h5>
<span>Select a model to start working on it</span>
<h5 class="font-weight-bold mt-1 text-primary">You have no model selected</h5>
<span style="color: var(--colors-gray-600);">Select a model to start working on it</span>
</div>
</DxFormLayoutItem>
<DxFormLayoutItem Caption="View" ColSpanLg="12">
Expand Down Expand Up @@ -104,7 +104,7 @@
CssClass="btn btn-connect w-100 lh-lg mt-2"
Text="Close"
Click="@(() => this.OnCancel?.Invoke())"
RenderStyle="ButtonRenderStyle.Secondary"/>
RenderStyleMode="ButtonRenderStyleMode.Outline"/>
}
</DxFormLayoutItem>
</DxFormLayout>
7 changes: 5 additions & 2 deletions COMETwebapp/Components/Tabs/TabComponent.razor.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,13 @@
padding: 2px 10px 2px 10px;
display: flex;
align-items: center;
box-shadow: 0px 0px 3px 0px gray;
box-shadow: 0px 4px 8px 0px #090E110A;
background-color: var(--colors-white);
color: var(--colors-primary-800);
font-weight: 500;
}

.current-tab {
box-shadow: 0px 0px 4px 0px black!important;
box-shadow: 0px 0px 3px 0px black!important;
font-weight: bold;
}
35 changes: 19 additions & 16 deletions COMETwebapp/Pages/ReferenceData/ReferenceDataPage.razor
Original file line number Diff line number Diff line change
Expand Up @@ -16,23 +16,26 @@ Copyright (c) 2023-2024 Starion Group S.A.
------------------------------------------------------------------------------->
@attribute [Route(WebAppConstantValues.ReferenceDataPage)]
@attribute [Authorize]
@using AntDesign
@using COMETwebapp.Utilities

<DxToolbar ItemClick="@this.OnItemClick">
<Items>
@foreach (var mappedValue in this.mapOfComponentsAndNames)
<ApplicationTemplate>
<Body>
<DxToolbar ItemClick="@(this.OnItemClick)">
<Items>
@foreach (var mappedValue in this.mapOfComponentsAndNames)
{
<DxToolbarItem @key="@(mappedValue.Value)"
Name="@(mappedValue.Value)"
Text="@(mappedValue.Value)"
Tooltip="@(mappedValue.Value)"
RenderStyle="@(mappedValue.Key == this.SelectedComponent ? ButtonRenderStyle.Primary : ButtonRenderStyle.Secondary)"/>
}
</Items>
</DxToolbar>

@if (this.SelectedComponent != null)
{
<DxToolbarItem @key="@(mappedValue.Value)"
Name="@(mappedValue.Value)"
Text="@(mappedValue.Value)"
Tooltip="@(mappedValue.Value)"
RenderStyle="@(mappedValue.Key == this.SelectedComponent ? ButtonRenderStyle.Primary : ButtonRenderStyle.Secondary)" />
<DynamicComponent Type="@(this.SelectedComponent)"/>
}
</Items>
</DxToolbar>

@if (this.SelectedComponent != null)
{
<DynamicComponent Type="@this.SelectedComponent" />
}
</Body>
</ApplicationTemplate>
Loading

0 comments on commit a3e6845

Please sign in to comment.