-
Notifications
You must be signed in to change notification settings - Fork 2
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
#394 마이페이지에 알림 설정 추가 + Introduce @emotion/react
#488
Conversation
…-kaist/taxi-front into #394-notification-setting
@emotion/react
@@ -1,3 +1,4 @@ | |||
node_modules | |||
build | |||
.github | |||
tsconfig.json |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
tsconfig.json
formatting은 typescript
가 자동으로 해주더라고요.
babel: { | ||
presets: [ | ||
[ | ||
"@babel/preset-react", | ||
{ runtime: "automatic", importSource: "@emotion/react" }, | ||
], | ||
], | ||
plugins: ["@emotion/babel-plugin"], | ||
}, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
css
prop 에 대해서 babel
설정하였습니다.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
react-mobile-picker-mod
는 과거에 사용한 모듈로 현재는 taxi-front
에서 사용하지 않습니다.
해당 모듈의 type
정의를 지웠습니다.
import { atom } from "recoil"; | ||
|
||
export type deviceTokenType = Nullable<string>; | ||
|
||
const deviceTokenAtom = atom<deviceTokenType>({ | ||
key: "deviceTokenAtom", | ||
default: null, | ||
}); | ||
|
||
export default deviceTokenAtom; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
deviceToken
을 관리하기 위한 recoil state를 정의하였습니다.
import { atom } from "recoil"; | ||
|
||
export type notificationOptionsType = { | ||
advertisement: boolean; | ||
beforeDepart: boolean; | ||
chatting: boolean; | ||
notice: boolean; | ||
keywords: [string]; | ||
}; | ||
|
||
const notificationOptionsAtom = atom<Nullable<notificationOptionsType>>({ | ||
key: "notificationOptionsAtom", | ||
default: null, | ||
}); | ||
|
||
export default notificationOptionsAtom; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
notificationOption
(/notifications/options
API 호출 결과) 을 관리하기 위한 recoil state를 정의하였습니다.
url: "/auth/registerDeviceToken", | ||
method: "post", | ||
data: { deviceToken: newDeviceToken }, | ||
onSuccess: () => setDeviceToken(newDeviceToken), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
device 토큰 등록을 taxi-back에 API를 통해 완료하면, global state를 업데이트 합니다.
<NavigationMenu | ||
text={t("home_for_nav", { ns: "home" })} | ||
page="home" | ||
path={pathname} | ||
/> | ||
<NavigationMenu | ||
text={t("search_room_for_nav", { ns: "search" })} | ||
page="search" | ||
path={pathname} | ||
/> | ||
<NavigationMenu | ||
text={t("add_room_for_nav", { ns: "addroom" })} | ||
page="addroom" | ||
path={pathname} | ||
/> | ||
<NavigationMenu | ||
text={t("my_room_for_nav", { ns: "myroom" })} | ||
page="myroom" | ||
path={pathname} | ||
/> | ||
<NavigationMenu | ||
text={t("my_page_for_nav", { ns: "mypage" })} | ||
page="mypage" | ||
path={pathname} | ||
/> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Navigation
컴포넌트 i18n으로 영어 지원
Summary
It closes #394 , #495
Screenshots
알림 기능 설정 모달
디바이스 토큰을 백엔드에서 확인할 수 없을 때