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

Commit 5a527e3

Browse files
author
JWittmeyer
committed
Adds lock option for heuristic links
1 parent cac87b2 commit 5a527e3

File tree

11 files changed

+190
-37
lines changed

11 files changed

+190
-37
lines changed

src/app/base/services/project/project-apollo.service.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -957,6 +957,17 @@ export class ProjectApolloService {
957957
.pipe(map((result) => result['data']['accessLink']));
958958
}
959959

960+
lockAccessLink(projectId: string, linkId: string, lockState: boolean = true) {
961+
return this.apollo.mutate({
962+
mutation: mutations.LOCK_ACCESS_LINK,
963+
variables: {
964+
projectId: projectId,
965+
linkId: linkId,
966+
lockState: lockState,
967+
},
968+
});
969+
}
970+
960971
createAccessLink(
961972
projectId: string,
962973
type: string,
@@ -982,4 +993,18 @@ export class ProjectApolloService {
982993
});
983994
}
984995

996+
linkLocked(projectId: string, linkRoute: string) {
997+
return this.apollo
998+
.query({
999+
query: queries.LINK_LOCKED,
1000+
variables: {
1001+
projectId: projectId,
1002+
linkRoute: linkRoute
1003+
},
1004+
fetchPolicy: 'no-cache', //this shouldnt change often (also default value)
1005+
})
1006+
.pipe(map((result) => result['data']['linkLocked']));
1007+
1008+
}
1009+
9851010
}

src/app/base/services/project/project-mutations.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -197,6 +197,7 @@ export const mutations = {
197197
link {
198198
id
199199
link
200+
isLocked
200201
}
201202
}
202203
}
@@ -208,6 +209,13 @@ mutation ($projectId: ID!, $linkId: ID!) {
208209
ok
209210
}
210211
}
212+
`,
213+
LOCK_ACCESS_LINK: gql`
214+
mutation ($projectId: ID!, $linkId: ID!, $lockState: Boolean) {
215+
lockAccessLink(projectId: $projectId, linkId: $linkId, lockState: $lockState) {
216+
ok
217+
}
218+
}
211219
`
212220

213221
};

src/app/base/services/project/project-queries.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -369,6 +369,7 @@ export const queries = {
369369
accessLink(projectId: $projectId, linkId: $linkId) {
370370
id
371371
link
372+
isLocked
372373
}
373374
}
374375
`,
@@ -384,6 +385,11 @@ export const queries = {
384385
}
385386
}
386387
387-
`
388+
`,
389+
LINK_LOCKED: gql`
390+
query ($projectId: ID!, $linkRoute: String!) {
391+
linkLocked(projectId: $projectId, linkRoute: $linkRoute)
392+
}`
393+
,
388394

389395
};

src/app/labeling/components/helper/labeling-helper.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ export type labelingLinkData = {
55
id: string;
66
requestedPos: number;
77
linkType: labelingLinkType;
8+
linkLocked?: boolean;
89
};
910

