remove unwanted change

ansible · Nov 12, 2024 · fc3d80f · fc3d80f
1 parent 160b8cf
commit fc3d80f
Show file tree

Hide file tree

Showing 8 changed files with 4,655 additions and 2,690 deletions.
diff --git a/ansible_ai_connect_admin_portal/package-lock.json b/ansible_ai_connect_admin_portal/package-lock.json
diff --git a/ansible_ai_connect_admin_portal/package.json b/ansible_ai_connect_admin_portal/package.json
@@ -8,12 +8,12 @@
     "npm": ">=7.0.0"
   },
   "dependencies": {
-    "@ansible/ansible-ui-framework": "^2.4.2590",
+    "@ansible/ansible-ui-framework": "^2.4.456",
     "@babel/core": "^7.16.0",
     "@babel/plugin-proposal-private-property-in-object": "^7.16.0",
-    "@patternfly/patternfly": "^5.1",
-    "@patternfly/react-core": "^5.1",
-    "@patternfly/react-icons": "^5.1",
+    "@patternfly/patternfly": "^4.224.5",
+    "@patternfly/react-core": "^4.276.11",
+    "@patternfly/react-icons": "^4.93.7",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
     "@svgr/webpack": "8.1.0",
     "i18next-http-backend": "^2.2.1",

diff --git a/ansible_ai_connect_admin_portal/src/AppHeader.tsx b/ansible_ai_connect_admin_portal/src/AppHeader.tsx
@@ -24,18 +24,19 @@ export function AppHeader(props: AppHeaderProps) {
 
   return (
     <PageMasthead
-      brand={
+      icon={
         <Brand alt="" widths={{ default: "125px", md: "125px" }}>
           <source media="(min-width: 125px)" srcSet={RedHatLogo} />
         </Brand>
       }
+      title=""
     >
       <ToolbarItem style={{ flexGrow: 1 }} />
       <ToolbarGroup variant="icon-button-group">
         <ToolbarItem>
           <PageMastheadDropdown
             id="account-menu"
-            icon={<UserCircleIcon/>}
+            icon={<UserCircleIcon size="md" />}
             userName={userName}
           >
             <DropdownItem

diff --git a/ansible_ai_connect_admin_portal/src/ModelSettingsOverview.tsx b/ansible_ai_connect_admin_portal/src/ModelSettingsOverview.tsx
@@ -237,6 +237,7 @@ export const ModelSettingsOverview = (props: ModelSettingsOverviewProps) => {
                         <SplitItem>
                           <BusyButton
                             variant={"tertiary"}
+                            isSmall={true}
                             isBusy={isValidatingKey}
                             isDisabled={isValidatingKey}
                             onClick={testKey}
@@ -408,6 +409,7 @@ export const ModelSettingsOverview = (props: ModelSettingsOverviewProps) => {
                           <SplitItem>
                             <BusyButton
                               variant={"tertiary"}
+                              isSmall={true}
                               isBusy={isValidatingModelId}
                               isDisabled={isValidatingModelId}
                               onClick={testModelId}

diff --git a/ansible_ai_connect_admin_portal/src/PageApp.tsx b/ansible_ai_connect_admin_portal/src/PageApp.tsx
@@ -63,7 +63,7 @@ interface PageRouterLayoutProps {
 function PageRouterLayout(props: PageRouterLayoutProps) {
   const { header, navigationItems } = props;
   return (
-    <PageFramework defaultRefreshInterval={10}>
+    <PageFramework>
       <Page
         header={header}
         sidebar={<PageSidebar navigation={navigationItems} />}

diff --git a/ansible_ai_connect_admin_portal/src/PageMastheadDropdown.tsx b/ansible_ai_connect_admin_portal/src/PageMastheadDropdown.tsx
@@ -1,13 +1,9 @@
 import {
   Dropdown,
-  MenuToggle,
-  MenuToggleElement,
+  DropdownToggle,
   Flex,
   FlexItem,
-  DropdownList,
-  DropdownItem,
 } from "@patternfly/react-core";
-import React from 'react';
 import { ReactNode, useCallback, useState } from "react";
 import { useBreakpoint } from "@ansible/ansible-ui-framework";
 
@@ -25,14 +21,17 @@ export function PageMastheadDropdown(props: PageMastheadDropdownProps) {
   const onSelect = useCallback(() => setOpen((open) => !open), []);
   const onToggle = useCallback(() => setOpen((open) => !open), []);
   const _children = Array.isArray(children) ? children : [children];
-  const [isOpen] = React.useState(false);
 
   return (
     <Dropdown
       id={id}
       onSelect={onSelect}
-      toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
-        <MenuToggle ref={toggleRef} onClick={onToggle} isExpanded={isOpen}>
+      toggle={
+        <DropdownToggle
+          toggleIndicator={null}
+          onToggle={onToggle}
+          data-testid="page-masthead-dropdown__button"
+        >
           <Flex
             alignItems={{ default: "alignItemsCenter" }}
             flexWrap={{ default: "nowrap" }}
@@ -41,16 +40,14 @@ export function PageMastheadDropdown(props: PageMastheadDropdownProps) {
             <FlexItem>{icon}</FlexItem>
             {isSmallOrLarger && <FlexItem wrap="nowrap">{userName}</FlexItem>}
           </Flex>
-        </MenuToggle>
-      )}
+        </DropdownToggle>
+      }
       isOpen={open}
       isPlain
+      dropdownItems={_children}
+      position="right"
       data-cy={id}
       data-testid="page-masthead-dropdown"
-    >
-      <DropdownList>
-        <DropdownItem>{_children}</DropdownItem>
-      </DropdownList>
-    </Dropdown>
+    />
   );
 }
diff --git a/ansible_ai_connect_admin_portal/src/SingleInlineEdit.tsx b/ansible_ai_connect_admin_portal/src/SingleInlineEdit.tsx
@@ -24,8 +24,7 @@ export const SingleInlineEdit = (props: InlineTextInputProps) => {
         <InputGroup>
           <TextInput
             type={isPassword && passwordHidden ? "password" : "text"}
-            onChange={(_event, value: string) => onChange(value)}
-            // onChange={(value, event) => props.onChange?.(value)}
+            onChange={(value, event) => props.onChange?.(value)}
             aria-label={props["aria-label"]}
             placeholder={placeholder}
             isDisabled={isDisabled}
@@ -58,7 +57,7 @@ export const SingleInlineEdit = (props: InlineTextInputProps) => {
           <TextInput
             value={value}
             type={"text"}
-            onChange={(_event, value: string) => onChange(value)}
+            onChange={(value, event) => props.onChange?.(value)}
             aria-label={props["aria-label"]}
             placeholder={placeholder}
             isDisabled={isDisabled}

diff --git a/ansible_ai_connect_admin_portal/src/denied/PageAppDenied.tsx b/ansible_ai_connect_admin_portal/src/denied/PageAppDenied.tsx
@@ -53,7 +53,7 @@ export function PageAppDenied(props: PageAppDeniedProps) {
 function PageRouterLayout(props: PageAppDeniedProps) {
   const { header, navigationItems, hasSubscription } = props;
   return (
-    <PageFramework defaultRefreshInterval={10}>
+    <PageFramework>
       <Page
         header={header}
         sidebar={<PageSidebar navigation={navigationItems} />}