toast

src/shared/configs/axios/index.ts

@@ -3,7 +3,7 @@ import axios, { AxiosError, AxiosResponse, InternalAxiosRequestConfig } from 'ax
 import { WHITE_LIST_URLS } from '@/shared/api/urls';
 import { StorageKeys } from '@/shared/constants/local-storage';
 import { checkIsAxiosError, getLocalStorage, setLocalStorage } from '@/shared/lib';
-import { finalizeConfig, extractAccessToken, extractRequestId } from './utils';
+import { finalizeConfig } from './utils';
 import { HEADER_USER_AGENT } from '@/shared/constants/url';
 import { appBridge } from '@/utils/appBridge';
 import { useAppBridge } from '@/hooks';
@@ -30,22 +30,10 @@ const onRequestFulfilled = (config: InternalAxiosRequestConfig) => {
 };
 
 const onRequestRejected = (error: any) => {
-  const { method, url, params, data, headers } = error.config;
-  /*
-  Sentry.setContext('API Request Detail', {
-    method,
-    url,
-    params,
-    data,
-    headers,
-  });
-  */
   return Promise.reject(error);
 };
 
 const onResponseFulfilled = (response: AxiosResponse) => {
-  extractAccessToken(response);
-  extractRequestId(response);
   return {
     ...response,
     data: response.data.data || response.data,
@@ -73,22 +61,13 @@ const onResponseRejected = (error: AxiosError) => {
     });
     
   }
-  /*
-  else if (error?.response) {
-    const { data, status } = error.response;
-    extractRequestId(error?.response);
-    Sentry.setContext('API Response Detail', {
-      status,
-      data,
-    });
-  }
-    */
   return new Promise((_resolve, reject) => {
-    if (checkIsAxiosError(error)) {
+    if(checkIsAxiosError(error)){
       // iOS의 경우 window에서 unload event가 일어날때 네트워크 에러가 발생하곤 해서 이런 케이스를 방지하기 위해 지연시킴
       // location.href, location.reload 등으로 unload event가 일어나면 자바스크립트 런타임이 초기화되므로 settimeout으로 인한 네트워크 에러가 트리거 x
       setTimeout(() => reject(error), 300);
-    } else {
+    }
+    else{
       reject(error);
     }
   });

src/shared/configs/axios/utils.ts

@@ -1,6 +1,4 @@
-import { InternalAxiosRequestConfig, AxiosResponse } from 'axios';
-import { StorageKeys } from '@/shared/constants/local-storage';
-import { setLocalStorage } from '@/shared/lib';
+import { InternalAxiosRequestConfig } from 'axios';
 
 export const finalizeConfig = (config: InternalAxiosRequestConfig) => {
   const { params, data } = config;
@@ -9,21 +7,4 @@ export const finalizeConfig = (config: InternalAxiosRequestConfig) => {
     params,
     data,
   };
-};
-
-export const extractAccessToken = (response: AxiosResponse): void => {
-  const authHeader = response?.headers?.['authorization'];
-  if (authHeader) {
-    const accessToken = authHeader.substring(7);
-    setLocalStorage(StorageKeys.Jwt, accessToken);
-  }
-};
-
-export const extractRequestId = (response: AxiosResponse): void => {
-  const requestIdHeader = response?.headers?.['x-request-id'];
-  if (requestIdHeader) {
-    const requestId = requestIdHeader.replaceAll(', *', '');
-    console.log('requestId --> ', requestId);
-    setLocalStorage(StorageKeys.RequestId, requestId);
-  }
-};
+};

src/shared/lib/hooks/use-navigate.ts

