diff --git a/frontend/src/components/common/keyword/Keyword.tsx b/frontend/src/components/common/keyword/Keyword.tsx index 309c14ea..bbaa9b2a 100644 --- a/frontend/src/components/common/keyword/Keyword.tsx +++ b/frontend/src/components/common/keyword/Keyword.tsx @@ -28,12 +28,16 @@ const Keyword = ({ currentKeywords, onKeywordsChange, error }: KeywordProps) => const trimmedKeyword = keyword.trim(); if (trimmedKeyword === "") return; - if (currentKeywords.includes(trimmedKeyword)) { + + if (trimmedKeyword.includes("⠀") || currentKeywords.includes(trimmedKeyword)) { setKeyword(""); return; } - onKeywordsChange([...currentKeywords, trimmedKeyword]); - setKeyword(""); + + if (e.nativeEvent.isComposing === false) { + onKeywordsChange([...currentKeywords, trimmedKeyword]); + setKeyword(""); + } } }; diff --git a/frontend/src/pages/callback/CallbackPage.style.ts b/frontend/src/pages/callback/CallbackPage.style.ts index 141f145c..014a8fbb 100644 --- a/frontend/src/pages/callback/CallbackPage.style.ts +++ b/frontend/src/pages/callback/CallbackPage.style.ts @@ -1,4 +1,5 @@ import styled, { keyframes } from "styled-components"; +import { Z_INDEX } from "@/styles/zIndex"; export const CallbackPageContainer = styled.div` display: flex; @@ -41,6 +42,7 @@ export const LoadingContainer = styled.div` border-radius: 25px; p { + z-index: ${Z_INDEX.header}; font: ${({ theme }) => theme.TEXT.medium_bold}; color: ${({ theme }) => theme.COLOR.grey4}; }