[디테일] 하단 구매 토스트 노출 관련수정
- 디테일 상단 백버튼에 포커스가면 clearAllToasts 처리.
This commit is contained in:
@@ -35,6 +35,7 @@ import {
|
|||||||
clearProductDetail,
|
clearProductDetail,
|
||||||
getProductOptionId,
|
getProductOptionId,
|
||||||
} from '../../actions/productActions';
|
} from '../../actions/productActions';
|
||||||
|
import { clearAllToasts } from '../../actions/toastActions';
|
||||||
import TBody from '../../components/TBody/TBody';
|
import TBody from '../../components/TBody/TBody';
|
||||||
import TPanel from '../../components/TPanel/TPanel';
|
import TPanel from '../../components/TPanel/TPanel';
|
||||||
import { panel_names } from '../../utils/Config';
|
import { panel_names } from '../../utils/Config';
|
||||||
@@ -180,6 +181,10 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
|
|||||||
[dispatch, panelInfo, panels]
|
[dispatch, panelInfo, panels]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const onBackButtonFocus = useCallback(() => {
|
||||||
|
dispatch(clearAllToasts());
|
||||||
|
},[dispatch])
|
||||||
|
|
||||||
const handleScrollToSection = useCallback(
|
const handleScrollToSection = useCallback(
|
||||||
(sectionId) => {
|
(sectionId) => {
|
||||||
console.log('DetailPanel: handleScrollToSection called with:', sectionId);
|
console.log('DetailPanel: handleScrollToSection called with:', sectionId);
|
||||||
@@ -681,6 +686,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
|
|||||||
title={headerTitle}
|
title={headerTitle}
|
||||||
onBackButton
|
onBackButton
|
||||||
onClick={onClick(false)}
|
onClick={onClick(false)}
|
||||||
|
onBackButtonFocus={onBackButtonFocus}
|
||||||
spotlightDisabled={isLoading}
|
spotlightDisabled={isLoading}
|
||||||
onSpotlightUp={onSpotlightUpTButton}
|
onSpotlightUp={onSpotlightUpTButton}
|
||||||
onSpotlightLeft={onSpotlightUpTButton}
|
onSpotlightLeft={onSpotlightUpTButton}
|
||||||
|
|||||||
@@ -28,6 +28,7 @@ export default function THeaderCustom({
|
|||||||
onBackButton,
|
onBackButton,
|
||||||
onSpotlightUp,
|
onSpotlightUp,
|
||||||
onSpotlightLeft,
|
onSpotlightLeft,
|
||||||
|
onBackButtonFocus,
|
||||||
marqueeDisabled = true,
|
marqueeDisabled = true,
|
||||||
onClick,
|
onClick,
|
||||||
ariaLabel,
|
ariaLabel,
|
||||||
@@ -65,12 +66,19 @@ export default function THeaderCustom({
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const _onBackButtonFocus = useCallback(() => {
|
||||||
|
if(onBackButtonFocus){
|
||||||
|
onBackButtonFocus();
|
||||||
|
}
|
||||||
|
},[onBackButtonFocus])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Container className={classNames(css.tHeaderCustom, className)} {...rest}>
|
<Container className={classNames(css.tHeaderCustom, className)} {...rest}>
|
||||||
{onBackButton && (
|
{onBackButton && (
|
||||||
<SpottableComponent
|
<SpottableComponent
|
||||||
className={css.button}
|
className={css.button}
|
||||||
onClick={_onClick}
|
onClick={_onClick}
|
||||||
|
onFocus={_onBackButtonFocus}
|
||||||
spotlightId={"spotlightId_backBtn"}
|
spotlightId={"spotlightId_backBtn"}
|
||||||
onSpotlightUp={_onSpotlightUp}
|
onSpotlightUp={_onSpotlightUp}
|
||||||
onSpotlightLeft={_onSpotlightLeft}
|
onSpotlightLeft={_onSpotlightLeft}
|
||||||
|
|||||||
Reference in New Issue
Block a user