From d0aef965d6309a4d0ea6cc6649d67a8b7bbeb8f7 Mon Sep 17 00:00:00 2001
From: hanseulhee <3021062@gmail.com>
Date: Mon, 8 Apr 2024 00:03:06 +0900
Subject: [PATCH] =?UTF-8?q?[#24]=20=EC=84=A0=ED=83=9D=ED=95=9C=20=ED=95=AD?=
=?UTF-8?q?=EB=AA=A9=20atom=20=EA=B4=80=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../indicators/_components/result/index.tsx | 19 ++++++++-----------
app/(route)/indicators/page.tsx | 1 -
.../ActiveInvestmentItem/index.tsx | 12 +++++++++++-
app/_store/atom.ts | 9 ++++++---
4 files changed, 25 insertions(+), 16 deletions(-)
diff --git a/app/(route)/indicators/_components/result/index.tsx b/app/(route)/indicators/_components/result/index.tsx
index 3352f8f..37d9688 100644
--- a/app/(route)/indicators/_components/result/index.tsx
+++ b/app/(route)/indicators/_components/result/index.tsx
@@ -1,13 +1,13 @@
import Nav from '@/app/_common/nav'
import Title from '@/app/_common/text/title'
-import { investmentItemAtom, totalinputValueAtom } from '@/app/_store/atom'
+import { selectedItemAtom, totalinputValueAtom } from '@/app/_store/atom'
import { useRecoilValue } from 'recoil'
import S from './result.module.css'
//* 결과페이지 입니다.
//TODO: 사용자가 클릭한 아이디어 이름과 해당 툴을 사용한 사용자 수가 보여집니다.
function Result() {
- const selectedItem = useRecoilValue(investmentItemAtom)
+ const selectedItem = useRecoilValue(selectedItemAtom)
const totalinputValue = parseInt(useRecoilValue(totalinputValueAtom))
return (
@@ -24,16 +24,13 @@ function Result() {
검증 지표
계산 결과지입니다.
-
전체 이용자 수 : {totalinputValue}
-
- {selectedItem.map((item) => (
-
- 선택한 아이템 이름: {item.name}
- 선택한 아이템 점수: {item.score}
- 최종 점수: {item.score && item.score * totalinputValue}
-
- ))}
+
선택한 아이템 이름: {selectedItem?.name}
+
선택한 아이템 점수: {selectedItem?.score}
+
+ 최종 점수:
+ {selectedItem?.score && selectedItem?.score * totalinputValue}
+
diff --git a/app/(route)/indicators/page.tsx b/app/(route)/indicators/page.tsx
index 0b15a40..de5d424 100644
--- a/app/(route)/indicators/page.tsx
+++ b/app/(route)/indicators/page.tsx
@@ -12,7 +12,6 @@ import FormS from './_components/form/form.module.css'
import S from './indicators.module.css'
//* 투자 지표 입력 페이지입니다.
-//TODO: title에 사용자가 입력했던 요소들이 보여지게 됩니다.
function Indicators() {
const router = useRouter()
const [inputValue, setInputValue] = useRecoilState(totalinputValueAtom)
diff --git a/app/(route)/verification/ibulsin/_components/ActiveInvestmentItem/index.tsx b/app/(route)/verification/ibulsin/_components/ActiveInvestmentItem/index.tsx
index 1b731f0..4de8a81 100644
--- a/app/(route)/verification/ibulsin/_components/ActiveInvestmentItem/index.tsx
+++ b/app/(route)/verification/ibulsin/_components/ActiveInvestmentItem/index.tsx
@@ -1,7 +1,11 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
'use client'
-import { ActiveInvestmentItemType, investmentItemAtom } from '@/app/_store/atom'
+import {
+ ActiveInvestmentItemType,
+ investmentItemAtom,
+ selectedItemAtom,
+} from '@/app/_store/atom'
import cn from 'classnames'
import { ChangeEvent, useState } from 'react'
import { useRecoilState } from 'recoil'
@@ -22,6 +26,7 @@ function ActiveInvestmentItem({
onSelect,
}: ActiveInvestmentItemProps) {
const [investmentItem, setInvestmentItem] = useRecoilState(investmentItemAtom)
+ const [, setSelectedItem] = useRecoilState(selectedItemAtom)
const [itemName, setItemName] = useState(item?.name ?? '')
const [itemScore, setItemScore] = useState(
item?.score ?? undefined,
@@ -34,6 +39,11 @@ function ActiveInvestmentItem({
const selectedInvestmentItem = investmentItem[index]
setItemName(selectedInvestmentItem.name)
setItemScore(selectedInvestmentItem?.score ?? undefined)
+
+ setSelectedItem({
+ name: selectedInvestmentItem.name,
+ score: selectedInvestmentItem.score,
+ })
}
const handleDeleteItem = () => {
diff --git a/app/_store/atom.ts b/app/_store/atom.ts
index a7664b0..06ea507 100644
--- a/app/_store/atom.ts
+++ b/app/_store/atom.ts
@@ -1,14 +1,17 @@
import { atom } from 'recoil'
export interface ActiveInvestmentItemType {
- id: string
+ id?: string
name: string
score: number | null
}
// type ActiveType = Omit
-// 시온 그는 신이야...
-// 고오급 타입 스크립트,,,
+
+export const selectedItemAtom = atom({
+ key: 'selectedItemAtom',
+ default: null,
+})
export const totalinputValueAtom = atom({
key: 'totalinputValueAtom',