Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[FEAT] 대시보드 뷰 테스크 버튼 더블클릭 시 모달 노출 막기 #162

Merged
merged 6 commits into from
Jul 17, 2024
Merged

[FEAT] 대시보드 뷰 테스크 버튼 더블클릭 시 모달 노출 막기 #162

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
354238e
feat: 더블클릭 시 모달 노출 막기
jeeminyi Jul 16, 2024
1a92064
fix: preventDefault으로 모달 동작 막기
jeeminyi Jul 17, 2024
6aa1fa4
chore: 주석 제거
jeeminyi Jul 17, 2024
9c9ff13
Merge branch 'develop' into feat/#161/handle_modal
jeeminyi Jul 17, 2024
b8cdef0
fix: prop 위치 수정
jeeminyi Jul 17, 2024
a9882ce
fix: 다른 페이지에서 모달 나타나게 설정
jeeminyi Jul 17, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,4 +23,5 @@ dist-ssr
*.sln
*.sw?

*storybook.log
*storybook.log
.env
1 change: 1 addition & 0 deletions src/components/DashboardPage/DashboardTask.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,7 @@ function DashboardTask({ text }: DashboardTaskProps) {
status={task.status}
deadLine={task.deadLine}
btnType="target"
preventDoubleClick // 더블클릭 막기
/>
))}
<ScrollGradient />
Expand Down
8 changes: 7 additions & 1 deletion src/components/common/BtnTask/BtnTask.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ import { TaskType } from '@/types/tasks/taskType';

interface BtnTaskProps extends TaskType {
btnType: 'staging' | 'target' | 'delayed';
// onDoubleClick?: (e: React.MouseEvent) => void;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이 함수가 기존에 더블클릭을 막고자 사용했다가 preventDoubleClick의 boolean값으로 처리하게 변경한 것으로 보여서 혹시 해당 코드가 필요하지 않다면 주석을 지워도 좋을 것 같습니다! 해당 코드의 주석을 남겨두신 이유가 있으실까요?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

으앙 확인하지 못했어요ㅣ,, 지울게욥 ㅜ! 꼼꼼하게 봐주셔서 감사합니닷

preventDoubleClick: boolean;
}

interface BorderColorProps {
Expand All @@ -23,7 +25,7 @@ interface BorderColorProps {
}

function BtnTask(props: BtnTaskProps) {
const { btnType, name, deadLine, hasDescription, status } = props;
const { btnType, name, deadLine, hasDescription, status, preventDoubleClick } = props;
const [isModalOpen, setModalOpen] = useState(false);
const [isClicked, setIsClicked] = useState(false);
const [isHovered, setIsHovered] = useState(false);
Expand All @@ -41,6 +43,10 @@ function BtnTask(props: BtnTaskProps) {

/** 모달 띄우기 */
const handleDoubleClick = (e: React.MouseEvent) => {
if (preventDoubleClick) {
e.preventDefault();
return;
}
const rect = e.currentTarget.getBoundingClientRect();
const calculatedTop = rect.top;
const adjustedTop = Math.min(calculatedTop, MODAL.SCREEN_HEIGHT - MODAL.TASK_MODAL_HEIGHT);
Expand Down