From 6998ffd6a3ff83c74fa4479ff49b5de1ca91f7d6 Mon Sep 17 00:00:00 2001 From: tolelom <98kimsungmin@naver.com> Date: Tue, 24 Feb 2026 20:55:27 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20=EA=B2=8C=EC=9E=84=20=EC=8B=9C=EC=9E=91?= =?UTF-8?q?=20=EB=B2=84=ED=8A=BC=20=EC=B6=94=EA=B0=80=20=EB=B0=8F=20AuthCo?= =?UTF-8?q?ntext=20=EB=A6=B0=ED=8A=B8=20=EC=97=90=EB=9F=AC=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - DownloadSection에 a301:// 커스텀 URI로 게임 실행하는 버튼 추가 - AuthContext에서 createContext와 useAuth 훅을 별도 파일로 분리하여 react-refresh 린트 에러 해결 Co-Authored-By: Claude Opus 4.6 --- src/App.jsx | 3 ++- src/components/DownloadSection.css | 27 +++++++++++++++++++++++++++ src/components/DownloadSection.jsx | 16 +++++++++++++++- src/context/AuthContext.jsx | 10 ++-------- src/context/authContextValue.js | 3 +++ src/context/useAuth.js | 8 ++++++++ src/pages/AdminPage.jsx | 2 +- src/pages/HomePage.jsx | 2 +- src/pages/LoginPage.jsx | 2 +- 9 files changed, 60 insertions(+), 13 deletions(-) create mode 100644 src/context/authContextValue.js create mode 100644 src/context/useAuth.js diff --git a/src/App.jsx b/src/App.jsx index dafa0ce..1a47a60 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,6 +1,7 @@ import { BrowserRouter, Routes, Route, Navigate, useNavigate, useLocation } from 'react-router-dom'; import { useEffect, useRef } from 'react'; -import { AuthProvider, useAuth } from './context/AuthContext'; +import { AuthProvider } from './context/AuthContext'; +import { useAuth } from './context/useAuth'; import LoginPage from './pages/LoginPage'; import RegisterPage from './pages/RegisterPage'; import HomePage from './pages/HomePage'; diff --git a/src/components/DownloadSection.css b/src/components/DownloadSection.css index 11bcef2..a45265d 100644 --- a/src/components/DownloadSection.css +++ b/src/components/DownloadSection.css @@ -39,6 +39,33 @@ transform: translateY(-1px); } +.btn-launch { + display: inline-block; + padding: 16px 48px; + background: transparent; + color: #BACDB0; + border: 2px solid #BACDB0; + border-radius: 8px; + font-size: 1.1rem; + font-weight: 700; + cursor: pointer; + transition: background 0.2s, color 0.2s, transform 0.15s; + letter-spacing: 0.05em; + margin-left: 16px; +} + +.btn-launch:hover { + background: #BACDB0; + color: #2E2C2F; + transform: translateY(-1px); +} + +.launch-hint { + font-size: 0.78rem; + color: rgba(255, 255, 255, 0.3); + margin: 16px 0 0; +} + .download-preparing { font-size: 0.9rem; color: rgba(255, 255, 255, 0.4); diff --git a/src/components/DownloadSection.jsx b/src/components/DownloadSection.jsx index e918b29..f287d38 100644 --- a/src/components/DownloadSection.jsx +++ b/src/components/DownloadSection.jsx @@ -1,6 +1,6 @@ import { useState, useEffect } from 'react'; import { useNavigate } from 'react-router-dom'; -import { useAuth } from '../context/AuthContext'; +import { useAuth } from '../context/useAuth'; import { getDownloadInfo } from '../api/download'; import './DownloadSection.css'; @@ -23,6 +23,14 @@ export default function DownloadSection() { } }; + const handleLaunch = () => { + if (!user) { + navigate('/login'); + return; + } + window.location.href = 'a301://launch?token=' + user.token; + }; + if (!ready) return null; return ( @@ -37,6 +45,12 @@ export default function DownloadSection() { {user ? '다운로드' : '로그인 후 다운로드'} + +

+ 게임 시작이 안 되나요? 먼저 다운로드 후 launcher.exe install을 실행해주세요. +

) : (

런처 준비 중입니다. 잠시 후 다시 확인해주세요.

diff --git a/src/context/AuthContext.jsx b/src/context/AuthContext.jsx index 867ccfd..58d91ce 100644 --- a/src/context/AuthContext.jsx +++ b/src/context/AuthContext.jsx @@ -1,7 +1,6 @@ -import { createContext, useContext, useState, useCallback, useEffect } from 'react'; +import { useState, useCallback, useEffect } from 'react'; import { login as apiLogin } from '../api/auth'; - -const AuthContext = createContext(null); +import { AuthContext } from './authContextValue'; export function AuthProvider({ children }) { const [user, setUser] = useState(() => { @@ -38,8 +37,3 @@ export function AuthProvider({ children }) { ); } -export function useAuth() { - const ctx = useContext(AuthContext); - if (!ctx) throw new Error('useAuth must be used within AuthProvider'); - return ctx; -} diff --git a/src/context/authContextValue.js b/src/context/authContextValue.js new file mode 100644 index 0000000..a3e3c7d --- /dev/null +++ b/src/context/authContextValue.js @@ -0,0 +1,3 @@ +import { createContext } from 'react'; + +export const AuthContext = createContext(null); diff --git a/src/context/useAuth.js b/src/context/useAuth.js new file mode 100644 index 0000000..8da97ea --- /dev/null +++ b/src/context/useAuth.js @@ -0,0 +1,8 @@ +import { useContext } from 'react'; +import { AuthContext } from './authContextValue'; + +export function useAuth() { + const ctx = useContext(AuthContext); + if (!ctx) throw new Error('useAuth must be used within AuthProvider'); + return ctx; +} diff --git a/src/pages/AdminPage.jsx b/src/pages/AdminPage.jsx index 1a2de3b..fec1ebb 100644 --- a/src/pages/AdminPage.jsx +++ b/src/pages/AdminPage.jsx @@ -1,6 +1,6 @@ import { useState } from 'react'; import { Link } from 'react-router-dom'; -import { useAuth } from '../context/AuthContext'; +import { useAuth } from '../context/useAuth'; import AnnouncementAdmin from '../components/admin/AnnouncementAdmin'; import DownloadAdmin from '../components/admin/DownloadAdmin'; import UserAdmin from '../components/admin/UserAdmin'; diff --git a/src/pages/HomePage.jsx b/src/pages/HomePage.jsx index 7716f2b..6dd0b57 100644 --- a/src/pages/HomePage.jsx +++ b/src/pages/HomePage.jsx @@ -1,5 +1,5 @@ import { Link } from 'react-router-dom'; -import { useAuth } from '../context/AuthContext'; +import { useAuth } from '../context/useAuth'; import DownloadSection from '../components/DownloadSection'; import AnnouncementBoard from '../components/AnnouncementBoard'; import './HomePage.css'; diff --git a/src/pages/LoginPage.jsx b/src/pages/LoginPage.jsx index 0bf5d95..2c920cd 100644 --- a/src/pages/LoginPage.jsx +++ b/src/pages/LoginPage.jsx @@ -1,6 +1,6 @@ import { useState } from 'react'; import { useNavigate, Link, useLocation } from 'react-router-dom'; -import { useAuth } from '../context/AuthContext'; +import { useAuth } from '../context/useAuth'; import './LoginPage.css'; export default function LoginPage() {