Enhance dialog components by adding smooth scroll to top functionality upon opening; update ConfirmDialog, ClearSubmissionsDialog, and DuplicateChainDialog for improved user experience. Remove unused ConfirmDialog from ChainsListPage and TasksListPage, streamlining code.

src/pages/chains/ChainsListPage.tsx

@@ -17,7 +17,6 @@ import { URLs } from '../../__data__/urls'
 import { LoadingSpinner } from '../../components/LoadingSpinner'
 import { ErrorAlert } from '../../components/ErrorAlert'
 import { EmptyState } from '../../components/EmptyState'
-import { ConfirmDialog } from '../../components/ConfirmDialog'
 import { DuplicateChainDialog } from '../../components/DuplicateChainDialog'
 import { ClearSubmissionsDialog } from '../../components/ClearSubmissionsDialog'
 import type { ChallengeChain } from '../../types/challenge'
@@ -27,26 +26,28 @@ export const ChainsListPage: React.FC = () => {
   const navigate = useNavigate()
   const { t } = useTranslation()
   const { data: chains, isLoading, error, refetch } = useGetChainsQuery()
-  const [deleteChain, { isLoading: isDeleting }] = useDeleteChainMutation()
+  const [deleteChain] = useDeleteChainMutation()
 
   const [searchQuery, setSearchQuery] = useState('')
-  const [chainToDelete, setChainToDelete] = useState<ChallengeChain | null>(null)
   const [chainToDuplicate, setChainToDuplicate] = useState<ChallengeChain | null>(null)
   const [chainToClearSubmissions, setChainToClearSubmissions] = useState<ChallengeChain | null>(null)
   const [updatingChainId, setUpdatingChainId] = useState<string | null>(null)
   const [updateChain] = useUpdateChainMutation()
 
-  const handleDeleteChain = async () => {
-    if (!chainToDelete) return
+  const handleDeleteChain = async (chain: ChallengeChain) => {
+    const confirmed = window.confirm(
+      t('challenge.admin.chains.delete.confirm.message', { name: chain.name })
+    )
+
+    if (!confirmed) return
 
     try {
-      await deleteChain(chainToDelete.id).unwrap()
+      await deleteChain(chain.id).unwrap()
       toaster.create({
         title: t('challenge.admin.common.success'),
         description: t('challenge.admin.chains.deleted'),
         type: 'success',
       })
-      setChainToDelete(null)
     } catch (err) {
       toaster.create({
         title: t('challenge.admin.common.error'),
@@ -205,7 +206,7 @@ export const ChainsListPage: React.FC = () => {
                         size="sm"
                         variant="ghost"
                         colorPalette="red"
-                        onClick={() => setChainToDelete(chain)}
+                        onClick={() => handleDeleteChain(chain)}
                       >
                         {t('challenge.admin.chains.list.button.delete')}
                       </Button>
@@ -218,16 +219,6 @@ export const ChainsListPage: React.FC = () => {
         </Box>
       )}
 
-      <ConfirmDialog
-        isOpen={!!chainToDelete}
-        onClose={() => setChainToDelete(null)}
-        onConfirm={handleDeleteChain}
-        title={t('challenge.admin.chains.delete.confirm.title')}
-        message={t('challenge.admin.chains.delete.confirm.message', { name: chainToDelete?.name })}
-        confirmLabel={t('challenge.admin.chains.delete.confirm.button')}
-        isLoading={isDeleting}
-      />
-
       <DuplicateChainDialog
         isOpen={!!chainToDuplicate}
         onClose={() => setChainToDuplicate(null)}