From 22c3ec7fc1f4963ba6fda8924922751314fad5bf Mon Sep 17 00:00:00 2001 From: Cllaude99 Date: Sat, 31 May 2025 10:42:37 +0900 Subject: [PATCH 1/6] =?UTF-8?q?feat:=20AI=20=EC=B0=A8=ED=8A=B8=20=ED=95=B4?= =?UTF-8?q?=EC=84=9D=20api=20=EC=97=B0=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../app/home/floating/AIChartAnalyze.tsx | 80 ++++++++++++++++++- .../api/floating/useBitCoinAnalysisQuery.ts | 20 +++++ 2 files changed, 99 insertions(+), 1 deletion(-) create mode 100644 src/hooks/api/floating/useBitCoinAnalysisQuery.ts diff --git a/src/components/app/home/floating/AIChartAnalyze.tsx b/src/components/app/home/floating/AIChartAnalyze.tsx index 9003ff6..e931a48 100644 --- a/src/components/app/home/floating/AIChartAnalyze.tsx +++ b/src/components/app/home/floating/AIChartAnalyze.tsx @@ -1,3 +1,81 @@ +import IconRightChevron from "@/assets/IconRightChevron.svg?react"; +import { useBitCoinAnalysisQuery } from "@/hooks/api/floating/useBitCoinAnalysisQuery"; +import { css } from "@emotion/react"; + export default function AIChartAnalyze() { - return
AIChartAnalyze
; + const { data } = useBitCoinAnalysisQuery(); + console.log(data); + + return ( +
+

+ '비트코인' 가격 추세 예측과 뉴스 동향을 종합해서 최적의 투자 판단을 + 추천해드릴게요. +

+
+
+ 비트코인 예측 해석 +
+
+ {data?.response} +
+
+ +
+

+ 지금 주요뉴스 동향을 분석해서 추천할 만한 투자 판단을 도와드릴까요? +

+
+ AI 추천판단 +
+
+
+ ); } diff --git a/src/hooks/api/floating/useBitCoinAnalysisQuery.ts b/src/hooks/api/floating/useBitCoinAnalysisQuery.ts new file mode 100644 index 0000000..01a1dca --- /dev/null +++ b/src/hooks/api/floating/useBitCoinAnalysisQuery.ts @@ -0,0 +1,20 @@ +import { api } from "@/api"; +import { useQuery } from "@tanstack/react-query"; + +export const useBitCoinAnalysisQuery = () => { + const getBitCoinAnalysis = async () => { + const response = await api.get( + "/bitcoin-service/get_chart_analysis?currency=BTC", + ); + return response.data; + }; + + return { + ...useQuery({ + queryKey: ["bitCoinAnalysis"], + queryFn: () => getBitCoinAnalysis(), + staleTime: 60000 * 60 * 2, // 2시간 + gcTime: 60000 * 60 * 2, // 2시간 + }), + }; +}; From 96ebbea6a7b3f6e5a82f6974eec084d361d631cd Mon Sep 17 00:00:00 2001 From: Cllaude99 Date: Sat, 31 May 2025 10:43:24 +0900 Subject: [PATCH 2/6] =?UTF-8?q?feat:=20=EA=B8=B0=EB=8A=A5=20=EB=8F=84?= =?UTF-8?q?=EC=9B=80=EB=A7=90=20=EC=9E=91=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 시세차트, 모델 적합도, 뉴스룸에 대해 도움말을 작성하였습니다. --- .../app/home/floating/FunctionHelp.tsx | 102 +++++++++++++++++- 1 file changed, 101 insertions(+), 1 deletion(-) diff --git a/src/components/app/home/floating/FunctionHelp.tsx b/src/components/app/home/floating/FunctionHelp.tsx index 7f15828..3edbbf3 100644 --- a/src/components/app/home/floating/FunctionHelp.tsx +++ b/src/components/app/home/floating/FunctionHelp.tsx @@ -1,3 +1,103 @@ +import { css } from "@emotion/react"; + export default function FunctionHelp() { - return
FunctionHelp
; + return ( +
+

+ 현재 페이지에 있는 기능들을 알려드릴게요. +

+
+
+ 시세차트 +
+
+ AI가 예측한 코인 가격과 실제 가격을 알려주는 시세 추이 차트로, + 상단에서 종목을 바꿀 수 있어요. 마우스 휠(또는 터치)로 확대 및 + 축소하거나 상단의 태그를 눌러 날짜 영역을 바꿔보세요 :) +
+
+
+
+ 모델 적합도 +
+
+ Flowbit AI 학습모델의 예측값이 실제 데이터 패턴을 얼마나 잘 + 설명하는지를 검증된 통계적 기법으로 평가한 지표에요. 지표가 높을수록 + 예측 정확도가 높아지기 때문에, 현재 지표 상으로는 예측가격이 + 실제가격과 매우 유사할 거에요 :) +
+
+
+
+ 뉴스룸 +
+
+ 매일 가상화폐 종목 별 주요뉴스를 선별해 제공하고 있어요. +
+
+
+ ); } From e80f63b894ba7afe18c02511ffd5665e0c08249e Mon Sep 17 00:00:00 2001 From: Cllaude99 Date: Sat, 31 May 2025 10:43:37 +0900 Subject: [PATCH 3/6] =?UTF-8?q?feat:=20AI=20=EC=B6=94=EC=B2=9C=ED=8C=90?= =?UTF-8?q?=EB=8B=A8=20=ED=99=94=EB=A9=B4=20=EA=B0=9C=EB=B0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../home/floating/AIChartRecommendation.tsx | 101 +++++++++++++++++- 1 file changed, 100 insertions(+), 1 deletion(-) diff --git a/src/components/app/home/floating/AIChartRecommendation.tsx b/src/components/app/home/floating/AIChartRecommendation.tsx index 9654096..380a4e7 100644 --- a/src/components/app/home/floating/AIChartRecommendation.tsx +++ b/src/components/app/home/floating/AIChartRecommendation.tsx @@ -1,3 +1,102 @@ +import { css } from "@emotion/react"; + export default function AIChartRecommendation() { - return
AIChartRecommendation
; + return ( +
+

+ '비트코인' 가격 추세 예측과 뉴스 동향을 종합해서 최적의 투자 판단을 + 추천해드릴게요. +

+
+
+ 비트코인 예측 해석 +
+
+ 가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하 +
+
+
+
+ 비트코인 예측 해석 +
+
+ 가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하 +
+
+
+
+ 매수 추천 +
+

+ 지금 주요뉴스 동향을 분석해서 추천할 만한 투자 판단을 도와드릴까요? +

+
+
+ ); } From e90e2a06219ad48f813a58bf2172b1930066f2b1 Mon Sep 17 00:00:00 2001 From: Cllaude99 Date: Sat, 31 May 2025 10:43:47 +0900 Subject: [PATCH 4/6] =?UTF-8?q?chore:=20layout=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/IconRightChevron.svg | 3 +++ src/components/app/home/floating/FloatingPanelLayout.tsx | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) create mode 100644 src/assets/IconRightChevron.svg diff --git a/src/assets/IconRightChevron.svg b/src/assets/IconRightChevron.svg new file mode 100644 index 0000000..c0cb12a --- /dev/null +++ b/src/assets/IconRightChevron.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/app/home/floating/FloatingPanelLayout.tsx b/src/components/app/home/floating/FloatingPanelLayout.tsx index 865e872..5fdbbdc 100644 --- a/src/components/app/home/floating/FloatingPanelLayout.tsx +++ b/src/components/app/home/floating/FloatingPanelLayout.tsx @@ -22,7 +22,7 @@ const panelStyle = css` width: 390px; height: calc(100dvh - 450px); background-color: white; - padding: 1.5rem; + padding: 24px; border-radius: 24px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); border: 1px solid #e5e7eb; From c6a0055d1e62fb657d82500a246adc9d05ed64b8 Mon Sep 17 00:00:00 2001 From: Cllaude99 Date: Tue, 3 Jun 2025 21:55:04 +0900 Subject: [PATCH 5/6] =?UTF-8?q?chore:=20css=20=EB=B3=80=EC=88=98=EC=B2=98?= =?UTF-8?q?=EB=A6=AC=EB=A1=9C=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../app/home/floating/AIChartAnalyze.tsx | 105 ++++++------- .../home/floating/AIChartRecommendation.tsx | 142 ++++++++---------- .../app/home/floating/FunctionHelp.tsx | 116 +++++--------- 3 files changed, 141 insertions(+), 222 deletions(-) diff --git a/src/components/app/home/floating/AIChartAnalyze.tsx b/src/components/app/home/floating/AIChartAnalyze.tsx index e931a48..0ca74fe 100644 --- a/src/components/app/home/floating/AIChartAnalyze.tsx +++ b/src/components/app/home/floating/AIChartAnalyze.tsx @@ -4,78 +4,67 @@ import { css } from "@emotion/react"; export default function AIChartAnalyze() { const { data } = useBitCoinAnalysisQuery(); - console.log(data); return (
-

+

'비트코인' 가격 추세 예측과 뉴스 동향을 종합해서 최적의 투자 판단을 추천해드릴게요.

-
-
- 비트코인 예측 해석 -
-
- {data?.response} -
+
+
비트코인 예측 해석
+
{data?.response}
-

+

지금 주요뉴스 동향을 분석해서 추천할 만한 투자 판단을 도와드릴까요?

-
+
AI 추천판단
); } + +const titleStyle = css` + font-size: 18px; + font-weight: 600; + line-height: 1.4; +`; + +const analysisContainerStyle = css` + background-color: var(--blue-5); + padding: 16px; + border-radius: 8px; + margin-bottom: 24px; +`; + +const analysisHeaderStyle = css` + font-weight: 600; + font-size: 16px; + margin-bottom: 8px; +`; + +const analysisContentStyle = css` + font-size: 14px; + line-height: 1.5; + color: var(--gray-80); +`; + +const buttonStyle = css` + width: 100%; + height: 40px; + margin-top: 12px; + background-color: #0056ca; + color: white; + border-radius: 6px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + font-size: 16px; + font-weight: 400; + margin: 8.5px 0px; +`; diff --git a/src/components/app/home/floating/AIChartRecommendation.tsx b/src/components/app/home/floating/AIChartRecommendation.tsx index 380a4e7..a1a3f9b 100644 --- a/src/components/app/home/floating/AIChartRecommendation.tsx +++ b/src/components/app/home/floating/AIChartRecommendation.tsx @@ -3,100 +3,76 @@ import { css } from "@emotion/react"; export default function AIChartRecommendation() { return (
-

