/
switch-user.ts
110 lines (99 loc) · 3.18 KB
/
switch-user.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
/*
* This file is part of the TYPO3 CMS project.
*
* It is free software; you can redistribute it and/or modify it under
* the terms of the GNU General Public License, either version 2
* of the License, or any later version.
*
* For the full copyright and license information, please read the
* LICENSE.txt file that was distributed with this source code.
*
* The TYPO3 project - inspiring people to share!
*/
import { html, css, TemplateResult, LitElement } from 'lit';
import { customElement, property } from 'lit/decorators';
import AjaxRequest from '@typo3/core/ajax/ajax-request';
import { AjaxResponse } from '@typo3/core/ajax/ajax-response';
import Notification from '@typo3/backend/notification';
enum Modes {
switch = 'switch',
exit = 'exit',
}
/**
* Module: @typo3/backend/switch-user
*
* @example
* <typo3-switch-user class="some" targetUser="123" mode="switch">
* Switch user
* </typo3-switch-user>
*/
@customElement('typo3-backend-switch-user')
export class SwitchUser extends LitElement {
static styles = [css`:host { cursor: pointer; appearance: button; }`];
@property({ type: String }) targetUser: string;
@property({ type: Modes }) mode: Modes = Modes.switch;
public constructor() {
super();
this.addEventListener('click', (event: Event): void => {
event.preventDefault();
if (this.mode === Modes.switch) {
this.handleSwitchUser();
} else if (this.mode === Modes.exit) {
this.handleExitSwitchUser();
}
});
this.addEventListener('keydown', (event: KeyboardEvent): void => {
if (event.key === 'Enter' || event.key === ' ') {
event.preventDefault();
if (this.mode === Modes.switch) {
this.handleSwitchUser();
} else if (this.mode === Modes.exit) {
this.handleExitSwitchUser();
}
}
});
}
public connectedCallback(): void {
if (!this.hasAttribute('role')) {
this.setAttribute('role', 'button');
}
if (!this.hasAttribute('tabindex')) {
this.setAttribute('tabindex', '0');
}
}
protected render(): TemplateResult {
return html`<slot></slot>`;
}
private handleSwitchUser(): void {
if (!this.targetUser) {
// Invalid request without target user
Notification.error('Switching to user went wrong.');
return;
}
(new AjaxRequest(TYPO3.settings.ajaxUrls.switch_user)).post({
targetUser: this.targetUser,
}).then(async (response: AjaxResponse): Promise<void> => {
const data = await response.resolve();
if (data.success === true && data.url) {
top.window.location.href = data.url;
} else {
Notification.error('Switching to user went wrong.');
}
});
}
private handleExitSwitchUser(): void {
(new AjaxRequest(TYPO3.settings.ajaxUrls.switch_user_exit)).post({}).then(async (response: AjaxResponse): Promise<void> => {
const data = await response.resolve();
if (data.success === true && data.url) {
top.window.location.href = data.url;
} else {
Notification.error('Exiting current user went wrong.');
}
});
}
}
declare global {
interface HTMLElementTagNameMap {
'typo3-backend-switch-user': SwitchUser;
}
}