Fix mobile layout

cockpit-project · Sep 14, 2023 · 071e781 · 071e781
1 parent fc06636
commit 071e781
Showing 1 changed file with 10 additions and 30 deletions.
diff --git a/src/ostree.jsx b/src/ostree.jsx
@@ -37,9 +37,6 @@ import {
 import { Gallery, } from "@patternfly/react-core/dist/esm/layouts/Gallery/index.js";
 import { Label, } from "@patternfly/react-core/dist/esm/components/Label";
 import { List, ListItem } from "@patternfly/react-core/dist/esm/components/List";
-import {
-    OverflowMenu, OverflowMenuContent, OverflowMenuGroup, OverflowMenuItem, OverflowMenuControl, OverflowMenuDropdownItem
-} from "@patternfly/react-core/dist/esm/components/OverflowMenu";
 import { Page, PageSection, } from "@patternfly/react-core/dist/esm/components/Page";
 import { Popover } from "@patternfly/react-core/dist/esm/components/Popover";
 import { Spinner } from "@patternfly/react-core/dist/esm/components/Spinner";
@@ -331,9 +328,9 @@ const Deployments = ({ versions }) => {
     return (
         <ListingTable aria-label={_("Deployments and updates")}
                   id="available-deployments"
-                  gridBreakPoint=''
                   columns={columns}
                   variant="compact"
+                  gridBreakPoint="grid-lg"
                   rows={items} />
     );
 };
@@ -405,7 +402,6 @@ const DeploymentDetails = (akey, info, packages, doRollback, doUpgrade, doRebase
                     {labels}
                 </Flex>
             ),
-            props: { className: "pf-v5-c-table__action" },
         }
     ];
 
@@ -415,31 +411,15 @@ const DeploymentDetails = (akey, info, packages, doRollback, doUpgrade, doRebase
 
     if (action_name) {
         columns.push({
-            title: <OverflowMenu breakpoint="lg" className="deployment-actions-btn">
-                <OverflowMenuContent>
-                    <OverflowMenuGroup groupType="button">
-                        <OverflowMenuItem>
-                            <Button size="sm" onClick={action}
-                                variant={action_name === "Roll back" ? "secondary" : "primary"}>
-                                {action_name}
-                            </Button>
-                        </OverflowMenuItem>
-                    </OverflowMenuGroup>
-                </OverflowMenuContent>
-                <OverflowMenuControl>
-                    <Dropdown position="right"
-                              onSelect={() => setOpenedKebab(akey, !openedKebab)}
-                              toggle={
-                                  <KebabToggle onToggle={(_event, open) => setOpenedKebab(akey, open)} />
-                              }
-                              isOpen={openedKebab}
-                              isPlain
-                              dropdownItems={[<OverflowMenuDropdownItem key={action_name} isShared onClick={action}>
-                                  {action_name}
-                              </OverflowMenuDropdownItem>]}
-                    />
-                </OverflowMenuControl>
-            </OverflowMenu>
+            title: (
+                <Flex justifyContent={{ default: "justifyContentFlexEnd" }}>
+                    <Button size="sm" onClick={action}
+                        variant={action_name === "Roll back" ? "secondary" : "primary"}
+                    >
+                        {action_name}
+                    </Button>
+                </Flex>
+            ),
         });
     } else {
         columns.push({ title: "" });