imprv/133905-replace-icon-pencilitem

apps/app/_obsolete/src/components/Navbar/GrowiNavbar.tsx

@@ -47,7 +47,7 @@ const NavbarRight = memo((): JSX.Element => {
                 data-testid="newPageBtn"
                 onClick={() => openCreateModal(currentPagePath || '')}
               >
-                <i className="icon-pencil me-2"></i>
+                <span className="material-symbols-outlined">edit</span>
                 <span className="d-none d-lg-block">{ t('commons:New') }</span>
               </button>
             </li>

apps/app/src/components/Admin/Notification/GlobalNotificationList.jsx

@@ -103,7 +103,7 @@ class GlobalNotificationList extends React.Component {
                   )}
                   {notification.triggerEvents.includes('pageEdit') && (
                     <li className="list-inline-item badge rounded-pill bg-warning text-dark">
-                      <i className="icon-pencil"></i> EDIT
+                      <span className="material-symbols-outlined">edit</span> EDIT
                     </li>
                   )}
                   {notification.triggerEvents.includes('pageMove') && (

apps/app/src/components/Admin/Notification/ManageGlobalNotification.tsx

@@ -250,7 +250,7 @@ const ManageGlobalNotification = (props: Props): JSX.Element => {
                 onChange={() => onChangeTriggerEvents(TriggerEventType.EDIT)}
               >
                 <span className="badge rounded-pill bg-warning text-dark">
-                  <i className="icon-pencil me-1" />EDIT
+                  <span className="imaterial-symbols-outlined">edit</span> EDIT
                 </span>
               </TriggerEventCheckBox>
             </div>

apps/app/src/components/Me/PersonalSettings.jsx

@@ -40,7 +40,7 @@ const PersonalSettings = () => {
         i18n: t('API Settings'),
       },
       // editor_settings: {
-      //   Icon: () => <i className="icon-fw icon-pencil"></i>,
+      //   Icon: () => <span className="material-symbols-outlined">edit</span>,
       //   Content: EditorSettings,
       //   i18n: t('editor_settings.editor_settings'),
       // },

apps/app/src/components/PageComment/CommentControl.tsx

@@ -14,7 +14,7 @@ export const CommentControl = (props: CommentControlProps): JSX.Element => {
     // The page-comment-control class is imported from Comment.module.scss
     <div className="page-comment-control">
       <button type="button" className="btn btn-link p-2" onClick={onClickEditBtn}>
-        <i className="ti ti-pencil"></i>
+        <span className="material-symbols-outlined">edit</span>
       </button>
       <button
         data-testid="comment-delete-button"

apps/app/src/components/Sidebar/Custom/CustomSidebar.tsx

@@ -22,7 +22,7 @@ export const CustomSidebar = (): JSX.Element => {
       <div className="grw-sidebar-content-header py-3 d-flex">
         <h3 className="mb-0">
           {t('CustomSidebar')}
-          { !isLoading && <Link href="/Sidebar#edit" className="h6 ms-2"><i className="icon-pencil"></i></Link> }
+          { !isLoading && <Link href="/Sidebar#edit" className="h6 ms-2"><span className="material-symbols-outlined">edit</span></Link> }
         </h3>
         { !isLoading && <SidebarHeaderReloadButton onClick={() => mutate()} /> }
       </div>

apps/app/src/components/Sidebar/SidebarNav/PersonalDropdown.tsx

@@ -90,7 +90,7 @@ export const PersonalDropdown = (): JSX.Element => {
               className="dropdown-item"
               onClick={() => setQuestionnaireModalOpen(true)}
             >
-              <i className="icon-fw icon-pencil"></i>{t('personal_dropdown.feedback')}
+              <span className="material-symbols-outlined">edit</span>{t('personal_dropdown.feedback')}
             </button>
           </li>
           <li>