From 071e7811cee07d4f2a0a81ab46029459aa4e5c74 Mon Sep 17 00:00:00 2001
From: Tomas Matus <tomatus777@gmail.com>
Date: Thu, 14 Sep 2023 15:32:40 +0200
Subject: [PATCH] Fix mobile layout

---
 src/ostree.jsx | 40 ++++++++++------------------------------
 1 file changed, 10 insertions(+), 30 deletions(-)

diff --git a/src/ostree.jsx b/src/ostree.jsx
index e71a17f0..d9c595ad 100644
--- 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: "" });