fix: secondary input

client/src/components/AnnoDialog/AnnoDialog.tsx

@@ -3,24 +3,25 @@ import { Button, Dialog, Classes, Tooltip } from "@blueprintjs/core";
 import { AnnoDialogProps } from "./types";
 import { DialogBody, DialogForm, ErrorText, SecondaryText } from "./style";
 
-export function AnnoDialog(props: AnnoDialogProps): JSX.Element {
-  const {
-    isActive,
-    text,
-    title,
-    instruction,
-    cancelTooltipContent,
-    errorMessage,
-    validationError,
-    annoInput,
-    secondaryInstructions,
-    secondaryInput,
-    handleCancel,
-    handleSubmit,
-    primaryButtonText,
-    primaryButtonProps,
-    inputProps,
-  } = props;
+function AnnoDialog({
+  isActive,
+  text,
+  title,
+  instruction,
+  cancelTooltipContent,
+  errorMessage,
+  validationError,
+  annoInput,
+  secondaryInstructions,
+  secondaryInput,
+  handleCancel,
+  handleSubmit,
+  primaryButtonText,
+  secondaryButtonText,
+  handleSecondaryButtonSubmit,
+  primaryButtonProps,
+  inputProps,
+}: AnnoDialogProps): JSX.Element {
   return (
     <Dialog icon="tag" title={title} isOpen={isActive} onClose={handleCancel}>
       <DialogForm
@@ -34,6 +35,7 @@ export function AnnoDialog(props: AnnoDialogProps): JSX.Element {
           <ErrorText validationError={validationError}>
             {errorMessage}
           </ErrorText>
+          {/* we might rename, secondary button and secondary input are not related */}
           {secondaryInstructions && (
             <SecondaryText secondaryInstructions={secondaryInstructions}>
               {secondaryInstructions}
@@ -46,6 +48,17 @@ export function AnnoDialog(props: AnnoDialogProps): JSX.Element {
             <Tooltip content={cancelTooltipContent}>
               <Button onClick={handleCancel}>Cancel</Button>
             </Tooltip>
+            {/* we might rename, secondary button and secondary input are not related */}
+            {handleSecondaryButtonSubmit && secondaryButtonText ? (
+              <Button
+                onClick={handleSecondaryButtonSubmit}
+                disabled={!text || validationError}
+                intent="none"
+                type="button"
+              >
+                {secondaryButtonText}
+              </Button>
+            ) : null}
             <Button
               {...primaryButtonProps}
               {...inputProps}
@@ -62,3 +75,5 @@ export function AnnoDialog(props: AnnoDialogProps): JSX.Element {
     </Dialog>
   );
 }
+
+export default AnnoDialog;

client/src/components/AnnoDialog/types.ts

@@ -14,6 +14,8 @@ export interface AnnoDialogProps {
   handleCancel: (e: SyntheticEvent<HTMLElement, Event>) => void;
   handleSubmit: (e: MouseEvent<HTMLElement>) => void;
   primaryButtonText: string;
+  secondaryButtonText?: string;
+  handleSecondaryButtonSubmit?: () => void;
   primaryButtonProps: Record<string, unknown>;
   inputProps: Record<string, unknown>;
 }

client/src/components/RightSideBar/components/GeneExpression/components/GeneSet/components/EditGenesetNameDialogue/EditGenesetNameDialogue.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { connect } from "react-redux";
-import { AnnoDialog } from "components/AnnoDialog/AnnoDialog";
+import AnnoDialog from "components/AnnoDialog/AnnoDialog";
 import { LabelInput } from "components/LabelInput/LabelInput";
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any --- FIXME: disabled temporarily on migrate to TS.

client/src/components/RightSideBar/components/GeneExpression/components/GeneSet/components/GeneSetMenus/components/AddGeneToGenesetDialogue/AddGeneToGenesetDialogue.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { connect } from "react-redux";
-import { AnnoDialog } from "components/AnnoDialog/AnnoDialog";
+import AnnoDialog from "components/AnnoDialog/AnnoDialog";
 import { LabelInput } from "components/LabelInput/LabelInput";
 import parseBulkGeneString from "util/parseBulkGeneString";
 import actions from "actions";