Skip to content

[QA] 데일리 챌린지 #451

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

Merged
JWMin556 merged 9 commits into from
Oct 14, 2025
Merged

[QA] 데일리 챌린지 #451

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
eb1306c
fix: 문의하기 - 정규스터디원 아니어도 문의 글쓰기 가능하도록 변경 #445
JWMin556 Oct 12, 2025
483f93b
fix: 푸터 - Copyright → 현재 년도로 변환 #445
JWMin556 Oct 12, 2025
3f22d3b
fix: 종료된 스터디에서는 보상 사용 버튼 미노출 구현 #445
JWMin556 Oct 14, 2025
0c6f338
chore: 주석, 로직 정리
nunomi0 Oct 14, 2025
d46e12e
Merge pull request #447 from ProjectX-Algoitzy/release/1.6-jw
begojara99 Oct 14, 2025
1fd3fa8
fix: disable 관련 로직 변경
nunomi0 Oct 14, 2025
173edd7
Merge pull request #449 from ProjectX-Algoitzy/release/1.6-yk
begojara99 Oct 14, 2025
ffe56a2
[QA] 데일리 챌린지 - 마이페이지 QA #444
begojara99 Oct 14, 2025
e0a8071
Merge pull request #450 from ProjectX-Algoitzy/release/1.6-ch
JWMin556 Oct 14, 2025
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
57 changes: 48 additions & 9 deletions src/APP/components/Footer/Footer.footer.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,62 @@
import React from 'react'
import * as itemS from "./Styled/Footer.footer.styles"
import React from 'react';
import * as itemS from './Styled/Footer.footer.styles';

export default function footer() {
const currentYear = new Date().getFullYear();
return (
<itemS.FooterContainer>
<itemS.InnerContainer>
<itemS.FooterLeftWrap>
<div style={{display:"flex", flexDirection:"row", alignItems:"center"}}>
<itemS.Sentence1>KOALA</itemS.Sentence1><itemS.Sentence2>(한국항공대학교 알고리즘 학회)</itemS.Sentence2>
<div
style={{
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
}}
>
<itemS.Sentence1>KOALA</itemS.Sentence1>
<itemS.Sentence2>(한국항공대학교 알고리즘 학회)</itemS.Sentence2>
</div>
<itemS.Sentence3>문의처 : [email protected] |<itemS.NoteLink href='https://kimdoohyeon.notion.site/Koala-11167ca5ea7a803da0dcd4b6a7caa303' target='_blank'>업데이트 노트 <img src="/img/link.png" alt="링크" style={{width:"0.792rem", height:"0.792rem"}} /></itemS.NoteLink></itemS.Sentence3>
<itemS.Sentence3 style={{marginTop:"24px"}}>Copyrightⓒ2024.KOALA. All rights reserved.</itemS.Sentence3>
<itemS.Sentence3>
문의처 : [email protected] |
<itemS.NoteLink
href="https://kimdoohyeon.notion.site/Koala-11167ca5ea7a803da0dcd4b6a7caa303"
target="_blank"
>
업데이트 노트{' '}
<img
src="/img/link.png"
alt="링크"
style={{ width: '0.792rem', height: '0.792rem' }}
/>
</itemS.NoteLink>
</itemS.Sentence3>
<itemS.Sentence3 style={{ marginTop: '24px' }}>
Copyrightⓒ{currentYear}.KOALA. All rights reserved.
</itemS.Sentence3>
</itemS.FooterLeftWrap>

<itemS.FooterRightWrap>
<a href="https://github.com/kauKoala" target='_blank' rel='noopener noreferrer'><itemS.Icon src='/img/icongithub.png' alt='깃허브 아이콘' /></a>
<a href="https://kau-algorithm.tistory.com/" target='_blank' rel='noopener noreferrer'><itemS.Icon src='/img/iconblog.png' alt='블로그 아이콘' style={{marginLeft:"16px"}} /></a>
<a
href="https://github.com/kauKoala"
target="_blank"
rel="noopener noreferrer"
>
<itemS.Icon src="/img/icongithub.png" alt="깃허브 아이콘" />
</a>
<a
href="https://kau-algorithm.tistory.com/"
target="_blank"
rel="noopener noreferrer"
>
<itemS.Icon
src="/img/iconblog.png"
alt="블로그 아이콘"
style={{ marginLeft: '16px' }}
/>
</a>
</itemS.FooterRightWrap>
</itemS.InnerContainer>
</itemS.FooterContainer>
)
);
}
103 changes: 64 additions & 39 deletions src/APP/components/Header/Header.header.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,25 +1,25 @@
import React, { useEffect, useRef, useState } from 'react';
import React, { useEffect, useRef, useState } from "react";
import * as itemS from "./Styled/Header.header.styles";
import request from '../../Api/request';
import ProfileModal from './Header.profile.modal';
import request from "../../Api/request";
import ProfileModal from "./Header.profile.modal";

