refactor: button에 aria-label 추가

Author: tifsy

src/components/MenuButton.tsx

@@ -22,6 +22,7 @@ export default function MenuButton() {
               : 'pointer-events-none translate-y-[120%] rotate-180 opacity-0',
           )}
           onClick={() => setIsOpen(false)}
+          aria-label="내 편지함으로 이동하기"
         >
           <MarkunreadOutlinedIcon fontSize="small" />
         </Link>
@@ -34,6 +35,7 @@ export default function MenuButton() {
               : 'pointer-events-none translate-y-[120%] rotate-180 opacity-0',
           )}
           onClick={() => setIsOpen(false)}
+          aria-label="게시판으로 이동하기"
         >
           <CalendarTodayOutlinedIcon fontSize="small" />
         </Link>
@@ -46,6 +48,7 @@ export default function MenuButton() {
               : 'pointer-events-none translate-y-[120%] rotate-180 opacity-0',
           )}
           onClick={() => setIsOpen(false)}
+          aria-label="속마음 나누기로 이동하기"
         >
           <EditNoteRoundedIcon fontSize="medium" />
         </Link>
@@ -56,6 +59,7 @@ export default function MenuButton() {
             isOpen ? 'rotate-90' : 'rotate-0',
           )}
           onClick={() => setIsOpen((state) => !state)}
+          aria-label="메뉴 열기"
         >
           <MenuRoundedIcon />
         </div>

src/components/NotificationButton.tsx

@@ -26,7 +26,7 @@ export default function NotificationButton() {
   });
 
   return (
-    <Link to="/mypage/notifications" className="relative">
+    <Link to="/mypage/notifications" className="relative" aria-label="알림">
       {notReadCount > 0 && (
         <div className={notReadStyle}>{notReadCount < 100 ? notReadCount : '99+'}</div>
       )}

src/layouts/Header.tsx

@@ -14,10 +14,10 @@ const Header = () => {
 
   return (
     <header className="fixed top-0 z-40 flex h-16 w-full max-w-150 items-center justify-between p-5">
-      <button onClick={() => navigate(-1)}>
+      <button onClick={() => navigate(-1)} aria-label="뒤로 가기">
         <ArrowLeftIcon className="h-6 w-6 text-white" />
       </button>
-      <div className="flex items-center gap-3">
+      <div className="flex items-center gap-3" aria-label="테마 바꾸기">
         {theme === 'light' ? (
           <DarkModeOutlinedIcon className="h-6 w-6 text-white" onClick={toggleTheme} />
         ) : (

src/pages/Admin/Filtering.tsx

@@ -43,6 +43,7 @@ export default function FilteringManage() {
                 onClick={() => {
                   setAddInputShow(true);
                 }}
+                aria-label="추가하기"
               >
                 <AddIcon className="h-4 w-4" />
               </button>

src/pages/Admin/RollingPaper.tsx

@@ -39,6 +39,7 @@ export default function AdminRollingPaper() {
             type="button"
             className="ml-auto flex items-center gap-2 rounded-md text-black"
             onClick={() => setActiveModal(true)}
+            aria-label='롤링페이퍼 생성하기'
           >
             <AddIcon />
             롤링페이퍼 생성

src/pages/Admin/components/AddInputButton.tsx

@@ -57,6 +57,7 @@ export default function AddInputButton({
         onClick={() => {
           handlePostBadWords();
         }}
+        aria-label="검열 단어 추가하기"
       >
         <AddIcon className="h-4 w-4" />
       </button>

src/pages/Admin/components/AddRollingPaperModal.tsx

@@ -64,10 +64,15 @@ export default function AddRollingPaperModal({ currentPage, onClose }: AddRollin
               type="button"
               className="secondary-btn text-gray-80 body-m flex-1 basis-1/2 px-3 py-2"
               onClick={onClose}
+              aria-label="취소하기"
             >
               취소하기
             </button>
-            <button type="submit" className="primary-btn body-m flex-1 basis-1/2 px-3 py-2">
+            <button
+              type="submit"
+              className="primary-btn body-m flex-1 basis-1/2 px-3 py-2"
+              aria-label="생성하기"
+            >
               생성하기
             </button>
           </section>

src/pages/Admin/components/FilterTextItem.tsx

@@ -64,14 +64,15 @@ export default function FilterTextItem({
         badWord.word
       )}
 
-      <button onClick={() => setPatchInputShow(true)}>
+      <button onClick={() => setPatchInputShow(true)} aria-label="작성하기">
         <PencilIcon className="h-4 w-4" />
       </button>
 
       <button
         onClick={() => {
           handleDeleteBadWords(badWord.id);
         }}
+        aria-label="삭제하기"
       >
         <DeleteIcon className="h-5 w-5" />
       </button>

src/pages/Admin/components/PagenationNavigation.tsx

@@ -62,6 +62,7 @@ export default function PagenationNavigation({
           onClick={() => {
             handlePrevButtonClick();
           }}
+          aria-label="이전으로"
         >
           prev
         </button>
@@ -85,6 +86,7 @@ export default function PagenationNavigation({
           onClick={() => {
             handleNextButtonClick();
           }}
+          aria-label="다음으로"
         >
           next
         </button>

src/pages/Admin/components/PatchInput.tsx

@@ -67,6 +67,7 @@ export default function PatchInput({
         onClick={() => {
           handlePatchBadWords();
         }}
+        aria-label="추가하기"
       >
         <AddIcon className="h-4 w-4" />
       </button>