The communications platform that puts data protection first.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Rocket.Chat/client/sidebar/header/UserAvatarButton.js

147 lines
3.9 KiB

[IMPROVE] New sidebar layout (#19089) * wip * wip * more work in progress * lint * Fix IE11 support livechat widget * More wip * lint * Add correct buttons and fix some errors * fix import * Fix error with empty department agents * fix title and tags * more fixes * fix agents save * Fix agentlist not saving * First Review * update fuselage * Sidebar variations * Fix Stories * Sidebar Header * Initial data * Fix paddings * sidebar search * Wip Chats * Added more logic * Fix Memo * Virtual List * switch to VariableSizeList * Fix Size * Te acalma Gabriel * Badges * Menu actions * Do not group by type option * Highligthed state * Fix menu * Item Skeletons * Search list * Omnichannel to virtualList * Sidebar header * SidebarHeader * Better Ominichannel Context usage * Revome livechat template * Remove discussion Room List * alert and open prop * Menu as renderprop * ReactiveUserPresence * Update components * Update cachedCollection * Fiz discussions * update cachedcolletion * Header color * Fix unread * Presence * Fix presence * Fix Admin * [wip] Search bar * get usernames in subscription * Local an spotlight search * Fix avatar id prop * Fix multi users on search * Livechat RoomMenu * Fix Header in anonymous sessions * Fix sidebar * update base old * Sidebar variations * Fix Stories * Sidebar Header * Initial data * Fix paddings * sidebar search * Wip Chats * Added more logic * Virtual List * Fix Memo * switch to VariableSizeList * Fix Size * Te acalma Gabriel * Badges * Menu actions * Do not group by type option * Highligthed state * Item Skeletons * Search list * Fix menu * Omnichannel to virtualList * Sidebar header * SidebarHeader * Better Ominichannel Context usage * Revome livechat template * Remove discussion Room List * alert and open prop * Menu as renderprop * ReactiveUserPresence * Update components * Update cachedCollection * Fiz discussions * update cachedcolletion * Header color * Fix unread * Presence * Fix presence * Fix Admin * [wip] Search bar * get usernames in subscription * Local an spotlight search * Fix avatar id prop * [FIX] Missing "Bio" in user's profile view (#19166) * [FIX] Omnichannel: triggers page not rendering (#19134) * [FIX] VisitorAutoComplete component (#19133) * [FIX] Admin Sidebar overflowing (#19101) * [FIX] Integrations history page not reacting to changes. (#19114) * [FIX] Selecting the same department for multiple units (#19168) * [FIX] Error when editing priority and required description (#19170) * [FIX] Thread view in a channel user haven't joined (#19172) * [FIX] Livechat Appearance label and reset button (#19171) * Refactor: Omnichannel departments (#18920) Co-authored-by: Guilherme Gazzo <guilherme@gazzo.xyz> Co-authored-by: Gabriel Henriques <gabriel.henriques@rocket.chat> Co-authored-by: Guilherme Gazzo <guilhermegazzo@gmail.com> * Fix multi users on search * Livechat RoomMenu * Fix Header in anonymous sessions * Fix sidebar * Fix admin user Info * update base old * fix sidebar size * Fix sidebar tests * Lint * Package-lock * package-lock * Fix callback * Removed useless files * Fix LGTM * Isolate userpresence to dont leak react and fuselage * Fix Alert * update fuselage * fix hide modal not closing * Sort by name and activity * Fix reset * Arrow controls (#19239) Co-authored-by: Guilherme Gazzo <guilherme@gazzo.xyz> * Fixes * ActionButton * ActionButton[2] * ActionButton [3] * Support anonymous * Open menu by keyboard * Login button for anonymous users * Login button for anonymous users * Update code * ShouldUpdate * Change login Icon, fix badge * Update fuselage * Fix storybook * Fix storybook * Use Style and renamed * wip stories sidebar * Types * wip * Testing IE11 * WIP * Fix Typo * Use Layout colors * Lint * Fix * Remove CallProvider * Remove CallContext Co-authored-by: Martin <martin.schoeler@rocket.chat> Co-authored-by: Gabriel Henriques <gabriel.henriques@rocket.chat> Co-authored-by: Douglas Fabris <deefabris@gmail.com> Co-authored-by: gabriellsh <40830821+gabriellsh@users.noreply.github.com> Co-authored-by: Renato Becker <renato.augusto.becker@gmail.com> Co-authored-by: Tasso Evangelista <tasso.evangelista@rocket.chat>
5 years ago
import React from 'react';
import { Meteor } from 'meteor/meteor';
import { FlowRouter } from 'meteor/kadira:flow-router';
import { Box } from '@rocket.chat/fuselage';
import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
import { css } from '@rocket.chat/css-in-js';
import { popover, modal, AccountBox } from '../../../app/ui-utils';
import { useSetting } from '../../contexts/SettingsContext';
import { useTranslation } from '../../contexts/TranslationContext';
import { UserStatus } from '../../components/UserStatus';
[IMPROVE] New sidebar layout (#19089) * wip * wip * more work in progress * lint * Fix IE11 support livechat widget * More wip * lint * Add correct buttons and fix some errors * fix import * Fix error with empty department agents * fix title and tags * more fixes * fix agents save * Fix agentlist not saving * First Review * update fuselage * Sidebar variations * Fix Stories * Sidebar Header * Initial data * Fix paddings * sidebar search * Wip Chats * Added more logic * Fix Memo * Virtual List * switch to VariableSizeList * Fix Size * Te acalma Gabriel * Badges * Menu actions * Do not group by type option * Highligthed state * Fix menu * Item Skeletons * Search list * Omnichannel to virtualList * Sidebar header * SidebarHeader * Better Ominichannel Context usage * Revome livechat template * Remove discussion Room List * alert and open prop * Menu as renderprop * ReactiveUserPresence * Update components * Update cachedCollection * Fiz discussions * update cachedcolletion * Header color * Fix unread * Presence * Fix presence * Fix Admin * [wip] Search bar * get usernames in subscription * Local an spotlight search * Fix avatar id prop * Fix multi users on search * Livechat RoomMenu * Fix Header in anonymous sessions * Fix sidebar * update base old * Sidebar variations * Fix Stories * Sidebar Header * Initial data * Fix paddings * sidebar search * Wip Chats * Added more logic * Virtual List * Fix Memo * switch to VariableSizeList * Fix Size * Te acalma Gabriel * Badges * Menu actions * Do not group by type option * Highligthed state * Item Skeletons * Search list * Fix menu * Omnichannel to virtualList * Sidebar header * SidebarHeader * Better Ominichannel Context usage * Revome livechat template * Remove discussion Room List * alert and open prop * Menu as renderprop * ReactiveUserPresence * Update components * Update cachedCollection * Fiz discussions * update cachedcolletion * Header color * Fix unread * Presence * Fix presence * Fix Admin * [wip] Search bar * get usernames in subscription * Local an spotlight search * Fix avatar id prop * [FIX] Missing "Bio" in user's profile view (#19166) * [FIX] Omnichannel: triggers page not rendering (#19134) * [FIX] VisitorAutoComplete component (#19133) * [FIX] Admin Sidebar overflowing (#19101) * [FIX] Integrations history page not reacting to changes. (#19114) * [FIX] Selecting the same department for multiple units (#19168) * [FIX] Error when editing priority and required description (#19170) * [FIX] Thread view in a channel user haven't joined (#19172) * [FIX] Livechat Appearance label and reset button (#19171) * Refactor: Omnichannel departments (#18920) Co-authored-by: Guilherme Gazzo <guilherme@gazzo.xyz> Co-authored-by: Gabriel Henriques <gabriel.henriques@rocket.chat> Co-authored-by: Guilherme Gazzo <guilhermegazzo@gmail.com> * Fix multi users on search * Livechat RoomMenu * Fix Header in anonymous sessions * Fix sidebar * Fix admin user Info * update base old * fix sidebar size * Fix sidebar tests * Lint * Package-lock * package-lock * Fix callback * Removed useless files * Fix LGTM * Isolate userpresence to dont leak react and fuselage * Fix Alert * update fuselage * fix hide modal not closing * Sort by name and activity * Fix reset * Arrow controls (#19239) Co-authored-by: Guilherme Gazzo <guilherme@gazzo.xyz> * Fixes * ActionButton * ActionButton[2] * ActionButton [3] * Support anonymous * Open menu by keyboard * Login button for anonymous users * Login button for anonymous users * Update code * ShouldUpdate * Change login Icon, fix badge * Update fuselage * Fix storybook * Fix storybook * Use Style and renamed * wip stories sidebar * Types * wip * Testing IE11 * WIP * Fix Typo * Use Layout colors * Lint * Fix * Remove CallProvider * Remove CallContext Co-authored-by: Martin <martin.schoeler@rocket.chat> Co-authored-by: Gabriel Henriques <gabriel.henriques@rocket.chat> Co-authored-by: Douglas Fabris <deefabris@gmail.com> Co-authored-by: gabriellsh <40830821+gabriellsh@users.noreply.github.com> Co-authored-by: Renato Becker <renato.augusto.becker@gmail.com> Co-authored-by: Tasso Evangelista <tasso.evangelista@rocket.chat>
5 years ago
import { userStatus } from '../../../app/user-status';
import { callbacks } from '../../../app/callbacks';
import UserAvatar from '../../components/avatar/UserAvatar';
[IMPROVE] New sidebar layout (#19089) * wip * wip * more work in progress * lint * Fix IE11 support livechat widget * More wip * lint * Add correct buttons and fix some errors * fix import * Fix error with empty department agents * fix title and tags * more fixes * fix agents save * Fix agentlist not saving * First Review * update fuselage * Sidebar variations * Fix Stories * Sidebar Header * Initial data * Fix paddings * sidebar search * Wip Chats * Added more logic * Fix Memo * Virtual List * switch to VariableSizeList * Fix Size * Te acalma Gabriel * Badges * Menu actions * Do not group by type option * Highligthed state * Fix menu * Item Skeletons * Search list * Omnichannel to virtualList * Sidebar header * SidebarHeader * Better Ominichannel Context usage * Revome livechat template * Remove discussion Room List * alert and open prop * Menu as renderprop * ReactiveUserPresence * Update components * Update cachedCollection * Fiz discussions * update cachedcolletion * Header color * Fix unread * Presence * Fix presence * Fix Admin * [wip] Search bar * get usernames in subscription * Local an spotlight search * Fix avatar id prop * Fix multi users on search * Livechat RoomMenu * Fix Header in anonymous sessions * Fix sidebar * update base old * Sidebar variations * Fix Stories * Sidebar Header * Initial data * Fix paddings * sidebar search * Wip Chats * Added more logic * Virtual List * Fix Memo * switch to VariableSizeList * Fix Size * Te acalma Gabriel * Badges * Menu actions * Do not group by type option * Highligthed state * Item Skeletons * Search list * Fix menu * Omnichannel to virtualList * Sidebar header * SidebarHeader * Better Ominichannel Context usage * Revome livechat template * Remove discussion Room List * alert and open prop * Menu as renderprop * ReactiveUserPresence * Update components * Update cachedCollection * Fiz discussions * update cachedcolletion * Header color * Fix unread * Presence * Fix presence * Fix Admin * [wip] Search bar * get usernames in subscription * Local an spotlight search * Fix avatar id prop * [FIX] Missing "Bio" in user's profile view (#19166) * [FIX] Omnichannel: triggers page not rendering (#19134) * [FIX] VisitorAutoComplete component (#19133) * [FIX] Admin Sidebar overflowing (#19101) * [FIX] Integrations history page not reacting to changes. (#19114) * [FIX] Selecting the same department for multiple units (#19168) * [FIX] Error when editing priority and required description (#19170) * [FIX] Thread view in a channel user haven't joined (#19172) * [FIX] Livechat Appearance label and reset button (#19171) * Refactor: Omnichannel departments (#18920) Co-authored-by: Guilherme Gazzo <guilherme@gazzo.xyz> Co-authored-by: Gabriel Henriques <gabriel.henriques@rocket.chat> Co-authored-by: Guilherme Gazzo <guilhermegazzo@gmail.com> * Fix multi users on search * Livechat RoomMenu * Fix Header in anonymous sessions * Fix sidebar * Fix admin user Info * update base old * fix sidebar size * Fix sidebar tests * Lint * Package-lock * package-lock * Fix callback * Removed useless files * Fix LGTM * Isolate userpresence to dont leak react and fuselage * Fix Alert * update fuselage * fix hide modal not closing * Sort by name and activity * Fix reset * Arrow controls (#19239) Co-authored-by: Guilherme Gazzo <guilherme@gazzo.xyz> * Fixes * ActionButton * ActionButton[2] * ActionButton [3] * Support anonymous * Open menu by keyboard * Login button for anonymous users * Login button for anonymous users * Update code * ShouldUpdate * Change login Icon, fix badge * Update fuselage * Fix storybook * Fix storybook * Use Style and renamed * wip stories sidebar * Types * wip * Testing IE11 * WIP * Fix Typo * Use Layout colors * Lint * Fix * Remove CallProvider * Remove CallContext Co-authored-by: Martin <martin.schoeler@rocket.chat> Co-authored-by: Gabriel Henriques <gabriel.henriques@rocket.chat> Co-authored-by: Douglas Fabris <deefabris@gmail.com> Co-authored-by: gabriellsh <40830821+gabriellsh@users.noreply.github.com> Co-authored-by: Renato Becker <renato.augusto.becker@gmail.com> Co-authored-by: Tasso Evangelista <tasso.evangelista@rocket.chat>
5 years ago
const setStatus = (status, statusText) => {
AccountBox.setStatus(status, statusText);
callbacks.run('userStatusManuallySet', status);
popover.close();
};
const onClick = (e, t, allowAnonymousRead) => {
if (!(Meteor.userId() == null && allowAnonymousRead)) {
const user = Meteor.user();
const STATUS_MAP = [
'offline',
'online',
'away',
'busy',
];
const userStatusList = Object.keys(userStatus.list).map((key) => {
const status = userStatus.list[key];
const name = status.localizeName ? t(status.name) : status.name;
const modifier = status.statusType || user.status;
const defaultStatus = STATUS_MAP.includes(status.id);
const statusText = defaultStatus ? null : name;
return {
icon: 'circle',
name,
modifier,
action: () => setStatus(status.statusType, statusText),
};
});
const statusText = user.statusText || t(user.status);
userStatusList.push({
icon: 'edit',
name: t('Edit_Status'),
type: 'open',
action: (e) => {
e.preventDefault();
modal.open({
title: t('Edit_Status'),
content: 'editStatus',
data: {
onSave() {
modal.close();
},
},
modalClass: 'modal',
showConfirmButton: false,
showCancelButton: false,
confirmOnEnter: false,
});
},
});
const config = {
popoverClass: 'sidebar-header',
columns: [
{
groups: [
{
title: user.name,
items: [{
icon: 'circle',
name: statusText,
modifier: user.status,
}],
},
{
title: t('User'),
items: userStatusList,
},
{
items: [
{
icon: 'user',
name: t('My_Account'),
type: 'open',
id: 'account',
action: () => {
FlowRouter.go('account');
popover.close();
},
},
{
icon: 'sign-out',
name: t('Logout'),
type: 'open',
id: 'logout',
action: () => {
Meteor.logout(() => {
callbacks.run('afterLogoutCleanUp', user);
Meteor.call('logoutCleanUp', user);
FlowRouter.go('home');
popover.close();
});
},
},
],
},
],
},
],
currentTarget: e.currentTarget,
offsetVertical: e.currentTarget.clientHeight + 10,
};
popover.open(config);
}
};
export default React.memo(({ user = {} }) => {
const t = useTranslation();
const {
_id: uid,
status = !uid && 'online',
username = 'Anonymous',
avatarETag,
} = user;
const allowAnonymousRead = useSetting('Accounts_AllowAnonymousRead');
const handleClick = useMutableCallback((e) => uid && onClick(e, t, allowAnonymousRead));
return <Box position='relative' onClick={handleClick} className={css`cursor: pointer;`} data-qa='sidebar-avatar-button'>
<UserAvatar size='x24' username={username} etag={avatarETag}/>
<Box className={css`bottom: 0; right: 0;`} justifyContent='center' alignItems='center'display='flex' overflow='hidden' size='x12' borderWidth='x2' position='absolute' bg='neutral-200' borderColor='neutral-200' borderRadius='full' mie='neg-x2' mbe='neg-x2'>
<UserStatus small status={status}/>
</Box>
</Box>;
});