1011
export type labelingHuddle = {

src/app/labeling/components/labeling.component.html

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,26 @@
11
<div *ngIf="user" class="h-full grid gap-0 bg-white" style="grid-template-rows: 65px minmax(auto,92%) 65px; "
22
[ngClass]="somethingLoading?'wait':null">
3-
<div *ngIf="huddleData && (roleAssumed || !huddleData.canEdit)"
3+
<div *ngIf="huddleData && (roleAssumed || !huddleData.canEdit) && !labelingLinkData?.linkLocked"
44
class="absolute left-0 right-0 flex items-center justify-center pointer-events-none"
55
style="top:17px;z-index:100">
66
<span class="inline-flex items-center px-2 py-0.5 rounded font-medium bg-red-100 text-red-800">
77
You are viewing this page as {{user.role}} you are not able to edit </span>
88
</div>
9+
<div *ngIf="labelingLinkData?.linkLocked"
10+
class="absolute left-0 right-0 flex items-center justify-center pointer-events-none"
11+
style="top:17px;z-index:101">
12+
<span class="inline-flex items-center px-2 py-0.5 rounded font-medium bg-red-100 text-red-800">
13+
This link is locked, contact your supervisor to request access</span>
14+
</div>
915
<ng-container [ngTemplateOutlet]="navigationBar" [ngTemplateOutletContext]="{isBottom:false}">
1016
</ng-container>
1117
<ng-template #dummyDiv>
1218
<div class="h-full flex flex-grow items-center justify-center">
13-
<kern-loading size="btn-lg"></kern-loading>
19+
<kern-loading size="btn-lg" *ngIf="!labelingLinkData?.linkLocked"></kern-loading>
1420
</div>
1521
</ng-template>
16-
<div #baseDomElement *ngIf="project;else dummyDiv" class="flex justify-center relative overflow-y-auto -mt-1.5">
22+
<div #baseDomElement *ngIf="project && !labelingLinkData?.linkLocked;else dummyDiv"
23+
class="flex justify-center relative overflow-y-auto -mt-1.5">
1724
<div #setLabelBox class="flex flex-col rounded-lg bg-white shadow absolute z-10 top-0 left-0"
1825
style="transition: max-height 0.25s ease-in-out;"
1926
[ngClass]="isLabelBoxOpen ? 'max-h-80 overflow-y-auto border border-gray-300' : 'max-h-0 overflow-hidden'"

src/app/labeling/components/labeling.component.ts

Lines changed: 31 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ import {
2727
labelSourceToString,
2828
} from 'src/app/base/enum/graphql-enums';
2929
import { NotificationApolloService } from 'src/app/base/services/notification/notification-apollo.service';
30-
import { dateAsUTCDate } from 'src/app/util/helper-functions';
30+
import { dateAsUTCDate, parseLinkFromText } from 'src/app/util/helper-functions';
3131
import { OrganizationApolloService } from 'src/app/base/services/organization/organization-apollo.service';
3232
import { NotificationService } from 'src/app/base/services/notification.service';
3333
import { assumeUserRole, guessLinkType, labelingHuddle, labelingLinkData, labelingLinkType, parseLabelingLinkData, userRoles } from './helper/labeling-helper';
@@ -149,10 +149,13 @@ export class LabelingComponent implements OnInit, OnDestroy {
149149

150150
let initialTasks$ = [];
151151
initialTasks$.push(this.prepareUser());
152+
if (this.labelingLinkData.linkType == "HEURISTIC") {
153+
initialTasks$.push(this.checkLinkAccess());
154+
}
152155
forkJoin(initialTasks$).pipe(first()).subscribe(() => {
153156

154157
//user is set to null if a redirect is needed
155-
if (!this.user) return;
158+
if (!this.user || this.labelingLinkData.linkLocked) return;
156159
let initialTasks$ = [];
157160
initialTasks$.push(this.prepareProject(this.labelingLinkData.projectId));
158161
initialTasks$.push(this.prepareLabelingTask(this.labelingLinkData.projectId));
@@ -181,11 +184,23 @@ export class LabelingComponent implements OnInit, OnDestroy {
181184

182185
}
183186

187+
checkLinkAccess() {
188+
const pipeFirst = this.projectApolloService.linkLocked(this.labelingLinkData.projectId, this.router.url)
189+
.pipe(first());
190+
191+
pipeFirst.subscribe((isLocked) => {
192+
this.labelingLinkData.linkLocked = isLocked;
193+
if (isLocked) this.somethingLoading = false;
194+
});
195+
return pipeFirst;
196+
}
197+
184198
getWhiteListNotificationService(): string[] {
185199
let toReturn = ['label_created', 'label_deleted', 'attributes_updated'];
186200
toReturn.push(...['payload_finished', 'weak_supervision_finished']);
187201
toReturn.push(...['labeling_task_deleted', 'labeling_task_updated', 'labeling_task_created']);
188202
toReturn.push(...['record_deleted', 'rla_created', 'rla_deleted']);
203+
toReturn.push(...['access_link_changed', 'access_link_removed']);
189204
return toReturn;
190205
}
191206

@@ -312,6 +327,8 @@ export class LabelingComponent implements OnInit, OnDestroy {
312327
this.roleAssumed = this.user.role != user.role;
313328
this.displayUserId = user.id;
314329

330+
//no old data to ensure the view is up to date (lockstate etc.)
331+
if (this.roleAssumed) localStorage.removeItem("huddleData");
315332
});
316333
return pipeFirst;
317334
}
@@ -1722,6 +1739,18 @@ export class LabelingComponent implements OnInit, OnDestroy {
17221739
}
17231740
} else if (msgParts[1] == 'attributes_updated') {
17241741
this.attributesQuery$.refetch();
1742+
} else if (['access_link_changed', 'access_link_removed'].includes(msgParts[1])) {
1743+
if (this.router.url.indexOf(msgParts[3]) > -1 && this.labelingLinkData) {
1744+
// this.checkLinkAccess();
1745+
console.log(msgParts[4], !msgParts[4], msgParts[4] === 'true')
1746+
this.labelingLinkData.linkLocked = !msgParts[4] || msgParts[4] === 'true';
1747+
// location.reload();
1748+
}
1749+
1750+
} else if (msgParts[1] == 'information_source_updated') {
1751+
if (this.router.url.indexOf(msgParts[2]) > -1 && this.labelingLinkData) {
1752+
location.reload();
1753+
}
17251754
}
17261755
}
17271756