+

'비트코인' 가격 추세 예측과 뉴스 동향을 종합해서 최적의 투자 판단을 추천해드릴게요.

-
-
- 비트코인 예측 해석 -
-
- 가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하 +
+
비트코인 예측 해석
+
+ 가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하
-
-
- 비트코인 예측 해석 -
-
- 가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하 +
+
비트코인 예측 해석
+
+ 가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하
-
- 매수 추천 -
-

+
매수 추천
+

지금 주요뉴스 동향을 분석해서 추천할 만한 투자 판단을 도와드릴까요?

); } + +const titleStyle = css` + font-size: 18px; + font-weight: 600; + line-height: 1.4; +`; + +const analysisContainerStyle = css` + background-color: #f2f6fc; + padding: 16px; + border-radius: 8px; + margin-bottom: 12px; +`; + +const analysisContainerSecondStyle = css` + background-color: #f2f6fc; + padding: 16px; + border-radius: 8px; + margin-bottom: 24px; +`; + +const analysisHeaderStyle = css` + font-weight: 600; + font-size: 16px; + margin-bottom: 8px; +`; + +const analysisContentStyle = css` + font-size: 14px; + line-height: 1.5; + color: #424242; +`; + +const recommendButtonStyle = css` + width: 69px; + height: 29px; + margin-top: 12px; + background-color: #0056ca; + color: white; + border-radius: 6px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + font-size: 13px; + font-weight: 400; + margin: 8.5px 0px; +`; diff --git a/src/components/app/home/floating/FunctionHelp.tsx b/src/components/app/home/floating/FunctionHelp.tsx index 3edbbf3..9aa57fd 100644 --- a/src/components/app/home/floating/FunctionHelp.tsx +++ b/src/components/app/home/floating/FunctionHelp.tsx @@ -3,101 +3,55 @@ import { css } from "@emotion/react"; export default function FunctionHelp() { return (
-

- 현재 페이지에 있는 기능들을 알려드릴게요. -

-
-
- 시세차트 -
-
+

현재 페이지에 있는 기능들을 알려드릴게요.

+
+
시세차트
+
AI가 예측한 코인 가격과 실제 가격을 알려주는 시세 추이 차트로, 상단에서 종목을 바꿀 수 있어요. 마우스 휠(또는 터치)로 확대 및 축소하거나 상단의 태그를 눌러 날짜 영역을 바꿔보세요 :)
-
-
- 모델 적합도 -
-
+
+
모델 적합도
+
Flowbit AI 학습모델의 예측값이 실제 데이터 패턴을 얼마나 잘 설명하는지를 검증된 통계적 기법으로 평가한 지표에요. 지표가 높을수록 예측 정확도가 높아지기 때문에, 현재 지표 상으로는 예측가격이 실제가격과 매우 유사할 거에요 :)
-
-
- 뉴스룸 -
-
+
+
뉴스룸
+
매일 가상화폐 종목 별 주요뉴스를 선별해 제공하고 있어요.
); } + +const titleStyle = css` + font-size: 18px; + font-weight: 600; + line-height: 1.4; +`; + +const helpContainerStyle = css` + background-color: var(--blue-5); + padding: 16px; + border-radius: 8px; + margin-bottom: 12px; +`; + +const helpHeaderStyle = css` + font-weight: 600; + font-size: 16px; + margin-bottom: 8px; +`; + +const helpContentStyle = css` + font-size: 14px; + line-height: 1.5; + color: var(--gray-80); +`; From 6d768db31d9e4f676304166a1ed6b7fca667f77d Mon Sep 17 00:00:00 2001 From: Cllaude99 Date: Tue, 3 Jun 2025 22:06:45 +0900 Subject: [PATCH 6/6] =?UTF-8?q?chore:=20staleTime=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - staleTime을 0으로 수정 - 스프레드 연산자 수정 --- src/hooks/api/floating/useBitCoinAnalysisQuery.ts | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/src/hooks/api/floating/useBitCoinAnalysisQuery.ts b/src/hooks/api/floating/useBitCoinAnalysisQuery.ts index 01a1dca..d9bbf9d 100644 --- a/src/hooks/api/floating/useBitCoinAnalysisQuery.ts +++ b/src/hooks/api/floating/useBitCoinAnalysisQuery.ts @@ -9,12 +9,9 @@ export const useBitCoinAnalysisQuery = () => { return response.data; }; - return { - ...useQuery({ - queryKey: ["bitCoinAnalysis"], - queryFn: () => getBitCoinAnalysis(), - staleTime: 60000 * 60 * 2, // 2시간 - gcTime: 60000 * 60 * 2, // 2시간 - }), - }; + return useQuery({ + queryKey: ["bitCoinAnalysis"], + queryFn: () => getBitCoinAnalysis(), + gcTime: 60000 * 60 * 2, // 2시간 + }); };