From f2cee79fb51dc76ab7292a383c5b53f005f504fe Mon Sep 17 00:00:00 2001 From: Hanna922 Date: Fri, 9 Feb 2024 16:34:13 +0900 Subject: [PATCH 1/5] feat: add initialLog function MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 중복되는 초기화 로직을 분리합니다. --- src/Logger.ts | 54 ++++++++++++++++++++++++--------------------------- 1 file changed, 25 insertions(+), 29 deletions(-) diff --git a/src/Logger.ts b/src/Logger.ts index e059874..0a0796f 100644 --- a/src/Logger.ts +++ b/src/Logger.ts @@ -1,5 +1,5 @@ import { postLog } from './apis/postLog'; -import { LogPayloadParams, LogType } from './types/LogType'; +import { LogPayloadParams, LogType, ServiceNameType } from './types/LogType'; const createHashedId = (userId: string) => { // Todo: create hashedId @@ -34,40 +34,36 @@ const setLocalStorage = async (logger: LogType) => { } }; +const initialLog = ( + userId: string, + serviceName: ServiceNameType, + name: string, + path: string | undefined +) => { + const loggerType: LogPayloadParams = { + userId: userId, + path: '/', + serviceName: serviceName, + name: '', + message: '', + }; + + const logger = Logger(loggerType); + + logger.event.name = name; + logger.event.path = path; + + setLocalStorage(logger); +}; + export const useYLSLogger = () => { const screen = ({ userId, serviceName, name, path }: LogPayloadParams) => { - const loggerType: LogPayloadParams = { - userId: userId, - path: '/', - serviceName: serviceName, - name: '', - message: '', - }; - const logger = Logger(loggerType); - console.log(`Logging screen information for path: ${serviceName}`); - logger.event.name = name; - logger.event.path = path; - - setLocalStorage(logger); + initialLog(userId, serviceName, name, path); }; const click = ({ userId, serviceName, name, path }: LogPayloadParams) => { - console.log(`Logging click information for button: ${name}`); - //사용자에서 path,name,message를 넣어줌 - const loggerType: LogPayloadParams = { - userId: userId, - path: '/', - serviceName: serviceName, - name: '', - message: '', - }; - const logger = Logger(loggerType); - - logger.event.name = name; - logger.event.path = path; - setLocalStorage(logger); + initialLog(userId, serviceName, name, path); }; - // todo: 로컬스토리지 로그 개수가 10개 넘어가면 postLog.ts호출 return { screen, From dfd36ab3b0fe6f73f42000e0c996128979222244 Mon Sep 17 00:00:00 2001 From: Hanna922 Date: Fri, 9 Feb 2024 16:36:11 +0900 Subject: [PATCH 2/5] feat: separate localStorage logic MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 로컬 스토리지와 관련된 로직을 별도 파일로 분리합니다. --- src/Logger.ts | 26 ++------------------------ src/setLocalStorage.ts | 24 ++++++++++++++++++++++++ 2 files changed, 26 insertions(+), 24 deletions(-) create mode 100644 src/setLocalStorage.ts diff --git a/src/Logger.ts b/src/Logger.ts index 0a0796f..f71b643 100644 --- a/src/Logger.ts +++ b/src/Logger.ts @@ -1,5 +1,5 @@ -import { postLog } from './apis/postLog'; -import { LogPayloadParams, LogType, ServiceNameType } from './types/LogType'; +import { setLocalStorage } from './setLocalStorage'; +import { LogPayloadParams, ServiceNameType } from './types/LogType'; const createHashedId = (userId: string) => { // Todo: create hashedId @@ -12,28 +12,6 @@ const createTimestamp = () => { return now.toISOString(); }; -const setLocalStorageClear = () => { - const list: any[] = []; - localStorage.setItem('yls-web', JSON.stringify(list)); -}; - -const setLocalStorage = async (logger: LogType) => { - if (window.localStorage.getItem('yls-web') == undefined) { - const list: any[] = []; - list.push(logger); - localStorage.setItem('yls-web', JSON.stringify(list)); - } else { - const remainList: any[] = JSON.parse(localStorage.getItem('yls-web') as string) || []; - if (remainList.length < 10) { - const updateList = [...remainList, logger]; - localStorage.setItem('yls-web', JSON.stringify(updateList)); - } else { - setLocalStorageClear(); - const res = await postLog(); - } - } -}; - const initialLog = ( userId: string, serviceName: ServiceNameType, diff --git a/src/setLocalStorage.ts b/src/setLocalStorage.ts new file mode 100644 index 0000000..9595d38 --- /dev/null +++ b/src/setLocalStorage.ts @@ -0,0 +1,24 @@ +import { postLog } from './apis/postLog'; +import { LogType } from './types/LogType'; + +const setLocalStorageClear = () => { + const list: any[] = []; + localStorage.setItem('yls-web', JSON.stringify(list)); +}; + +export const setLocalStorage = async (logger: LogType) => { + if (window.localStorage.getItem('yls-web') == undefined) { + const list: any[] = []; + list.push(logger); + localStorage.setItem('yls-web', JSON.stringify(list)); + } else { + const remainList: any[] = JSON.parse(localStorage.getItem('yls-web') as string) || []; + if (remainList.length < 10) { + const updateList = [...remainList, logger]; + localStorage.setItem('yls-web', JSON.stringify(updateList)); + } else { + setLocalStorageClear(); + const res = await postLog(); + } + } +}; From 992d4fa045625035a1e1daf2999e8a43873a1f71 Mon Sep 17 00:00:00 2001 From: Hanna922 Date: Fri, 9 Feb 2024 16:40:00 +0900 Subject: [PATCH 3/5] feat: move LogClick, LogScreen components MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - components 폴더 내로 분리했습니다. --- src/{ => components}/LogClick.tsx | 4 ++-- src/{ => components}/LogScreen.tsx | 4 ++-- src/demo/App.tsx | 4 ++-- src/demo/Drawer.tsx | 5 +++-- src/demo/Home.tsx | 4 ++-- src/demo/main.tsx | 1 - 6 files changed, 11 insertions(+), 11 deletions(-) rename src/{ => components}/LogClick.tsx (85%) rename src/{ => components}/LogScreen.tsx (77%) diff --git a/src/LogClick.tsx b/src/components/LogClick.tsx similarity index 85% rename from src/LogClick.tsx rename to src/components/LogClick.tsx index d721f60..3b817ce 100644 --- a/src/LogClick.tsx +++ b/src/components/LogClick.tsx @@ -1,6 +1,6 @@ import { Children, cloneElement } from 'react'; -import { useYLSLogger } from '.'; -import { LogPayloadParams } from './types/LogType'; +import { useYLSLogger } from '..'; +import { LogPayloadParams } from '../types/LogType'; interface Props { children: React.ReactElement; diff --git a/src/LogScreen.tsx b/src/components/LogScreen.tsx similarity index 77% rename from src/LogScreen.tsx rename to src/components/LogScreen.tsx index 544bc7f..d4e5cd9 100644 --- a/src/LogScreen.tsx +++ b/src/components/LogScreen.tsx @@ -1,6 +1,6 @@ -import { useYLSLogger } from '.'; +import { useYLSLogger } from '..'; import { useEffect } from 'react'; -import { LogPayloadParams } from './types/LogType'; +import { LogPayloadParams } from '../types/LogType'; interface Props { children: React.ReactNode; diff --git a/src/demo/App.tsx b/src/demo/App.tsx index bdcad57..0c1a623 100644 --- a/src/demo/App.tsx +++ b/src/demo/App.tsx @@ -1,7 +1,7 @@ -import { BrowserRouter } from 'react-router-dom'; -import { Routes, Route } from 'react-router-dom'; +import { Routes, Route, BrowserRouter } from 'react-router-dom'; import { Home } from './Home'; import { Drawer } from './Drawer'; + export const App = () => { return ( <> diff --git a/src/demo/Drawer.tsx b/src/demo/Drawer.tsx index 79cd0fa..ab2d6dd 100644 --- a/src/demo/Drawer.tsx +++ b/src/demo/Drawer.tsx @@ -1,7 +1,8 @@ import { useState } from 'react'; -import { LogClick } from '../LogClick'; +import { LogClick } from '../components/LogClick'; import { useLocation } from 'react-router-dom'; -import { LogScreen } from '../LogScreen'; +import { LogScreen } from '../components/LogScreen'; + export const Drawer = () => { const [count, setCount] = useState(0); const router = useLocation(); diff --git a/src/demo/Home.tsx b/src/demo/Home.tsx index f7b6bf6..0ddef24 100644 --- a/src/demo/Home.tsx +++ b/src/demo/Home.tsx @@ -1,7 +1,7 @@ import { useState } from 'react'; -import { LogClick } from '../LogClick'; +import { LogClick } from '../components/LogClick'; import { useLocation } from 'react-router-dom'; -import { LogScreen } from '../LogScreen'; +import { LogScreen } from '../components/LogScreen'; export const Home = () => { const [count, setCount] = useState(0); diff --git a/src/demo/main.tsx b/src/demo/main.tsx index 6a90344..dccf3eb 100644 --- a/src/demo/main.tsx +++ b/src/demo/main.tsx @@ -1,4 +1,3 @@ -import React from 'react'; import ReactDOM from 'react-dom/client'; import { App } from './App'; From 79f0edfc7731011d9d4e2ca1a15d1af039beae05 Mon Sep 17 00:00:00 2001 From: Hanna922 Date: Fri, 9 Feb 2024 22:08:54 +0900 Subject: [PATCH 4/5] remove: delete setLocalStorage MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 대소문자 구별을 위해 삭제 --- src/setLocalStorage.ts | 24 ------------------------ 1 file changed, 24 deletions(-) diff --git a/src/setLocalStorage.ts b/src/setLocalStorage.ts index 9595d38..e69de29 100644 --- a/src/setLocalStorage.ts +++ b/src/setLocalStorage.ts @@ -1,24 +0,0 @@ -import { postLog } from './apis/postLog'; -import { LogType } from './types/LogType'; - -const setLocalStorageClear = () => { - const list: any[] = []; - localStorage.setItem('yls-web', JSON.stringify(list)); -}; - -export const setLocalStorage = async (logger: LogType) => { - if (window.localStorage.getItem('yls-web') == undefined) { - const list: any[] = []; - list.push(logger); - localStorage.setItem('yls-web', JSON.stringify(list)); - } else { - const remainList: any[] = JSON.parse(localStorage.getItem('yls-web') as string) || []; - if (remainList.length < 10) { - const updateList = [...remainList, logger]; - localStorage.setItem('yls-web', JSON.stringify(updateList)); - } else { - setLocalStorageClear(); - const res = await postLog(); - } - } -}; From 11672637a55cb0bc12c489ac2e3148a2758fafb0 Mon Sep 17 00:00:00 2001 From: Hanna922 Date: Fri, 9 Feb 2024 22:09:51 +0900 Subject: [PATCH 5/5] rename: setLocalStorage -> SetLocalStorage --- src/Logger.ts | 4 ++-- src/setLocalStorage.ts | 24 ++++++++++++++++++++++++ 2 files changed, 26 insertions(+), 2 deletions(-) diff --git a/src/Logger.ts b/src/Logger.ts index 8071c7e..07a1bd3 100644 --- a/src/Logger.ts +++ b/src/Logger.ts @@ -1,4 +1,4 @@ -import { setLocalStorage } from './setLocalStorage'; +import { SetLocalStorage } from './SetLocalStorage'; import { LogPayloadParams, ServiceNameType } from './types/LogType'; import CryptoJS from 'crypto-js'; @@ -57,7 +57,7 @@ const initialLog = ( logger.event.name = name; logger.event.path = path; - setLocalStorage(logger); + SetLocalStorage(logger); }; export const useYLSLogger = () => { diff --git a/src/setLocalStorage.ts b/src/setLocalStorage.ts index e69de29..a96331d 100644 --- a/src/setLocalStorage.ts +++ b/src/setLocalStorage.ts @@ -0,0 +1,24 @@ +import { postLog } from './apis/postLog'; +import { LogType } from './types/LogType'; + +const SetLocalStorageClear = () => { + const list: any[] = []; + localStorage.setItem('yls-web', JSON.stringify(list)); +}; + +export const SetLocalStorage = async (logger: LogType) => { + if (window.localStorage.getItem('yls-web') == undefined) { + const list: any[] = []; + list.push(logger); + localStorage.setItem('yls-web', JSON.stringify(list)); + } else { + const remainList: any[] = JSON.parse(localStorage.getItem('yls-web') as string) || []; + if (remainList.length < 10) { + const updateList = [...remainList, logger]; + localStorage.setItem('yls-web', JSON.stringify(updateList)); + } else { + SetLocalStorageClear(); + const res = await postLog(); + } + } +};