pt
/
superset
mirror of https://github.com/apache/superset.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor: icon to icons for toasts component (#15579) 

* initial commit

* remove code

* fix test

* Update superset-frontend/src/messageToasts/components/Toast.tsx

Co-authored-by: David Aaron Suddjian <1858430+suddjian@users.noreply.github.com>

* Update superset-frontend/src/messageToasts/components/Toast.tsx

Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com>

* Update superset-frontend/src/messageToasts/components/Toast.tsx

Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com>

Co-authored-by: David Aaron Suddjian <1858430+suddjian@users.noreply.github.com>
Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com>
This commit is contained in:
Phillip Kelley-Dotson 2021-07-09 10:50:48 -07:00 committed by GitHub
parent f67e40236d
commit 600473ff72
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
superset-frontend/spec/javascripts/messageToasts/components/Toast_spec.jsx
View File

@ -18,6 +18,7 @@
*/
import React from 'react';
import { mount } from 'enzyme';
import { ThemeProvider, supersetTheme } from '@superset-ui/core';
import Toast from 'src/messageToasts/components/Toast';
import { act } from 'react-dom/test-utils';
import mockMessageToasts from '../mockMessageToasts';
@ -27,7 +28,11 @@ const props = {
onCloseToast() {},
};
const setup = overrideProps => mount(<Toast {...props} {...overrideProps} />);
const setup = overrideProps =>
mount(<Toast {...props} {...overrideProps} />, {
wrappingComponent: ThemeProvider,
wrappingComponentProps: { theme: supersetTheme },
});
describe('Toast', () => {
it('should render', () => {

20
superset-frontend/src/messageToasts/components/Toast.tsx
View File

@ -16,11 +16,11 @@
* specific language governing permissions and limitations
* under the License.
*/
import { styled } from '@superset-ui/core';
import { styled, css, SupersetTheme } from '@superset-ui/core';
import cx from 'classnames';
import Interweave from 'interweave';
import React, { useCallback, useEffect, useRef, useState } from 'react';
import Icon, { IconName } from 'src/components/Icon';
import Icons from 'src/components/Icons';
import { ToastType } from 'src/messageToasts/constants';
import { ToastMeta } from '../types';
@ -34,8 +34,9 @@ const ToastContainer = styled.div`
}
`;
const StyledIcon = styled(Icon)`
min-width: ${({ theme }) => theme.gridUnit * 5}px;
const StyledIcon = (theme: SupersetTheme) => css`
min-width: ${theme.gridUnit * 5}px;
color: ${theme.colors.grayscale.base};
`;
interface ToastPresenterProps {
@ -76,16 +77,17 @@ export default function Toast({ toast, onCloseToast }: ToastPresenterProps) {
};
}, [handleClosePress, toast.duration]);
let iconName: IconName = 'circle-check-solid';
let className = 'toast--success';
let icon = <Icons.CircleCheckSolid css={theme => StyledIcon(theme)} />;
if (toast.toastType === ToastType.WARNING) {
iconName = 'warning-solid';
icon = <Icons.WarningSolid css={StyledIcon} />;
className = 'toast--warning';
} else if (toast.toastType === ToastType.DANGER) {
iconName = 'error-solid';
icon = <Icons.ErrorSolid css={StyledIcon} />;
className = 'toast--danger';
} else if (toast.toastType === ToastType.INFO) {
iconName = 'info-solid';
icon = <Icons.InfoSolid css={StyledIcon} />;
className = 'toast--info';
}
@ -95,7 +97,7 @@ export default function Toast({ toast, onCloseToast }: ToastPresenterProps) {
data-test="toast-container"
role="alert"
>
<StyledIcon name={iconName} />
{icon}
<Interweave content={toast.text} />
<i
className="fa fa-close pull-right pointer"