Skip to content

Commit

Permalink
Merge 0910006 into 8d6fec5
Browse files Browse the repository at this point in the history
  • Loading branch information
zusorio authored Oct 8, 2024
2 parents 8d6fec5 + 0910006 commit b81e2d9
Show file tree
Hide file tree
Showing 25 changed files with 938 additions and 400 deletions.

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -25,14 +25,15 @@ <h3 class="flex justify-center sm:hidden">Create new project</h3>
formControlName="name"
data-testId="input-name"
/>
<mat-error *ngIf="form.controls.name.errors?.uniqueSlug">
A project with a name similar to “{{
form.controls.name.errors!.uniqueSlug.value
}}” already exists.
</mat-error>
<mat-error *ngIf="form.controls.name.errors?.required">
A project name is required.
</mat-error>
@if (form.controls.name.errors?.uniqueSlug) {
<mat-error>
A project with a name similar to “{{
form.controls.name.errors!.uniqueSlug.value
}}” already exists.
</mat-error>
} @else if (form.controls.name.errors?.required) {
<mat-error> A project name is required. </mat-error>
}
</mat-form-field>
</div>
<div>
Expand Down Expand Up @@ -93,39 +94,40 @@ <h3 class="flex justify-center sm:hidden">Create new project</h3>
<div class="hidden sm:inline">(Optional) Add team members</div>
</ng-template>
<h3 class="flex justify-center sm:hidden">(Optional) Add team members</h3>
<div *ngIf="projectService.project$ | async" class="flex justify-center">
<app-project-user-settings></app-project-user-settings>
</div>
<div *ngIf="projectService.project$ | async">
<div class="flex justify-between">
<div></div>
<div>
<div class="flex w-[312px] justify-end sm:w-[420px]">
<a
class="mt-[5px]"
mat-button
color="primary"
(click)="stepper.next()"
data-testId="button-skipAddMembers"
>
<ng-container
*ngIf="
projectUserService.nonAdminProjectUsers$ | async as users
"
>
{{
!users || users.length === 0 ? "Skip for now" : "Continue"
}}
</ng-container>
<mat-icon iconPositionEnd class="mat-icon-position right"
>navigate_next</mat-icon
@if (projectService.project$ | async) {
<div class="flex justify-center">
<app-project-user-settings></app-project-user-settings>
</div>
<div>
<div class="flex justify-between">
<div></div>
<div>
<div class="flex w-[312px] justify-end sm:w-[420px]">
<a
class="mt-[5px]"
mat-button
color="primary"
(click)="stepper.next()"
data-testId="button-skipAddMembers"
>
</a>
@if (
projectUserService.nonAdminProjectUsers$ | async;
as users
) {
{{
!users || users.length === 0 ? "Skip for now" : "Continue"
}}
}
<mat-icon iconPositionEnd class="mat-icon-position right"
>navigate_next</mat-icon
>
</a>
</div>
</div>
<div></div>
</div>
<div></div>
</div>
</div>
}
</mat-step>

<mat-step>
Expand Down Expand Up @@ -156,20 +158,14 @@ <h3 class="flex justify-center pb-[5px] sm:hidden sm:pb-0">
[color]="getColorByModelCreationStep()"
data-testId="a-skipModelAndFinishProjectCreation"
>
<span *ngIf="modelCreationStep === 'create-model'">
Abort model creation and finish
</span>
<span
*ngIf="
modelCreationStep !== 'create-model' &&
modelCreationStep !== 'complete'
"
>
Abort model creation and finish
</span>
<span *ngIf="modelCreationStep === 'complete'">
Finish project creation
</span>
@if (modelCreationStep === "create-model") {
<span> Abort model creation and finish </span>
} @else if (modelCreationStep === "complete") {
<span> Finish project creation </span>
} @else {
<span> Abort model creation and finish </span>
}

