refactor: alert close button

packages/web/src/javascripts/Components/OtherSessionsSignOut/OtherSessionsSignOut.tsx

@@ -4,6 +4,7 @@ import { WebApplication } from '@/Application/Application'
 import { ViewControllerManager } from '@/Controllers/ViewControllerManager'
 import { observer } from 'mobx-react-lite'
 import Button from '@/Components/Button/Button'
+import Icon from '../Icon/Icon'
 
 type Props = {
   application: WebApplication
@@ -17,6 +18,14 @@ const ConfirmOtherSessionsSignOut = observer(({ application, viewControllerManag
     viewControllerManager.accountMenuController.setOtherSessionsSignOut(false)
   }, [viewControllerManager])
 
+  const confirm = useCallback(() => {
+    application.revokeAllOtherSessions().catch(console.error)
+    closeDialog()
+    application.alertService
+      .alert('You have successfully revoked your sessions from other devices.', undefined, 'Finish')
+      .catch(console.error)
+  }, [application, closeDialog])
+
   return (
     <AlertDialog onDismiss={closeDialog} leastDestructiveRef={cancelRef} className="max-w-[600px] p-0">
       <div className="sk-modal-content">
@@ -24,7 +33,12 @@ const ConfirmOtherSessionsSignOut = observer(({ application, viewControllerManag
           <div className="sk-panel">
             <div className="sk-panel-content">
               <div className="sk-panel-section">
-                <AlertDialogLabel className="text-lg font-bold capitalize">End all other sessions?</AlertDialogLabel>
+                <AlertDialogLabel className="flex items-center justify-between text-lg font-bold capitalize">
+                  End all other sessions?
+                  <button className="rounded p-1 font-bold hover:bg-contrast" onClick={closeDialog}>
+                    <Icon type="close" />
+                  </button>
+                </AlertDialogLabel>
                 <AlertDialogDescription className="sk-panel-row">
                   <p className="text-base text-foreground lg:text-sm">
                     This action will sign out all other devices signed into your account, and remove your data from
@@ -36,17 +50,7 @@ const ConfirmOtherSessionsSignOut = observer(({ application, viewControllerManag
                   <Button ref={cancelRef} onClick={closeDialog}>
                     Cancel
                   </Button>
-                  <Button
-                    primary
-                    colorStyle="danger"
-                    onClick={() => {
-                      application.revokeAllOtherSessions().catch(console.error)
-                      closeDialog()
-                      application.alertService
-                        .alert('You have successfully revoked your sessions from other devices.', undefined, 'Finish')
-                        .catch(console.error)
-                    }}
-                  >
+                  <Button primary colorStyle="danger" onClick={confirm}>
                     End Sessions
                   </Button>
                 </div>