if/SymphonyElectron
1
0
Fork 0
mirror of https://github.com/finos/SymphonyElectron.git synced 2025-02-25 18:55:29 -06:00
Code Issues Packages Projects Releases Wiki Activity

Removed accept button icon + larger buttons (#1970)

Browse Source 
* Removed accept button icon + larger buttons

* Removed default image logic in call notifications

* UT fix
This commit is contained in:
Salah Benmoussati 2023-10-06 10:14:23 +02:00 committed by GitHub
parent 3189c54310
commit bca688167a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
spec/callNotification.spec.ts
View File

@ -119,16 +119,16 @@ describe('Call toast notification component', () => {
expect(imClass.exists()).toBeTruthy(); expect(imClass.exists()).toBeTruthy();
}); });
it('should render Symphony logo if Symphony default image provided', () => { it('should render profile picture if Symphony default image provided', () => {
const icon = './default.png'; const icon = './default.png';
ipcRenderer.send(IPC_RENDERER_NOTIFICATION_DATA_CHANNEL, { ipcRenderer.send(IPC_RENDERER_NOTIFICATION_DATA_CHANNEL, {
...defaultProps, ...defaultProps,
icon, icon,
}); });
const defaultLogoContainer = wrapper.find('.default-logo'); const defaultLogoContainer = wrapper.find('.default-logo');
expect(defaultLogoContainer).toBeTruthy(); expect(defaultLogoContainer.exists()).toBeFalsy();
const imageContainer = wrapper.find('.profile-picture'); const imageContainer = wrapper.find('.profile-picture');
expect(imageContainer.exists()).toBeFalsy(); expect(imageContainer).toBeTruthy();
}); });
it('should flash in a custom way when theme is set', () => { it('should flash in a custom way when theme is set', () => {

22
src/renderer/components/call-notification.tsx
View File

@ -99,7 +99,6 @@ export default class CallNotification extends React.Component<
company, company,
companyIconUrl, companyIconUrl,
color, color,
actionIconUrl,
profilePlaceHolderText, profilePlaceHolderText,
callType, callType,
acceptButtonText, acceptButtonText,
@ -226,22 +225,6 @@ export default class CallNotification extends React.Component<
})} })}
onClick={this.eventHandlers.onAccept(id)} onClick={this.eventHandlers.onAccept(id)}
> >
{actionIconUrl ? (
<img
onError={(event) => {
(event.target as any).src =
'../renderer/assets/call-icon.svg';
}}
className={'action-icon'}
src={actionIconUrl}
/>
) : (
<img
src='../renderer/assets/call-icon.svg'
alt='join call icon'
className='profile-picture-badge'
/>
)}
<div className='label'>{acceptText}</div> <div className='label'>{acceptText}</div>
</button> </button>
</div> </div>
@ -304,15 +287,14 @@ export default class CallNotification extends React.Component<
let imgClass = 'default-logo'; let imgClass = 'default-logo';
let url = '../renderer/assets/notification-symphony-logo.svg'; let url = '../renderer/assets/notification-symphony-logo.svg';
let alt = 'Symphony logo'; let alt = 'Symphony logo';
const isDefaultUrl = imageUrl && imageUrl.includes('default.png');
if (imageUrl && !isDefaultUrl) { if (imageUrl) {
imgClass = 'profile-picture'; imgClass = 'profile-picture';
url = imageUrl; url = imageUrl;
alt = 'Profile picture'; alt = 'Profile picture';
} }
if (!imageUrl || isDefaultUrl) { if (!imageUrl) {
const profilePlaceHolderClassName = const profilePlaceHolderClassName =
callType === 'IM' callType === 'IM'
? 'profilePlaceHolderContainer' ? 'profilePlaceHolderContainer'

15
src/renderer/styles/call-notification.less
View File

@ -229,26 +229,29 @@ text {
.actions { .actions {
display: flex; display: flex;
justify-content: center; flex-flow: row;
align-items: flex-start; width: 100%;
gap: 16px; gap: 16px;
align-self: stretch;
button { button {
display: flex; display: flex;
flex-grow: 1;
flex-basis: calc(100% / 2);
padding: 4px 8px;
padding: 4px 12px; padding: 4px 12px;
justify-content: center; justify-content: center;
width: var(--button-width);
align-items: center; align-items: center;
gap: 8px;
border-radius: 16px; border-radius: 16px;
border-style: none; border-style: none;
cursor: pointer; cursor: pointer;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
.label { .label {
color: @red-05; color: @red-05;
text-align: center; text-align: center;
font-size: 12px; font-size: 11px;
font-family: @font-family; font-family: @font-family;
font-style: normal; font-style: normal;
font-weight: 600; font-weight: 600;