Add localization

components/search/SearchModal/index.module.scss

@@ -93,6 +93,7 @@
     .viewSwitcher {
       align-items: center;
       display: flex;
+      gap: $unit-fourth;
 
       span {
         color: var(--text-tertiary);
@@ -113,6 +114,7 @@
         }
 
         &.active {
+          background: var(--button-contained-bg);
           font-weight: $bold;
         }
       }

components/search/SearchModal/index.tsx

@@ -459,12 +459,12 @@ const SearchModal = (props: Props) => {
             </h5>
             {(props.object === 'weapons' || props.object === 'summons') && (
               <div className={styles.viewSwitcher}>
-                <span>View: </span>
+                <span>{t('search.labels.view')}</span>
                 <button className={newestViewClasses} onClick={showNewest}>
-                  Newest
+                  {t('search.labels.newest')}
                 </button>
                 <button className={recentViewClasses} onClick={showRecent}>
-                  Recently used
+                  {t('search.labels.recently_used')}
                 </button>
               </div>
             )}

public/locales/en/common.json

@@ -512,6 +512,11 @@
       "end_results": "No more results",
       "type": "Keep typing..."
     },
+    "labels": {
+      "view": "View:",
+      "newest": "Newly added",
+      "recently_used": "Recently used"
+    },
     "placeholders": {
       "weapon": "Search for a weapon...",
       "summon": "Search for a summon...",

public/locales/ja/common.json

@@ -510,6 +510,11 @@
       "end_results": "検索結果これ以上ありません",
       "type": "もっと入力してください"
     },
+    "labels": {
+      "view": "表示:",
+      "newest": "最新発表",
+      "recently_used": "最近使用"
+    },
     "placeholders": {
       "weapon": "武器を検索...",
       "summon": "召喚石を検索...",