Skip to content

Commit 8f3ec31

Browse files
seungw0oseungw0o
committed
fix : 로직 수정
1 parent d4e57f9 commit 8f3ec31

File tree

4 files changed

+108
-77
lines changed

4 files changed

+108
-77
lines changed

‎src/App.tsx‎

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import React from 'react';
1+
import React, { useEffect } from 'react';
22
import { Router } from './Router';
33
import { StyledProvider } from '@team-aliens/design-system';
44
import { setCookie } from './utils/cookies';
55

6-
window.setAuthToken = (accessToken, refreshToken) => {
6+
// ✅ window에 함수 등록
7+
window.setAuthToken = (accessToken: string, refreshToken: string) => {
78
const expires = new Date();
89
expires.setDate(expires.getDate() + 7);
910

@@ -19,10 +20,20 @@ window.setAuthToken = (accessToken, refreshToken) => {
1920
expires,
2021
});
2122
}
23+
24+
// ✅ 페이지 새로고침
2225
window.location.reload();
26+
return 'SUCCESS';
2327
};
2428

2529
function App() {
30+
useEffect(() => {
31+
// ✅ 네이티브(Android 웹뷰)에게 함수 등록 완료됐다고 알려주기
32+
if (window.ReactNativeWebView?.postMessage) {
33+
window.ReactNativeWebView.postMessage('setAuthTokenReady');
34+
}
35+
}, []);
36+
2637
return (
2738
<StyledProvider>
2839
<Router />

‎src/global.d.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,8 @@ export {};
33
declare global {
44
interface Window {
55
setAuthToken: (accessToken: string, refreshToken: string) => void;
6+
ReactNativeWebView?: {
7+
postMessage: (message: string) => void;
8+
};
69
}
7-
}
10+
}

‎src/pages/Volunteer/Application.tsx‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,15 @@ import { VolunteerHeader } from '../../components/Volunteer/Header';
44
import { useEffect, useState } from 'react';
55
import { getVolunteer } from '../../apis/volunteers';
66
import { useLocation } from 'react-router-dom';
7+
import axios from 'axios';
78

89
enum THEME {
910
'LIGHT' = 'LIGHT',
1011
'DARK' = 'DARK',
1112
}
1213

1314
export const VolunteerApplication = () => {
15+
console.log('BASE_URL 확인용:', process.env.REACT_APP_BASE_URL);
1416
const location = useLocation();
1517
const initTheme = new URLSearchParams(location.search);
1618
const [userTheme] = useState<THEME>(
@@ -24,7 +26,13 @@ export const VolunteerApplication = () => {
2426
setApplications(response?.volunteers || []);
2527
})
2628
.catch((error) => {
27-
console.error('봉사 데이터를 가져오는 중 오류가 발생했습니다: ', error);
29+
if (axios.isAxiosError(error)) {
30+
console.error('에러 메시지:', error.message);
31+
console.error('응답 데이터:', error.response?.data);
32+
console.error('상태 코드:', error.response?.status);
33+
} else {
34+
console.error('알 수 없는 에러:', error);
35+
}
2836
});
2937
}, []);
3038

‎src/pages/Volunteer/History.tsx‎

Lines changed: 82 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -1,90 +1,99 @@
1-
import styled from "styled-components"
2-
import { VolunteerHeader } from "../../components/Volunteer/Header";
3-
import { ApplicationHistory } from "../../components/Volunteer/ApplicationHistory";
4-
import { useEffect, useState } from "react";
5-
import { Explain, Text } from "./Application";
6-
import { getMyVolunteers } from "../../apis/volunteers";
7-
import { useLocation } from "react-router-dom";
1+
import styled from 'styled-components';
2+
import { VolunteerHeader } from '../../components/Volunteer/Header';
3+
import { ApplicationHistory } from '../../components/Volunteer/ApplicationHistory';
4+
import { useEffect, useState } from 'react';
5+
import { Explain, Text } from './Application';
6+
import { getMyVolunteers } from '../../apis/volunteers';
7+
import { useLocation } from 'react-router-dom';
8+
import axios from 'axios';
89

910
enum THEME {
10-
'LIGHT' = 'LIGHT',
11-
'DARK' = 'DARK',
11+
'LIGHT' = 'LIGHT',
12+
'DARK' = 'DARK',
1213
}
1314