src/app/util/helper-functions.ts

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,3 +20,34 @@ export function formatBytes(bytes, decimals = 2) {
2020
return parseFloat((bytes / Math.pow(1024, i)).toFixed(dm)) + ' ' + sizes[i];
2121
}
2222

23+
24+
export function parseLinkFromText(link: string) {
25+
if (!link) return null;
26+
let linkData: any = {
27+
protocol: window.location.protocol,
28+
host: window.location.host,
29+
inputLink: "" + link,
30+
queryParams: {}
31+
}
32+
if (link.startsWith(linkData.protocol)) link = link.substring(linkData.protocol.length);
33+
if (link.startsWith("//")) link = link.substring(2);
34+
if (link.startsWith(linkData.host)) link = link.substring(linkData.host.length);
35+
if (link.startsWith("/app")) link = link.substring(4);
36+
if (link.indexOf("?") > -1) {
37+
let params = link.split("?");
38+
linkData.route = params[0];
39+
params = params[1].split("&");
40+
params.forEach(param => {
41+
let keyValue = param.split("=");
42+
linkData.queryParams[keyValue[0]] = keyValue[1];
43+
})
44+
} else {
45+
linkData.route = link;
46+
}
47+
48+
linkData.fullUrl = linkData.protocol + '//' + linkData.host + "/app" + linkData.route;
49+
if (linkData.queryParams) linkData.fullUrl += "?" + Object.keys(linkData.queryParams).map(key => key + "=" + linkData.queryParams[key]).join("&");
50+
51+
52+
return linkData;
53+
}

src/app/weak-supervision/components/crowd-labeler-details/component/crowd-labeler-details.component.html

Lines changed: 46 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -195,21 +195,53 @@ <h3 class="mt-2 text-3xl font-bold leading-8 tracking-tight text-gray-900 sm:tex
195195

