optrader/shoptime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[251124] fix: App.js 로그 정리 및 최적화-2

Browse Source 
🕐 커밋 시간: 2025. 11. 24. 09:24:08

📊 변경 통계:
  • 총 파일: 5개
  • 추가: +156줄
  • 삭제: -111줄

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/actions/empActions.js
  ~ com.twin.app.shoptime/src/hooks/useFocusHistory/useFocusHistory.js
  ~ com.twin.app.shoptime/src/lunaSend/common.js
  ~ com.twin.app.shoptime/src/views/CheckOutPanel/CheckOutPanel.jsx
  ~ com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx

🔧 함수 변경 내용:
  📄 com.twin.app.shoptime/src/hooks/useFocusHistory/useFocusHistory.js (javascript):
    ✅ Added: dwarn(), derror()
    🔄 Modified: getOrCreateGlobalBuffer()
  📄 com.twin.app.shoptime/src/lunaSend/common.js (javascript):
    ✅ Added: dwarn(), derror()
  📄 com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx (javascript):
    ✅ Added: dwarn(), derror()

🔧 주요 변경 내용:
  • 핵심 비즈니스 로직 개선
This commit is contained in:
hyeon soo noh
2025-11-24 09:24:08 +09:00
parent 6d0cf78534
commit e2a50b62ab
5 changed files with 479 additions and 360 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
com.twin.app.shoptime/src/actions/empActions.js
View File