1415
export const VolunteerHistory = () => {
15-
const [histories, setHistories] = useState<any[]>([]);
16-
const location = useLocation();
17-
const initTheme = new URLSearchParams(location.search);
18-
const [userTheme] = useState<THEME>(
19-
initTheme.get('theme') === 'dark' ? THEME.DARK : THEME.LIGHT,
20-
)
16+
const [histories, setHistories] = useState<any[]>([]);
17+
const location = useLocation();
18+
const initTheme = new URLSearchParams(location.search);
19+
const [userTheme] = useState<THEME>(
20+
initTheme.get('theme') === 'dark' ? THEME.DARK : THEME.LIGHT,
21+
);
2122

22-
useEffect(() => {
23-
getMyVolunteers()
24-
.then(response => {
25-
setHistories(response.volunteer_applications || []);
26-
})
27-
.catch(error => {
28-
console.error('봉사 신청 내역을 가져오는 중 오류가 발생했습니다:' , error);
29-
})
30-
}, [])
23+
useEffect(() => {
24+
getMyVolunteers()
25+
.then((response) => {
26+
setHistories(response.volunteer_applications || []);
27+
})
28+
.catch((error) => {
29+
if (axios.isAxiosError(error)) {
30+
console.error('에러 메시지:', error.message);
31+
console.error('응답 데이터:', error.response?.data);
32+
console.error('상태 코드:', error.response?.status);
33+
} else {
34+
console.error('알 수 없는 에러:', error);
35+
}
36+
});
37+
}, []);
3138

32-
return (
33-
<Wrapper>
34-
<VolunteerHeader />
35-
<ContentWrapper Theme={userTheme}>
36-
{histories.length > 0 ? (
37-
<ContentContainer>
38-
{histories.map((history) => (
39-
<ApplicationHistory
40-
key={history.id}
41-
name={history.name}
42-
status={history.status}
43-
volunteerId={history.volunteer_id}
44-
/>
45-
))}
46-
</ContentContainer>
47-
) : (
48-
<TextWrapper>
49-
<Text Theme={userTheme}>신청 내역이 없습니다.</Text>
50-
<Explain Theme={userTheme}>신청 내역은 이곳에서 확인할 수 있어요.</Explain>
51-
</TextWrapper>
52-
)}
53-
</ContentWrapper>
54-
</Wrapper>
55-
)
56-
}
39+
return (
40+
<Wrapper>
41+
<VolunteerHeader />
42+
<ContentWrapper Theme={userTheme}>
43+
{histories.length > 0 ? (
44+
<ContentContainer>
45+
{histories.map((history) => (
46+
<ApplicationHistory
47+
key={history.id}
48+
name={history.name}
49+
status={history.status}
50+
volunteerId={history.volunteer_id}
51+
/>
52+
))}
53+
</ContentContainer>
54+
) : (
55+
<TextWrapper>
56+
<Text Theme={userTheme}>신청 내역이 없습니다.</Text>
57+
<Explain Theme={userTheme}>
58+
신청 내역은 이곳에서 확인할 수 있어요.
59+
</Explain>
60+
</TextWrapper>
61+
)}
62+
</ContentWrapper>
63+
</Wrapper>
64+
);
65+
};
5766

5867
const Wrapper = styled.div`
59-
width: 100vw;
60-
display: flex;
61-
flex-direction: column;
62-
align-items: center;
63-
68+
width: 100vw;
69+
display: flex;
70+
flex-direction: column;
71+
align-items: center;
6472
`;
6573

66-
const ContentWrapper = styled.div<{Theme: THEME}>`
67-
width: 100%;
68-
min-height: 100vh;
69-
background-color: ${({Theme}) => Theme === THEME.LIGHT ? '#F2F2F7' : '#242424'};
74+
const ContentWrapper = styled.div<{ Theme: THEME }>`
75+
width: 100%;
76+
min-height: 100vh;
77+
background-color: ${({ Theme }) =>
78+
Theme === THEME.LIGHT ? '#F2F2F7' : '#242424'};
7079
`;
7180

7281
const ContentContainer = styled.div`
73-
margin-top: 119px;
74-
gap: 12px;
75-
display: flex;
76-
flex-direction: column;
77-
align-items: center;
78-
margin-bottom: 24px;
79-
padding-left: 20px;
80-
padding-right: 20px;
81-
width: 100%;
82+
margin-top: 119px;
83+
gap: 12px;
84+
display: flex;
85+
flex-direction: column;
86+
align-items: center;
87+
margin-bottom: 24px;
88+
padding-left: 20px;
89+
padding-right: 20px;
90+
width: 100%;
8291
`;
8392

8493
const TextWrapper = styled.div`
85-
display: flex;
86-
align-items: center;
87-
flex-direction: column;
88-
gap: 7px;
89-
margin-top: 400px;
90-
`;
94+
display: flex;
95+
align-items: center;
96+
flex-direction: column;
97+
gap: 7px;
98+
margin-top: 400px;
99+
`;

0 commit comments

Comments
 (0)