@@ -8,15 +8,15 @@ import {
 export type NavigateTo = PathType | -1 | 0;
 
 export const goBackWebview = (goBack: () => void) => {
-  if (!window.ReactNativeWebView) {
-    if (window.history.state?.idx > 0) {
-      goBack();
-      return;
-    } else {
-      window.close();
-    }
+  if(window.history.state?.idx > 0){
+    goBack();
     return;
   }
+  else{
+    window.close();
+  }
+  return;
+  
 };
 
 export const useNavigate = () => {

src/shared/lib/toast.ts

@@ -1,5 +1,5 @@
-/* eslint-disable @cspell/spellchecker */
-import { toast } from 'react-toastify';
+import { toast } from "react-toastify";
+
 export const snackBar = (text: string) => {
   toast.dismiss({ containerId: 'snackbar' });
   toast(text, { containerId: 'snackbar' });
@@ -7,5 +7,5 @@ export const snackBar = (text: string) => {
 
 export const notiBar = (text: string) => {
   toast.dismiss({ containerId: 'notibar' });
-  toast(text);
-};
+  toast(text, { containerId: 'notibar' });
+};

src/shared/ui/toasts/noti-bar.tsx

@@ -1,21 +1,22 @@
 /* eslint-disable @cspell/spellchecker */
-import { Slide, ToastContainer } from 'react-toastify';
+import { ToastContainer } from 'react-toastify';
 import styled from 'styled-components';
 
 const StyledNotiBar = styled(ToastContainer)`
   // https://styled-components.com/docs/faqs#how-can-i-override-styles-with-higher-specificity
   &&&.Toastify__toast-container {
-    transform: translateX(2.5%);
+    
   }
   .Toastify__toast {
     min-height: auto;
-    width: 95%;
+    width: calc(100% - 32px);
     height: auto;
-
-    background-color: #262d42;
+    margin-top: 20px;
+    background-color: rgba(45, 52, 54, 0.8);
     box-sizing: border-box;
+    color: #ffffff;
 
-    border-radius: 0px 0px 20px 20px;
+    border-radius: 20px 20px 20px 20px;
     text-align: center;
     -webkit-box-shadow: 1px 1px 10px 0px rgba(43, 38, 38, 0.5);
     -moz-box-shadow: 1px 1px 10px 0px rgba(43, 38, 38, 0.5);
@@ -23,7 +24,7 @@ const StyledNotiBar = styled(ToastContainer)`
     display: flex;
     align-items: center;
     justify-content: center;
-    padding: 0;
+    padding: 6px 0 9px 0;
   }
   .Toastify__toast-body {
     padding: 0;

src/shared/ui/toasts/snack-bar.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable @cspell/spellchecker */
 import { cssTransition, ToastContainer } from 'react-toastify';
 import styled from 'styled-components';
 
@@ -8,12 +7,14 @@ const StyledSnackBar = styled(ToastContainer)`
     display: flex;
     align-items: center;
     justify-content: center;
-    bottom: 20px;
+    bottom: 30px;
     pointer-events: none;
     margin-bottom: calc(env(safe-area-inset-top) / 3);
+    z-index: 1000;
   }
   .Toastify__toast {
     pointer-events: none;
+    calc(100% - 32px);
     height: auto;
     padding: 0;
     display: flex;
@@ -23,8 +24,9 @@ const StyledSnackBar = styled(ToastContainer)`
     min-height: auto;
     border-radius: 50px;
     padding: 10px 20px;
-    background-color: rgba(34, 37, 56, 0.555);
+    background-color: rgba(45, 52, 54, 0.8);
     width: 85%;
+    color: #ffffff
   }
   .Toastify__toast-body {
     padding: 0;
@@ -53,7 +55,7 @@ export const SnackBar = () => {
   return (
     <StyledSnackBar
       position="bottom-center"
-      autoClose={2000}
+      autoClose={3000}
       limit={1}
       hideProgressBar
       newestOnTop={false}
@@ -62,7 +64,6 @@ export const SnackBar = () => {
       pauseOnFocusLoss={false}
       draggable={false}
       pauseOnHover={false}
-      transition={fade}
       containerId={'snackbar'}
       draggablePercent={10}
       closeButton={false}