Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -127,6 +127,8 @@ public void sendAddConsortiumMemberEmail(AddConsortiumMember addConsortiumMember
context.setVariable("contactFamilyName", addConsortiumMember.getContactFamilyName());
context.setVariable("contactJobTitle", addConsortiumMember.getContactJobTitle());
context.setVariable("contactEmail", addConsortiumMember.getContactEmail());
context.setVariable("organizationTier", addConsortiumMember.getOrganizationTier());
context.setVariable("integrationPlans", addConsortiumMember.getIntegrationPlans());

String content = templateEngine.process("mail/addConsortiumMember", context);
try {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,10 @@ public class AddConsortiumMember {

private String contactJobTitle;

private String organizationTier;

private String integrationPlans;

public String getRequestedByName() {
return requestedByName;
}
Expand Down Expand Up @@ -173,4 +177,20 @@ public String getContactJobTitle() {
public void setContactJobTitle(String contactJobTitle) {
this.contactJobTitle = contactJobTitle;
}

public String getOrganizationTier() {
return organizationTier;
}

public void setOrganizationTier(String organizationTier) {
this.organizationTier = organizationTier;
}

public String getIntegrationPlans() {
return integrationPlans;
}

public void setIntegrationPlans(String integrationPlans) {
this.integrationPlans = integrationPlans;
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,16 @@
<span th:text="(@{|${membershipStartDate}|})">Yes</span>
</p>

<p>
<strong>Organization tier</strong><br/>
<span th:text="(@{|${organizationTier}|})">Yes</span>
</p>

<p>
<strong>Integration plans</strong><br/>
<span th:text="(@{|${integrationPlans}|})">Yes</span>
</p>

<p>
<hr/>
<strong>Main contact</strong>
Expand Down
145 changes: 74 additions & 71 deletions ui/src/app/home/consortium/add-consortium-member.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<h1 class="mb-40 wide-text font-weight-bold">New organization</h1>
<div class="d-flex">
<form (ngSubmit)="save()" name="editForm" role="form" [formGroup]="editForm" class="w-66">
<div *ngIf="invalidForm" class="error-message d-flex p-16 mb-30 line-height-150">
<div *ngIf="invalidForm" class="message-box error-message d-flex p-16 mb-30 line-height-150">
<img src="./content/images/error-sign.svg" alt="Warning sign" class="p-8" />
<div>
<div class="mb-8 font-size-14 wide-text-25 font-weight-bold">Your changes cannot be saved</div>
Expand All @@ -28,7 +28,7 @@ <h3 class="mb-20 font-size-16 font-weight-bold">Name & email domain</h3>
'text-danger':
editForm.get('orgName')?.invalid && editForm.get('orgName')?.touched && editForm.get('orgName')?.dirty
}"
>Organization name <span class="font-weight-normal">(Required)</span></label
>Organization name <span class="font-weight-normal required">(Required)</span></label
>
<input
type="text"
Expand Down Expand Up @@ -195,7 +195,7 @@ <h3 class="mb-20 font-size-16 font-weight-bold">Billing address</h3>
for="country"
class="wide-text font-size-12 font-weight-bold"
[ngClass]="{ 'text-danger': editForm.get('country')?.invalid && editForm.get('country')?.dirty }"
>Country <span class="font-size-12 font-weight-normal">(Required)</span></label
>Country</label
>
<select
(change)="onCountryChange(editForm.get('country')?.value)"
Expand All @@ -213,14 +213,6 @@ <h3 class="mb-20 font-size-16 font-weight-bold">Billing address</h3>
{{ country.name }}
</option>
</select>
<div *ngIf="editForm.get('country')?.invalid && editForm.get('country')?.dirty">
<small
class="wide-text font-size-12 form-text text-danger"
*ngIf="(editForm.get('country')?.errors)!['required']"
>
Please select a country
</small>
</div>
</div>
<div class="form-group mb-30">
<label
Expand Down Expand Up @@ -254,56 +246,37 @@ <h3 class="mb-20 font-size-16 font-weight-bold">Billing address</h3>
<!-- Trademark license -->

<h3 class="font-weight-bold font-size-16 mb-10">
Trademark license <span class="font-size-12 font-weight-normal">(Required)</span>
Trademark license <span class="font-size-12 font-weight-normal required">(Required)</span>
</h3>
<div class="font-size-14 wide-text-25 mb-20">Can ORCID use this organization's trademarked name and logos?</div>
<div class="mb-40">
<div class="form-group d-flex">
<input
type="radio"
id="trademarkLicenseYes"
class="form-control radio mr-8"
name="trademarkLicense"
value="Yes"
formControlName="trademarkLicense"
[ngClass]="{
'outline-danger': editForm.get('trademarkLicense')?.invalid && editForm.get('trademarkLicense')?.dirty
}"
/>
<label for="trademarkLicenseYes" class="wide-text-25 font-size-14 font-weight-normal"
><strong>YES</strong> - ORCID can use this organization's trademarked name and logos</label
>
<div
*ngIf="getControl('trademarkLicense').invalid && getControl('trademarkLicense').touched"
class="message-box error-message d-flex p-16 mb-40"
>
<img src="./content/images/error-sign.svg" alt="Required sign" />
<div>
<div class="font-size-14 wide-text-25 line-height-150">Please select a trademark license option</div>
</div>
<div class="form-group d-flex">
</div>
<div class="mb-40">
<div *ngFor="let license of trademarkLicenseOptions; trackBy: trackByValue" class="form-group d-flex">
<input
type="radio"
id="trademarkLicenseNo"
[id]="'trademarkLicense' + license.value"
class="form-control radio mr-8"
name="trademarkLicense"
value="No"
formControlName="trademarkLicense"
[ngClass]="{
'outline-danger': editForm.get('trademarkLicense')?.invalid && editForm.get('trademarkLicense')?.dirty
}"
[value]="license.value"
/>
<label for="trademarkLicenseNo" class="wide-text-25 font-size-14 font-weight-normal"
><strong>NO</strong> - ORCID cannot use this organization's trademarked name and logos</label
>
</div>
<div *ngIf="editForm.get('trademarkLicense')?.invalid && editForm.get('trademarkLicense')?.dirty">
<small
class="wide-text font-size-12 form-text text-danger"
*ngIf="(editForm.get('trademarkLicense')?.errors)!['required']"
>
Please select a trademark license option
</small>
<label [for]="'trademarkLicense' + license.value" class="wide-text-25 font-size-14 font-weight-normal">
<strong>{{ license.value.toUpperCase() }}</strong> – {{ license.description }}
</label>
</div>
</div>

<!-- Membership start date -->

<h3 class="font-weight-bold font-size-16">
Membership start date <span class="font-size-12 font-weight-normal">(Required)</span>
Membership start date <span class="font-size-12 font-weight-normal required">(Required)</span>
</h3>
<div class="font-size-14 wide-text-25 mb-20">
When does this organization's ORCID membership start? All memberships begin on the 1st of the month.
Expand Down Expand Up @@ -374,6 +347,55 @@ <h3 class="font-weight-bold font-size-16">
</small>
</div>

<h3 class="font-weight-bold font-size-16">
Organization tier <span class="font-size-12 font-weight-normal required">(Required)</span>
</h3>
<div class="font-size-14 wide-text-25 mb-20">
Please select a tier that reflects this organization's annual operating budget.
</div>

<div
*ngIf="getControl('organizationTier').invalid && getControl('organizationTier').touched"
class="message-box error-message d-flex p-16 mb-40"
>
<img src="./content/images/error-sign.svg" alt="Required sign" />
<div>
<div class="font-size-14 wide-text-25 line-height-150">Please select an organization tier</div>
</div>
</div>

<div class="mb-40">
<div *ngFor="let tier of organizationTiers; trackBy: trackByValue" class="form-group d-flex">
<input
type="radio"
[id]="'organizationTier' + tier.value"
class="form-control radio mr-8"
formControlName="organizationTier"
[value]="tier.value"
/>
<label [for]="'organizationTier' + tier.value" class="wide-text-25 font-size-14 font-weight-normal">
<strong>{{ tier.value.toUpperCase() }}</strong> – {{ tier.description }}
</label>
</div>
</div>

<h3 class="font-weight-bold font-size-16">Integration plans</h3>
<div class="font-size-14 wide-text-25 mb-20">
Tell us a little about the organization's plans for ORCID integration.
</div>
<div class="form-group mb-2">
<textarea id="integrationPlans" formControlName="integrationPlans" class="form-control" rows="4"></textarea>
<small class="wide-text font-size-12 form-text color-gray">Max 1000 characters</small>
<div *ngIf="editForm.get('integrationPlans')?.invalid && editForm.get('integrationPlans')?.touched">
<small
class="wide-text font-size-12 form-text text-danger"
*ngIf="(editForm.get('integrationPlans')?.errors)!['maxlength']"
>
Integration plans description is too long. Please use 1000 characters or less.
</small>
</div>
</div>

<!-- Main contact -->

<h2 class="mb-10 wide-text font-size-24 line-height-150">Main contact</h2>
Expand All @@ -392,7 +414,7 @@ <h2 class="mb-10 wide-text font-size-24 line-height-150">Main contact</h2>
editForm.get('contactGivenName')?.dirty &&
editForm.get('contactGivenName')?.touched
}"
>First or given name <span class="font-size-12 font-weight-normal">(Required)</span></label
>First or given name</label
>
<input
type="text"
Expand Down Expand Up @@ -423,12 +445,6 @@ <h2 class="mb-10 wide-text font-size-24 line-height-150">Main contact</h2>
>
First or given name is too long. Please use 40 characters or less.
</small>
<small
class="wide-text font-size-12 form-text text-danger"
*ngIf="(editForm.get('contactGivenName')?.errors)!['required']"
>
Please provide a first or given name
</small>
</div>
</div>
<div class="form-group mb-20">
Expand All @@ -441,7 +457,7 @@ <h2 class="mb-10 wide-text font-size-24 line-height-150">Main contact</h2>
editForm.get('contactFamilyName')?.dirty &&
editForm.get('contactFamilyName')?.touched
}"
>Last or family name <span class="font-size-12 font-weight-normal">(Required)</span></label
>Last or family name</label
>
<input
type="text"
Expand Down Expand Up @@ -472,12 +488,6 @@ <h2 class="mb-10 wide-text font-size-24 line-height-150">Main contact</h2>
>
Last or family name is too long. Please use 80 characters or less.
</small>
<small
class="wide-text font-size-12 form-text text-danger"
*ngIf="(editForm.get('contactFamilyName')?.errors)!['required']"
>
Please provide a last or family name
</small>
</div>
</div>
<div class="form-group mb-20">
Expand Down Expand Up @@ -521,7 +531,7 @@ <h2 class="mb-10 wide-text font-size-24 line-height-150">Main contact</h2>
editForm.get('contactEmail')?.touched
}"
class="wide-text font-size-12 font-weight-bold"
>Email address <span class="font-size-12 font-weight-normal">(Required)</span></label
>Email address</label
>
<input
type="text"
Expand Down Expand Up @@ -565,18 +575,11 @@ <h2 class="mb-10 wide-text font-size-24 line-height-150">Main contact</h2>
>
Email is too long. Please use 80 characters or less.
</small>
<small
class="wide-text font-size-12 text-danger"
*ngIf="(editForm.get('contactEmail')?.errors)!['required']"
>
Please provide an email address
</small>
</div>
</div>
<div class="warning-message d-flex p-16 mb-40">
<img src="./content/images/warning-sign.svg" alt="Warning sign" class="p-8" />
<div class="message-box warning-message d-flex p-16 mb-40">
<img src="./content/images/warning-sign.svg" alt="Warning sign" />
<div>
<div class="mb-8 font-size-14 wide-text-25 font-weight-bold">Please note</div>
<div class="font-size-14 wide-text-25 line-height-150">
It can take up to 24 hours before a new organization is available in the Member Portal. Please contact
your ORCID engagement lead for more information.
Expand Down
22 changes: 10 additions & 12 deletions ui/src/app/home/consortium/add-consortium-member.component.scss
Original file line number Diff line number Diff line change
Expand Up @@ -20,28 +20,26 @@ label {
margin-bottom: 0.25rem;
}

