data toggle dropdown to data bs toggle dropdown

apps/app/src/components/Admin/App/AwsSetting.tsx

@@ -32,7 +32,7 @@ export const AwsSettingMolecule = (props: AwsSettingMoleculeProps): JSX.Element
               className="btn btn-outline-secondary dropdown-toggle"
               type="button"
               id="ddS3ReferenceFileWithRelayMode"
-              data-toggle="dropdown"
+              data-bs-toggle="dropdown"
               aria-haspopup="true"
               aria-expanded="true"
             >

apps/app/src/components/Admin/App/GcsSetting.tsx

@@ -43,7 +43,7 @@ export const GcsSettingMolecule = (props: GcsSettingMoleculeProps): JSX.Element
               className="btn btn-outline-secondary dropdown-toggle"
               type="button"
               id="ddGcsReferenceFileWithRelayMode"
-              data-toggle="dropdown"
+              data-bs-toggle="dropdown"
               aria-haspopup="true"
               aria-expanded="true"
             >

apps/app/src/components/Admin/AuditLog/SelectActionDropdown.tsx

@@ -77,7 +77,7 @@ export const SelectActionDropdown: FC<Props> = (props: Props) => {
 
   return (
     <div className="btn-group me-2 admin-audit-log">
-      <button className="btn btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown">
+      <button className="btn btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-bs-toggle="dropdown">
         <i className="fa fa-fw fa-bolt" />{t('admin:audit_log_management.action')}
       </button>
       <ul className="dropdown-menu select-action-dropdown" aria-labelledby="dropdownMenuButton">

apps/app/src/components/Admin/Common/AdminNavigation.tsx

@@ -131,7 +131,7 @@ export const AdminNavigation = (): JSX.Element => {
           type="button"
           id="dropdown-admin-navigation"
           data-display="static"
-          data-toggle="dropdown"
+          data-bs-toggle="dropdown"
           aria-haspopup="true"
           aria-expanded="false"
         >

apps/app/src/components/Admin/ExportArchiveData/ArchiveFilesTableMenu.tsx

@@ -14,7 +14,7 @@ const ArchiveFilesTableMenu = (props: ArchiveFilesTableMenuProps):JSX.Element =>
 
   return (
     <div className="btn-group admin-user-menu dropdown">
-      <button type="button" className="btn btn-sm btn-outline-secondary dropdown-toggle" data-toggle="dropdown">
+      <button type="button" className="btn btn-sm btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown">
         <i className="icon-settings"></i> <span className="caret"></span>
       </button>
       <ul className="dropdown-menu" role="menu">

apps/app/src/components/Admin/ImportData/GrowiArchive/ImportCollectionItem.jsx

@@ -118,7 +118,7 @@ export default class ImportCollectionItem extends React.Component {
             type="button"
             id="ddmMode"
             disabled={isImporting}
-            data-toggle="dropdown"
+            data-bs-toggle="dropdown"
             aria-haspopup="true"
             aria-expanded="true"
           >

apps/app/src/components/Admin/LegacySlackIntegration/SlackConfiguration.jsx

@@ -45,7 +45,7 @@ class SlackConfiguration extends React.Component {
                 className="btn btn-secondary dropdown-toggle"
                 type="button"
                 id="dropdownMenuButton"
-                data-toggle="dropdown"
+                data-bs-toggle="dropdown"
                 aria-haspopup="true"
                 aria-expanded="true"
               >

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

@@ -139,7 +139,7 @@ class GlobalNotificationList extends React.Component {
                     className="btn btn-outline-secondary dropdown-toggle"
                     type="button"
                     id="dropdownMenuButton"
-                    data-toggle="dropdown"
+                    data-bs-toggle="dropdown"
                     aria-haspopup="true"
                     aria-expanded="false"
                   >

apps/app/src/components/Admin/Security/LdapSecuritySettingContents.jsx

@@ -116,7 +116,7 @@ class LdapSecuritySettingContents extends React.Component {
                     className="btn btn-outline-secondary dropdown-toggle"
                     type="button"
                     id="dropdownMenuButton"
-                    data-toggle="dropdown"
+                    data-bs-toggle="dropdown"
                     aria-haspopup="true"
                     aria-expanded="true"
                   >

apps/app/src/components/Admin/Security/LocalSecuritySettingContents.jsx

@@ -97,7 +97,7 @@ class LocalSecuritySettingContents extends React.Component {
                     className="btn btn-outline-secondary dropdown-toggle"
                     type="button"
                     id="dropdownMenuButton"
-                    data-toggle="dropdown"
+                    data-bs-toggle="dropdown"
                     aria-haspopup="true"
                     aria-expanded="true"
                   >

apps/app/src/components/Admin/Security/SecuritySetting.jsx

@@ -192,7 +192,7 @@ class SecuritySetting extends React.Component {
           className="btn btn-outline-secondary dropdown-toggle text-end"
           type="button"
           id="dropdownMenuButton"
-          data-toggle="dropdown"
+          data-bs-toggle="dropdown"
           aria-haspopup="true"
           aria-expanded="true"
         >
@@ -403,7 +403,7 @@ class SecuritySetting extends React.Component {
                             col-md-auto ${adminGeneralSecurityContainer.isWikiModeForced && 'disabled'}`}
                 type="button"
                 id="dropdownMenuButton"
-                data-toggle="dropdown"
+                data-bs-toggle="dropdown"
                 aria-haspopup="true"
                 aria-expanded="true"
               >

apps/app/src/components/Admin/SlackIntegration/ManageCommandsProcess.jsx

@@ -97,7 +97,7 @@ const PermissionSettingForEachPermissionTypeComponent = ({
             className="btn btn-outline-secondary dropdown-toggle text-end col-12 col-md-auto"
             type="button"
             id="dropdownMenuButton"
-            data-toggle="dropdown"
+            data-bs-toggle="dropdown"
             aria-haspopup="true"
             aria-expanded="true"
           >

apps/app/src/components/Admin/SlackIntegration/ManageCommandsProcessWithoutProxy.jsx

@@ -89,7 +89,7 @@ const SinglePermissionSettingComponent = ({
             className="btn btn-outline-secondary dropdown-toggle text-end col-12 col-md-auto"
             type="button"
             id="dropdownMenuButton"
-            data-toggle="dropdown"
+            data-bs-toggle="dropdown"
             aria-haspopup="true"
             aria-expanded="true"
           >

apps/app/src/components/Admin/UserGroup/UserGroupDropdown.tsx

@@ -29,7 +29,7 @@ export const UserGroupDropdown: FC<Props> = (props: Props) => {
   return (
     <>
       <div className="dropdown">
-        <button className="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown">
+        <button className="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-bs-toggle="dropdown">
           {t('admin:user_group_management.add_child_group')}
         </button>
 

apps/app/src/components/Admin/UserGroup/UserGroupForm.tsx

@@ -104,7 +104,7 @@ export const UserGroupForm: FC<Props> = (props: Props) => {
             <button
               type="button"
               id="dropdownMenuButton"
-              data-toggle="dropdown"
+              data-bs-toggle="dropdown"
               className={`
                 btn btn-outline-secondary dropdown-toggle mb-3 ${isSelectableParentUserGroups ? '' : 'disabled'}
               `}

apps/app/src/components/Admin/UserGroup/UserGroupTable.tsx

@@ -189,7 +189,7 @@ export const UserGroupTable: FC<Props> = (props: Props) => {
                           type="button"
                           id={`admin-group-menu-button-${group._id}`}
                           className="btn btn-outline-secondary btn-sm dropdown-toggle"
-                          data-toggle="dropdown"
+                          data-bs-toggle="dropdown"
                         >
                           <i className="icon-settings"></i>
                         </button>

apps/app/src/components/Admin/UserGroupDetail/UserGroupUserTable.tsx

@@ -54,7 +54,7 @@ export const UserGroupUserTable = (props: Props): JSX.Element => {
                     type="button"
                     id={`admin-group-menu-button-${relatedUser._id}`}
                     className="btn btn-outline-secondary btn-sm dropdown-toggle"
-                    data-toggle="dropdown"
+                    data-bs-toggle="dropdown"
                   >
                     <i className="icon-settings"></i>
                   </button>

apps/app/src/components/Admin/Users/ExternalAccountTable.tsx

@@ -91,7 +91,7 @@ const ExternalAccountTable = (props: ExternalAccountTableProps): JSX.Element =>
                 <td>{dateFnsFormat(new Date(ea.createdAt), 'yyyy-MM-dd')}</td>
                 <td>
                   <div className="btn-group admin-user-menu">
-                    <button type="button" className="btn btn-outline-secondary btn-sm dropdown-toggle" data-toggle="dropdown">
+                    <button type="button" className="btn btn-outline-secondary btn-sm dropdown-toggle" data-bs-toggle="dropdown">
                       <i className="icon-settings"></i> <span className="caret"></span>
                     </button>
                     <ul className="dropdown-menu" role="menu">

apps/app/src/components/CustomNavigation/CustomNav.tsx

@@ -53,7 +53,7 @@ export const CustomNavDropdown = (props: CustomNavDropdownProps): JSX.Element =>
       <button
         className="btn btn-outline-primary btn-lg dropdown-toggle text-end"
         type="button"
-        data-toggle="dropdown"
+        data-bs-toggle="dropdown"
         aria-haspopup="true"
         aria-expanded="false"
       >

apps/app/src/components/InstallerForm.tsx

@@ -108,7 +108,7 @@ const InstallerForm = memo((): JSX.Element => {
                 className="btn btn-secondary dropdown-toggle form-control text-end rounded-end"
                 id="dropdownLanguage"
                 data-testid="dropdownLanguage"
-                data-toggle="dropdown"
+                data-bs-toggle="dropdown"
                 aria-haspopup="true"
                 aria-expanded="true"
               >

apps/app/src/components/Navbar/GlobalSearch.tsx

@@ -94,7 +94,7 @@ export const GlobalSearch = (props: GlobalSearchProps): JSX.Element => {
           <button
             className="btn btn-secondary dropdown-toggle py-0"
             type="button"
-            data-toggle="dropdown"
+            data-bs-toggle="dropdown"
             aria-haspopup="true"
             data-testid="select-search-scope"
           >

apps/app/src/components/PageAlert/FixPageGrantAlert.tsx

@@ -178,7 +178,7 @@ const FixPageGrantModal = (props: ModalProps): JSX.Element => {
                   <button
                     type="button"
                     className="btn btn-secondary dropdown-toggle text-end w-100 border-0 shadow-none"
-                    data-toggle="dropdown"
+                    data-bs-toggle="dropdown"
                     disabled={selectedGrant !== PageGrant.GRANT_USER_GROUP} // disable when its radio input is not selected
                   >
                     <span className="float-start ms-2">

apps/app/src/components/PageEditor/GridEditModal.jsx

@@ -208,7 +208,7 @@ class GridEditModal extends React.Component {
                       className="btn btn-outline-secondary dropdown-toggle"
                       type="button"
                       id="dropdownMenuButton"
-                      data-toggle="dropdown"
+                      data-bs-toggle="dropdown"
                       aria-haspopup="true"
                       aria-expanded="false"
                     >

apps/app/src/components/PageEditor/OptionsSelector.tsx

@@ -43,7 +43,7 @@ const ThemeSelector = (): JSX.Element => {
         <button
           type="button"
           className="btn btn-outline-secondary dropdown-toggle"
-          data-toggle="dropdown"
+          data-bs-toggle="dropdown"
           aria-haspopup="true"
           aria-expanded="false"
           aria-describedby="igt-theme"
@@ -98,7 +98,7 @@ const KeymapSelector = memo((): JSX.Element => {
         <button
           type="button"
           className="btn btn-outline-secondary dropdown-toggle"
-          data-toggle="dropdown"
+          data-bs-toggle="dropdown"
           aria-haspopup="true"
           aria-expanded="false"
           aria-describedby="igt-keymap"
@@ -140,7 +140,7 @@ const IndentSizeSelector = memo(({ isIndentSizeForced, selectedIndentSize, onCha
         <button
           type="button"
           className="btn btn-outline-secondary dropdown-toggle"
-          data-toggle="dropdown"
+          data-bs-toggle="dropdown"
           aria-haspopup="true"
           aria-expanded="false"
           aria-describedby="igt-indent"

apps/app/src/components/SearchPage/SortControl.tsx

@@ -39,7 +39,7 @@ const SortControl: FC <Props> = (props: Props) => {
           <button
             type="button"
             className="btn dropdown-toggle py-1"
-            data-toggle="dropdown"
+            data-bs-toggle="dropdown"
           >
             <span className="me-2 text-secondary">{t(`search_result.sort_axis.${sort}`)}</span>
           </button>