[web] Drop heigh prop from Popup component

For reverting behavior introduced at 8b8de4c. Now we think that having scroll in Popups when there is room from them to grow is worst than a dialog changing its size for adapting to the content changes.
openSUSE · Jun 13, 2023 · 4883fb7 · 4883fb7
1 parent 7acc896
commit 4883fb7
Show file tree

Hide file tree

Showing 9 changed files with 8 additions and 13 deletions.
diff --git a/web/src/components/core/Popup.jsx b/web/src/components/core/Popup.jsx
@@ -189,7 +189,6 @@ const AncillaryAction = ({ children, ...props }) => (
  * @param {boolean} [props.isOpen=false] - whether the popup is displayed or not
  * @param {boolean} [props.showClose=false] - whether the popup should include a "X" action for closing it
  * @param {string} [props.variant="small"] - the popup size, based on Pf4/Modal `variant` prop
- * @param {string} [props.height="auto"] - the popup height, "auto", "medium", "large"
  * @param {React.ReactNode} props.children - the popup content and actions
  * @param {object} [pf4ModalProps] - PF4/Modal props, See {@link https://www.patternfly.org/v4/components/modal#props}
  *
@@ -198,13 +197,10 @@ const Popup = ({
   isOpen = false,
   showClose = false,
   variant = "small",
-  height = "auto",
   children,
-  className,
   ...pf4ModalProps
 }) => {
   const [actions, content] = partition(React.Children.toArray(children), child => child.type === Actions);
-  const classesNames = [className, `${height}-modal-popup`].filter(c => c !== "").join(" ");
 
   useLayoutEffect(() => {
     /**
@@ -241,7 +237,6 @@ const Popup = ({
       showClose={showClose}
       variant={variant}
       actions={actions}
-      className={classesNames}
     >
       { content }
     </Modal>

diff --git a/web/src/components/network/IpSettingsForm.jsx b/web/src/components/network/IpSettingsForm.jsx
@@ -123,7 +123,7 @@ export default function IpSettingsForm({ connection, onClose }) {
   };
 
   return (
-    <Popup isOpen height="medium" title={`Edit "${connection.name}" connection`}>
+    <Popup isOpen title={`Edit "${connection.name}" connection`}>
       <Form id="edit-connection" onSubmit={onSubmit}>
         <FormGroup fieldId="method" label="Mode" isRequired>
           <FormSelect

diff --git a/web/src/components/network/WifiSelector.jsx b/web/src/components/network/WifiSelector.jsx
@@ -130,7 +130,7 @@ function WifiSelector({ isOpen = false, onClose }) {
   });
 
   return (
-    <Popup isOpen={isOpen} height="large" title="Connect to a Wi-Fi network">
+    <Popup isOpen={isOpen} title="Connect to a Wi-Fi network">
       <WifiNetworksList
         networks={networksFromValues(networks)}
         hiddenNetwork={baseHiddenNetwork}

diff --git a/web/src/components/storage/ProposalVolumes.jsx b/web/src/components/storage/ProposalVolumes.jsx
@@ -250,7 +250,7 @@ const VolumeRow = ({ columns, volume, isLoading, onEdit, onDelete }) => {
         </Td>
       </Tr>
 
-      <Popup title="Edit file system" height="medium" isOpen={isFormOpen}>
+      <Popup title="Edit file system" isOpen={isFormOpen}>
         <VolumeForm
           id="editVolumeForm"
           volume={volume}

diff --git a/web/src/components/storage/iscsi/DiscoverForm.jsx b/web/src/components/storage/iscsi/DiscoverForm.jsx
@@ -86,7 +86,7 @@ export default function DiscoverForm({ onSubmit: onSubmitProp, onCancel }) {
   const isDisabled = isLoading || !isValidForm();
 
   return (
-    <Popup isOpen height="medium" title="Discover iSCSI Targets">
+    <Popup isOpen title="Discover iSCSI Targets">
       <Form id={id} onSubmit={onSubmit}>
         { isFailed &&
           <Alert variant="warning" isInline title="Something went wrong">

diff --git a/web/src/components/storage/iscsi/EditNodeForm.jsx b/web/src/components/storage/iscsi/EditNodeForm.jsx
@@ -44,7 +44,7 @@ export default function EditNodeForm({ node, onSubmit: onSubmitProp, onCancel })
   const id = "iscsiEditNode";
 
   return (
-    <Popup isOpen height="medium" title={`Edit ${node.target}`}>
+    <Popup isOpen title={`Edit ${node.target}`}>
       <Form id={id} onSubmit={onSubmit}>
         <FormGroup fieldId="startup" label="Startup">
           <FormSelect

diff --git a/web/src/components/storage/iscsi/InitiatorForm.jsx b/web/src/components/storage/iscsi/InitiatorForm.jsx
@@ -38,7 +38,7 @@ export default function InitiatorForm({ initiator, onSubmit: onSubmitProp, onCan
   const isDisabled = data.name === "";
 
   return (
-    <Popup isOpen height="medium" title="Edit iSCSI Initiator">
+    <Popup isOpen title="Edit iSCSI Initiator">
       <Form id={id} onSubmit={onSubmit}>
         <FormGroup fieldId="initiatorName" label="Name" isRequired>
           <TextInput

diff --git a/web/src/components/storage/iscsi/LoginForm.jsx b/web/src/components/storage/iscsi/LoginForm.jsx
@@ -63,7 +63,7 @@ export default function LoginForm({ node, onSubmit: onSubmitProp, onCancel }) {
   const isDisabled = isLoading || !isValidAuth;
 
   return (
-    <Popup isOpen height="medium" title={`Login ${node.target}`}>
+    <Popup isOpen title={`Login ${node.target}`}>
       <Form id={id} onSubmit={onSubmit}>
         { isFailed &&
           <Alert variant="warning" isInline title="Something went wrong">

diff --git a/web/src/components/users/FirstUser.jsx b/web/src/components/users/FirstUser.jsx
@@ -186,7 +186,7 @@ export default function FirstUser() {
       { isUserDefined ? <UserData user={user} actions={actions} /> : <UserNotDefined actionCb={openForm} /> }
       { /* TODO: Extract this form to a component, if possible */ }
       { isFormOpen &&
-        <Popup isOpen height="medium" title={isEditing ? "Edit user account" : "Create user account"}>
+        <Popup isOpen title={isEditing ? "Edit user account" : "Create user account"}>
           <Form id="createUser" onSubmit={(e) => accept("createUser", e)}>
             { showErrors() &&
               <Alert variant="warning" isInline title="Something went wrong">