diff --git a/src/features/slop/ui/slop-camera.tsx b/src/features/slop/ui/slop-camera.tsx
index f9902d0..e9cb36a 100644
--- a/src/features/slop/ui/slop-camera.tsx
+++ b/src/features/slop/ui/slop-camera.tsx
@@ -1,7 +1,9 @@
import React, { useEffect, useRef } from 'react';
import { createPortal } from 'react-dom';
+import { toast } from 'sonner';
import type { Position, Webcam } from '@/entities/slop/model/model';
import ArrowRightIcon from '@/shared/icons/arrow-right';
+import NeutralFace from '@/shared/icons/neutral-face';
import { cn } from '@/shared/lib';
import postAppMessage from '@/shared/lib/postAppMessage';
import CameraButton from '@/shared/ui/cam-button';
@@ -44,7 +46,13 @@ const SlopCamera = ({
setOpenCamera();
if (!src) {
- postAppMessage('선택한 웹캠은 아직 준비중 이에요');
+ postAppMessage('선택한 웹캠은 아직 준비중 이에요', (message) =>
+ toast(
+ <>
+ {message}
+ >
+ )
+ );
}
};
@@ -68,10 +76,8 @@ const SlopCamera = ({
}
isOpen={isOpen}
>
-
-
- {name}
-
+
diff --git a/src/shared/lib/postAppMessage.ts b/src/shared/lib/postAppMessage.ts
index 7251ff5..5ba953c 100644
--- a/src/shared/lib/postAppMessage.ts
+++ b/src/shared/lib/postAppMessage.ts
@@ -13,23 +13,21 @@ declare global {
}
}
-const postAppMessage = (message: string) => {
+const postAppMessage = (message: string, showToast: (message: string) => void) => {
const userAgent = navigator.userAgent.toLowerCase();
const android = userAgent.match(/android/i);
const iphone = userAgent.match(/iphone/i);
if (android !== null) {
- console.log("Android");
return window.Android.showToast(message);
} else if (iphone !== null) {
- console.log("iOS");
if (window.webkit.messageHandlers.weski) {
window.webkit.messageHandlers.weski.postMessage({ method: "showToast", message: message });
} else {
console.error("Weski bridge is not available.");
}
} else {
- return window.opener.postMessage(message);
+ return showToast(message);
}
}
diff --git a/src/shared/ui/card.tsx b/src/shared/ui/card.tsx
index 7086fba..1d83272 100644
--- a/src/shared/ui/card.tsx
+++ b/src/shared/ui/card.tsx
@@ -7,7 +7,7 @@ interface CardProps extends React.HTMLAttributes
{
const Card = ({ className, children, ...props }: CardProps) => (
router.push(`/${resortId}`)}
>