export default function Header({ dark }) {
const [isLoggedIn, setIsLoggedIn] = useState(false);
const [userName, setUserName] = useState('');
const [profileUrl, setProfileUrl] = useState('');
const [userName, setUserName] = useState("");
const [profileUrl, setProfileUrl] = useState("");
const [showProfileModal, setShowProfileModal] = useState(false);
const [activeMenu, setActiveMenu] = useState('');
const [activeMenu, setActiveMenu] = useState("");

// Refs for detecting clicks outside
const modalRef = useRef(null);
const modalRef = useRef(null);
const studyMenuRef = useRef(null);
const codingMenuRef = useRef(null);

// Fetch login status on component mount
const checkLoginStatus = async () => {
try {
const response = await request.get('/member/info');
console.log("로그인 멤버 정보 조회", response);
const response = await request.get("/member/info");
// console.log("로그인 멤버 정보 조회", response);
if (response["isSuccess"]) {
setUserName(response.result.name);
setProfileUrl(response.result.profileUrl);
Expand All @@ -30,56 +30,58 @@ export default function Header({ dark }) {
}
};
useEffect(() => {

const accessToken = localStorage.getItem('accessToken');
const accessToken = localStorage.getItem("accessToken");
if (accessToken) {
checkLoginStatus();
}
}, []);

// Toggle Profile Modal
const toggleProfileModal = () => {
setShowProfileModal(prev => !prev);
setActiveMenu('');
setShowProfileModal((prev) => !prev);
setActiveMenu("");
};

// Handle Menu Clicks
const handleMenuClick = (menu) => {
setActiveMenu((prev) => (prev === menu ? '' : menu));
setActiveMenu((prev) => (prev === menu ? "" : menu));
};

// Handle Navigation and Close Menus
const handleNav = () => {
setActiveMenu('');
setActiveMenu("");
};

// Click Outside Handler
useEffect(() => {
const handleClickOutside = (event) => {
// Check if click is inside Profile Modal
const clickedInsideProfile = modalRef.current && modalRef.current.contains(event.target);
const clickedInsideProfile =
modalRef.current && modalRef.current.contains(event.target);

// Check if click is inside any open submenu
let clickedInsideMenu = false;
if (activeMenu === 'study') {
clickedInsideMenu = studyMenuRef.current && studyMenuRef.current.contains(event.target);
} else if (activeMenu === 'coding') {
clickedInsideMenu = codingMenuRef.current && codingMenuRef.current.contains(event.target);
if (activeMenu === "study") {
clickedInsideMenu =
studyMenuRef.current && studyMenuRef.current.contains(event.target);
} else if (activeMenu === "coding") {
clickedInsideMenu =
codingMenuRef.current && codingMenuRef.current.contains(event.target);
}

// If click is outside both Profile Modal and any open submenu, close them
if (!clickedInsideProfile && !clickedInsideMenu) {
setShowProfileModal(false);
setActiveMenu('');
setActiveMenu("");
}
};

// Attach the event listener
document.addEventListener('mousedown', handleClickOutside);
document.addEventListener("mousedown", handleClickOutside);

// Cleanup the event listener on component unmount
return () => {
document.removeEventListener('mousedown', handleClickOutside);
document.removeEventListener("mousedown", handleClickOutside);
};
}, [showProfileModal, activeMenu]);

Expand All @@ -88,23 +90,38 @@ export default function Header({ dark }) {
<itemS.InnerContainer $dark={dark}>
<itemS.HeaderWrap>
<itemS.HeaderLeftWrap>
<itemS.StyledLink to="/" style={{ textDecoration: 'none' }}>
<itemS.Rabel src={dark ? '/img/koalalogo_dark.png':'/img/koalalogo.png'} alt='코알라로고' />
<itemS.StyledLink to="/" style={{ textDecoration: "none" }}>
<itemS.Rabel
src={dark ? "/img/koalalogo_dark.png" : "/img/koalalogo.png"}
alt="코알라로고"
/>
</itemS.StyledLink>
</itemS.HeaderLeftWrap>
<itemS.HeaderRightWrap>
<itemS.StyledLink to={isLoggedIn ? "/mystudy" : "/login"}>
<itemS.PageLink>나의 스터디</itemS.PageLink>
</itemS.StyledLink>
<itemS.StyledLink onClick={() => handleMenuClick('study')}>
<itemS.StyledLink onClick={() => handleMenuClick("study")}>
<itemS.PageLink>스터디</itemS.PageLink>
{activeMenu === 'study' && (
{activeMenu === "study" && (
<itemS.SubMenuContaier ref={studyMenuRef}>
<itemS.SubMenu isLoggedIn={isLoggedIn}>
<itemS.StyledLink to={isLoggedIn ? "/apply" : "/login"} onClick={(e) => {e.stopPropagation(); handleNav();}}>
<itemS.StyledLink
to={isLoggedIn ? "/apply" : "/login"}
onClick={(e) => {
e.stopPropagation();
handleNav();
}}
>
<itemS.SubMenuItem>정규 스터디</itemS.SubMenuItem>
</itemS.StyledLink>
<itemS.StyledLink to={isLoggedIn ? "/study" : "/login"} onClick={(e) => {e.stopPropagation(); handleNav();}}>
<itemS.StyledLink
to={isLoggedIn ? "/study" : "/login"}
onClick={(e) => {
e.stopPropagation();
handleNav();
}}
>
<itemS.SubMenuItem>자율 스터디</itemS.SubMenuItem>
</itemS.StyledLink>
</itemS.SubMenu>
Expand All @@ -114,29 +131,37 @@ export default function Header({ dark }) {
<itemS.StyledLink to={"/community"}>
<itemS.PageLink>커뮤니티</itemS.PageLink>
</itemS.StyledLink>
<itemS.StyledLink onClick={() => handleMenuClick('coding')}>
<itemS.StyledLink onClick={() => handleMenuClick("coding")}>
<itemS.PageLink>코딩테스트 분석</itemS.PageLink>
{activeMenu === 'coding' && (
{activeMenu === "coding" && (
<itemS.SubMenuContaier ref={codingMenuRef}>
<itemS.SubMenu isLoggedIn={isLoggedIn}>
<itemS.StyledLink to={isLoggedIn ? "/enterbootlist" : "/login"} onClick={(e) => {e.stopPropagation(); handleNav();}}>
<itemS.SubMenuItem style={{marginBottom:"2.5rem"}}>기업/부트캠프</itemS.SubMenuItem>
<itemS.StyledLink
to={isLoggedIn ? "/enterbootlist" : "/login"}
onClick={(e) => {
e.stopPropagation();
handleNav();
}}
>
<itemS.SubMenuItem style={{ marginBottom: "2.5rem" }}>
기업/부트캠프
</itemS.SubMenuItem>
</itemS.StyledLink>
</itemS.SubMenu>
</itemS.SubMenuContaier>
)}
</itemS.StyledLink>
{isLoggedIn ? (
<div style={{ position: 'relative' }} ref={modalRef}>
<div style={{ position: "relative" }} ref={modalRef}>
<itemS.ProfileBox onClick={toggleProfileModal}>
<itemS.AdminName>안녕하세요, {userName} 님</itemS.AdminName>
<itemS.Arrow src='/img/arrow-bt.svg' alt='화살표' />
<itemS.Arrow src="/img/arrow-bt.svg" alt="화살표" />
</itemS.ProfileBox>
{showProfileModal && (
<ProfileModal
userName={userName}
profileUrl={profileUrl}
setIsLoggedIn={setIsLoggedIn}
<ProfileModal
userName={userName}
profileUrl={profileUrl}
setIsLoggedIn={setIsLoggedIn}
setShowProfileModal={setShowProfileModal}
/>
)}
Expand Down
Loading
Loading