-
- 관리
-
-
+
+
+
누적 수익률
+
{data.cumulativeProfitRate.toFixed(2)}%
+
최근 1년 수익률
+
+ {data.recentYearProfitLossRate ? data.recentYearProfitLossRate.toFixed(2) + '%' : '-'}
+
+
+ {type === 'default' && (
+
+
- >
- )}
-
+ )}
+ {type === 'my' && (
+ <>
+
+
{data.isPublic === 'PUBLIC' ? '공개' : '비공개'}
+
+
+
+ 관리
+
+
+
+ >
+ )}
+
+
+ >
)
}
diff --git a/app/(dashboard)/_ui/strategies-item/styles.module.scss b/app/(dashboard)/_ui/strategies-item/styles.module.scss
index 072d1e6a..6f871b2d 100644
--- a/app/(dashboard)/_ui/strategies-item/styles.module.scss
+++ b/app/(dashboard)/_ui/strategies-item/styles.module.scss
@@ -52,6 +52,8 @@
.title {
@include typo-h4;
@include ellipsis(1);
+ display: flex;
+ justify-content: flex-start;
}
.trader-profile {
display: flex;
diff --git a/app/(dashboard)/_ui/strategies-item/subscribe.tsx b/app/(dashboard)/_ui/strategies-item/subscribe.tsx
index d4ca9162..8e9d7a78 100644
--- a/app/(dashboard)/_ui/strategies-item/subscribe.tsx
+++ b/app/(dashboard)/_ui/strategies-item/subscribe.tsx
@@ -2,15 +2,11 @@
import { useEffect, useState } from 'react'
-import { useRouter } from 'next/navigation'
-
import { BookmarkIcon, BookmarkOutlineIcon } from '@/public/icons'
import classNames from 'classnames/bind'
-import { PATH } from '@/shared/constants/path'
import useModal from '@/shared/hooks/custom/use-modal'
import { useAuthStore } from '@/shared/stores/use-auth-store'
-import SigninCheckModal from '@/shared/ui/modal/signin-check-modal'
import SubscribeWarningModal from '@/shared/ui/modal/subscribe-warning-modal'
import useGetSubscribe from '../../strategies/_hooks/query/use-get-subscribe'
@@ -26,18 +22,8 @@ interface Props {
const Subscribe = ({ strategyId, subscriptionStatus, traderName }: Props) => {
const [isSubscribed, setIsSubscribed] = useState(false)
- const router = useRouter()
const user = useAuthStore((state) => state.user)
- const {
- isModalOpen: isSigninCheckModalOpen,
- openModal: openSigninCheckModal,
- closeModal: closeSigninCheckModal,
- } = useModal()
- const {
- isModalOpen: isSubscribeWarningModal,
- openModal: openSubscribeWarningModal,
- closeModal: closeSubscribeWarningModal,
- } = useModal()
+ const { isModalOpen, openModal, closeModal } = useModal()
const { mutate } = useGetSubscribe()
useEffect(() => {
@@ -47,37 +33,27 @@ const Subscribe = ({ strategyId, subscriptionStatus, traderName }: Props) => {
}, [subscriptionStatus])
const handleSubscribe = (e: React.MouseEvent) => {
- e.preventDefault()
- if (!user) {
- openSigninCheckModal()
- } else if (user?.nickname === traderName) {
- openSubscribeWarningModal()
- } else {
- mutate(strategyId, {
- onSuccess: () => setIsSubscribed(!isSubscribed),
- })
+ if (user) {
+ e.stopPropagation()
+ if (user?.nickname === traderName) {
+ openModal()
+ } else {
+ e.preventDefault()
+ mutate(strategyId, {
+ onSuccess: () => setIsSubscribed(!isSubscribed),
+ })
+ }
}
}
- const handleRoute = () => router.push(PATH.SIGN_IN)
-
return (
<>
-
-
-
-
+
>
)
}
diff --git a/shared/hooks/custom/use-modal.ts b/shared/hooks/custom/use-modal.ts
index 20c0047d..bbfa2112 100644
--- a/shared/hooks/custom/use-modal.ts
+++ b/shared/hooks/custom/use-modal.ts
@@ -6,9 +6,10 @@ const useModal = () => {
const [isModalOpen, setIsModalOpen] = useState(false)
const openModal = () => setIsModalOpen(true)
+
const closeModal = (e?: React.MouseEvent) => {
if (e) {
- e.preventDefault()
+ e.stopPropagation()
}
setIsModalOpen(false)
}
diff --git a/shared/ui/modal/account-image-modal.tsx b/shared/ui/modal/account-image-modal.tsx
index a38aaa60..723a1a23 100644
--- a/shared/ui/modal/account-image-modal.tsx
+++ b/shared/ui/modal/account-image-modal.tsx
@@ -17,7 +17,7 @@ interface Props {
const AccountImageModal = ({ isOpen, title, url, onClose }: Props) => {
return (
-
+
diff --git a/shared/ui/modal/signin-check-modal.tsx b/shared/ui/modal/signin-check-modal.tsx
index d9942a84..dc1c0294 100644
--- a/shared/ui/modal/signin-check-modal.tsx
+++ b/shared/ui/modal/signin-check-modal.tsx
@@ -2,9 +2,13 @@
import React from 'react'
+import { useRouter } from 'next/navigation'
+
import { ModalAlertIcon } from '@/public/icons'
import classNames from 'classnames/bind'
+import { PATH } from '@/shared/constants/path'
+
import Modal from '.'
import { Button } from '../button'
import styles from './styles.module.scss'
@@ -14,10 +18,15 @@ const cx = classNames.bind(styles)
interface Props {
isModalOpen: boolean
onCloseModal: () => void
- onChange?: () => void
}
-const SigninCheckModal = ({ isModalOpen, onCloseModal, onChange }: Props) => {
+const SigninCheckModal = ({ isModalOpen, onCloseModal }: Props) => {
+ const router = useRouter()
+
+ const handleRouter = () => {
+ router.push(PATH.SIGN_IN)
+ }
+
return (
@@ -25,7 +34,7 @@ const SigninCheckModal = ({ isModalOpen, onCloseModal, onChange }: Props) => {
아니오
-
+
예
diff --git a/shared/ui/modal/styles.module.scss b/shared/ui/modal/styles.module.scss
index 0311d986..dcda2eb6 100644
--- a/shared/ui/modal/styles.module.scss
+++ b/shared/ui/modal/styles.module.scss
@@ -34,7 +34,7 @@
}
}
}
- &.account {
+ &.medium {
width: 600px;
}
&.big {