diff --git a/src/app/App.tsx b/src/app/App.tsx
index cad867e..fc60bd4 100644
--- a/src/app/App.tsx
+++ b/src/app/App.tsx
@@ -3,7 +3,7 @@ import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
import { RouterProvider } from 'react-router-dom';
import { queryClient } from '@/shared/react-query';
-import { NetworkErrorToast } from '@/shared/ui';
+import { Toast } from '@/shared/toast';
import { router } from './routers/index';
import './styles/global.scss';
@@ -13,7 +13,7 @@ function App() {
-
+
);
diff --git a/src/app/layout/iPhone/hooks/useUtilityIPhone.tsx b/src/app/layout/iPhone/hooks/useUtilityIPhone.tsx
index 8e56c0c..67b00d3 100644
--- a/src/app/layout/iPhone/hooks/useUtilityIPhone.tsx
+++ b/src/app/layout/iPhone/hooks/useUtilityIPhone.tsx
@@ -1,7 +1,7 @@
import { useEffect, useRef } from 'react';
-const IPHONE_MIN_SIZE = 60;
-const IPHONE_INIT_SIZE = 80;
+const IPHONE_MIN_SIZE = 75;
+const IPHONE_INIT_SIZE = 75;
const IPHONE_MAX_SIZE = 100;
const IPHONE_PROTRAIT_MODE = 0; // 세로 모드
diff --git a/src/app/layout/iPhone/ui/IPhoneLayout.scss b/src/app/layout/iPhone/ui/IPhoneLayout.scss
index 5ab09c4..0fa8431 100644
--- a/src/app/layout/iPhone/ui/IPhoneLayout.scss
+++ b/src/app/layout/iPhone/ui/IPhoneLayout.scss
@@ -3,7 +3,7 @@
display: none;
}
-@media (min-width: 1440px) {
+@media (min-width: 1080px) {
.root-layout {
width: 100vw;
height: 100vh;
diff --git a/src/shared/react-query/dir/handleQuery.ts b/src/shared/react-query/dir/handleQuery.ts
index 505b0f4..8ec0036 100644
--- a/src/shared/react-query/dir/handleQuery.ts
+++ b/src/shared/react-query/dir/handleQuery.ts
@@ -1,12 +1,12 @@
import { Query, QueryKey } from '@tanstack/react-query';
-import { removeErrorHandler, showErrorHandler } from './toastHandlers';
+import { removeToastHandler, showToastHandler } from '@/shared/toast';
/**
* 쿼리 성공 핸들러
*/
export function handleQuerySuccess() {
- removeErrorHandler();
+ removeToastHandler();
}
/**
@@ -20,7 +20,8 @@ export function handleQueryError(
const { queryKey, state } = query;
// feeds 쿼리에서 2 페이지부터 에러가 발생하면 네트워크 에러 토스트를 띄웁니다.
- if (queryKey[0] === 'feeds' && state.data) showErrorHandler();
+ if (queryKey[0] === 'feeds' && state.data)
+ showToastHandler('caution', '인터넷 연결이 불안정해요');
}
/**
diff --git a/src/shared/react-query/dir/index.ts b/src/shared/react-query/dir/index.ts
index e591523..2bc5436 100644
--- a/src/shared/react-query/dir/index.ts
+++ b/src/shared/react-query/dir/index.ts
@@ -1,2 +1 @@
export * from './handleQuery';
-export * from './toastHandlers';
diff --git a/src/shared/react-query/dir/toastHandlers.ts b/src/shared/react-query/dir/toastHandlers.ts
deleted file mode 100644
index a682bf7..0000000
--- a/src/shared/react-query/dir/toastHandlers.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Bounce, toast } from 'react-toastify';
-
-const id = 'react-query-toast';
-
-/**
- * 에러 메시지를 토스트 메시지로 변환합니다.
- */
-export function showErrorHandler() {
- // reference: https://fkhadra.github.io/react-toastify/api/toast
- if (!toast.isActive(id)) {
- toast('인터넷 연결이 불안정해요', {
- toastId: id,
- autoClose: 3000,
- position: 'bottom-center',
- transition: Bounce,
- });
- }
-}
-
-/**
- * 에러 메시지 토스트를 제거합니다.
- */
-export function removeErrorHandler() {
- if (toast.isActive(id)) {
- toast.dismiss(id);
- }
-}
diff --git a/src/shared/toast/dir/index.ts b/src/shared/toast/dir/index.ts
new file mode 100644
index 0000000..bfbd92e
--- /dev/null
+++ b/src/shared/toast/dir/index.ts
@@ -0,0 +1 @@
+export * from './toastHandlers';
diff --git a/src/shared/toast/dir/toastHandlers.tsx b/src/shared/toast/dir/toastHandlers.tsx
new file mode 100644
index 0000000..035106f
--- /dev/null
+++ b/src/shared/toast/dir/toastHandlers.tsx
@@ -0,0 +1,33 @@
+import { Bounce, toast } from 'react-toastify';
+
+import { Icon } from '@/shared/ui';
+import { IconName } from '@/shared/ui/icon';
+
+const id = 'react-query-toast';
+
+/**
+ * reference: https://fkhadra.github.io/react-toastify/api/toast
+ * 메시지를 토스트 메시지로 변환합니다.
+ * @param iconName 아이콘 이름
+ * @param message 메시지
+ */
+export function showToastHandler(iconName: IconName, message: string) {
+ if (!toast.isActive(id)) {
+ toast(message, {
+ toastId: id,
+ autoClose: 3000,
+ position: 'bottom-center',
+ transition: Bounce,
+ icon: ,
+ });
+ }
+}
+
+/**
+ * 화면에 표시되어 있는 토스트를 제거합니다.
+ */
+export function removeToastHandler() {
+ if (toast.isActive(id)) {
+ toast.dismiss(id);
+ }
+}
diff --git a/src/shared/toast/index.ts b/src/shared/toast/index.ts
new file mode 100644
index 0000000..693ea46
--- /dev/null
+++ b/src/shared/toast/index.ts
@@ -0,0 +1,2 @@
+export { Toast } from './ui';
+export * from './dir';
diff --git a/src/shared/ui/network-error-toast/NetworkErrorToast.scss b/src/shared/toast/ui/Toast.scss
similarity index 100%
rename from src/shared/ui/network-error-toast/NetworkErrorToast.scss
rename to src/shared/toast/ui/Toast.scss
diff --git a/src/shared/ui/network-error-toast/NetworkErrorToast.tsx b/src/shared/toast/ui/Toast.tsx
similarity index 63%
rename from src/shared/ui/network-error-toast/NetworkErrorToast.tsx
rename to src/shared/toast/ui/Toast.tsx
index d902788..88d64f8 100644
--- a/src/shared/ui/network-error-toast/NetworkErrorToast.tsx
+++ b/src/shared/toast/ui/Toast.tsx
@@ -1,14 +1,12 @@
import { ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
-import './NetworkErrorToast.scss';
-import { Icon } from '..';
+import './Toast.scss';
-export const NetworkErrorToast = () => {
+export const Toast = () => {
return (
}
limit={1}
pauseOnHover={false}
pauseOnFocusLoss={false}
diff --git a/src/shared/toast/ui/index.ts b/src/shared/toast/ui/index.ts
new file mode 100644
index 0000000..03e94bf
--- /dev/null
+++ b/src/shared/toast/ui/index.ts
@@ -0,0 +1 @@
+export { Toast } from './Toast';
diff --git a/src/shared/ui/icon/index.ts b/src/shared/ui/icon/index.ts
index bb0d107..773d0b5 100644
--- a/src/shared/ui/icon/index.ts
+++ b/src/shared/ui/icon/index.ts
@@ -1 +1,2 @@
export { Icon } from './ui';
+export type { IconName } from './consts';
diff --git a/src/shared/ui/index.ts b/src/shared/ui/index.ts
index 860fcf2..03beb18 100644
--- a/src/shared/ui/index.ts
+++ b/src/shared/ui/index.ts
@@ -4,6 +4,4 @@ export { ConfirmModal, BottomSheetModal } from './modal';
export { Profile, SkeletonProfile } from './profile';
export { Icon } from './icon';
export { NetworkError } from './network-error';
-export { NetworkErrorToast } from './network-error-toast';
export { Observer } from './observer';
-export { Carousel } from './carousel';
diff --git a/src/shared/ui/network-error-toast/index.ts b/src/shared/ui/network-error-toast/index.ts
deleted file mode 100644
index c581b1b..0000000
--- a/src/shared/ui/network-error-toast/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { NetworkErrorToast } from './NetworkErrorToast';
diff --git a/src/widgets/feed-carousel/index.ts b/src/widgets/feed-carousel/index.ts
new file mode 100644
index 0000000..e403d84
--- /dev/null
+++ b/src/widgets/feed-carousel/index.ts
@@ -0,0 +1 @@
+export { Carousel } from './ui';
diff --git a/src/shared/ui/carousel/Carousel.scss b/src/widgets/feed-carousel/ui/Carousel.scss
similarity index 100%
rename from src/shared/ui/carousel/Carousel.scss
rename to src/widgets/feed-carousel/ui/Carousel.scss
diff --git a/src/shared/ui/carousel/Carousel.tsx b/src/widgets/feed-carousel/ui/Carousel.tsx
similarity index 100%
rename from src/shared/ui/carousel/Carousel.tsx
rename to src/widgets/feed-carousel/ui/Carousel.tsx
diff --git a/src/shared/ui/carousel/index.ts b/src/widgets/feed-carousel/ui/index.ts
similarity index 100%
rename from src/shared/ui/carousel/index.ts
rename to src/widgets/feed-carousel/ui/index.ts
diff --git a/src/widgets/feed-main-list/ui/Feed.tsx b/src/widgets/feed-main-list/ui/Feed.tsx
index 06ee298..93faa00 100644
--- a/src/widgets/feed-main-list/ui/Feed.tsx
+++ b/src/widgets/feed-main-list/ui/Feed.tsx
@@ -1,8 +1,9 @@
import { BookmarkButton } from '@/features/feed-bookmark';
import { LikeButton } from '@/features/feed-main-like';
import { Feed as FeedProps } from '@/shared/consts';
-import { Carousel, Icon, Profile } from '@/shared/ui';
+import { Icon, Profile } from '@/shared/ui';
import { calculateElapsedTime } from '@/shared/utils';
+import { Carousel } from '@/widgets/feed-carousel';
import { FeedKebabButton } from '@/widgets/feed-kebab';
import './Feed.scss';