Skip to content
This repository was archived by the owner on Mar 8, 2024. It is now read-only.

Commit 1d3cc0b

Browse files
jhoetterJWittmeyer
jhoetter
and
JWittmeyer
authored
adds user overview and cta (#58)
* adds user overview and cta * optimize user overview, waitlist page and minor ui improvements * Merge issues resolve * Resolves pr comments * Changes user page Co-authored-by: JWittmeyer <jens.wittmeyer@onetask.ai>
1 parent 5a527e3 commit 1d3cc0b

File tree

15 files changed

+1343
-762
lines changed

15 files changed

+1343
-762
lines changed

‎src/app/app-routing.module.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import { RecordIDEComponent } from './record-ide/components/record-ide.component
1818
import { ConfigComponent } from './config/components/config.component';
1919
import { ModelDownloadComponent } from './model-download/pages/model-download/model-download.component';
2020
import { ModelCallbackComponent } from './model-callbacks/components/model-callbacks.component';
21+
import { UsersComponent } from './users/components/users.component';
2122
import { CrowdLabelerDetailsComponent } from './weak-supervision/components/crowd-labeler-details/component/crowd-labeler-details.component';
2223

2324
const routes: Routes = [
@@ -27,6 +28,7 @@ const routes: Routes = [
2728
pathMatch: 'full',
2829
},
2930
{ path: 'projects', component: ProjectsComponent, data: { name: 'ProjectsComponent' } },
31+
{ path: 'users', component: UsersComponent, data: { name: 'UsersComponent' } },
3032
{ path: 'notification-center', component: NotificationCenterComponent, data: { name: 'NotificationCenterComponent' } },
3133
{ path: 'projects/new', component: ProjectNewComponent, data: { name: 'ProjectNewComponent' } },
3234
{ path: 'config', component: ConfigComponent, data: { name: 'ConfigComponent' } },

‎src/app/app.module.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import { NotificationCenterModule } from './notification-center/notification-cen
2525
import { RecordIDEModule } from './record-ide/record-ide.module';
2626
import { ModelDownloadModule } from './model-download/model-download.module';
2727
import { ModelCallbackModule } from './model-callbacks/model-callbacks.module';
28+
import { UsersModule } from './users/users.module';
2829

2930
@NgModule({
3031
declarations: [AppComponent],
@@ -34,6 +35,7 @@ import { ModelCallbackModule } from './model-callbacks/model-callbacks.module';
3435
BaseModule,
3536
DataModule,
3637
ProjectsModule,
38+
UsersModule,
3739
ImportModule,
3840
MonitorModule,
3941
GraphQLModule,

‎src/app/base/components/header/header.component.html

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@
3131
<div class="ml-6 text-gray-500 text-sm font-normal">
3232
Welcome, <span class="font-bold text-gray-900">{{user?.firstName}}</span>!
3333
{{showConfigSettings ?'Switch to your main account to continue labeling...':
34-
'We’re currently setting up your account ...'}}
34+
'You are currently on the waitlist.'}}
3535
</div>
3636
</div>
3737
</ng-template>
@@ -79,6 +79,20 @@
7979
</a>
8080
</div>
8181

82+
<div *ngIf="user?.role == 'ENGINEER'" class="flex items-center justify-center">
83+
<a [routerLink]="['/users']" class="flex mr-6 tooltip tooltip-left" data-tip="Home page - Users">
84+
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hexagons" width="24"
85+
height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
86+
stroke-linecap="round" stroke-linejoin="round">
87+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
88+
<path d="M4 18v-5l4 -2l4 2v5l-4 2z"></path>
89+
<path d="M8 11v-5l4 -2l4 2v5"></path>
90+
<path d="M12 13l4 -2l4 2v5l-4 2l-4 -2"></path>
91+
</svg>
92+
</a>
93+
</div>
94+
95+
8296
<div *ngIf="user?.role == 'ENGINEER'" class="flex items-center justify-center">
8397
<a [routerLink]="['/notification-center']" class="flex mr-6 tooltip tooltip-left"
8498
data-tip="Notification center">

‎src/app/base/components/sidebar-pm/sidebar-pm.component.html

Lines changed: 41 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<div *ngIf="user$ | async as user" class="h-screen flex bg-gray-50 overflow-visible">
2-
<div #sideBar class="hidden lg:flex lg:flex-shrink-0 overflow-visible">
2+
<div class="flex overflow-visible">
33
<div class="flex flex-col w-20 overflow-visible">
44
<div class="flex-1 flex flex-col min-h-0 overflow-y-auto bg-kernindigo overflow-initial">
55
<div class="flex-1 flex flex-col">
6-
<div class="flex-shrink-0 bg-kernindigo pt-4 flex items-center justify-center">
6+
<div class="flex-shrink-0 bg-kernindigo pt-4 pb-10 flex items-center justify-center">
77
<a [routerLink]="['/projects']"
88
class="inline-flex items-center p-2 rounded-full hover:bg-kernindigo-dark focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-kernindigo-dark"
99
data-intercom-target="Home Button">
@@ -32,9 +32,9 @@
3232
</div>
3333
<div>
3434
<div *ngIf="project$ | async as project">
35-
<div *ngIf="project.id !== null"
36-
[ngClass]="user?.role == 'ENGINEER' ? 'visible' : 'invisible' ">
37-
<div class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
35+
<div *ngIf="project.id !== null">
36+
<div *ngIf="user?.role == 'ENGINEER'"
37+
class="flex items-center justify-center overflow-visible">
3838
<div data-tip="Overview" class="tooltip tooltip-right relative z-50"
3939
[ngClass]="project.numDataScaleUploaded == 0 ? 'opacity-50 cursor-not-allowed pointer-events-none' : 'opacity-100 cursor-pointer'">
4040
<a [routerLink]="['./overview']" rel="noopener noreferrer"
@@ -48,7 +48,8 @@
4848
</a>
4949
</div>
5050
</div>
51-
<div class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
51+
<div *ngIf="user?.role == 'ENGINEER'"
52+
class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
5253
<div data-tip="Data Browser" class="tooltip tooltip-right relative z-50"
5354
[ngClass]="project.numDataScaleUploaded == 0 ? 'opacity-50 cursor-not-allowed pointer-events-none' : 'opacity-100 cursor-pointer'">
5455
<a [routerLink]="['./data']" rel="noopener noreferrer" class="circle text-white"
@@ -67,7 +68,8 @@
6768
</a>
6869
</div>
6970
</div>
70-
<div class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
71+
<div class="flex items-center justify-center overflow-visible"
72+
[ngClass]="user?.role == 'ENGINEER'?'mt-10 2xl:mt-12':''">
7173
<div data-tip="Labeling" class="tooltip tooltip-right relative z-50"
7274
[ngClass]="project.numDataScaleUploaded == 0 ? 'opacity-50 cursor-not-allowed pointer-events-none' : 'opacity-100 cursor-pointer'">
7375
<a [routerLink]="['./labeling']" rel="noopener noreferrer"
@@ -82,7 +84,8 @@
8284
</a>
8385
</div>
8486
</div>
85-
<div class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
87+
<div *ngIf="user?.role == 'ENGINEER'"
88+
class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
8689
<div data-tip="Heuristics" class="tooltip tooltip-right relative z-50"
8790
[ngClass]="project.numDataScaleUploaded == 0 ? 'opacity-50 cursor-not-allowed pointer-events-none' : 'opacity-100 cursor-pointer'">
8891
<a [routerLink]="['./heuristics']" rel="noopener noreferrer"
@@ -96,7 +99,8 @@
9699
</a>
97100
</div>
98101
</div>
99-
<div class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
102+
<div *ngIf="user?.role == 'ENGINEER'"
103+
class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
100104
<div data-tip="Settings" class="tooltip tooltip-right relative z-50">
101105
<a [routerLink]="['./settings']" rel="noopener noreferrer"
102106
class="circle text-white"
@@ -119,7 +123,7 @@
119123
</div>
120124
</div>
121125
</div>
122-
<div [ngClass]="user?.role == 'ENGINEER' ? 'visible' : 'invisible' ">
126+
<div *ngIf="user?.role == 'ENGINEER'">
123127
<div class="flex items-center justify-center overflow-visible mt-6">
124128
<div data-tip="Documentation" class="tooltip tooltip-right relative z-50">
125129
<a href="https://docs.kern.ai/" target="_blank" rel="noopener noreferrer"
@@ -149,29 +153,32 @@
149153
</a>
150154
</div>
151155
</div>
152-
<div class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
153-
<div data-tip="Join our community" class="tooltip tooltip-right relative z-50">
154-
<a href="https://discord.com/invite/qf4rGCEphW" target="_blank"
155-
rel="noopener noreferrer" class="circle text-white">
156-
<svg xmlns="http://www.w3.org/2000/svg"
157-
class="icon icon-tabler icon-tabler-brand-discord" width="24" height="24"
158-
viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
159-
stroke-linecap="round" stroke-linejoin="round">
160-
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
161-
<circle cx="9" cy="12" r="1"></circle>
162-
<circle cx="15" cy="12" r="1"></circle>
163-
<path d="M7.5 7.5c3.5 -1 5.5 -1 9 0"></path>
164-
<path d="M7 16.5c3.5 1 6.5 1 10 0"></path>
165-
<path
166-
d="M15.5 17c0 1 1.5 3 2 3c1.5 0 2.833 -1.667 3.5 -3c.667 -1.667 .5 -5.833 -1.5 -11.5c-1.457 -1.015 -3 -1.34 -4.5 -1.5l-1 2.5">
167-
</path>
168-
<path
169-
d="M8.5 17c0 1 -1.356 3 -1.832 3c-1.429 0 -2.698 -1.667 -3.333 -3c-.635 -1.667 -.476 -5.833 1.428 -11.5c1.388 -1.015 2.782 -1.34 4.237 -1.5l1 2.5">
170-
</path>
171-
</svg>
172-
</a>
173-
</div>
174-
</div>
156+
157+
</div>
158+
</div>
159+
160+
161+
<div class="flex items-center justify-center overflow-visible mt-10 2xl:mt-12">
162+
<div data-tip="Join our community" class="tooltip tooltip-right relative z-50">
163+
<a href="https://discord.com/invite/qf4rGCEphW" target="_blank" rel="noopener noreferrer"
164+
class="circle text-white">
165+
<svg xmlns="http://www.w3.org/2000/svg"
166+
class="icon icon-tabler icon-tabler-brand-discord" width="24" height="24"
167+
viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
168+
stroke-linecap="round" stroke-linejoin="round">
169+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
170+
<circle cx="9" cy="12" r="1"></circle>
171+
<circle cx="15" cy="12" r="1"></circle>
172+
<path d="M7.5 7.5c3.5 -1 5.5 -1 9 0"></path>
173+
<path d="M7 16.5c3.5 1 6.5 1 10 0"></path>
174+
<path
175+
d="M15.5 17c0 1 1.5 3 2 3c1.5 0 2.833 -1.667 3.5 -3c.667 -1.667 .5 -5.833 -1.5 -11.5c-1.457 -1.015 -3 -1.34 -4.5 -1.5l-1 2.5">
176+
</path>
177+
<path
178+
d="M8.5 17c0 1 -1.356 3 -1.832 3c-1.429 0 -2.698 -1.667 -3.333 -3c-.635 -1.667 -.476 -5.833 1.428 -11.5c1.388 -1.015 2.782 -1.34 4.237 -1.5l1 2.5">
179+
</path>
180+
</svg>
181+
</a>
175182
</div>
176183
</div>
177184
</div>
@@ -219,13 +226,7 @@
219226
</div>
220227
</div>
221228
</div>
222-
</div>
223-
<div #svgMenu class="flex lg:hidden m-4 cursor-pointer" (isMenuOpen)="toggleVisible($event, sideBar, svgMenu)"
224-
appDropdown>
225-
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"
226-
stroke-width="2">
227-
<path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 12h16M4 18h16" />
228-
</svg>
229+
229230
</div>
230231
</div>
231232

‎src/app/base/components/sidebar-pm/sidebar-pm.component.ts

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -135,19 +135,6 @@ export class SidebarPmComponent implements OnInit {
135135
return route.url.value.toString().includes(menuItem);
136136
}
137137

138-
toggleVisible(isVisible: boolean, menuButton: HTMLDivElement, svgIcon: HTMLDivElement): void {
139-
if (isVisible) {
140-
menuButton.classList.remove('hidden');
141-
menuButton.classList.add('flex');
142-
svgIcon.classList.remove('flex');
143-
svgIcon.classList.add('hidden');
144-
} else {
145-
menuButton.classList.remove('flex');
146-
menuButton.classList.add('hidden');
147-
svgIcon.classList.remove('hidden');
148-
svgIcon.classList.add('flex');
149-
}
150-
}
151138

152139
openFullscreen() {
153140
this.isFullscreen = true;

0 commit comments

Comments
 (0)