[MM-56019] Move the deactivate account section to the last, and change the button to danger (#25697)

* [MM-56019] 🎨 Move the deactivate account section to the last, and change the button to danger

* refactor: remove unnecessary divider

webapp/channels/src/components/setting_item_max.tsx

@@ -48,6 +48,7 @@ type Props = {
     cancelButtonText?: ReactNode;
     shiftEnter?: boolean;
     saveButtonText?: string;
+    saveButtonClassName?: string;
 }
 export default class SettingItemMax extends React.PureComponent<Props> {
     settingList: React.RefObject<HTMLDivElement>;
@@ -170,6 +171,7 @@ export default class SettingItemMax extends React.PureComponent<Props> {
                     saving={this.props.saving}
                     disabled={this.props.saving}
                     onClick={this.handleSubmit}
+                    btnClass={this.props.saveButtonClassName}
                 />
             );
         }

webapp/channels/src/components/user_settings/advanced/user_settings_advanced.tsx

@@ -819,6 +819,7 @@ export default class AdvancedSettingsDisplay extends React.PureComponent<Props,
                             </div>,
                         ]}
                         saveButtonText={'Deactivate'}
+                        saveButtonClassName={'btn-danger'}
                         setting={'deactivateAccount'}
                         submit={this.handleShowDeactivateAccountModal}
                         saving={this.state.isSaving}
@@ -942,17 +943,17 @@ export default class AdvancedSettingsDisplay extends React.PureComponent<Props,
                     />
                     {previewFeaturesSectionDivider}
                     {previewFeaturesSection}
-                    {formattingSectionDivider}
                     <PerformanceDebuggingSection
                         active={this.props.activeSection === AdvancedSections.PERFORMANCE_DEBUGGING}
                         onUpdateSection={this.handleUpdateSection}
                         areAllSectionsInactive={this.props.activeSection === ''}
                     />
-                    {deactivateAccountSection}
                     {unreadScrollPositionSectionDivider}
                     {unreadScrollPositionSection}
                     {syncDraftsSectionDivider}
                     {syncDraftsSection}
+                    {formattingSectionDivider}
+                    {deactivateAccountSection}
                     <div className='divider-dark'/>
                     {makeConfirmationModal}
                 </div>