<mat-icon iconPositionEnd class="mat-icon-position right"
>check</mat-icon
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* SPDX-FileCopyrightText: Copyright DB InfraGO AG and contributors
* SPDX-License-Identifier: Apache-2.0
*/
import { NgIf, NgFor, AsyncPipe } from '@angular/common';
import { NgFor, AsyncPipe } from '@angular/common';
import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core';
import {
FormControl,
Expand Down Expand Up @@ -32,7 +32,6 @@ import { ProjectWrapperService } from '../service/project.service';
@Component({
selector: 'app-create-project',
templateUrl: './create-project.component.html',
styleUrls: ['./create-project.component.css'],
standalone: true,
imports: [
MatStepper,
Expand All @@ -43,7 +42,6 @@ import { ProjectWrapperService } from '../service/project.service';
MatFormField,
MatLabel,
MatInput,
NgIf,
MatError,
MatRadioGroup,
NgFor,
Expand Down
82 changes: 82 additions & 0 deletions frontend/src/app/projects/create-project/create-project.stories.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
/*
* SPDX-FileCopyrightText: Copyright DB InfraGO AG and contributors
* SPDX-License-Identifier: Apache-2.0
*/
import { Meta, moduleMetadata, StoryObj } from '@storybook/angular';
import { userEvent, within } from '@storybook/test';
import {
mockProject,
MockProjectWrapperService,
} from '../../../storybook/project';
import {
mockProjectUsers,
MockProjectUserService,
} from '../../../storybook/project-users';
import { ProjectUserService } from '../project-detail/project-users/service/project-user.service';
import { ProjectWrapperService } from '../service/project.service';
import { CreateProjectComponent } from './create-project.component';

const meta: Meta<CreateProjectComponent> = {
title: 'Project Components / Create Project',
component: CreateProjectComponent,
};

export default meta;
type Story = StoryObj<CreateProjectComponent>;

export const CreateProject: Story = {
args: {},
};

export const AddTeamMembers: Story = {
args: {},
decorators: [
moduleMetadata({
providers: [
{
provide: ProjectWrapperService,
useFactory: () =>
new MockProjectWrapperService(mockProject, [mockProject]),
},
{
provide: ProjectUserService,
useFactory: () =>
new MockProjectUserService('user', undefined, mockProjectUsers),
},
],
}),
],
play: async ({ canvasElement }) => {
const canvas = within(canvasElement);
const nameField = canvas.getByTestId('input-name');
await userEvent.type(nameField, 'Test Project');
const createProject = canvas.getByTestId('button-create-project');
await userEvent.click(createProject);
},
};

export const AddModel: Story = {
args: {},
decorators: [
moduleMetadata({
providers: [
{
provide: ProjectWrapperService,
useFactory: () =>
new MockProjectWrapperService(mockProject, [mockProject]),
},
{
provide: ProjectUserService,
useFactory: () =>
new MockProjectUserService('user', undefined, mockProjectUsers),
},
],
}),
],
play: async (context) => {
const canvas = within(context.canvasElement);
await AddTeamMembers.play!(context);
const skipMembers = canvas.getByTestId('button-skipAddMembers');
await userEvent.click(skipMembers);
},
};

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -4,53 +4,56 @@
-->

<div class="wrapper flex justify-center">
<div
class="collab-card w-[350px] sm:min-w-[420px]"
*ngIf="modelService.model$ | async"
>
<form [formGroup]="form">
<mat-form-field class="w-full" appearance="fill">
<mat-label>Modelling tool</mat-label>
<input
matInput
[value]="(modelService.model$ | async)!.tool.name"
disabled
/>
</mat-form-field>
<mat-form-field class="w-full" appearance="fill">
<mat-label>Version</mat-label>
<mat-select formControlName="version" id="version-selector">
<mat-option
*ngFor="let version of this.toolVersions"
[value]="version.id"
>
{{ version.name }}
<span *ngIf="version.config.is_recommended"> (recommended)</span>
<span *ngIf="version.config.is_deprecated"> (deprecated)</span>
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="w-full" appearance="fill">
<mat-label>Model nature</mat-label>
<mat-select formControlName="nature">
<mat-option
*ngFor="let nature of this.toolNatures"
[value]="nature.id"
>
{{ nature.name }}
</mat-option>
</mat-select>
</mat-form-field>
</form>
<div class="flex justify-end">
<button
mat-raised-button
color="primary"
[disabled]="!form.valid || buttonDisabled"
(click)="onSubmit()"
>
Save model
</button>
@if (modelService.model$ | async) {
<div class="collab-card w-[350px] sm:min-w-[420px]">
<form [formGroup]="form">
<mat-form-field class="w-full" appearance="fill">
<mat-label>Modelling tool</mat-label>
<input
matInput
[value]="(modelService.model$ | async)!.tool.name"
disabled
/>
</mat-form-field>
<mat-form-field class="w-full" appearance="fill">
<mat-label>Version</mat-label>
<mat-select formControlName="version" id="version-selector">
<mat-option
*ngFor="let version of this.toolVersions"
[value]="version.id"
>
{{ version.name }}
@if (version.config.is_recommended) {
<span> (recommended)</span>
}
@if (version.config.is_deprecated) {
<span> (deprecated)</span>
}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="w-full" appearance="fill">
<mat-label>Model nature</mat-label>
<mat-select formControlName="nature">
<mat-option
*ngFor="let nature of this.toolNatures"
[value]="nature.id"
>
{{ nature.name }}
</mat-option>
</mat-select>
</mat-form-field>
</form>
<div class="flex justify-end">
<button
mat-raised-button
color="primary"
[disabled]="!form.valid || buttonDisabled"
(click)="onSubmit()"
>
Save model
</button>
</div>
</div>
</div>
}
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* SPDX-FileCopyrightText: Copyright DB InfraGO AG and contributors
* SPDX-License-Identifier: Apache-2.0
*/
import { NgIf, NgFor, AsyncPipe } from '@angular/common';
import { NgFor, AsyncPipe } from '@angular/common';
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import {
FormControl,
Expand All @@ -27,17 +27,14 @@ import {
Tool,
} from 'src/app/openapi';
import { ModelWrapperService } from 'src/app/projects/models/service/model.service';
import { GitModelService } from '../../project-detail/model-overview/model-detail/git-model.service';
import { ProjectWrapperService } from '../../service/project.service';

@UntilDestroy()
@Component({
selector: 'app-init-model',
templateUrl: './init-model.component.html',
styleUrls: ['./init-model.component.css'],
standalone: true,
imports: [
NgIf,
FormsModule,
ReactiveFormsModule,
MatFormField,
Expand Down Expand Up @@ -65,7 +62,6 @@ export class InitModelComponent implements OnInit {
constructor(
public projectService: ProjectWrapperService,
public modelService: ModelWrapperService,
public gitModelService: GitModelService,
private toolsService: ToolsService,
) {}

Expand Down
Loading

0 comments on commit b81e2d9

Please sign in to comment.