Add confirmation dialog

app/src/actions/clearTopic.ts

@@ -3,11 +3,28 @@ import { AppState } from '../reducers'
 import { Dispatch } from 'redux'
 import { makePublishEvent, rendererEvents } from '../../../events'
 import { moveSelectionUpOrDownwards } from './visibleTreeTraversal'
+import { globalActions } from '.'
 
-export const clearTopic = (topic: q.TreeNode<any>, recursive: boolean, subtopicClearLimit = 50) => (
+export const clearTopic = (topic: q.TreeNode<any>, recursive: boolean, subtopicClearLimit = 50) => async (
   dispatch: Dispatch<any>,
   getState: () => AppState
 ) => {
+  if (recursive) {
+    const topicCount = topic.childTopicCount()
+    const deleteLimitMessage =
+      topicCount > subtopicClearLimit ? ` You can only delete ${subtopicClearLimit} child topics at once.` : ''
+    const childTopicsMessage = topicCount > 0 ? ` and ${topicCount} child ${topicCount === 1 ? 'topic' : 'topics'}` : ''
+    const confirmed = await dispatch(
+      globalActions.requestConfirmation(
+        'Confirm delete',
+        `Do you want to delete "${topic.path()}"${childTopicsMessage}?${deleteLimitMessage}`
+      )
+    )
+    if (!confirmed) {
+      return
+    }
+  }
+
   dispatch(moveSelectionUpOrDownwards('next'))
 
   const { connectionId } = getState().connection