grafana/public/app/features/admin/UserSessions.tsx

69 lines
2.0 KiB
TypeScript
Raw Normal View History

Ldap: Add LDAP debug page (#18759) * Add items for navmodel and basic page * add reducer and actions * adding user mapping table component * adding components for ldap tables * add alert box on error * close error alert box * LDAP status page: connect APIs WIP * LDAP debug: fetch connection status from API * LDAP debug: fetch user info from API * LDAP debug: improve connection error view * LDAP debug: connection error tweaks * LDAP debug: fix role mapping view * LDAP debug: role mapping view tweaks * LDAP debug: add bulk-sync button stub * LDAP debug: minor refactor * LDAP debug: show user teams * LDAP debug: user info refactor * LDAP debug: initial user page * LDAP debug: minor refactor, remove unused angular wrapper * LDAP debug: add sessions to user page * LDAP debug: tweak user page * LDAP debug: tweak view for disabled user * LDAP debug: get sync info from API * LDAP debug: user sync info * LDAP debug: sync user button * LDAP debug: clear error on page load * LDAP debug: add user last sync info * LDAP debug: actions refactor * LDAP debug: roles and teams style tweaks * Pass showAttributeMapping to LdapUserTeams * LDAP debug: hide bulk sync button * LDAP debug: refactor sessions component * LDAP debug: fix loading user sessions * LDAP debug: hide sync user button * LDAP debug: fix fetching unavailable /ldap-sync-status endpoint * LDAP debug: revert accidentally added fix * LDAP debug: show error when LDAP is not enabled * LDAP debug: refactor, move ldap components into ldap/ folder * LDAP debug: styles refactoring * LDAP debug: ldap reducer tests * LDAP debug: ldap user reducer tests * LDAP debug: fix connection error placement * Text update * LdapUser: Minor UI changes moving things around * AlertBox: Removed icon-on-top as everywhere else it is centered, want to have it be consistent
2019-09-16 10:56:01 -05:00
import React, { PureComponent } from 'react';
import { UserSession } from 'app/types';
interface Props {
sessions: UserSession[];
onSessionRevoke: (id: number) => void;
onAllSessionsRevoke: () => void;
}
export class UserSessions extends PureComponent<Props> {
handleSessionRevoke = (id: number) => {
return () => {
this.props.onSessionRevoke(id);
};
};
handleAllSessionsRevoke = () => {
this.props.onAllSessionsRevoke();
};
render() {
const { sessions } = this.props;
return (
<>
<h3 className="page-heading">Sessions</h3>
<div className="gf-form-group">
<div className="gf-form">
<table className="filter-table form-inline">
<thead>
<tr>
<th>Last seen</th>
<th>Logged on</th>
<th>IP address</th>
<th colSpan={2}>Browser &amp; OS</th>
</tr>
</thead>
<tbody>
{sessions &&
sessions.map((session, index) => (
<tr key={`${session.id}-${index}`}>
<td>{session.isActive ? 'Now' : session.seenAt}</td>
<td>{session.createdAt}</td>
<td>{session.clientIp}</td>
<td>{`${session.browser} on ${session.os} ${session.osVersion}`}</td>
<td>
<button className="btn btn-danger btn-small" onClick={this.handleSessionRevoke(session.id)}>
<i className="fa fa-power-off" />
</button>
</td>
</tr>
))}
</tbody>
</table>
</div>
<div className="gf-form-button-row">
{sessions.length > 0 && (
<button className="btn btn-danger" onClick={this.handleAllSessionsRevoke}>
Logout user from all devices
</button>
)}
</div>
</div>
</>
);
}
}