Skip to content
This repository has been archived by the owner on Jul 29, 2024. It is now read-only.

Commit

Permalink
refactor: Toast 커링 함수 제거 및 css props 네이밍 수정
Browse files Browse the repository at this point in the history
  • Loading branch information
nangkyeonglim committed Aug 15, 2023
1 parent 84ab500 commit 1f38c86
Showing 1 changed file with 8 additions and 10 deletions.
18 changes: 8 additions & 10 deletions frontend/src/components/@common/Toast/Toast.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -37,15 +37,13 @@ const Toast = ({

const hideToast: HideToast = () => setIsVisible(false);

const removeToast =
(toastId: number): AnimationEventHandler<HTMLDivElement> =>
() => {
onClose(toastId);
};
const removeToast = (toastId: number) => {
onClose(toastId);
};

return (
<AnimationDiv isVisible={isVisible} onDisappear={removeToast(toastId)}>
<S.ToastContainer $theme={theme} $type={type}>
<AnimationDiv isVisible={isVisible} onDisappear={() => removeToast(toastId)}>
<S.ToastContainer $toastTheme={theme} $type={type}>
<S.Content>
<span>{message}</span>
{hasCloseButton && (
Expand All @@ -66,14 +64,14 @@ export default Toast;

const S = {
ToastContainer: styled.div<{
$theme: ToastTheme;
$toastTheme: ToastTheme;
$type: ToastType;
}>`
position: relative;
width: fit-content;
padding: 1.2rem 2.4rem;
background-color: ${({ theme, $type, $theme }) =>
$theme === 'light' ? theme.color.gray1 : theme.toastColor[$type].background};
background-color: ${({ theme, $type, $toastTheme }) =>
$toastTheme === 'light' ? theme.color.gray1 : theme.toastColor[$type].background};
border: 1px solid ${({ theme, $type }) => theme.toastColor[$type].border};
border-radius: 8px;
box-shadow:
Expand Down

0 comments on commit 1f38c86

Please sign in to comment.