[SM-613] Misc Onboarding UX fixes (#4953)

* make dismiss always visible

* reorder tasks; hide create secret task if no projects

* update stories
This commit is contained in:
Will Martin 2023-03-08 16:01:45 -05:00 committed by GitHub
parent 6971c3dca2
commit 54411ea84f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 21 additions and 23 deletions

View File

@ -18,13 +18,7 @@
<ng-content></ng-content>
</ul>
<div class="tw-p-4 tw-pt-0">
<button
bitLink
type="button"
class="tw-ml-auto tw-block"
[ngClass]="{ 'tw-invisible': !isComplete }"
(click)="dismiss.emit()"
>
<button bitLink type="button" class="tw-ml-auto tw-block" (click)="dismiss.emit()">
{{ "dismiss" | i18n }}
</button>
</div>

View File

@ -23,10 +23,6 @@ export class OnboardingComponent {
return this.tasks.length === 0 ? 0 : (this.amountCompleted / this.tasks.length) * 100;
}
protected get isComplete(): boolean {
return this.tasks.length > 0 && this.tasks.length === this.amountCompleted;
}
protected toggle() {
this.open = !this.open;
}

View File

@ -54,6 +54,11 @@ const Template: Story = (args) => ({
{{ "downloadThe" | i18n }} <a bitLink routerLink="">{{ "smCLI" | i18n }}</a>
</span>
</sm-onboarding-task>
<sm-onboarding-task
[title]="'createProject' | i18n"
icon="bwi-collection"
[completed]="createProject"
></sm-onboarding-task>
<sm-onboarding-task
[title]="'importSecrets' | i18n"
icon="bwi-download"
@ -64,11 +69,6 @@ const Template: Story = (args) => ({
icon="bwi-key"
[completed]="createSecret"
></sm-onboarding-task>
<sm-onboarding-task
[title]="'createProject' | i18n"
icon="bwi-collection"
[completed]="createProject"
></sm-onboarding-task>
</sm-onboarding>
`,
});

View File

@ -14,6 +14,13 @@
{{ "downloadThe" | i18n }} <a bitLink routerLink="">{{ "smCLI" | i18n }}</a>
</span>
</sm-onboarding-task>
<sm-onboarding-task
*ngIf="userIsAdmin"
[title]="'createProject' | i18n"
(click)="openNewProjectDialog()"
icon="bwi-collection"
[completed]="view.tasks.createProject"
></sm-onboarding-task>
<sm-onboarding-task
*ngIf="userIsAdmin"
[title]="'importSecrets' | i18n"
@ -22,18 +29,12 @@
[completed]="view.tasks.importSecrets"
></sm-onboarding-task>
<sm-onboarding-task
*ngIf="view.tasks.createProject"
[title]="'createSecret' | i18n"
(click)="openSecretDialog()"
icon="bwi-key"
[completed]="view.tasks.createSecret"
></sm-onboarding-task>
<sm-onboarding-task
*ngIf="userIsAdmin"
[title]="'createProject' | i18n"
(click)="openNewProjectDialog()"
icon="bwi-collection"
[completed]="view.tasks.createProject"
></sm-onboarding-task>
</sm-onboarding>
<div class="tw-mt-6 tw-flex tw-flex-col tw-gap-6">

View File

@ -91,6 +91,7 @@ export class OverviewComponent implements OnInit, OnDestroy {
) {}
ngOnInit() {
this.stateService.setSMOnboardingTasks(null);
const orgId$ = this.route.params.pipe(
map((p) => p.organizationId),
distinctUntilChanged()
@ -297,5 +298,11 @@ export class OverviewComponent implements OnInit, OnDestroy {
protected hideOnboarding() {
this.showOnboarding = false;
this.saveCompletedTasks(this.organizationId, {
importSecrets: true,
createSecret: true,
createProject: true,
createServiceAccount: true,
});
}
}