@@ -5,7 +5,7 @@ import { types } from './actionTypes';
// IF-LGSPM-373 EMP Shoptime 선택 약관 조회 // IF-LGSPM-373 EMP Shoptime 선택 약관 조회
export const getShoptimeTerms = () => (dispatch, getState) => { export const getShoptimeTerms = () => (dispatch, getState) => {
const onSuccess = (response) => { const onSuccess = (response) => {
console.log("getShoptimeTerms onSuccess ", response.data); // console.log("getShoptimeTerms onSuccess ", response.data);
dispatch({ dispatch({
type: types.GET_SHOPTIME_TERMS, type: types.GET_SHOPTIME_TERMS,
@@ -14,17 +14,8 @@ export const getShoptimeTerms = () => (dispatch, getState) => {
}; };
const onFail = (error) => { const onFail = (error) => {
console.error("getShoptimeTerms onFail ", error); console.error('getShoptimeTerms onFail ', error);
}; };
TAxios( TAxios(dispatch, getState, 'get', URLS.GET_SHOPTIME_TERMS, {}, {}, onSuccess, onFail);
dispatch,
getState,
"get",
URLS.GET_SHOPTIME_TERMS,
{},
{},
onSuccess,
onFail
);
}; };

97
com.twin.app.shoptime/src/hooks/useFocusHistory/useFocusHistory.js
View File

@@ -3,6 +3,21 @@
import { useRef, useCallback, useState, useMemo } from 'react'; import { useRef, useCallback, useState, useMemo } from 'react';
import fp from '../../utils/fp.js'; import fp from '../../utils/fp.js';
// Toggle debug logging in this file (false by default)
const DEBUG_MODE = false;
const dlog = (...args) => {
if (DEBUG_MODE) console.log(...args);
};
const dwarn = (...args) => {
if (DEBUG_MODE) console.warn(...args);
};
const derror = (...args) => {
console.error(...args);
};
/** /**
* useFocusHistory Hook - 경량화된 포커스 히스토리 관리 * useFocusHistory Hook - 경량화된 포커스 히스토리 관리
* - 어떤 string 식별자든 받을 수 있는 범용적 구조 * - 어떤 string 식별자든 받을 수 있는 범용적 구조
@@ -112,7 +127,7 @@ const createFocusRingBuffer = () => {
// 직접 포커스 (banner1, banner2) // 직접 포커스 (banner1, banner2)
if (current === 'banner1') { if (current === 'banner1') {
if (previous === 'icons') { if (previous === 'icons') {
console.log('[DEBUG] 🔄 icons → banner1 복원 패턴'); dlog('[DEBUG] 🔄 icons → banner1 복원 패턴');
return { return {
pattern: 'restore-banner1', pattern: 'restore-banner1',
videoTarget: 'banner1', videoTarget: 'banner1',
@@ -120,7 +135,7 @@ const createFocusRingBuffer = () => {
shouldShowBorder: true, shouldShowBorder: true,
}; };
} }
console.log('[DEBUG] 🎯 banner1 직접 포커스 패턴'); dlog('[DEBUG] 🎯 banner1 직접 포커스 패턴');
return { return {
pattern: 'direct-banner1', pattern: 'direct-banner1',
videoTarget: 'banner1', videoTarget: 'banner1',
@@ -130,7 +145,7 @@ const createFocusRingBuffer = () => {
} }
if (current === 'banner2') { if (current === 'banner2') {
if (previous === 'icons') { if (previous === 'icons') {
console.log('[DEBUG] 🔄 icons → banner2 복원 패턴'); dlog('[DEBUG] 🔄 icons → banner2 복원 패턴');
return { return {
pattern: 'restore-banner2', pattern: 'restore-banner2',
videoTarget: 'banner2', videoTarget: 'banner2',
@@ -138,7 +153,7 @@ const createFocusRingBuffer = () => {
shouldShowBorder: true, shouldShowBorder: true,
}; };
} }
console.log('[DEBUG] 🎯 banner2 직접 포커스 패턴'); dlog('[DEBUG] 🎯 banner2 직접 포커스 패턴');
return { return {
pattern: 'direct-banner2', pattern: 'direct-banner2',
videoTarget: 'banner2', videoTarget: 'banner2',
@@ -161,8 +176,8 @@ const createFocusRingBuffer = () => {
// 🔽 [개선] 간접 포커스 (banner3, banner4) - 더 깊은 히스토리 확인 // 🔽 [개선] 간접 포커스 (banner3, banner4) - 더 깊은 히스토리 확인
if (current === 'banner3' || current === 'banner4') { if (current === 'banner3' || current === 'banner4') {
console.log(`[DEBUG] 🔍 간접 포커스 (${current}) - 히스토리 분석 시작`); dlog(`[DEBUG] 🔍 간접 포커스 (${current}) - 히스토리 분석 시작`);
console.log(`[DEBUG] 전체 히스토리:`, history); dlog(`[DEBUG] 전체 히스토리:`, history);
// 히스토리에서 가장 최근의 banner1 또는 banner2 찾기 // 히스토리에서 가장 최근의 banner1 또는 banner2 찾기
let lastVideoBanner = null; let lastVideoBanner = null;
@@ -172,13 +187,13 @@ const createFocusRingBuffer = () => {
if (history[i] === 'banner1' || history[i] === 'banner2') { if (history[i] === 'banner1' || history[i] === 'banner2') {
lastVideoBanner = history[i]; lastVideoBanner = history[i];
lastVideoBannerDistance = i; lastVideoBannerDistance = i;
console.log(`[DEBUG] 발견된 비디오 배너: ${lastVideoBanner} (거리: ${i})`); dlog(`[DEBUG] 발견된 비디오 배너: ${lastVideoBanner} (거리: ${i})`);
break; // 가장 최근 것만 찾으면 됨 break; // 가장 최근 것만 찾으면 됨
} }
} }
if (lastVideoBanner) { if (lastVideoBanner) {
console.log(`[DEBUG] 🔄 간접 포커스 유지 패턴:`, { dlog(`[DEBUG] 🔄 간접 포커스 유지 패턴:`, {
current: current, current: current,
maintainTarget: lastVideoBanner, maintainTarget: lastVideoBanner,
distance: lastVideoBannerDistance, distance: lastVideoBannerDistance,
@@ -192,7 +207,7 @@ const createFocusRingBuffer = () => {
reason: `${current} 포커스, ${lastVideoBannerDistance}단계 이전 ${lastVideoBanner} 유지`, reason: `${current} 포커스, ${lastVideoBannerDistance}단계 이전 ${lastVideoBanner} 유지`,
}; };
} else { } else {
console.log(`[DEBUG] ❓ 간접 포커스 - 히스토리 없음:`, { dlog(`[DEBUG] ❓ 간접 포커스 - 히스토리 없음:`, {
current: current, current: current,
history: history.slice(0, 5), history: history.slice(0, 5),
reason: '비디오 배너 히스토리 없음, 기본값 banner1 사용', reason: '비디오 배너 히스토리 없음, 기본값 banner1 사용',
@@ -294,7 +309,7 @@ const isValidBuffer = (buffer) => {
typeof buffer.clear === 'function' typeof buffer.clear === 'function'
); );
} catch (error) { } catch (error) {
console.warn('[FocusHistory] 버퍼 유효성 검증 실패:', error); dwarn('[FocusHistory] 버퍼 유효성 검증 실패:', error);
return false; return false;
} }
}; };
@@ -319,10 +334,10 @@ const getGlobalObject = () => {
// if (typeof globalThis !== 'undefined') return globalThis; // if (typeof globalThis !== 'undefined') return globalThis;
// 최후의 수단 - 빈 객체 // 최후의 수단 - 빈 객체
console.warn('[FocusHistory] 전역 객체 접근 불가, 빈 객체 사용'); dwarn('[FocusHistory] 전역 객체 접근 불가, 빈 객체 사용');
return {}; return {};
} catch (error) { } catch (error) {
console.error('[FocusHistory] 전역 객체 접근 오류:', error); derror('[FocusHistory] 전역 객체 접근 오류:', error);
return {}; return {};
} }
}; };
@@ -337,14 +352,14 @@ const attemptBufferRestore = () => {
const existingBuffer = globalObj[GLOBAL_BUFFER_KEY]; const existingBuffer = globalObj[GLOBAL_BUFFER_KEY];
if (isValidBuffer(existingBuffer)) { if (isValidBuffer(existingBuffer)) {
console.log('[FocusHistory] ✅ 기존 전역 버퍼 복원 성공'); dlog('[FocusHistory] ✅ 기존 전역 버퍼 복원 성공');
return existingBuffer; return existingBuffer;
} else if (existingBuffer) { } else if (existingBuffer) {
console.warn('[FocusHistory] ⚠️ 손상된 전역 버퍼 발견, 제거 후 재생성'); dwarn('[FocusHistory] ⚠️ 손상된 전역 버퍼 발견, 제거 후 재생성');
delete globalObj[GLOBAL_BUFFER_KEY]; delete globalObj[GLOBAL_BUFFER_KEY];
} }
} catch (error) { } catch (error) {
console.error('[FocusHistory] 버퍼 복원 시도 실패:', error); derror('[FocusHistory] 버퍼 복원 시도 실패:', error);
} }
return null; return null;
}; };
@@ -369,10 +384,10 @@ const createAndRegisterBuffer = () => {
} }
} }
console.log('[FocusHistory] 🆕 새 전역 버퍼 생성 및 등록 완료'); dlog('[FocusHistory] 🆕 새 전역 버퍼 생성 및 등록 완료');
return newBuffer; return newBuffer;
} catch (error) { } catch (error) {
console.error('[FocusHistory] 버퍼 생성 및 등록 실패:', error); derror('[FocusHistory] 버퍼 생성 및 등록 실패:', error);
// 최후의 수단 - 로컬 버퍼라도 반환 // 최후의 수단 - 로컬 버퍼라도 반환
return createFocusRingBuffer(); return createFocusRingBuffer();
} }
@@ -401,7 +416,7 @@ const getOrCreateGlobalBuffer = () => {
globalFocusBuffer = createAndRegisterBuffer(); globalFocusBuffer = createAndRegisterBuffer();
return globalFocusBuffer; return globalFocusBuffer;
} catch (error) { } catch (error) {
console.error('[FocusHistory] 전역 버퍼 초기화 실패:', error); derror('[FocusHistory] 전역 버퍼 초기화 실패:', error);
// 최후의 수단: 최소한의 로컬 버퍼라도 제공 // 최후의 수단: 최소한의 로컬 버퍼라도 제공
try { try {
@@ -410,7 +425,7 @@ const getOrCreateGlobalBuffer = () => {
} }
return globalFocusBuffer; return globalFocusBuffer;
} catch (fallbackError) { } catch (fallbackError) {
console.error('[FocusHistory] 폴백 버퍼 생성도 실패:', fallbackError); derror('[FocusHistory] 폴백 버퍼 생성도 실패:', fallbackError);
// 더미 버퍼 반환 (앱 크래시 방지) // 더미 버퍼 반환 (앱 크래시 방지)
return { return {
enqueue: () => ({ inserted: false, policy: null }), enqueue: () => ({ inserted: false, policy: null }),
@@ -466,7 +481,7 @@ export const useFocusHistory = (options = {}) => {
try { try {
localBufferRef.current = createFocusRingBuffer(); localBufferRef.current = createFocusRingBuffer();
} catch (error) { } catch (error) {
console.error('[FocusHistory] 로컬 버퍼 생성 실패:', error); derror('[FocusHistory] 로컬 버퍼 생성 실패:', error);
// 더미 버퍼로 폴백 // 더미 버퍼로 폴백
localBufferRef.current = { localBufferRef.current = {
enqueue: () => ({ inserted: false, policy: null }), enqueue: () => ({ inserted: false, policy: null }),
@@ -497,7 +512,7 @@ export const useFocusHistory = (options = {}) => {
return localBufferRef.current; return localBufferRef.current;
} }
} catch (error) { } catch (error) {
console.error('[FocusHistory] 버퍼 초기화 전체 실패:', error); derror('[FocusHistory] 버퍼 초기화 전체 실패:', error);
// 최후의 더미 버퍼 // 최후의 더미 버퍼
return { return {
enqueue: () => ({ inserted: false, policy: null }), enqueue: () => ({ inserted: false, policy: null }),
@@ -532,13 +547,13 @@ export const useFocusHistory = (options = {}) => {
try { try {
// 입력값 검증 // 입력값 검증
if (!focusId || typeof focusId !== 'string') { if (!focusId || typeof focusId !== 'string') {
console.warn(`${logPrefix} Invalid focus ID:`, focusId); dwarn(`${logPrefix} Invalid focus ID:`, focusId);
return { inserted: false, policy: null }; return { inserted: false, policy: null };
} }
// 버퍼 유효성 재검증 // 버퍼 유효성 재검증
if (!isValidBuffer(buffer)) { if (!isValidBuffer(buffer)) {
console.error(`${logPrefix} 버퍼가 손상됨, enqueue 실패`); derror(`${logPrefix} 버퍼가 손상됨, enqueue 실패`);
return { inserted: false, policy: null }; return { inserted: false, policy: null };
} }
@@ -556,11 +571,11 @@ export const useFocusHistory = (options = {}) => {
// 🔽 [향상된 로깅] 패턴과 정책 정보 포함 // 🔽 [향상된 로깅] 패턴과 정책 정보 포함
if (previous && current && previous !== current) { if (previous && current && previous !== current) {
console.log(`${logPrefix} 🎯 ${previous} → ${current}`); dlog(`${logPrefix} 🎯 ${previous} → ${current}`);
console.log(`${logPrefix} 📋 buffer:`, buffer.getHistory()); dlog(`${logPrefix} 📋 buffer:`, buffer.getHistory());
} else { } else {
console.log(`${logPrefix} 🎯 초기 포커스: ${current}`); dlog(`${logPrefix} 🎯 초기 포커스: ${current}`);
console.log(`${logPrefix} 📋 buffer:`, buffer.getHistory()); dlog(`${logPrefix} 📋 buffer:`, buffer.getHistory());
} }
// 디버그 모드에서는 전체 히스토리 표시 // 디버그 모드에서는 전체 히스토리 표시
@@ -573,7 +588,7 @@ export const useFocusHistory = (options = {}) => {
return result; // { inserted, policy } 반환 return result; // { inserted, policy } 반환
} catch (error) { } catch (error) {
console.error(`${logPrefix} enqueue 실행 중 오류:`, error, { focusId }); derror(`${logPrefix} enqueue 실행 중 오류:`, error, { focusId });
// 오류 발생 시 안전한 기본값 반환 // 오류 발생 시 안전한 기본값 반환
return { inserted: false, policy: null }; return { inserted: false, policy: null };
} }
@@ -585,7 +600,7 @@ export const useFocusHistory = (options = {}) => {
const getQueueState = useCallback(() => { const getQueueState = useCallback(() => {
try { try {
if (!isValidBuffer(buffer)) { if (!isValidBuffer(buffer)) {
console.warn(`${logPrefix} getQueueState: 버퍼 무효`); dwarn(`${logPrefix} getQueueState: 버퍼 무효`);
return { return {
current: null, current: null,
previous: null, previous: null,
@@ -597,7 +612,7 @@ export const useFocusHistory = (options = {}) => {
} }
return buffer.getState(); return buffer.getState();
} catch (error) { } catch (error) {
console.error(`${logPrefix} getQueueState 오류:`, error); derror(`${logPrefix} getQueueState 오류:`, error);
return { return {
current: null, current: null,
previous: null, previous: null,
@@ -613,16 +628,16 @@ export const useFocusHistory = (options = {}) => {
const clearHistory = useCallback(() => { const clearHistory = useCallback(() => {
try { try {
if (!isValidBuffer(buffer)) { if (!isValidBuffer(buffer)) {
console.warn(`${logPrefix} clearHistory: 버퍼 무효`); dwarn(`${logPrefix} clearHistory: 버퍼 무효`);
return; return;
} }
buffer.clear(); buffer.clear();
triggerUpdate(); // 상태 변경 시 리렌더링 트리거 triggerUpdate(); // 상태 변경 시 리렌더링 트리거
if (enableLogging) { if (enableLogging) {
console.log(`${logPrefix} 히스토리 초기화됨`); dlog(`${logPrefix} 히스토리 초기화됨`);
} }
} catch (error) { } catch (error) {
console.error(`${logPrefix} clearHistory 오류:`, error); derror(`${logPrefix} clearHistory 오류:`, error);
} }
}, [buffer, enableLogging, logPrefix, triggerUpdate]); }, [buffer, enableLogging, logPrefix, triggerUpdate]);
@@ -641,7 +656,7 @@ export const useFocusHistory = (options = {}) => {
} }
return buffer.getState(); return buffer.getState();
} catch (error) { } catch (error) {
console.error(`${logPrefix} currentState 계산 오류:`, error); derror(`${logPrefix} currentState 계산 오류:`, error);
return { return {
current: null, current: null,
previous: null, previous: null,
@@ -658,7 +673,7 @@ export const useFocusHistory = (options = {}) => {
try { try {
return isValidBuffer(buffer) ? buffer.getHistory() : []; return isValidBuffer(buffer) ? buffer.getHistory() : [];
} catch (error) { } catch (error) {
console.error(`${logPrefix} getHistory 오류:`, error); derror(`${logPrefix} getHistory 오류:`, error);
return []; return [];
} }
}, [buffer, logPrefix]); }, [buffer, logPrefix]);
@@ -668,7 +683,7 @@ export const useFocusHistory = (options = {}) => {
try { try {
return isValidBuffer(buffer) ? buffer.getHistoryAt(distance) : null; return isValidBuffer(buffer) ? buffer.getHistoryAt(distance) : null;
} catch (error) { } catch (error) {
console.error(`${logPrefix} getHistoryAt 오류:`, error); derror(`${logPrefix} getHistoryAt 오류:`, error);
return null; return null;
} }
}, },
@@ -681,7 +696,7 @@ export const useFocusHistory = (options = {}) => {
? buffer.detectPattern() ? buffer.detectPattern()
: { pattern: 'error', videoTarget: null, confidence: 0 }; : { pattern: 'error', videoTarget: null, confidence: 0 };
} catch (error) { } catch (error) {
console.error(`${logPrefix} detectPattern 오류:`, error); derror(`${logPrefix} detectPattern 오류:`, error);
return { pattern: 'error', videoTarget: null, confidence: 0 }; return { pattern: 'error', videoTarget: null, confidence: 0 };
} }
}, [buffer, logPrefix]); }, [buffer, logPrefix]);
@@ -692,7 +707,7 @@ export const useFocusHistory = (options = {}) => {
? buffer.calculateVideoPolicy() ? buffer.calculateVideoPolicy()
: { videoTarget: null, shouldShowBorder: false, transition: 'error', confidence: 0 }; : { videoTarget: null, shouldShowBorder: false, transition: 'error', confidence: 0 };
} catch (error) { } catch (error) {
console.error(`${logPrefix} calculateVideoPolicy 오류:`, error); derror(`${logPrefix} calculateVideoPolicy 오류:`, error);
return { videoTarget: null, shouldShowBorder: false, transition: 'error', confidence: 0 }; return { videoTarget: null, shouldShowBorder: false, transition: 'error', confidence: 0 };
} }
}, [buffer, logPrefix]); }, [buffer, logPrefix]);
@@ -703,7 +718,7 @@ export const useFocusHistory = (options = {}) => {
? buffer.getDebugInfo() ? buffer.getDebugInfo()
: { error: 'Buffer invalid or unavailable' }; : { error: 'Buffer invalid or unavailable' };
} catch (error) { } catch (error) {
console.error(`${logPrefix} getDebugInfo 오류:`, error); derror(`${logPrefix} getDebugInfo 오류:`, error);
return { error: 'getDebugInfo failed', details: error.message }; return { error: 'getDebugInfo failed', details: error.message };
} }
}, [buffer, logPrefix]); }, [buffer, logPrefix]);
@@ -716,7 +731,7 @@ export const useFocusHistory = (options = {}) => {
} }
return buffer.getHistory(); // 이미 최신순으로 정렬됨 [current, previous, older, oldest, ...] return buffer.getHistory(); // 이미 최신순으로 정렬됨 [current, previous, older, oldest, ...]
} catch (error) { } catch (error) {
console.error(`${logPrefix} getQueue 오류:`, error); derror(`${logPrefix} getQueue 오류:`, error);
return []; return [];
} }
}, [buffer, logPrefix]); }, [buffer, logPrefix]);
@@ -733,7 +748,7 @@ export const useFocusHistory = (options = {}) => {
fp.map(fp.defaultTo(null)) // 각 항목도 null로 안전하게 처리 fp.map(fp.defaultTo(null)) // 각 항목도 null로 안전하게 처리
)(queue); )(queue);
} catch (error) { } catch (error) {
console.error(`${logPrefix} getQueueSafe 오류:`, error); derror(`${logPrefix} getQueueSafe 오류:`, error);
return []; // 에러 시 빈 배열 return []; // 에러 시 빈 배열
} }
}, [getQueue, logPrefix]); }, [getQueue, logPrefix]);

321
com.twin.app.shoptime/src/lunaSend/common.js
View File

@@ -1,11 +1,26 @@
import appinfo from "../../webos-meta/appinfo.json"; import appinfo from '../../webos-meta/appinfo.json';
import { alertToast } from "../actions/commonActions"; import { alertToast } from '../actions/commonActions';
import { store } from "../store/store"; import { store } from '../store/store';
import LS2Request from "./LS2Request"; import LS2Request from './LS2Request';
// Toggle debug logging for this module (false by default)
const DEBUG_MODE = false;
const dlog = (...args) => {
if (DEBUG_MODE) console.log(...args);
};
const dwarn = (...args) => {
if (DEBUG_MODE) console.warn(...args);
};
const derror = (...args) => {
console.error(...args);
};
export const getConnectionStatus = ({ onSuccess, onFailure, onComplete }) => { export const getConnectionStatus = ({ onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND getConnectionStatus"); dlog('LUNA SEND getConnectionStatus');
//test //test
// setTimeout(() => { // setTimeout(() => {
@@ -24,11 +39,11 @@ export const getConnectionStatus = ({ onSuccess, onFailure, onComplete }) => {
// }, 20000); // }, 20000);
// }, 10000); // }, 10000);
return "Some Hard Coded Mock Data"; return 'Some Hard Coded Mock Data';
} else { } else {
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.service.connectionmanager", service: 'luna://com.webos.service.connectionmanager',
method: "getStatus", method: 'getStatus',
subscribe: true, subscribe: true,
parameters: {}, parameters: {},
onSuccess, onSuccess,
@@ -39,59 +54,51 @@ export const getConnectionStatus = ({ onSuccess, onFailure, onComplete }) => {
}; };
export const createToast = (message) => { export const createToast = (message) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND createToast message", message); dlog('LUNA SEND createToast message', message);
return; return;
} }
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.notification", service: 'luna://com.webos.notification',
method: "createToast", method: 'createToast',
parameters: { parameters: {
message: message, message: message,
iconUrl: "", iconUrl: '',
noaction: true, noaction: true,
}, },
onSuccess: (res) => { onSuccess: (res) => {
console.log("LUNA SEND createToast success", message); dlog('LUNA SEND createToast success', message);
}, },
onFailure: (err) => { onFailure: (err) => {
console.log("LUNA SEND createToast failed", err); derror('LUNA SEND createToast failed', err);
}, },
}); });
}; };
let httpHeaderHandler = null; let httpHeaderHandler = null;
export const getHttpHeaderForServiceRequest = ({ export const getHttpHeaderForServiceRequest = ({ onSuccess, onFailure, onComplete }) => {
onSuccess, if (typeof window === 'object' && window.PalmSystem && process.env.REACT_APP_MODE !== 'DEBUG') {
onFailure,
onComplete,
}) => {
if (
typeof window === "object" &&
window.PalmSystem &&
process.env.REACT_APP_MODE !== "DEBUG"
) {
if (httpHeaderHandler) { if (httpHeaderHandler) {
httpHeaderHandler.cancel(); httpHeaderHandler.cancel();
} }
httpHeaderHandler = new LS2Request().send({ httpHeaderHandler = new LS2Request().send({
service: "luna://com.webos.service.sdx", service: 'luna://com.webos.service.sdx',
method: "getHttpHeaderForServiceRequest", method: 'getHttpHeaderForServiceRequest',
subscribe: true, subscribe: true,
parameters: {}, parameters: {},
onSuccess: (res) => { onSuccess: (res) => {
try { try {
console.log("[serverHost][LS2] onSuccess HOST:", res && res.HOST); dlog('[serverHost][LS2] onSuccess HOST:', res && res.HOST);
console.log("[serverHost][LS2] onSuccess raw:", res); dlog('[serverHost][LS2] onSuccess raw:', res);
} catch (e) {} } catch (e) {}
onSuccess && onSuccess(res); onSuccess && onSuccess(res);
}, },
onFailure: (err) => { onFailure: (err) => {
console.log("[serverHost][LS2] onFailure:", err); derror('[serverHost][LS2] onFailure:', err);
onFailure && onFailure(err); onFailure && onFailure(err);
}, },
onComplete: (res) => { onComplete: (res) => {
console.log("[serverHost][LS2] onComplete:", res); dlog('[serverHost][LS2] onComplete:', res);
onComplete && onComplete(res); onComplete && onComplete(res);
}, },
}); });
@@ -99,64 +106,56 @@ export const getHttpHeaderForServiceRequest = ({
} else { } else {
const serverType = store.getState().localSettings.serverType; const serverType = store.getState().localSettings.serverType;
const userNumber = const userNumber = serverType === 'prd' ? 'US2412306099093' : 'US2210240095608';
serverType === "prd" ? "US2412306099093" : "US2210240095608";
const mockRes = { const mockRes = {
HOST: "qt2-US.nextlgsdp.com", HOST: 'qt2-US.nextlgsdp.com',
"X-User-Number": userNumber, 'X-User-Number': userNumber,
Authorization: Authorization:
"eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJuZXh0bGdzZHAuY29tIiwiYXVkIjoibmV4dGxnc2RwLmNvbSIsImlhdCI6MTcwNzc4NTUyNSwiZXhwIjoxNzA3NzkyNzI1LCJtYWNBZGRyZXNzIjoiZWVkMDQ2NjdiNjUzOWU3YmQxMDA1OTljYjBkYTI5ZjRjZTgyZGZlOGZkNzIzMDAxZGVmMjg4NWRkNWZiODRmNWNiMzZlM2QwNzYzNWZjZGJjYWNjNGVjMzI5NWIwNjZjOTMwNmNmNDI1ZGQzMmQ2MDMxMjc1NWNkOTIyNjEwMzcifQ.vqPdYGnN46diesDBLzA4UhACCJVdIycLs7wZu9M55Hc", 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJuZXh0bGdzZHAuY29tIiwiYXVkIjoibmV4dGxnc2RwLmNvbSIsImlhdCI6MTcwNzc4NTUyNSwiZXhwIjoxNzA3NzkyNzI1LCJtYWNBZGRyZXNzIjoiZWVkMDQ2NjdiNjUzOWU3YmQxMDA1OTljYjBkYTI5ZjRjZTgyZGZlOGZkNzIzMDAxZGVmMjg4NWRkNWZiODRmNWNiMzZlM2QwNzYzNWZjZGJjYWNjNGVjMzI5NWIwNjZjOTMwNmNmNDI1ZGQzMmQ2MDMxMjc1NWNkOTIyNjEwMzcifQ.vqPdYGnN46diesDBLzA4UhACCJVdIycLs7wZu9M55Hc',
"X-Authentication": "MkOLvUocrJ69RH/iV1ZABJhjR2g=", 'X-Authentication': 'MkOLvUocrJ69RH/iV1ZABJhjR2g=',
"X-Device-ID": 'X-Device-ID':
"OemUY5qbPITZv96QKlxrtcqT6ypeX6us2qANLng3/0QCUhv2mecK1UDTMYb/hjpjey9dC/kFycc/5R8u+oK56JIWyYC4V278z64YDPKbDXIsd+eECvyf+Rdm8BneIUPM", 'OemUY5qbPITZv96QKlxrtcqT6ypeX6us2qANLng3/0QCUhv2mecK1UDTMYb/hjpjey9dC/kFycc/5R8u+oK56JIWyYC4V278z64YDPKbDXIsd+eECvyf+Rdm8BneIUPM',
"X-Device-Product": "webOSTV 6.0", 'X-Device-Product': 'webOSTV 6.0',
"X-Device-Platform": "W21A", 'X-Device-Platform': 'W21A',
"X-Device-Model": "HE_DTV_W20P_AFADATAA", 'X-Device-Model': 'HE_DTV_W20P_AFADATAA',
"X-Device-Eco-Info": "1", 'X-Device-Eco-Info': '1',
"X-Device-Country": "US", 'X-Device-Country': 'US',
"X-Device-Language": "en-US", 'X-Device-Language': 'en-US',
"X-Device-Netcast-Platform-Version": "6.4.0", 'X-Device-Netcast-Platform-Version': '6.4.0',
"X-Device-Publish-Flag": "N", 'X-Device-Publish-Flag': 'N',
"X-Device-Fck": "253", 'X-Device-Fck': '253',
"X-Device-SDK-VERSION": "1.0.0", 'X-Device-SDK-VERSION': '1.0.0',
"X-Device-Eula": 'X-Device-Eula':
"additionalDataAllowed,takeOnAllowed,networkAllowed,generalTermsAllowed,chpAllowed,customAdAllowed,acrOnAllowed,voice2Allowed,voiceAllowed,acrAdAllowed", 'additionalDataAllowed,takeOnAllowed,networkAllowed,generalTermsAllowed,chpAllowed,customAdAllowed,acrOnAllowed,voice2Allowed,voiceAllowed,acrAdAllowed',
}; };
try { try {
console.log("[serverHost][LS2][MOCK] onSuccess HOST:", mockRes.HOST); dlog('[serverHost][LS2][MOCK] onSuccess HOST:', mockRes.HOST);
console.log("[serverHost][LS2][MOCK] onSuccess raw:", mockRes); dlog('[serverHost][LS2][MOCK] onSuccess raw:', mockRes);
} catch (e) {} } catch (e) {}
onSuccess(mockRes); onSuccess(mockRes);
} }
}; };
export const getSystemSettings = ( export const getSystemSettings = (parameters, { onSuccess, onFailure, onComplete }) => {
parameters, if (typeof window === 'object' && window.PalmSystem && process.env.REACT_APP_MODE !== 'DEBUG') {
{ onSuccess, onFailure, onComplete }
) => {
if (
typeof window === "object" &&
window.PalmSystem &&
process.env.REACT_APP_MODE !== "DEBUG"
) {
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.settingsservice", service: 'luna://com.webos.settingsservice',
method: "getSystemSettings", method: 'getSystemSettings',
subscribe: true, subscribe: true,
parameters: parameters, parameters: parameters,
onSuccess, onSuccess,
onFailure, onFailure,
onComplete, onComplete,
}); });
} else if (typeof window === "object") { } else if (typeof window === 'object') {
const language = const language =
typeof window.navigator === "object" typeof window.navigator === 'object'
? window.navigator.language || window.navigator.userLanguage ? window.navigator.language || window.navigator.userLanguage
: "en-US"; : 'en-US';
const res = { const res = {
settings: { settings: {
smartServiceCountryCode2: language.split("-")[1], smartServiceCountryCode2: language.split('-')[1],
captionEnable: true, captionEnable: true,
}, },
returnValue: true, returnValue: true,
@@ -167,17 +166,17 @@ export const getSystemSettings = (
}; };
export function checkValidCountry(ricCode, country) { export function checkValidCountry(ricCode, country) {
if (ricCode === "aic") { if (ricCode === 'aic') {
if (country === "US") return true; if (country === 'US') return true;
else return false; else return false;
} else if (ricCode === "eic") { } else if (ricCode === 'eic') {
if (country === "GB" || country === "DE") return true; if (country === 'GB' || country === 'DE') return true;
else return false; else return false;
} else if (ricCode === "ruc") { } else if (ricCode === 'ruc') {
if (country === "RU") return true; if (country === 'RU') return true;
else return false; else return false;
} else { } else {
if (country === "US") { if (country === 'US') {
return true; return true;
} else { } else {
return false; return false;
@@ -186,20 +185,12 @@ export function checkValidCountry(ricCode, country) {
} }
// 3.0 ~ 4.5 // 3.0 ~ 4.5
export const setSubtitleEnable = ( export const setSubtitleEnable = (mediaId, captionEnable, { onSuccess, onFailure, onComplete }) => {
mediaId, if (typeof window === 'object' && window.PalmSystem && process.env.REACT_APP_MODE !== 'DEBUG') {
captionEnable,
{ onSuccess, onFailure, onComplete }
) => {
if (
typeof window === "object" &&
window.PalmSystem &&
process.env.REACT_APP_MODE !== "DEBUG"
) {
if (captionEnable) { if (captionEnable) {
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.service.tv.subtitle", service: 'luna://com.webos.service.tv.subtitle',
method: "enableSubtitle", method: 'enableSubtitle',
parameters: { pipelineId: mediaId }, parameters: { pipelineId: mediaId },
onSuccess, onSuccess,
onFailure, onFailure,
@@ -207,8 +198,8 @@ export const setSubtitleEnable = (
}); });
} else { } else {
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.service.tv.subtitle", service: 'luna://com.webos.service.tv.subtitle',
method: "disableSubtitle", method: 'disableSubtitle',
parameters: { pipelineId: mediaId }, parameters: { pipelineId: mediaId },
onSuccess, onSuccess,
onFailure, onFailure,
@@ -224,10 +215,10 @@ export const setSubtitleEnableOver5 = (
captionEnable, captionEnable,
{ onSuccess, onFailure, onComplete } { onSuccess, onFailure, onComplete }
) => { ) => {
if (typeof window === "object" && window.PalmSystem) { if (typeof window === 'object' && window.PalmSystem) {
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.media", service: 'luna://com.webos.media',
method: "setSubtitleEnable", method: 'setSubtitleEnable',
parameters: { enable: captionEnable, mediaId: mediaId }, parameters: { enable: captionEnable, mediaId: mediaId },
onSuccess, onSuccess,
onFailure, onFailure,
@@ -238,17 +229,17 @@ export const setSubtitleEnableOver5 = (
// system Alert with time validation // system Alert with time validation
export const addReservation = (data, { onSuccess, onFailure, onComplete }) => { export const addReservation = (data, { onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND addReservation data", data); dlog('LUNA SEND addReservation data', data);
return; return;
} }
const createReservation = () => { const createReservation = () => {
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.service.tvReservationAgent", service: 'luna://com.webos.service.tvReservationAgent',
method: "add", method: 'add',
parameters: { parameters: {
scheduleType: "LGShopping", scheduleType: 'LGShopping',
startTime: { startTime: {
year: data.startTime.year, year: data.startTime.year,
month: data.startTime.month, month: data.startTime.month,
@@ -258,13 +249,13 @@ export const addReservation = (data, { onSuccess, onFailure, onComplete }) => {
second: data.startTime.second, second: data.startTime.second,
}, },
callback: { callback: {
method: "luna://com.webos.notification/createAlert", method: 'luna://com.webos.notification/createAlert',
params: { params: {
message: data.params.message, message: data.params.message,
buttons: [ buttons: [
{ {
label: data.params.buttons[0].label, label: data.params.buttons[0].label,
onclick: "luna://com.webos.applicationManager/launch", onclick: 'luna://com.webos.applicationManager/launch',
params: { params: {
id: window.PalmSystem.identifier ?? appinfo.id, id: window.PalmSystem.identifier ?? appinfo.id,
params: data.params.launch, params: data.params.launch,
@@ -284,16 +275,10 @@ export const addReservation = (data, { onSuccess, onFailure, onComplete }) => {
}, },
onSuccess, onSuccess,
onFailure: (err) => { onFailure: (err) => {
console.log("LUNA SEND addReservation failed", err); derror('LUNA SEND addReservation failed', err);
// Check if error is related to invalid current time // Check if error is related to invalid current time
if ( if (err && err.errorText && err.errorText.includes('Invalid current time')) {
err && dlog('Invalid current time error detected, will retry after time validation');
err.errorText &&
err.errorText.includes("Invalid current time")
) {
console.log(
"Invalid current time error detected, will retry after time validation"
);
// Don't call onFailure immediately, let the retry logic handle it // Don't call onFailure immediately, let the retry logic handle it
return; return;
} }
@@ -305,33 +290,33 @@ export const addReservation = (data, { onSuccess, onFailure, onComplete }) => {
// First, validate system time before creating reservation // First, validate system time before creating reservation
const validateTimeAndCreateReservation = (retryCount = 0, maxRetries = 3) => { const validateTimeAndCreateReservation = (retryCount = 0, maxRetries = 3) => {
console.log(`LUNA SEND validating system time, attempt ${retryCount + 1}`); dlog(`LUNA SEND validating system time, attempt ${retryCount + 1}`);
getSystemTime({ getSystemTime({
onSuccess: (timeRes) => { onSuccess: (timeRes) => {
console.log("LUNA SEND system time validation success", timeRes); dlog('LUNA SEND system time validation success', timeRes);
// Time is available, proceed with reservation // Time is available, proceed with reservation
createReservation(); createReservation();
}, },
onFailure: (timeErr) => { onFailure: (timeErr) => {
console.log("LUNA SEND system time validation failed", timeErr); derror('LUNA SEND system time validation failed', timeErr);
if (retryCount < maxRetries) { if (retryCount < maxRetries) {
// Retry with exponential backoff // Retry with exponential backoff
const delay = Math.min(1000 * Math.pow(2, retryCount), 5000); // Max 5 seconds const delay = Math.min(1000 * Math.pow(2, retryCount), 5000); // Max 5 seconds
console.log(`LUNA SEND retrying time validation in ${delay}ms`); dlog(`LUNA SEND retrying time validation in ${delay}ms`);
setTimeout(() => { setTimeout(() => {
validateTimeAndCreateReservation(retryCount + 1, maxRetries); validateTimeAndCreateReservation(retryCount + 1, maxRetries);
}, delay); }, delay);
} else { } else {
console.log("LUNA SEND max retries exceeded for time validation"); dlog('LUNA SEND max retries exceeded for time validation');
// Still try to create reservation as fallback // Still try to create reservation as fallback
createReservation(); createReservation();
} }
}, },
onComplete: () => { onComplete: () => {
console.log("LUNA SEND system time validation complete"); dlog('LUNA SEND system time validation complete');
}, },
}); });
}; };
@@ -340,21 +325,15 @@ export const addReservation = (data, { onSuccess, onFailure, onComplete }) => {
validateTimeAndCreateReservation(); validateTimeAndCreateReservation();
}; };
export const deleteReservationCallback = ( export const deleteReservationCallback = (scheduleIdList, { onSuccess, onFailure, onComplete }) => {
scheduleIdList, if (typeof window === 'object' && !window.PalmSystem) {
{ onSuccess, onFailure, onComplete } dlog('LUNA SEND deleteReservationCallback scheduleIdList', scheduleIdList);
) => {
if (typeof window === "object" && !window.PalmSystem) {
console.log(
"LUNA SEND deleteReservationCallback scheduleIdList",
scheduleIdList
);
return; return;
} }
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.service.tvReservationAgent", service: 'luna://com.webos.service.tvReservationAgent',
method: "delete", method: 'delete',
parameters: { parameters: {
scheduleIdList: scheduleIdList, scheduleIdList: scheduleIdList,
}, },
@@ -365,19 +344,19 @@ export const deleteReservationCallback = (
}; };
export const deleteReservation = ({ onSuccess, onFailure, onComplete }) => { export const deleteReservation = ({ onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND deleteReservation"); dlog('LUNA SEND deleteReservation');
return; return;
} }
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.palm.db", service: 'luna://com.palm.db',
method: "search", method: 'search',
parameters: { parameters: {
query: { query: {
from: "com.webos.service.tvReservationAgent.info:1", from: 'com.webos.service.tvReservationAgent.info:1',
orderBy: "startTime", orderBy: 'startTime',
filter: [{ prop: "reserveType", op: "=", val: 6 }], // 6 LG Shopping 전용. filter: [{ prop: 'reserveType', op: '=', val: 6 }], // 6 LG Shopping 전용.
}, },
}, },
onSuccess, onSuccess,
@@ -387,8 +366,8 @@ export const deleteReservation = ({ onSuccess, onFailure, onComplete }) => {
}; };
export const deleteOldDb8 = (kind, { onSuccess, onFailure, onComplete }) => { export const deleteOldDb8 = (kind, { onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND deleteOldDb8"); dlog('LUNA SEND deleteOldDb8');
onSuccess && onSuccess(); onSuccess && onSuccess();
return; return;
} }
@@ -396,10 +375,10 @@ export const deleteOldDb8 = (kind, { onSuccess, onFailure, onComplete }) => {
const id = window.PalmSystem.identifier ?? appinfo.id; const id = window.PalmSystem.identifier ?? appinfo.id;
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.service.db", service: 'luna://com.webos.service.db',
method: "delKind", method: 'delKind',
parameters: { parameters: {
id: id + ":" + kind, id: id + ':' + kind,
}, },
onSuccess, onSuccess,
onFailure, onFailure,
@@ -408,20 +387,20 @@ export const deleteOldDb8 = (kind, { onSuccess, onFailure, onComplete }) => {
}; };
export const checkFirstLaunch = ({ onSuccess, onFailure, onComplete }) => { export const checkFirstLaunch = ({ onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND checkFirstLaunch"); dlog('LUNA SEND checkFirstLaunch');
return; return;
} }
const id = window.PalmSystem.identifier ?? appinfo.id; const id = window.PalmSystem.identifier ?? appinfo.id;
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.service.db", service: 'luna://com.webos.service.db',
method: "find", method: 'find',
parameters: { parameters: {
query: { query: {
from: `${id}:20`, from: `${id}:20`,
where: [{ prop: "type", op: "=", val: "app_init" }], where: [{ prop: 'type', op: '=', val: 'app_init' }],
}, },
}, },
onSuccess, onSuccess,
@@ -431,8 +410,8 @@ export const checkFirstLaunch = ({ onSuccess, onFailure, onComplete }) => {
}; };
export const saveFirstLaunchInfo = ({ onSuccess, onFailure, onComplete }) => { export const saveFirstLaunchInfo = ({ onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND saveFirstLaunchInfo"); dlog('LUNA SEND saveFirstLaunchInfo');
onSuccess({ returnValue: true }); onSuccess({ returnValue: true });
return; return;
} }
@@ -440,13 +419,13 @@ export const saveFirstLaunchInfo = ({ onSuccess, onFailure, onComplete }) => {
const id = window.PalmSystem.identifier ?? appinfo.id; const id = window.PalmSystem.identifier ?? appinfo.id;
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.service.db", service: 'luna://com.webos.service.db',
method: "put", method: 'put',
parameters: { parameters: {
object: [ object: [
{ {
_kind: `${id}:20`, _kind: `${id}:20`,
type: "app_init", type: 'app_init',
initialized: true, initialized: true,
timestamp: new Date().toISOString(), timestamp: new Date().toISOString(),
}, },
@@ -459,14 +438,14 @@ export const saveFirstLaunchInfo = ({ onSuccess, onFailure, onComplete }) => {
}; };
export const disableNotification = ({ onSuccess, onFailure, onComplete }) => { export const disableNotification = ({ onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND disableNotification"); dlog('LUNA SEND disableNotification');
return; return;
} }
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.notification", service: 'luna://com.webos.notification',
method: "disable", method: 'disable',
parameters: {}, parameters: {},
onSuccess, onSuccess,
onFailure, onFailure,
@@ -475,14 +454,14 @@ export const disableNotification = ({ onSuccess, onFailure, onComplete }) => {
}; };
export const enableNotification = ({ onSuccess, onFailure, onComplete }) => { export const enableNotification = ({ onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND enableNotification"); dlog('LUNA SEND enableNotification');
return; return;
} }
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.notification", service: 'luna://com.webos.notification',
method: "enable", method: 'enable',
parameters: {}, parameters: {},
onSuccess, onSuccess,
onFailure, onFailure,
@@ -491,13 +470,13 @@ export const enableNotification = ({ onSuccess, onFailure, onComplete }) => {
}; };
export const getConnectionInfo = ({ onSuccess, onFailure, onComplete }) => { export const getConnectionInfo = ({ onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND disableConnectionInfo"); dlog('LUNA SEND disableConnectionInfo');
return; return;
} else { } else {
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.service.connectionmanager", service: 'luna://com.webos.service.connectionmanager',
method: "getinfo", method: 'getinfo',
subscribe: false, subscribe: false,
parameters: {}, parameters: {},
onSuccess, onSuccess,
@@ -509,35 +488,35 @@ export const getConnectionInfo = ({ onSuccess, onFailure, onComplete }) => {
// Check system time availability // Check system time availability
export const getSystemTime = ({ onSuccess, onFailure, onComplete }) => { export const getSystemTime = ({ onSuccess, onFailure, onComplete }) => {
if (typeof window === "object" && !window.PalmSystem) { if (typeof window === 'object' && !window.PalmSystem) {
console.log("LUNA SEND getSystemTime - mock environment"); dlog('LUNA SEND getSystemTime - mock environment');
onSuccess({ returnValue: true, utc: Date.now() / 1000 }); onSuccess({ returnValue: true, utc: Date.now() / 1000 });
return; return;
} }
return new LS2Request().send({ return new LS2Request().send({
service: "luna://com.webos.settingsservice", service: 'luna://com.webos.settingsservice',
method: "getSystemSettings", method: 'getSystemSettings',
subscribe: false, subscribe: false,
parameters: { parameters: {
category: "time", category: 'time',
keys: ["autoClock"], keys: ['autoClock'],
}, },
onSuccess: (res) => { onSuccess: (res) => {
console.log("LUNA SEND getSystemTime success", res); dlog('LUNA SEND getSystemTime success', res);
if (res && res.returnValue) { if (res && res.returnValue) {
// If autoClock is available, try to get actual time // If autoClock is available, try to get actual time
new LS2Request().send({ new LS2Request().send({
service: "luna://com.webos.service.systemservice", service: 'luna://com.webos.service.systemservice',
method: "clock/getTime", method: 'clock/getTime',
subscribe: false, subscribe: false,
parameters: {}, parameters: {},
onSuccess: (timeRes) => { onSuccess: (timeRes) => {
console.log("LUNA SEND clock/getTime success", timeRes); dlog('LUNA SEND clock/getTime success', timeRes);
onSuccess(timeRes); onSuccess(timeRes);
}, },
onFailure: (timeErr) => { onFailure: (timeErr) => {
console.log("LUNA SEND clock/getTime failed", timeErr); derror('LUNA SEND clock/getTime failed', timeErr);
// Fallback to settings response if getTime fails // Fallback to settings response if getTime fails
onSuccess(res); onSuccess(res);
}, },

281
com.twin.app.shoptime/src/views/CheckOutPanel/CheckOutPanel.jsx
View File

@@ -1,27 +1,12 @@
import React, { import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
useCallback,
useEffect,
useMemo,
useRef,
useState,
} from 'react';
import { import { useDispatch, useSelector } from 'react-redux';
useDispatch,
useSelector,
} from 'react-redux';
import { Job } from '@enact/core/util'; import { Job } from '@enact/core/util';
import Spotlight from '@enact/spotlight'; import Spotlight from '@enact/spotlight';
import { import { getCheckoutTotalAmt, resetCheckoutData } from '../../actions/checkoutActions';
getCheckoutTotalAmt, import { setHidePopup, setShowPopup } from '../../actions/commonActions';
resetCheckoutData,
} from '../../actions/checkoutActions';
import {
setHidePopup,
setShowPopup,
} from '../../actions/commonActions';
import { getShoptimeTerms } from '../../actions/empActions'; import { getShoptimeTerms } from '../../actions/empActions';
import { import {
sendLogCheckOutBtnClick, sendLogCheckOutBtnClick,
@@ -30,10 +15,7 @@ import {
sendLogPaymentEntry, sendLogPaymentEntry,
sendLogTotalRecommend, sendLogTotalRecommend,
} from '../../actions/logActions'; } from '../../actions/logActions';
import { import { popPanel, updatePanel } from '../../actions/panelActions';
popPanel,
updatePanel,
} from '../../actions/panelActions';
import TBody from '../../components/TBody/TBody'; import TBody from '../../components/TBody/TBody';
import TButton from '../../components/TButton/TButton'; import TButton from '../../components/TButton/TButton';
import TButtonScroller from '../../components/TButtonScroller/TButtonScroller'; import TButtonScroller from '../../components/TButtonScroller/TButtonScroller';
@@ -46,11 +28,7 @@ import TQRCode from '../../components/TQRCode/TQRCode';
import useScrollTo from '../../hooks/useScrollTo'; import useScrollTo from '../../hooks/useScrollTo';
import { BUYNOW_CONFIG } from '../../utils/BuyNowConfig'; import { BUYNOW_CONFIG } from '../../utils/BuyNowConfig';
import * as Config from '../../utils/Config'; import * as Config from '../../utils/Config';
import { import { $L, scaleH, scaleW } from '../../utils/helperMethods';
$L,
scaleH,
scaleW,
} from '../../utils/helperMethods';
import { import {
getSafeCurrencyInfo, getSafeCurrencyInfo,
getSafeFirstProduct, getSafeFirstProduct,
@@ -68,7 +46,7 @@ import SummaryContainer from './container/SummaryCotainer';
export default function CheckOutPanel({ panelInfo }) { export default function CheckOutPanel({ panelInfo }) {
// DEBUG_LOG 설정 - 이 값이 true일 때만 console.log가 실행됨 // DEBUG_LOG 설정 - 이 값이 true일 때만 console.log가 실행됨
const DEBUG_LOG = true; // 계속 활성화하여 디버깅 const DEBUG_LOG = false; // 계속 활성화하여 디버깅
// console.log 오버라이드를 위한 ref // console.log 오버라이드를 위한 ref
const originalConsoleLog = useRef(); const originalConsoleLog = useRef();
@@ -85,32 +63,75 @@ export default function CheckOutPanel({ panelInfo }) {
} }
}; };
console.log('%c[BuyOption][CheckOutPanel] ▶️ Component mounted START', 'background: blue; color: white; font-weight: bold; padding: 5px;'); console.log(
console.log('%c🚨🚨🚨 CHECKOUT PANEL PANELINFO ANALYSIS 🚨🚨🚨', 'background: yellow; color: black; font-weight: bold; font-size: 14px; padding: 5px;'); '%c[BuyOption][CheckOutPanel] ▶️ Component mounted START',
'background: blue; color: white; font-weight: bold; padding: 5px;'
);
console.log(
'%c🚨🚨🚨 CHECKOUT PANEL PANELINFO ANALYSIS 🚨🚨🚨',
'background: yellow; color: black; font-weight: bold; font-size: 14px; padding: 5px;'
);
console.log('%cpanelInfo:', 'background: yellow; color: black; padding: 3px;', panelInfo); console.log('%cpanelInfo:', 'background: yellow; color: black; padding: 3px;', panelInfo);
console.log('%cpanelInfo.isFromCart:', 'background: yellow; color: black; padding: 3px;', panelInfo?.isFromCart); console.log(
console.log('%cpanelInfo.fromCartPanel:', 'background: yellow; color: black; padding: 3px;', panelInfo?.fromCartPanel); '%cpanelInfo.isFromCart:',
console.log('%cpanelInfo.cartItems:', 'background: yellow; color: black; padding: 3px;', panelInfo?.cartItems); 'background: yellow; color: black; padding: 3px;',
console.log('%cpanelInfo.cartItems type:', 'background: yellow; color: black; padding: 3px;', typeof panelInfo?.cartItems); panelInfo?.isFromCart
console.log('%cpanelInfo.cartItems length:', 'background: yellow; color: black; padding: 3px;', panelInfo?.cartItems?.length); );
console.log('%cpanelInfo.productInfo:', 'background: yellow; color: black; padding: 3px;', panelInfo?.productInfo); console.log(
console.log('%cpanelInfo.logInfo:', 'background: yellow; color: black; padding: 3px;', panelInfo?.logInfo); '%cpanelInfo.fromCartPanel:',
console.log('[BuyOption][CheckOutPanel] Current panels:', panels?.map((p) => ({ name: p.name, hasModal: !!p.panelInfo?.modal }))); 'background: yellow; color: black; padding: 3px;',
panelInfo?.fromCartPanel
);
console.log(
'%cpanelInfo.cartItems:',
'background: yellow; color: black; padding: 3px;',
panelInfo?.cartItems
);
console.log(
'%cpanelInfo.cartItems type:',
'background: yellow; color: black; padding: 3px;',
typeof panelInfo?.cartItems
);
console.log(
'%cpanelInfo.cartItems length:',
'background: yellow; color: black; padding: 3px;',
panelInfo?.cartItems?.length
);
console.log(
'%cpanelInfo.productInfo:',
'background: yellow; color: black; padding: 3px;',
panelInfo?.productInfo
);
console.log(
'%cpanelInfo.logInfo:',
'background: yellow; color: black; padding: 3px;',
panelInfo?.logInfo
);
console.log(
'[BuyOption][CheckOutPanel] Current panels:',
panels?.map((p) => ({ name: p.name, hasModal: !!p.panelInfo?.modal }))
);
// PlayerPanel 충돌 방지: PlayerPanel이 있고 modal 상태면 비활성화 // PlayerPanel 충돌 방지: PlayerPanel이 있고 modal 상태면 비활성화
const playerPanelIndex = panels?.findIndex(p => const playerPanelIndex = panels?.findIndex(
(p) =>
p.name === Config.panel_names.PLAYER_PANEL || p.name === Config.panel_names.PLAYER_PANEL ||
p.name === Config.panel_names.PLAYER_PANEL_NEW || p.name === Config.panel_names.PLAYER_PANEL_NEW ||
p.name === Config.panel_names.MEDIA_PANEL p.name === Config.panel_names.MEDIA_PANEL
); );
if (playerPanelIndex >= 0) { if (playerPanelIndex >= 0) {
console.log('[BuyOption][CheckOutPanel] 🚨 PlayerPanel/MediaPanel detected at index:', playerPanelIndex); console.log(
'[BuyOption][CheckOutPanel] 🚨 PlayerPanel/MediaPanel detected at index:',
playerPanelIndex
);
console.log('[BuyOption][CheckOutPanel] PlayerPanel info:', panels[playerPanelIndex]); console.log('[BuyOption][CheckOutPanel] PlayerPanel info:', panels[playerPanelIndex]);
// PlayerPanel/MediaPanel 상태를 비활성화하여 CheckOutPanel과의 충돌 방지 // PlayerPanel/MediaPanel 상태를 비활성화하여 CheckOutPanel과의 충돌 방지
if (panels[playerPanelIndex].panelInfo?.modal) { if (panels[playerPanelIndex].panelInfo?.modal) {
console.log('[BuyOption][CheckOutPanel] 🔄 Disabling modal PlayerPanel to prevent conflicts'); console.log(
'[BuyOption][CheckOutPanel] 🔄 Disabling modal PlayerPanel to prevent conflicts'
);
// 필요하다면 여기서 PlayerPanel 상태를 비활성화하는 액션을 디스패치할 수 있음 // 필요하다면 여기서 PlayerPanel 상태를 비활성화하는 액션을 디스패치할 수 있음
// dispatch(updatePanel({ // dispatch(updatePanel({
// name: panels[playerPanelIndex].name, // name: panels[playerPanelIndex].name,
@@ -143,38 +164,97 @@ export default function CheckOutPanel({ panelInfo }) {
// Mock Mode: panelInfo.productInfo 또는 Redux에서 상품 데이터 사용 // Mock Mode: panelInfo.productInfo 또는 Redux에서 상품 데이터 사용
const productData = BUYNOW_CONFIG.isMockMode() const productData = BUYNOW_CONFIG.isMockMode()
? (() => { ? (() => {
console.log('%c🚨🚨🚨 MOCK MODE DATA SELECTION START 🚨🚨🚨', 'background: yellow; color: black; font-weight: bold; font-size: 14px; padding: 5px;'); console.log(
console.log('%cisFromCart condition check:', 'background: yellow; color: black; padding: 3px;'); '%c🚨🚨🚨 MOCK MODE DATA SELECTION START 🚨🚨🚨',
console.log('%c - panelInfo?.isFromCart:', 'background: yellow; color: black; padding: 3px;', panelInfo?.isFromCart); 'background: yellow; color: black; font-weight: bold; font-size: 14px; padding: 5px;'
console.log('%c - panelInfo?.cartItems exists:', 'background: yellow; color: black; padding: 3px;', !!panelInfo?.cartItems); );
console.log('%c - Array.isArray(panelInfo?.cartItems):', 'background: yellow; color: black; padding: 3px;', Array.isArray(panelInfo?.cartItems)); console.log(
console.log('%c - panelInfo?.cartItems.length > 0:', 'background: yellow; color: black; padding: 3px;', panelInfo?.cartItems?.length > 0); '%cisFromCart condition check:',
'background: yellow; color: black; padding: 3px;'
);
console.log(
'%c - panelInfo?.isFromCart:',
'background: yellow; color: black; padding: 3px;',
panelInfo?.isFromCart
);
console.log(
'%c - panelInfo?.cartItems exists:',
'background: yellow; color: black; padding: 3px;',
!!panelInfo?.cartItems
);
console.log(
'%c - Array.isArray(panelInfo?.cartItems):',
'background: yellow; color: black; padding: 3px;',
Array.isArray(panelInfo?.cartItems)
);
console.log(
'%c - panelInfo?.cartItems.length > 0:',
'background: yellow; color: black; padding: 3px;',
panelInfo?.cartItems?.length > 0
);
// ✅ 1순위: CartPanel에서 전달된 cartItems (전체 카트 데이터) // ✅ 1순위: CartPanel에서 전달된 cartItems (전체 카트 데이터)
if (panelInfo?.isFromCart && panelInfo?.cartItems && Array.isArray(panelInfo.cartItems) && panelInfo.cartItems.length > 0) { if (
console.log('%c✅ SUCCESS! Using cartItems from CartPanel (multi-product) ✅', 'background: green; color: white; font-weight: bold; font-size: 14px; padding: 5px;'); panelInfo?.isFromCart &&
console.log('%ccartItems:', 'background: green; color: white; padding: 3px;', panelInfo.cartItems); panelInfo?.cartItems &&
console.log('%ccartItems count:', 'background: green; color: white; padding: 3px;', panelInfo.cartItems.length); Array.isArray(panelInfo.cartItems) &&
panelInfo.cartItems.length > 0
) {
console.log(
'%c✅ SUCCESS! Using cartItems from CartPanel (multi-product) ✅',
'background: green; color: white; font-weight: bold; font-size: 14px; padding: 5px;'
);
console.log(
'%ccartItems:',
'background: green; color: white; padding: 3px;',
panelInfo.cartItems
);
console.log(
'%ccartItems count:',
'background: green; color: white; padding: 3px;',
panelInfo.cartItems.length
);
return panelInfo.cartItems; return panelInfo.cartItems;
} }
console.log('%c❌ FAILED! isFromCart condition FAILED ❌', 'background: red; color: white; font-weight: bold; font-size: 14px; padding: 5px;'); console.log(
console.log('%cTrying next condition - productInfo check...', 'background: red; color: white; padding: 3px;'); '%c❌ FAILED! isFromCart condition FAILED ❌',
'background: red; color: white; font-weight: bold; font-size: 14px; padding: 5px;'
);
console.log(
'%cTrying next condition - productInfo check...',
'background: red; color: white; padding: 3px;'
);
// 2순위: BuyOption에서 전달된 productInfo (단일 상품) // 2순위: BuyOption에서 전달된 productInfo (단일 상품)
if (panelInfo?.productInfo) { if (panelInfo?.productInfo) {
console.log('%c[BuyOption][CheckOutPanel] ✅ Mock Mode - Using panelInfo.productInfo (single product):', 'background: green; color: white; font-weight: bold; padding: 5px;', panelInfo.productInfo); console.log(
'%c[BuyOption][CheckOutPanel] ✅ Mock Mode - Using panelInfo.productInfo (single product):',
'background: green; color: white; font-weight: bold; padding: 5px;',
panelInfo.productInfo
);
return [panelInfo.productInfo]; return [panelInfo.productInfo];
} }
// 3순위: Redux에서 가져온 상품 데이터 // 3순위: Redux에서 가져온 상품 데이터
if (reduxProductData && Array.isArray(reduxProductData) && reduxProductData.length > 0) { if (reduxProductData && Array.isArray(reduxProductData) && reduxProductData.length > 0) {
console.log('%c[BuyOption][CheckOutPanel] ✅ Mock Mode - Using reduxProductData:', 'background: green; color: white; font-weight: bold; padding: 5px;', 'count=' + reduxProductData.length); console.log(
'%c[BuyOption][CheckOutPanel] ✅ Mock Mode - Using reduxProductData:',
'background: green; color: white; font-weight: bold; padding: 5px;',
'count=' + reduxProductData.length
);
return reduxProductData; return reduxProductData;
} }
// 4순위: 기본 Hardcoded Mock 데이터 (최후의 fallback) // 4순위: 기본 Hardcoded Mock 데이터 (최후의 fallback)
console.error('%c[BuyOption][CheckOutPanel] ⚠️ Mock Mode - Using fallback mock data:', 'background: orange; color: white; font-weight: bold; padding: 5px;', 'panelInfo=', panelInfo, 'reduxProductData=', reduxProductData); console.error(
'%c[BuyOption][CheckOutPanel] ⚠️ Mock Mode - Using fallback mock data:',
'background: orange; color: white; font-weight: bold; padding: 5px;',
'panelInfo=',
panelInfo,
'reduxProductData=',
reduxProductData
);
return [ return [
{ {
prdtId: 'MOCK_PRODUCT_1', prdtId: 'MOCK_PRODUCT_1',
@@ -192,16 +272,37 @@ export default function CheckOutPanel({ panelInfo }) {
})() })()
: reduxProductData; : reduxProductData;
console.log('%c🚨🚨🚨 FINAL PRODUCT DATA RESULT 🚨🚨🚨', 'background: yellow; color: black; font-weight: bold; font-size: 14px; padding: 5px;'); console.log(
console.log('%cisMockMode:', 'background: yellow; color: black; padding: 3px;', BUYNOW_CONFIG.isMockMode()); '%c🚨🚨🚨 FINAL PRODUCT DATA RESULT 🚨🚨🚨',
console.log('%cproductData loaded:', 'background: yellow; color: black; padding: 3px;', productData && productData.length, 'items'); 'background: yellow; color: black; font-weight: bold; font-size: 14px; padding: 5px;'
console.log('%cproductData[0].prdtId:', 'background: yellow; color: black; padding: 3px;', productData?.[0]?.prdtId); );
console.log('%cproductData length:', 'background: yellow; color: black; padding: 3px;', productData?.length || 0); console.log(
'%cisMockMode:',
'background: yellow; color: black; padding: 3px;',
BUYNOW_CONFIG.isMockMode()
);
console.log(
'%cproductData loaded:',
'background: yellow; color: black; padding: 3px;',
productData && productData.length,
'items'
);
console.log(
'%cproductData[0].prdtId:',
'background: yellow; color: black; padding: 3px;',
productData?.[0]?.prdtId
);
console.log(
'%cproductData length:',
'background: yellow; color: black; padding: 3px;',
productData?.length || 0
);
console.log('%cproductData:', 'background: yellow; color: black; padding: 3px;', productData); console.log('%cproductData:', 'background: yellow; color: black; padding: 3px;', productData);
// 표시용으로 모든 상품 데이터 정규화 (없는 필드는 안전한 기본값으로) // 표시용으로 모든 상품 데이터 정규화 (없는 필드는 안전한 기본값으로)
// Mock 모드에서는 항상 정규화, API 모드에서는 그대로 사용 // Mock 모드에서는 항상 정규화, API 모드에서는 그대로 사용
const normalizedProductData = productData?.map((prod) => normalizeProductDataForDisplay(prod)) || []; const normalizedProductData =
productData?.map((prod) => normalizeProductDataForDisplay(prod)) || [];
const safeProductData = BUYNOW_CONFIG.isMockMode() ? normalizedProductData : productData; const safeProductData = BUYNOW_CONFIG.isMockMode() ? normalizedProductData : productData;
console.log('[BuyOption][CheckOutPanel] productData (normalized):', normalizedProductData); console.log('[BuyOption][CheckOutPanel] productData (normalized):', normalizedProductData);
@@ -259,7 +360,10 @@ export default function CheckOutPanel({ panelInfo }) {
const spotJob = useRef(new Job((func) => func(), 0)); const spotJob = useRef(new Job((func) => func(), 0));
useEffect(() => { useEffect(() => {
console.log('[BuyOption][CheckOutPanel] sendLogGNB useEffect - isOrderSuccessful:', isOrderSuccessful); console.log(
'[BuyOption][CheckOutPanel] sendLogGNB useEffect - isOrderSuccessful:',
isOrderSuccessful
);
let nowMenu; let nowMenu;
if (isOrderSuccessful) { if (isOrderSuccessful) {
@@ -321,7 +425,9 @@ export default function CheckOutPanel({ panelInfo }) {
// Mock Mode: API 호출 스킵 // Mock Mode: API 호출 스킵
if (BUYNOW_CONFIG.isMockMode()) { if (BUYNOW_CONFIG.isMockMode()) {
console.log('[BuyOption][CheckOutPanel] Mock Mode - Skipping checkout total amount calculation'); console.log(
'[BuyOption][CheckOutPanel] Mock Mode - Skipping checkout total amount calculation'
);
return; return;
} }
@@ -356,7 +462,9 @@ export default function CheckOutPanel({ panelInfo }) {
infoForCheckoutData.dlvrAddrSno && infoForCheckoutData.dlvrAddrSno &&
infoForCheckoutData.bilAddrSno infoForCheckoutData.bilAddrSno
) { ) {
console.log('[BuyOption][CheckOutPanel] ✅ All conditions met - Calling getCheckoutTotalAmt'); console.log(
'[BuyOption][CheckOutPanel] ✅ All conditions met - Calling getCheckoutTotalAmt'
);
dispatch( dispatch(
getCheckoutTotalAmt( getCheckoutTotalAmt(
{ {
@@ -364,7 +472,7 @@ export default function CheckOutPanel({ panelInfo }) {
dirPurcSelYn: cartSelectInfo.length > 0 ? 'N' : 'Y', dirPurcSelYn: cartSelectInfo.length > 0 ? 'N' : 'Y',
bilAddrSno: infoForCheckoutData.bilAddrSno, bilAddrSno: infoForCheckoutData.bilAddrSno,
dlvrAddrSno: infoForCheckoutData.dlvrAddrSno, dlvrAddrSno: infoForCheckoutData.dlvrAddrSno,
isPageLoading: "Y", isPageLoading: 'Y',
orderProductCoupontUse, orderProductCoupontUse,
}, },
totalAmtValidate totalAmtValidate
@@ -428,12 +536,14 @@ export default function CheckOutPanel({ panelInfo }) {
console.log('[CheckOutPanel] onBackClick - Sending reload signal to DetailPanel'); console.log('[CheckOutPanel] onBackClick - Sending reload signal to DetailPanel');
// DetailPanel에 재시작 신호 전달 // DetailPanel에 재시작 신호 전달
dispatch(updatePanel({ dispatch(
updatePanel({
name: Config.panel_names.DETAIL_PANEL, name: Config.panel_names.DETAIL_PANEL,
panelInfo: { panelInfo: {
shouldReload: true, shouldReload: true,
} },
})); })
);
// CheckOutPanel 제거 // CheckOutPanel 제거
dispatch(popPanel(Config.panel_names.CHECKOUT_PANEL)); dispatch(popPanel(Config.panel_names.CHECKOUT_PANEL));
@@ -442,7 +552,10 @@ export default function CheckOutPanel({ panelInfo }) {
}, [dispatch, panels]); }, [dispatch, panels]);
const toggleOrderSideBar = useCallback(() => { const toggleOrderSideBar = useCallback(() => {
console.log('[BuyOption][CheckOutPanel] toggleOrderSideBar called - current state:', orderSideBarOpen); console.log(
'[BuyOption][CheckOutPanel] toggleOrderSideBar called - current state:',
orderSideBarOpen
);
if (!orderSideBarOpen) { if (!orderSideBarOpen) {
dispatch(sendLogCheckOutBtnClick({ btnNm: 'ORDER ITEMS' })); dispatch(sendLogCheckOutBtnClick({ btnNm: 'ORDER ITEMS' }));
dispatch( dispatch(
@@ -460,7 +573,10 @@ export default function CheckOutPanel({ panelInfo }) {
}, [orderSideBarOpen, dispatch]); }, [orderSideBarOpen, dispatch]);
const toggleOfferSideBar = useCallback(() => { const toggleOfferSideBar = useCallback(() => {
console.log('[BuyOption][CheckOutPanel] toggleOfferSideBar called - current state:', offerSideBarOpen); console.log(
'[BuyOption][CheckOutPanel] toggleOfferSideBar called - current state:',
offerSideBarOpen
);
if (!offerSideBarOpen) { if (!offerSideBarOpen) {
dispatch(sendLogCheckOutBtnClick({ btnNm: 'OFFERS & PROMOTION' })); dispatch(sendLogCheckOutBtnClick({ btnNm: 'OFFERS & PROMOTION' }));
dispatch( dispatch(
@@ -489,7 +605,9 @@ export default function CheckOutPanel({ panelInfo }) {
}, [dispatch]); }, [dispatch]);
const handlePopPanel = useCallback(() => { const handlePopPanel = useCallback(() => {
console.log('[BuyOption][CheckOutPanel] handlePopPanel called - dispatching setHidePopup and popPanel'); console.log(
'[BuyOption][CheckOutPanel] handlePopPanel called - dispatching setHidePopup and popPanel'
);
dispatch(setHidePopup()); dispatch(setHidePopup());
dispatch(popPanel()); dispatch(popPanel());
}, [dispatch]); }, [dispatch]);
@@ -564,12 +682,14 @@ export default function CheckOutPanel({ panelInfo }) {
console.log('[CheckOutPanel] onCancelCheckoutPanel - Sending reload signal to DetailPanel'); console.log('[CheckOutPanel] onCancelCheckoutPanel - Sending reload signal to DetailPanel');
// DetailPanel에 재시작 신호 전달 // DetailPanel에 재시작 신호 전달
dispatch(updatePanel({ dispatch(
updatePanel({
name: Config.panel_names.DETAIL_PANEL, name: Config.panel_names.DETAIL_PANEL,
panelInfo: { panelInfo: {
shouldReload: true, shouldReload: true,
} },
})); })
);
// CheckOutPanel 제거 // CheckOutPanel 제거
dispatch(popPanel(Config.panel_names.CHECKOUT_PANEL)); dispatch(popPanel(Config.panel_names.CHECKOUT_PANEL));
@@ -591,9 +711,7 @@ export default function CheckOutPanel({ panelInfo }) {
dispatch(sendLogMyInfoEdit({ btnNm })); dispatch(sendLogMyInfoEdit({ btnNm }));
}, []); }, []);
const checkOutPanelInfo = panels.find( const checkOutPanelInfo = panels.find((panel) => panel.name === 'checkoutpanel')?.panelInfo;
(panel) => panel.name === "checkoutpanel"
)?.panelInfo;
console.log( console.log(
'[CheckOutPanel] Rendering - orderSideBarOpen:', '[CheckOutPanel] Rendering - orderSideBarOpen:',
@@ -741,7 +859,10 @@ export default function CheckOutPanel({ panelInfo }) {
/> />
</TFullPopup> </TFullPopup>
<div style={{ display: 'none' }}> <div style={{ display: 'none' }}>
{console.log('%c[BuyOption][CheckOutPanel] ✅ Component rendering COMPLETE', 'background: lightgreen; color: black; font-weight: bold; padding: 5px;')} {console.log(
'%c[BuyOption][CheckOutPanel] ✅ Component rendering COMPLETE',
'background: lightgreen; color: black; font-weight: bold; padding: 5px;'
)}
</div> </div>
</> </>
); );

77
com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx
View File

@@ -53,6 +53,21 @@ import usePrevious from '../../hooks/usePrevious';
import { useVideoPlay } from '../../hooks/useVideoPlay/useVideoPlay'; import { useVideoPlay } from '../../hooks/useVideoPlay/useVideoPlay';
import ImagePreloader from '../../utils/ImagePreloader'; import ImagePreloader from '../../utils/ImagePreloader';
// Toggle debug logging for this module (false by default)
const DEBUG_MODE = false;
const dlog = (...args) => {
if (DEBUG_MODE) console.log(...args);
};
const dwarn = (...args) => {
if (DEBUG_MODE) console.warn(...args);
};
const derror = (...args) => {
console.error(...args);
};
// DetailPanelBackground 이미지 imports for preloading // DetailPanelBackground 이미지 imports for preloading
import hsn from '../../../assets/images/bg/hsn_new.png'; import hsn from '../../../assets/images/bg/hsn_new.png';
import koreaKiosk from '../../../assets/images/bg/koreaKiosk_new.png'; import koreaKiosk from '../../../assets/images/bg/koreaKiosk_new.png';
@@ -233,23 +248,21 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
// HomePanel 마운트 시 백그라운드로 모든 파트너사 배경 이미지를 미리 로드하여 // HomePanel 마운트 시 백그라운드로 모든 파트너사 배경 이미지를 미리 로드하여
// DetailPanel 진입 시 로딩 지연을 방지함 // DetailPanel 진입 시 로딩 지연을 방지함
useEffect(() => { useEffect(() => {
console.log('[HomePanel] Starting background image preloading...'); dlog('[HomePanel] Starting background image preloading...');
// HomePanel의 다른 기능들에 영향을 주지 않도록 비동기로 조용히 실행 // HomePanel의 다른 기능들에 영향을 주지 않도록 비동기로 조용히 실행
setTimeout(() => { setTimeout(() => {
ImagePreloader.preloadAllImages(BACKGROUND_IMAGES) ImagePreloader.preloadAllImages(BACKGROUND_IMAGES)
.then((results) => { .then((results) => {
const successCount = results.filter((r) => r !== null).length; const successCount = results.filter((r) => r !== null).length;
console.log( dlog(`[HomePanel] Background images preloaded: ${successCount}/${results.length} images`);
`[HomePanel] Background images preloaded: ${successCount}/${results.length} images`
);
// 프리로딩 통계 정보 로깅 (디버깅용) // 프리로딩 통계 정보 로깅 (디버깅용)
const stats = ImagePreloader.getStats(); const stats = ImagePreloader.getStats();
console.log('[HomePanel] Preloader stats:', stats); dlog('[HomePanel] Preloader stats:', stats);
}) })
.catch((error) => { .catch((error) => {
console.error('[HomePanel] Background image preloading failed:', error); derror('[HomePanel] Background image preloading failed:', error);
// 프리로딩 실패가 HomePanel 기능에 영향을 주지 않도록 조용히 처리 // 프리로딩 실패가 HomePanel 기능에 영향을 주지 않도록 조용히 처리
}); });
}, 1000); // HomePanel 안정화 후 1초 뒤 시작 }, 1000); // HomePanel 안정화 후 1초 뒤 시작
@@ -299,7 +312,7 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
const handleOptionalAgree = useCallback(() => { const handleOptionalAgree = useCallback(() => {
if (!termsIdMap || Object.keys(termsIdMap).length === 0) { if (!termsIdMap || Object.keys(termsIdMap).length === 0) {
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
console.error('[HomePanel] termsIdMap이 없습니다:', termsIdMap); derror('[HomePanel] termsIdMap이 없습니다:', termsIdMap);
} }
return; return;
} }
@@ -309,7 +322,7 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
if (missingTerms.length > 0) { if (missingTerms.length > 0) {
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
console.error('[HomePanel] 누락된 약관 타입:', missingTerms); derror('[HomePanel] 누락된 약관 타입:', missingTerms);
} }
return; return;
} }
@@ -329,8 +342,8 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
const notTermsList = []; const notTermsList = [];
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
console.log('[HomePanel] 현재 termsIdMap:', termsIdMap); dlog('[HomePanel] 현재 termsIdMap:', termsIdMap);
console.log('[HomePanel] 약관 동의 API 호출 파라미터:', { dlog('[HomePanel] 약관 동의 API 호출 파라미터:', {
termsList, termsList,
notTermsList, notTermsList,
}); });
@@ -339,13 +352,13 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
const callback = (response) => { const callback = (response) => {
if (response.retCode === '000' || response.retCode === 0) { if (response.retCode === '000' || response.retCode === 0) {
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
console.log('[HomePanel] 약관 동의 성공:', response); dlog('[HomePanel] 약관 동의 성공:', response);
} }
dispatch(updateOptionalTermsAgreement(true)); dispatch(updateOptionalTermsAgreement(true));
setOptionalTermsAgreed(true); setOptionalTermsAgreed(true);
} else { } else {
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
console.error('[HomePanel] 약관 동의 실패:', response); derror('[HomePanel] 약관 동의 실패:', response);
} }
} }
}; };
@@ -355,7 +368,7 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
const handleOptionalTermsClick = useCallback(() => { const handleOptionalTermsClick = useCallback(() => {
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
console.log('[HomePanel] 약관 자세히 보기 클릭'); dlog('[HomePanel] 약관 자세히 보기 클릭');
} }
setIsOptionalConfirmVisible(false); setIsOptionalConfirmVisible(false);
setIsOptionalTermsVisible(true); setIsOptionalTermsVisible(true);
@@ -375,7 +388,7 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
const handleOptionalDeclineClick = useCallback(() => { const handleOptionalDeclineClick = useCallback(() => {
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
console.log('[HomePanel] 거절/다음에 하기 버튼 클릭'); dlog('[HomePanel] 거절/다음에 하기 버튼 클릭');
} }
dispatch(updateOptionalTermsAgreement(false)); dispatch(updateOptionalTermsAgreement(false));
setIsOptionalConfirmVisible(false); setIsOptionalConfirmVisible(false);
@@ -389,7 +402,7 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
const handleTermsPopupAgree = useCallback(() => { const handleTermsPopupAgree = useCallback(() => {
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
console.log('[HomePanel] handleTermsPopupAgree'); dlog('[HomePanel] handleTermsPopupAgree');
} }
handleOptionalAgree(); handleOptionalAgree();
setIsOptionalTermsVisible(false); setIsOptionalTermsVisible(false);
@@ -439,8 +452,8 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
} }
if (shouldShowOptionalTermsPopup && !isOptionalConfirmVisible) { if (shouldShowOptionalTermsPopup && !isOptionalConfirmVisible) {
console.log('shouldShowOptionalTermsPopup', shouldShowOptionalTermsPopup); dlog('shouldShowOptionalTermsPopup', shouldShowOptionalTermsPopup);
console.log('HomePanel optionalTermsConfirm 팝업 표시'); dlog('HomePanel optionalTermsConfirm 팝업 표시');
const timer = setTimeout(() => { const timer = setTimeout(() => {
setIsOptionalConfirmVisible(true); setIsOptionalConfirmVisible(true);
@@ -812,14 +825,14 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
const _onFocusedContainerId = useCallback( const _onFocusedContainerId = useCallback(
(containerId) => { (containerId) => {
setFocusedContainerId(containerId); setFocusedContainerId(containerId);
console.log('[_onFocusedContainerId] 호출됨:', { dlog('[_onFocusedContainerId] 호출됨:', {
containerId, containerId,
enterThroughGNB, enterThroughGNB,
isOnTop, isOnTop,
condition: enterThroughGNB && cbChangePageRef.current && !isOnTop, condition: enterThroughGNB && cbChangePageRef.current && !isOnTop,
}); });
if (enterThroughGNB && cbChangePageRef.current && !isOnTop) { if (enterThroughGNB && cbChangePageRef.current && !isOnTop) {
console.log('[_onFocusedContainerId] ⚠️ 맨 위로 스크롤 강제 실행!'); dlog('[_onFocusedContainerId] ⚠️ 맨 위로 스크롤 강제 실행!');
Spotlight.resume(); Spotlight.resume();
cbChangePageRef.current(0, false); cbChangePageRef.current(0, false);
Spotlight.focus(defaultFocus); Spotlight.focus(defaultFocus);
@@ -1034,7 +1047,7 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
// 🔽 videoPlayIntentRef가 null인 경우: 비디오 재생 가능한 첫 번째 배너 찾기 // 🔽 videoPlayIntentRef가 null인 경우: 비디오 재생 가능한 첫 번째 배너 찾기
if (!videoPlayIntentRef.current && bannerDataList) { if (!videoPlayIntentRef.current && bannerDataList) {
console.log('[HomePanel] *** videoPlayIntentRef가 null - 첫 번째 비디오 배너 검색'); dlog('[HomePanel] *** videoPlayIntentRef가 null - 첫 번째 비디오 배너 검색');
// HomeBanner.jsx의 defaultFocus 계산 로직과 동일 // HomeBanner.jsx의 defaultFocus 계산 로직과 동일
let targetIndex = 0; let targetIndex = 0;
@@ -1069,7 +1082,7 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
if (targetBannerData && videoData) { if (targetBannerData && videoData) {
const bannerId = 'banner' + targetIndex; const bannerId = 'banner' + targetIndex;
console.log('[HomePanel] *** 찾은 비디오 배너:', bannerId, videoData); dlog('[HomePanel] *** 찾은 비디오 배너:', bannerId, videoData);
// videoPlayIntentRef에 값 할당 (HomeBanner.jsx의 초기 재생 로직과 동일) // videoPlayIntentRef에 값 할당 (HomeBanner.jsx의 초기 재생 로직과 동일)
videoPlayIntentRef.current = { videoPlayIntentRef.current = {
@@ -1088,9 +1101,9 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
}; };
lastPlayedBannerIdRef.current = bannerId; lastPlayedBannerIdRef.current = bannerId;
console.log('[HomePanel] *** videoPlayIntentRef 설정 완료:', videoPlayIntentRef.current); dlog('[HomePanel] *** videoPlayIntentRef 설정 완료:', videoPlayIntentRef.current);
} else { } else {
console.log('[HomePanel] *** ⚠️ 비디오 재생 가능한 배너를 찾지 못함'); dlog('[HomePanel] *** ⚠️ 비디오 재생 가능한 배너를 찾지 못함');
} }
} }
@@ -1104,7 +1117,7 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
// 🔽 [251118] 현재 스크롤 위치 확인하여 비디오 크기 결정 // 🔽 [251118] 현재 스크롤 위치 확인하여 비디오 크기 결정
const currentScrollTop = prevScrollTopRef.current; const currentScrollTop = prevScrollTopRef.current;
const shouldShrink = currentScrollTop > 0; const shouldShrink = currentScrollTop > 0;
console.log( dlog(
'[HomePanel] *** 비디오 복구 - currentScrollTop:', '[HomePanel] *** 비디오 복구 - currentScrollTop:',
currentScrollTop, currentScrollTop,
', shouldShrink:', ', shouldShrink:',
@@ -1130,9 +1143,9 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
); );
// 🔽 DetailPanel에서 돌아온 뒤 포커스를 마지막 포커스 대상에 복원 // 🔽 DetailPanel에서 돌아온 뒤 포커스를 마지막 포커스 대상에 복원
console.log('[HomePanel] *** 🎯 Focus 복원 준비'); dlog('[HomePanel] *** 🎯 Focus 복원 준비');
const targetFocusId = panelInfo.lastFocusedTargetId || lastFocusedTargetRef.current; const targetFocusId = panelInfo.lastFocusedTargetId || lastFocusedTargetRef.current;
console.log( dlog(
'[HomePanel] *** 📍 targetFocusId:', '[HomePanel] *** 📍 targetFocusId:',
targetFocusId, targetFocusId,
'(panelInfo.lastFocusedTargetId:', '(panelInfo.lastFocusedTargetId:',
@@ -1142,13 +1155,13 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
')' ')'
); );
if (targetFocusId) { if (targetFocusId) {
console.log('[HomePanel] *** ⏰ 300ms 후 Spotlight.focus 호출 예정'); dlog('[HomePanel] *** ⏰ 300ms 후 Spotlight.focus 호출 예정');
setTimeout(() => { setTimeout(() => {
console.log('[HomePanel] *** 🔍 Spotlight.focus 호출:', targetFocusId); dlog('[HomePanel] *** 🔍 Spotlight.focus 호출:', targetFocusId);
Spotlight.focus(targetFocusId); Spotlight.focus(targetFocusId);
}, 300); }, 300);
} else { } else {
console.log('[HomePanel] *** ⚠️ targetFocusId가 없음 - Focus 복원 스킵'); dlog('[HomePanel] *** ⚠️ targetFocusId가 없음 - Focus 복원 스킵');
} }
// refs 초기화 // refs 초기화
@@ -1156,7 +1169,7 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
lastPlayedBannerIdRef.current = null; lastPlayedBannerIdRef.current = null;
// detailPanelClosed 플래그 초기화 (다음 사이클에서 재사용 방지) // detailPanelClosed 플래그 초기화 (다음 사이클에서 재사용 방지)
console.log('[HomePanel] *** detailPanelClosed flag 초기화'); dlog('[HomePanel] *** detailPanelClosed flag 초기화');
dispatch( dispatch(
updateHomeInfo({ updateHomeInfo({
name: panel_names.HOME_PANEL, name: panel_names.HOME_PANEL,
@@ -1236,14 +1249,14 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
useEffect(() => { useEffect(() => {
const prevModalState = prevPlayerModalStateRef.current; const prevModalState = prevPlayerModalStateRef.current;
console.log('[HomePanel] 🔍 Modal 상태 체크:', { dlog('[HomePanel] 🔍 Modal 상태 체크:', {
prevModalState, prevModalState,
playerModalState, playerModalState,
shouldExecute: prevModalState === false && playerModalState === true, shouldExecute: prevModalState === false && playerModalState === true,
}); });
if (prevModalState === false && playerModalState === true) { if (prevModalState === false && playerModalState === true) {
console.log('>>>>>[HomePanel] ▶️ PlayerPanel이 Fullscreen에서 Banner로 전환됨'); dlog('>>>>>[HomePanel] ▶️ PlayerPanel이 Fullscreen에서 Banner로 전환됨');
// 0.5초 후 비디오가 재생되는 배너에 포커스 테두리 효과 적용 // 0.5초 후 비디오가 재생되는 배너에 포커스 테두리 효과 적용
// const focusTimer = setTimeout(() => { // const focusTimer = setTimeout(() => {
// if (videoPlayIntentRef.current?.bannerId) { // if (videoPlayIntentRef.current?.bannerId) {