Merge pull request #12442 from overleaf/jel-bsStyle

[web] Add bsStyle to `react-bootstrap` buttons

GitOrigin-RevId: 0059a457cbd8b4c316aa3b34e4d77f1b92bd690e

services/web/frontend/js/features/file-tree/components/file-tree-item/file-tree-item-menu.js

@@ -42,6 +42,7 @@ function FileTreeItemMenu({ id }) {
         id={`menu-button-${id}`}
         onClick={withoutPropagation(handleClick)}
         ref={menuButtonRef}
+        bsStyle={null}
       >
         <Icon type="ellipsis-v" accessibilityLabel={t('menu')} />
       </Button>

services/web/frontend/js/features/file-tree/components/file-tree-toolbar.js

@@ -43,7 +43,7 @@ function FileTreeToolbarLeft() {
         description={t('new_file')}
         overlayProps={{ placement: 'bottom' }}
       >
-        <Button onClick={startCreatingDocOrFile}>
+        <Button onClick={startCreatingDocOrFile} bsStyle={null}>
           <Icon type="file" fw accessibilityLabel={t('new_file')} />
         </Button>
       </Tooltip>
@@ -52,7 +52,7 @@ function FileTreeToolbarLeft() {
         description={t('new_folder')}
         overlayProps={{ placement: 'bottom' }}
       >
-        <Button onClick={startCreatingFolder}>
+        <Button onClick={startCreatingFolder} bsStyle={null}>
           <Icon type="folder" fw accessibilityLabel={t('new_folder')} />
         </Button>
       </Tooltip>

services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-error.js

@@ -70,7 +70,9 @@ function FileTreeModalError() {
       </Modal.Body>
 
       <Modal.Footer>
-        <Button onClick={handleHide}>{t('ok')}</Button>
+        <Button onClick={handleHide} bsStyle="primary">
+          {t('ok')}
+        </Button>
       </Modal.Footer>
     </Modal>
   )

services/web/frontend/js/features/project-list/components/modals/edit-tag-modal.tsx

@@ -111,6 +111,8 @@ export default function EditTagModal({
           <Button
             onClick={onClose}
             disabled={isDeleteLoading || isRenameLoading}
+            bsStyle={null}
+            className="btn-secondary"
           >
             {t('save_or_cancel-cancel')}
           </Button>

services/web/frontend/js/features/project-list/components/new-project-button/upload-project-modal.tsx

@@ -110,7 +110,9 @@ function UploadProjectModal({ onHide }: UploadProjectModalProps) {
       </Modal.Body>
 
       <Modal.Footer>
-        <Button onClick={onHide}>{t('cancel')}</Button>
+        <Button onClick={onHide} bsStyle={null} className="btn-secondary">
+          {t('cancel')}
+        </Button>
       </Modal.Footer>
     </AccessibleModal>
   )

services/web/frontend/js/features/project-list/components/sidebar/sidebar-filters.tsx

@@ -19,7 +19,9 @@ export function SidebarFilter({ filter, text }: SidebarFilterProps) {
     <ProjectsFilterMenu filter={filter}>
       {isActive => (
         <li className={isActive ? 'active' : ''}>
-          <Button onClick={() => selectFilter(filter)}>{text}</Button>
+          <Button onClick={() => selectFilter(filter)} bsStyle={null}>
+            {text}
+          </Button>
         </li>
       )}
     </ProjectsFilterMenu>

services/web/frontend/js/features/project-list/components/sidebar/tags-list.tsx

@@ -34,7 +34,11 @@ export default function TagsList() {
         <h2>{t('tags_slash_folders')}</h2>
       </li>
       <li className="tag">
-        <Button className="tag-name" onClick={openCreateTagModal}>
+        <Button
+          className="tag-name"
+          onClick={openCreateTagModal}
+          bsStyle={null}
+        >
           <Icon type="plus" />
           <span className="name">{t('new_folder')}</span>
         </Button>
@@ -50,6 +54,7 @@ export default function TagsList() {
               onClick={e =>
                 handleSelectTag(e as unknown as React.MouseEvent, tag._id)
               }
+              bsStyle={null}
             >
               <span
                 style={{
@@ -109,6 +114,7 @@ export default function TagsList() {
         <Button
           className="tag-name"
           onClick={() => selectTag(UNCATEGORIZED_KEY)}
+          bsStyle={null}
         >
           <span className="name">{t('uncategorized')}</span>
           <span className="subdued"> ({untaggedProjectsCount})</span>

services/web/frontend/js/features/project-list/components/tags-list.tsx

@@ -49,6 +49,7 @@ function TagsList({ onTagClick, onEditClick }: TagsListProps) {
                 onEditClick()
               }}
               className="btn-transparent edit-btn me-2"
+              bsStyle={null}
             >
               <Icon type="pencil" fw />
             </Button>

services/web/frontend/js/features/settings/components/emails/add-email/add-another-email-btn.tsx

@@ -5,7 +5,12 @@ function AddAnotherEmailBtn({ onClick, ...props }: ButtonProps) {
   const { t } = useTranslation()
 
   return (
-    <Button className="btn-inline-link" onClick={onClick} {...props}>
+    <Button
+      className="btn-inline-link"
+      onClick={onClick}
+      {...props}
+      bsStyle={null}
+    >
       {t('add_another_email')}
     </Button>
   )

services/web/frontend/js/features/settings/components/emails/add-email/email-affiliated-with-institution.tsx

@@ -7,7 +7,12 @@ function EmailAffiliatedWithInstitution({ onClick, ...props }: ButtonProps) {
   return (
     <div className="mt-1">
       {t('is_email_affiliated')}
-      <Button className="btn-inline-link" onClick={onClick} {...props}>
+      <Button
+        className="btn-inline-link"
+        onClick={onClick}
+        {...props}
+        bsStyle={null}
+      >
         {t('let_us_know')}
       </Button>
     </div>

services/web/frontend/js/features/settings/components/emails/add-email/university-name.tsx

@@ -14,7 +14,7 @@ function UniversityName({ name, onClick }: UniversityNameProps) {
       {name}
       <span className="small">
         {' '}
-        <Button className="btn-inline-link" onClick={onClick}>
+        <Button className="btn-inline-link" onClick={onClick} bsStyle={null}>
           {t('change')}
         </Button>
       </span>

services/web/frontend/js/features/settings/components/emails/resend-confirmation-email-button.tsx

@@ -48,6 +48,7 @@ function ResendConfirmationEmailButton({
         className="btn-inline-link"
         disabled={state.isLoading}
         onClick={handleResendConfirmationEmail}
+        bsStyle={null}
       >
         {t('resend_confirmation_email')}
       </Button>

services/web/frontend/js/features/source-editor/components/cm6-switch-away-survey.tsx

@@ -79,6 +79,7 @@ export default function CM6SwitchAwaySurvey() {
         data-dismiss="alert"
         aria-label="Close"
         onClick={handleClose}
+        bsStyle={null}
       >
         <span aria-hidden="true">&times;</span>
       </Button>

services/web/frontend/js/features/source-editor/components/grammarly-warning.tsx

@@ -65,6 +65,7 @@ export default function GrammarlyWarning({ delay }: GrammarlyWarningProps) {
         data-dismiss="alert"
         aria-label="Close"
         onClick={handleClose}
+        bsStyle={null}
       >
         <span aria-hidden="true">&times;</span>
       </Button>