Fix rollback form (#2761)

* Fix revision=-1 if the user doesn't modify the form

* Minor changes in test

dashboard/src/components/AppView/AppControls/RollbackButton/RollbackDialog.test.tsx

@@ -23,15 +23,20 @@ it("should render the form if it is not loading", () => {
 });
 
 it("should submit the current revision", () => {
+  const currentRevision = defaultProps.currentRevision;
   const onConfirm = jest.fn();
-  const wrapper = mount(<RollbackDialog {...defaultProps} onConfirm={onConfirm} />);
+  const wrapper = mount(
+    <RollbackDialog {...defaultProps} currentRevision={currentRevision} onConfirm={onConfirm} />,
+  );
   const submit = wrapper.find(CdsButton).filterWhere(b => b.text() === "Rollback");
   expect(submit).toExist();
+  expect(wrapper.find("option").at(0).prop("value")).toBe(1);
+  expect(wrapper.find("cds-control-message").text()).toBe("(current: 2)");
   act(() => {
     (submit.prop("onClick") as any)();
   });
   wrapper.update();
-  expect(onConfirm).toBeCalledWith(1);
+  expect(onConfirm).toBeCalledWith(currentRevision - 1);
 });
 
 it("should disable the rollback button if there are no revisions", () => {

dashboard/src/components/AppView/AppControls/RollbackButton/RollbackDialog.tsx

@@ -3,7 +3,7 @@ import { CdsControlMessage } from "@cds/react/forms";
 import { CdsModal, CdsModalActions, CdsModalContent, CdsModalHeader } from "@cds/react/modal";
 import { CdsSelect } from "@cds/react/select";
 import Alert from "components/js/Alert";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import LoadingWrapper from "../../../LoadingWrapper/LoadingWrapper";
 import "./RollbackDialog.css";
 
@@ -24,11 +24,13 @@ function RollbackDialog({
   onConfirm,
   closeModal,
 }: IRollbackDialogProps) {
-  const [targetRevision, setTargetRevision] = useState(currentRevision - 1);
+  const [targetRevision, setTargetRevision] = useState(currentRevision);
+  const [hasUserChanges, setHasUserChanges] = useState(false);
   const options: number[] = [];
   // If there are no revisions to rollback to, disable
   const disableRollback = currentRevision === 1;
   const selectRevision = (e: React.ChangeEvent<HTMLSelectElement>) => {
+    setHasUserChanges(true);
     setTargetRevision(Number(e.target.value));
   };
   const onClick = () => {
@@ -39,6 +41,12 @@ function RollbackDialog({
     options.push(i);
   }
 
+  useEffect(() => {
+    if (!hasUserChanges) {
+      setTargetRevision(currentRevision - 1);
+    }
+  }, [hasUserChanges, currentRevision]);
+
   /* eslint-disable jsx-a11y/label-has-associated-control */
   return (
     <>
@@ -52,9 +60,9 @@ function RollbackDialog({
                 <p>The application has not been upgraded, it's not possible to rollback.</p>
               ) : (
                 <>
-                  <CdsSelect layout="horizontal" id="revision-selector" onChange={selectRevision}>
+                  <CdsSelect layout="horizontal" id="revision-selector">
                     <label>Select the revision to which you want to rollback</label>
-                    <select>
+                    <select value={targetRevision} onChange={selectRevision}>
                       {options.map(o => (
                         <option key={o} value={o}>
                           {o}