Skip to content

Commit

Permalink
fix: red fields in second tab of organization create page (#174)
Browse files Browse the repository at this point in the history
  • Loading branch information
@illfixit
illfixit authored Apr 3, 2024
1 parent 782816e commit aba3b78
Show file tree
Hide file tree
Showing 2 changed files with 74 additions and 79 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ please see [changelog_updates.md](docs/dev/changelog_updates.md).
#### Patch

- Fixed "Provided Connectors" view for Service Partners ([#172](https://github.com/sovity/authority-portal/issues/172))
- Fixed red fields in organization create page ([#122](https://github.com/sovity/authority-portal/issues/122))

### Known issues

Expand Down
152 changes: 73 additions & 79 deletions ...organization-create-page/organization-create-page/organization-create-page.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,93 +6,87 @@
</div>
<!-- header -->

<!-- registration wizard -->
<form [formGroup]="parentFormGroup">
<!-- registration wizard -->

<div class="flex justify-center">
<mat-stepper
class="mt-4 w-full lg:w-2/3"
labelPosition="bottom"
linear
#stepper>
<!-- user profile form -->
<mat-step
color="accent"
[editable]="state.state === 'editing' || state.state === 'error'"
[completed]="userForm.valid || state.state === 'success'">
<div class="flex flex-col px-1 md:px-8 w-full">
<ng-template matStepLabel>User Details</ng-template>
<app-user-create-form
class="flex-grow my-4"
[userForm]="userForm"></app-user-create-form>
<div
class="border-t border-gray-900/10 pt-6 mt-6 flex items-center justify-end gap-x-6">
<button class="btn-accent-outline" type="button" routerLink="/">
Cancel
</button>
<div class="flex justify-center">
<mat-stepper
class="mt-4 w-full lg:w-2/3"
labelPosition="bottom"
linear
#stepper>
<!-- user profile form -->
<mat-step
color="accent"
[editable]="state.state === 'editing' || state.state === 'error'"
[completed]="userForm.valid || state.state === 'success'">
<div class="flex flex-col px-1 md:px-8 w-full">
<ng-template matStepLabel>User Details</ng-template>
<app-user-create-form
class="flex-grow my-4"
[userForm]="userForm"></app-user-create-form>
<div
class="border-t border-gray-900/10 pt-6 mt-6 flex items-center justify-end gap-x-6">
<button class="btn-accent-outline" type="button" routerLink="/">
Cancel
</button>

<button
class="btn-accent"
matStepperNext
[disabledBtn]="!userForm.valid">
Next
</button>
</div>
<button
class="btn-accent"
matStepperNext
[disabledBtn]="!userForm.valid">
Next
</button>
</div>
</mat-step>
<!-- user profile form -->
</div>
</mat-step>
<!-- user profile form -->

<!-- Organization profile form -->
<mat-step
color="accent"
editable="false"
[editable]="state.state === 'editing' || state.state === 'error'"
[completed]="state.state === 'success'">
<div class="flex flex-col px-1 md:px-8 w-full">
<ng-template matStepLabel>Organization Profile</ng-template>
<h3 class="wizard-step-title">Organization Profile</h3>
<app-organization-create-form
class="flex-grow my-4"
[orgForm]="orgProfileForm"></app-organization-create-form>
<!-- Organization profile form -->
<mat-step
color="accent"
editable="false"
[editable]="state.state === 'editing' || state.state === 'error'"
[completed]="state.state === 'success'">
<div class="flex flex-col px-1 md:px-8 w-full">
<ng-template matStepLabel>Organization Profile</ng-template>
<h3 class="wizard-step-title">Organization Profile</h3>
<app-organization-create-form
class="flex-grow my-4"
[orgForm]="orgProfileForm"></app-organization-create-form>

<app-tos-check
[ctrl]="orgForm.controls.acceptedTos"></app-tos-check>
<app-tos-check [ctrl]="orgForm.controls.acceptedTos"></app-tos-check>

<div
class="border-t border-gray-900/10 pt-6 mt-6 mb-24 flex items-center justify-end gap-x-6">
<button class="btn-accent-outline" type="button" routerLink="/">
Cancel
</button>
<div
class="border-t border-gray-900/10 pt-6 mt-6 mb-24 flex items-center justify-end gap-x-6">
<button class="btn-accent-outline" type="button" routerLink="/">
Cancel
</button>

<button
class="btn-accent"
[disabledBtn]="!userForm.valid || !orgForm.valid || loading"
(click)="submit()">
Register
</button>
</div>
<button
class="btn-accent"
[disabledBtn]="!userForm.valid || !orgForm.valid || loading"
(click)="submit()">
Register
</button>
</div>
</mat-step>
<!-- Organization profile form -->
</div>
</mat-step>
<!-- Organization profile form -->

<!-- final step -->
<mat-step [editable]="false">
<ng-template matStepLabel>Email Verification</ng-template>
<div
class="my-12 flex flex-col justify-center items-center text-center">
<h3 class="wizard-end-title">Please verify your email!</h3>
<p class="wizard-end-prose max-w-md">
You will need to verify your email to complete registration. An
email has been sent to {{ state.email }} with a verification link.
</p>
<button class="btn-accent" (click)="finish()">Finish</button>
</div>
</mat-step>
<!-- final step -->
</mat-stepper>
</div>
</form>
<!-- final step -->
<mat-step [editable]="false">
<ng-template matStepLabel>Email Verification</ng-template>
<div
class="my-12 flex flex-col justify-center items-center text-center">
<h3 class="wizard-end-title">Please verify your email!</h3>
<p class="wizard-end-prose max-w-md">
You will need to verify your email to complete registration. An
email has been sent to {{ state.email }} with a verification link.
</p>
<button class="btn-accent" (click)="finish()">Finish</button>
</div>
</mat-step>
<!-- final step -->
</mat-stepper>
</div>

<!-- footer -->
<app-footer-for-full-page></app-footer-for-full-page>
Expand Down

0 comments on commit aba3b78

Please sign in to comment.