From 474c6aa52e8c97581eebc1ca12cdc8f892515dcb Mon Sep 17 00:00:00 2001
From: Miodec <jack@monkeytype.com>
Date: Fri, 15 Mar 2024 17:24:15 +0100
Subject: [PATCH] impr(animated modal): custom show options when modal is shown
 in a chain

---
 frontend/src/ts/commandline/commandline.ts | 3 +++
 frontend/src/ts/utils/animated-modal.ts    | 5 +++++
 2 files changed, 8 insertions(+)

diff --git a/frontend/src/ts/commandline/commandline.ts b/frontend/src/ts/commandline/commandline.ts
index 397156fd1..d0e16e0b5 100644
--- a/frontend/src/ts/commandline/commandline.ts
+++ b/frontend/src/ts/commandline/commandline.ts
@@ -535,6 +535,9 @@ const modal = new AnimatedModal({
   customWrapperClickHandler: (): void => {
     hide();
   },
+  showOptionsWhenInChain: {
+    focusFirstInput: true,
+  },
   setup: (modal): void => {
     const input = modal.querySelector("input") as HTMLInputElement;
 
diff --git a/frontend/src/ts/utils/animated-modal.ts b/frontend/src/ts/utils/animated-modal.ts
index dc3273a71..3fe131952 100644
--- a/frontend/src/ts/utils/animated-modal.ts
+++ b/frontend/src/ts/utils/animated-modal.ts
@@ -40,6 +40,7 @@ type ConstructorParams = {
   dialogId: string;
   appendTo?: Skeleton.SkeletonAppendParents;
   customAnimations?: ConstructorCustomAnimations;
+  showOptionsWhenInChain?: ShowOptions;
   customEscapeHandler?: (e: KeyboardEvent) => void;
   customWrapperClickHandler?: (e: MouseEvent) => void;
   setup?: (modal: HTMLElement) => void;
@@ -55,6 +56,7 @@ export default class AnimatedModal {
   private open = false;
   private setupRan = false;
   private previousModalInChain: AnimatedModal | undefined;
+  private showOptionsWhenInChain: ShowOptions | undefined;
   private skeletonAppendParent: Skeleton.SkeletonAppendParents;
   private customShowAnimations: CustomWrapperAndModalAnimations | undefined;
   private customHideAnimations: CustomWrapperAndModalAnimations | undefined;
@@ -106,6 +108,7 @@ export default class AnimatedModal {
     this.customShowAnimations = constructorParams.customAnimations?.show;
     this.customHideAnimations = constructorParams.customAnimations?.hide;
     this.previousModalInChain = undefined;
+    this.showOptionsWhenInChain = constructorParams.showOptionsWhenInChain;
 
     this.customEscapeHandler = constructorParams?.customEscapeHandler;
     this.customWrapperClickHandler =
@@ -359,6 +362,7 @@ export default class AnimatedModal {
                   animationMode: "modalOnly",
                   animationDurationMs:
                     modalAnimationDuration * MODAL_ONLY_ANIMATION_MULTIPLIER,
+                  ...this.previousModalInChain.showOptionsWhenInChain,
                 });
                 this.previousModalInChain = undefined;
               }
@@ -390,6 +394,7 @@ export default class AnimatedModal {
                 animationMode: "modalOnly",
                 animationDurationMs:
                   modalAnimationDuration * MODAL_ONLY_ANIMATION_MULTIPLIER,
+                ...this.previousModalInChain.showOptionsWhenInChain,
               });
               this.previousModalInChain = undefined;
             }