.error-message {
.required {
color: #d32f2f;
}

.message-box {
img {
padding: 0 16px 0 8px !important;
margin-top: -1.75rem;
padding: 0 16px 0 8px;
}
div {
font-size: 0.875rem;
}
border: 2px solid #b71c1c;
border-radius: 4px;
}

.error-message {
border: 2px solid #b71c1c;
}

.warning-message {
img {
padding: 0 16px 0 8px !important;
margin-top: -3rem;
}
div {
font-size: 0.875rem;
}
border: 2px solid #ff9c00;
border-radius: 4px;
}

.radio {
Expand Down
22 changes: 22 additions & 0 deletions ui/src/app/home/consortium/add-consortium-member.component.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,28 @@ describe('AddConsortiumMemberComponent', () => {
expect(component).toBeTruthy()
})

it('should be a valid form when all required fields are filled', () => {
component.editForm.controls['orgName'].setValue('Orcid')
component.editForm.controls['startMonth'].setValue('01')
component.editForm.controls['startYear'].setValue('2025')
component.editForm.controls['trademarkLicense'].setValue('Yes')
component.editForm.controls['organizationTier'].setValue('Small')
fixture.detectChanges()

expect(component.editForm.valid).toBeTrue()
})

it('should be a invalid form when a required field is missing', () => {
component.editForm.controls['orgName'].setValue('Orcid')
component.editForm.controls['startMonth'].setValue('01')
component.editForm.controls['startYear'].setValue('2025')
component.editForm.controls['trademarkLicense'].setValue('')
component.editForm.controls['organizationTier'].setValue('Small')
fixture.detectChanges()

expect(component.editForm.invalid).toBeTrue()
})

it('should call memberService.addConsortiumMember when saving', () => {
memberServiceSpy.addConsortiumMember.and.returnValue(of(true))

Expand Down
Loading
Loading