196196
<div *ngIf="crowdSettings.accessLinkParsed" class="mt-4">
197197
<label class="text-sm font-medium text-gray-700">Heuristic URL</label>
198+
198199
<div class="mt-1 flex rounded-md">
199-
<ng-template [ngIf]="crowdSettings.isHTTPS" [ngIfElse]="displayHTTP">
200-
<span
201-
class="inline-flex items-center rounded-l-md border border-r-0 border-gray-300 bg-gray-50 px-3 text-gray-500 sm:text-sm">https://</span>
202-
<span data-tip="Copy to clipboard"
203-
(click)="copyToClipboard(crowdSettings.accessLinkParsed)" type="text"
204-
class="cursor-pointer tooltip border rounded-none rounded-r-md border-gray-300 px-3 py-2 focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm">{{crowdSettings.accessLinkParsed.substring(8)}}</span>
205-
</ng-template>
206-
<ng-template #displayHTTP>
207-
<span
208-
class="inline-flex items-center rounded-l-md border border-r-0 border-gray-300 bg-gray-50 px-3 text-gray-500 sm:text-sm">http://</span>
209-
<span data-tip="Copy to clipboard"
210-
(click)="copyToClipboard(crowdSettings.accessLinkParsed)" type="text"
211-
class="cursor-pointer tooltip border rounded-none rounded-r-md border-gray-300 px-3 py-2 focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm">{{crowdSettings.accessLinkParsed.substring(7)}}</span>
212-
</ng-template>
200+
<span
201+
class="inline-flex items-center rounded-l-md border border-r-0 border-gray-300 bg-gray-50 px-3 text-gray-500 sm:text-sm">{{crowdSettings.isHTTPS?
202+
'https://':'http://'}}</span>
203+
<span data-tip="Copy to clipboard"
204+
(click)="copyToClipboard(crowdSettings.accessLinkParsed)" type="text"
205+
[ngStyle]="{'background-color': crowdSettings.accessLinkLocked?'#dbdbdb':null}"
206+
class="cursor-pointer tooltip border rounded-none rounded-r-md border-gray-300 px-3 py-2 focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm">
207+
{{crowdSettings.accessLinkParsed.substring(crowdSettings.isHTTPS?8:7)}}</span>
208+
209+
</div>
210+
<div class="flex flex-row items-center mt-2 gap-2">
211+
<button (click)="testLink()"
212+
class=" opacity-100 cursor-pointer w-40 bg-indigo-700 text-white text-xs leading-4 font-semibold px-4 py-2 rounded-md cursor-pointer hover:bg-indigo-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
213+
View as annotator
214+
</button>
215+
<button (click)="changeAccessLinkLock(!crowdSettings.accessLinkLocked)"
216+
[attr.data-tip]="crowdSettings.accessLinkLocked?'Unlock access':'Lock access'"
217+
class="tooltip tooltip-top btn btn-sm btn-ghost px-0 normal-case">
218+
<svg *ngIf="crowdSettings.accessLinkLocked" xmlns="http://www.w3.org/2000/svg"
219+
class="icon icon-tabler icon-tabler-lock" width="24" height="24"
220+
viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
221+
stroke-linecap="round" stroke-linejoin="round">
222+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
223+
<rect x="5" y="11" width="14" height="10" rx="2"></rect>
224+
<circle cx="12" cy="16" r="1"></circle>
225+
<path d="M8 11v-4a4 4 0 0 1 8 0v4"></path>
226+
</svg>
227+
<svg *ngIf="!crowdSettings.accessLinkLocked" xmlns="http://www.w3.org/2000/svg"
228+
class="icon icon-tabler icon-tabler-lock-open" width="24" height="24"
229+
viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
230+
stroke-linecap="round" stroke-linejoin="round">
231+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
232+
<rect x="5" y="11" width="14" height="10" rx="2"></rect>
233+
<circle cx="12" cy="16" r="1"></circle>
234+
<path d="M8 11v-5a4 4 0 0 1 8 0"></path>
235+
</svg>
236+
</button>
237+
<button (click)="removeAccessLink()" data-tip="remove link"
238+
class="tooltip tooltip-top btn btn-sm btn-ghost px-0 normal-case">
239+
<svg xmlns="http://www.w3.org/2000/svg" class="inline-block w-6 h-6 stroke-current"
240+
fill="none" viewBox="0 0 24 24" stroke="currentColor">
241+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
242+
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
243+
</svg>
244+
</button>
213245
</div>
214246
</div>
215247
</div>

0 commit comments

Comments
 (0)