Merge branch 'main' into update-business-service-table

konveyor · Nov 15, 2023 · d9bb666 · d9bb666
2 parents 686657e + fbabc56
commit d9bb666
Show file tree

Hide file tree

Showing 11 changed files with 280 additions and 108 deletions.
diff --git a/client/src/app/api/models.ts b/client/src/app/api/models.ts
@@ -503,13 +503,10 @@ export interface TrackerProjectIssuetype {
 }
 
 export interface AnalysisDependency {
-  createTime: string;
-  name: string;
   provider: string;
-  version: string;
-  sha: string;
-  applications: number;
+  name: string;
   labels: string[];
+  applications: number;
 }
 
 export interface AnalysisAppDependency {
@@ -519,12 +516,12 @@ export interface AnalysisAppDependency {
   businessService: string;
   dependency: {
     id: number;
+    provider: string;
     name: string;
     version: string;
-    provider: string;
+    sha: string;
     indirect: boolean;
-    //TODO: Glean from labels somehow
-    // management?: string;
+    labels: string[];
   };
 }
 
@@ -622,6 +619,7 @@ export interface Ticket {
   reference?: string | null;
   readonly status?: TicketStatus | null;
   error?: boolean;
+  link?: string;
 }
 
 export type Role = "Owner" | "Contributor" | null;

diff --git a/client/src/app/components/ExternalLink.tsx b/client/src/app/components/ExternalLink.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+import { Flex, FlexItem, Icon, Text } from "@patternfly/react-core";
+import ExternalLinkAltIcon from "@patternfly/react-icons/dist/esm/icons/external-link-alt-icon";
+
+/**
+ * Render a link open an external href in another tab with appropriate styling.
+ */
+export const ExternalLink: React.FC<{
+  href: string;
+  children: React.ReactNode;
+}> = ({ href, children }) => (
+  <Flex spaceItems={{ default: "spaceItemsSm" }}>
+    <FlexItem>
+      <Text component="a" href={href} target="_blank">
+        {children}
+      </Text>
+    </FlexItem>
+    <FlexItem>
+      <Icon size="sm" status="info">
+        <ExternalLinkAltIcon />
+      </Icon>
+    </FlexItem>
+  </Flex>
+);
+
+export default ExternalLink;
diff --git a/client/src/app/components/FilterToolbar/SearchFilterControl.tsx b/client/src/app/components/FilterToolbar/SearchFilterControl.tsx
@@ -51,7 +51,7 @@ export const SearchFilterControl = <TItem, TFilterCategoryKey extends string>({
       <InputGroup>
         <TextInput
           name={id}
-          id={id}
+          id="search-input"
           type={isNumeric ? "number" : "search"}
           onChange={(_, value) => setInputValue(value)}
           aria-label={`${category.title} filter`}

diff --git a/...app/pages/applications/components/application-detail-drawer/application-detail-fields.tsx b/...app/pages/applications/components/application-detail-drawer/application-detail-fields.tsx
@@ -8,20 +8,28 @@ import {
   Button,
   Grid,
   GridItem,
+  Spinner,
 } from "@patternfly/react-core";
 import { Application } from "@app/api/models";
 import spacing from "@patternfly/react-styles/css/utilities/Spacing/spacing";
 import { ApplicationBusinessService } from "../application-business-service";
 import { EmptyTextMessage } from "@app/components/EmptyTextMessage";
 import { EditIcon } from "@patternfly/react-icons";
+import { useFetchTickets } from "@app/queries/tickets";
+import { useDeleteTicketMutation } from "@app/queries/migration-waves";
+import { UnlinkIcon } from "@patternfly/react-icons";
 
 export const ApplicationDetailFields: React.FC<{
   application: Application | null;
   onEditClick: () => void;
   onCloseClick: () => void;
 }> = ({ application, onEditClick, onCloseClick }) => {
   const { t } = useTranslation();
-
+  const { tickets } = useFetchTickets();
+  const { mutate: deleteTicket, isLoading } = useDeleteTicketMutation();
+  const matchingTicket = tickets?.find(
+    (ticket) => ticket.application?.id === application?.id
+  );
   return (
     <>
       <TextContent className={spacing.mtLg}>
@@ -143,11 +151,51 @@ export const ApplicationDetailFields: React.FC<{
       <Title headingLevel="h3" size="md">
         {t("terms.migrationWave")}
       </Title>
-      <Text component="small">
+      <Text
+        component={TextVariants.small}
+        className="pf-v5-u-color-200 pf-v5-u-font-weight-light"
+      >
+        Wave name{": "}
+      </Text>
+      <Text
+        component={TextVariants.small}
+        className="pf-v5-u-color-200 pf-v5-u-font-weight-light"
+      >
         {application?.migrationWave
           ? application.migrationWave.name
           : t("terms.unassigned")}
       </Text>
+      <br />
+      <Text
+        component={TextVariants.small}
+        className="pf-v5-u-color-200 pf-v5-u-font-weight-light"
+      >
+        Ticket{": "}
+      </Text>
+      <Text
+        component={TextVariants.small}
+        className="pf-v5-u-color-200 pf-v5-u-font-weight-light"
+      >
+        {matchingTicket ? (
+          <a href={matchingTicket.link} target="_">
+            {matchingTicket?.link}
+          </a>
+        ) : (
+          t("terms.unassigned")
+        )}
+        {matchingTicket?.id ? (
+          isLoading ? (
+            <Spinner role="status" size="sm" />
+          ) : (
+            <Button
+              variant="link"
+              icon={<UnlinkIcon />}
+              onClick={() => deleteTicket(matchingTicket.id)}
+            />
+          )
+        ) : null}
+      </Text>
+
       <Title headingLevel="h3" size="md">
         {t("terms.commentsFromApplication")}
       </Title>

diff --git a/client/src/app/pages/assessment/components/custom-wizard-footer/custom-wizard-footer.tsx b/client/src/app/pages/assessment/components/custom-wizard-footer/custom-wizard-footer.tsx
@@ -93,16 +93,16 @@ export const CustomWizardFooter: React.FC<CustomWizardFooterProps> = ({
           >
             {t("actions.cancel")}
           </Button>
-          {!isFirstStep && (
+          {
             <Button
               variant="link"
               onClick={onSaveAsDraft}
-              isDisabled={isFormInvalid || isFirstStep || isSaveAsDraftDisabled}
+              isDisabled={isFormInvalid || isSaveAsDraftDisabled}
               cy-data="save-as-draft"
             >
               {t("actions.saveAsDraft")}
             </Button>
-          )}
+          }
         </>
       </WizardFooterWrapper>
     </>

diff --git a/client/src/app/pages/dependencies/dependencies.tsx b/client/src/app/pages/dependencies/dependencies.tsx
@@ -31,6 +31,7 @@ import { useSelectionState } from "@migtools/lib-ui";
 import { DependencyAppsDetailDrawer } from "./dependency-apps-detail-drawer";
 import { useSharedAffectedApplicationFilterCategories } from "../issues/helpers";
 import spacing from "@patternfly/react-styles/css/utilities/Spacing/spacing";
+import { getParsedLabel } from "@app/utils/rules-utils";
 
 export const Dependencies: React.FC = () => {
   const { t } = useTranslation();
@@ -79,31 +80,10 @@ export const Dependencies: React.FC = () => {
           }) + "...",
         getServerFilterValue: (value) => (value ? [`*${value[0]}*`] : []),
       },
-      {
-        key: "version",
-        title: t("terms.version"),
-        type: FilterType.search,
-        filterGroup: "Dependency",
-        placeholderText:
-          t("actions.filterBy", {
-            what: t("terms.label").toLowerCase(),
-          }) + "...",
-        getServerFilterValue: (value) => (value ? [`*${value[0]}*`] : []),
-      },
-      {
-        key: "sha",
-        title: "SHA",
-        type: FilterType.search,
-        filterGroup: "Dependency",
-        placeholderText:
-          t("actions.filterBy", {
-            what: t("terms.name").toLowerCase(),
-          }) + "...",
-        getServerFilterValue: (value) => (value ? [`*${value[0]}*`] : []),
-      },
     ],
     initialItemsPerPage: 10,
   });
+
   const {
     result: { data: currentPageItems, total: totalItemCount },
     isFetching,
@@ -179,8 +159,6 @@ export const Dependencies: React.FC = () => {
                   <Th {...getThProps({ columnKey: "foundIn" })} />
                   <Th {...getThProps({ columnKey: "provider" })} />
                   <Th {...getThProps({ columnKey: "labels" })} />
-                  <Th {...getThProps({ columnKey: "version" })} />
-                  <Th {...getThProps({ columnKey: "sha" })} />
                 </TableHeaderContentWithControls>
               </Tr>
             </Thead>
@@ -190,63 +168,54 @@ export const Dependencies: React.FC = () => {
               isNoData={totalItemCount === 0}
               numRenderedColumns={numRenderedColumns}
             >
-              {currentPageItems?.map((dependency, rowIndex) => {
-                return (
-                  <Tbody key={dependency.name + rowIndex}>
-                    <Tr {...getTrProps({ item: dependency })}>
-                      <TableRowContentWithControls
-                        {...tableControls}
-                        item={dependency}
-                        rowIndex={rowIndex}
-                      >
-                        <Td width={25} {...getTdProps({ columnKey: "name" })}>
-                          {dependency.name}
-                        </Td>
-                        <Td
-                          width={10}
-                          {...getTdProps({ columnKey: "foundIn" })}
-                        >
-                          <Button
-                            className={spacing.pl_0}
-                            variant="link"
-                            onClick={(_) => {
-                              if (activeItem && activeItem === dependency) {
-                                clearActiveItem();
-                              } else {
-                                setActiveItem(dependency);
-                              }
-                            }}
-                          >
-                            {`${dependency.applications} application(s)`}
-                          </Button>
-                        </Td>
-                        <Td
-                          width={10}
-                          {...getTdProps({ columnKey: "provider" })}
-                        >
-                          {dependency.provider}
-                        </Td>
-                        <Td width={10} {...getTdProps({ columnKey: "labels" })}>
-                          <LabelGroup>
-                            {dependency?.labels?.map((label) => {
-                              return <Label>{label}</Label>;
-                            })}
-                          </LabelGroup>
-                        </Td>
-                        <Td
-                          width={10}
-                          {...getTdProps({ columnKey: "version" })}
+              <Tbody>
+                {currentPageItems?.map((dependency, rowIndex) => (
+                  <Tr
+                    key={dependency.name + rowIndex}
+                    {...getTrProps({ item: dependency })}
+                  >
+                    <TableRowContentWithControls
+                      {...tableControls}
+                      item={dependency}
+                      rowIndex={rowIndex}
+                    >
+                      <Td width={25} {...getTdProps({ columnKey: "name" })}>
+                        {dependency.name}
+                      </Td>
+                      <Td width={10} {...getTdProps({ columnKey: "foundIn" })}>
+                        <Button
+                          className={spacing.pl_0}
+                          variant="link"
+                          onClick={(_) => {
+                            if (activeItem && activeItem === dependency) {
+                              clearActiveItem();
+                            } else {
+                              setActiveItem(dependency);
+                            }
+                          }}
                         >
-                          {dependency.version}
-                        </Td>
-                        <Td width={10} {...getTdProps({ columnKey: "sha" })}>
-                          {dependency.sha}
-                        </Td>
-                      </TableRowContentWithControls>
-                    </Tr>
-                  </Tbody>
-                );
-              })}
+                          {`${dependency.applications} application(s)`}
+                        </Button>
+                      </Td>
+                      <Td width={10} {...getTdProps({ columnKey: "provider" })}>
+                        {dependency.provider}
+                      </Td>
+                      <Td width={10} {...getTdProps({ columnKey: "labels" })}>
+                        <LabelGroup>
+                          {dependency?.labels?.map((label) => {
+                            if (getParsedLabel(label).labelType !== "language")
+                              return (
+                                <Label>
+                                  {getParsedLabel(label).labelValue}
+                                </Label>
+                              );
+                          })}
+                        </LabelGroup>
+                      </Td>
+                    </TableRowContentWithControls>
+                  </Tr>
+                ))}
+              </Tbody>
             </ConditionalTableBody>
           </Table>
           <SimplePagination
@@ -259,7 +228,7 @@ export const Dependencies: React.FC = () => {
       <DependencyAppsDetailDrawer
         dependency={activeItem || null}
         onCloseClick={() => setActiveItem(null)}
-      ></DependencyAppsDetailDrawer>
+      />
     </>
   );
 };