Display a progress notification when clearing all checkpoints

Author: robertpiosik

packages/ui/src/components/editor/panel/Page/Page.tsx

@@ -28,6 +28,9 @@ export const Page: React.FC<Props> = (props) => {
         <div>{props.header_slot}</div>
       </div>
       {props.children}
+      {props.footer_slot && (
+        <div className={styles.footer}>{props.footer_slot}</div>
+      )}
     </div>
   )
 }

packages/vscode/src/commands/checkpoints-command/actions/clear-all-checkpoints.ts

@@ -7,22 +7,30 @@ import { Logger } from '@shared/utils/logger'
 export const clear_all_checkpoints = async (
   context: vscode.ExtensionContext
 ) => {
-  const checkpoints = await get_checkpoints(context)
-
-  for (const checkpoint of checkpoints) {
-    try {
-      const checkpoint_path = get_checkpoint_path(checkpoint.timestamp)
-      await vscode.workspace.fs.delete(vscode.Uri.file(checkpoint_path), {
-        recursive: true
-      })
-    } catch (error) {
-      Logger.warn({
-        function_name: 'clear_all_checkpoints',
-        message: 'Could not delete checkpoint file',
-        data: error
-      })
+  const clear_task = async () => {
+    const checkpoints = await get_checkpoints(context)
+    for (const checkpoint of checkpoints) {
+      try {
+        const checkpoint_path = get_checkpoint_path(checkpoint.timestamp)
+        await vscode.workspace.fs.delete(vscode.Uri.file(checkpoint_path), {
+          recursive: true
+        })
+      } catch (error) {
+        Logger.warn({
+          function_name: 'clear_all_checkpoints',
+          message: 'Could not delete checkpoint file',
+          data: error
+        })
+      }
     }
+    await context.workspaceState.update(CHECKPOINTS_STATE_KEY, [])
   }
-
-  await context.workspaceState.update(CHECKPOINTS_STATE_KEY, [])
+  await vscode.window.withProgress(
+    {
+      location: vscode.ProgressLocation.Notification,
+      title: 'Clearing all checkpoints...',
+      cancellable: false
+    },
+    clear_task
+  )
 }

packages/vscode/src/views/panel/frontend/Panel.tsx

@@ -348,7 +348,6 @@ export const Panel = () => {
                   }
                 />
               }
-              header_slot={<></>}
             >
               <UiResponsePreview
                 items={items_to_review}