Skip to content

Commit efb7575

Browse files
committed
feat: MemeDetailPage에서 웹뷰 상태 관리 및 공유 기능 개선
- 웹뷰 상태를 관리하기 위해 useState 훅을 추가하고, onNativeEntered 이벤트에 따라 상태를 업데이트함 - 공유 버튼 클릭 시 웹뷰 상태에 따라 적절한 동작을 수행하도록 로직을 수정함 - 사용자 경험을 향상시키기 위해 웹 접속 시 알림 메시지를 제거함
1 parent 79de5aa commit efb7575

File tree

1 file changed

+12
-7
lines changed

1 file changed

+12
-7
lines changed

apps/web/src/pages/MemeDetailPage/index.tsx

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,11 @@ import * as S from './MemeDetailPage.styles';
1010
import { useTheme } from '@emotion/react';
1111
import { useParams } from 'react-router-dom';
1212
import { useMemeDetailQuery } from '@meme_wiki/apis';
13-
import { useEffect } from 'react';
13+
import { useEffect, useState } from 'react';
1414
import { BridgeCommand, COMMAND_TYPE, CommandType } from '@/types/bridge';
1515

1616
const MemeDetailPage = () => {
17+
const [isWebview, setIsWebview] = useState(false);
1718
const { memeId } = useParams();
1819
const { data: memeDetail } = useMemeDetailQuery(memeId!);
1920

@@ -22,9 +23,9 @@ const MemeDetailPage = () => {
2223
useEffect(() => {
2324
window.onNativeEntered = (command: BridgeCommand<CommandType>) => {
2425
if (command.type === COMMAND_TYPE.APP_ENTERED) {
25-
alert('앱 접속!');
26+
setIsWebview(true);
2627
} else {
27-
alert('웹 접속!');
28+
setIsWebview(false);
2829
}
2930
};
3031

@@ -71,10 +72,14 @@ const MemeDetailPage = () => {
7172
<S.ButtonContainer>
7273
<S.ActionButton
7374
onClick={() => {
74-
nativeBridge.shareMeme({
75-
title: memeDetail?.success.title ?? '',
76-
image: memeDetail?.success.imgUrl ?? '',
77-
});
75+
if (isWebview) {
76+
nativeBridge.shareMeme({
77+
title: memeDetail?.success.title ?? '',
78+
image: memeDetail?.success.imgUrl ?? '',
79+
});
80+
} else {
81+
alert('밈 공유하기 클릭!');
82+
}
7883
}}
7984
>
8085
<ShareIcon />

0 commit comments

Comments
 (0)