Merge branch 'main' into mta-1389

konveyor · Nov 22, 2023 · 87dc5ad · 87dc5ad
2 parents 1f62458 + 63e27fd
commit 87dc5ad
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 24 deletions.
diff --git a/client/src/app/components/SimpleSelectTypeahead.tsx b/client/src/app/components/SimpleSelectTypeahead.tsx
@@ -25,7 +25,9 @@ export interface ISimpleSelectBasicProps {
   toggleId?: string;
   toggleAriaLabel?: string;
   selectMultiple?: boolean;
+  width?: number;
   noResultsFoundText?: string;
+  hideClearButton?: boolean;
 }
 
 export const SimpleSelectTypeahead: React.FC<ISimpleSelectBasicProps> = ({
@@ -37,7 +39,9 @@ export const SimpleSelectTypeahead: React.FC<ISimpleSelectBasicProps> = ({
   toggleId,
   toggleAriaLabel,
   selectMultiple = false,
+  width,
   noResultsFoundText,
+  hideClearButton = false,
 }) => {
   const [isOpen, setIsOpen] = React.useState(false);
   const [selected, setSelected] = React.useState<string | string[]>(
@@ -190,7 +194,8 @@ export const SimpleSelectTypeahead: React.FC<ISimpleSelectBasicProps> = ({
       variant="typeahead"
       onClick={onToggleClick}
       isExpanded={isOpen}
-      isFullWidth
+      isFullWidth={!width}
+      style={{ width: width && width + "px" }}
     >
       <TextInputGroup isPlain>
         <TextInputGroupMain
@@ -199,7 +204,9 @@ export const SimpleSelectTypeahead: React.FC<ISimpleSelectBasicProps> = ({
           onChange={onTextInputChange}
           onKeyDown={onInputKeyDown}
           onBlur={() => {
-            setInputValue("");
+            selectMultiple
+              ? setInputValue("")
+              : setInputValue(selected.toString());
           }}
           id="typeahead-select-input"
           autoComplete="off"
@@ -243,7 +250,7 @@ export const SimpleSelectTypeahead: React.FC<ISimpleSelectBasicProps> = ({
               <TimesIcon aria-hidden />
             </Button>
           )}
-          {!selectMultiple && !!inputValue && (
+          {!hideClearButton && !selectMultiple && !!inputValue && (
             <Button
               variant="plain"
               onClick={() => {
@@ -264,13 +271,13 @@ export const SimpleSelectTypeahead: React.FC<ISimpleSelectBasicProps> = ({
   );
   return (
     <>
-      <div>selected: {[selected].join(",")}</div>
       <Select
         id={id}
         isOpen={isOpen}
         selected={selected}
         onSelect={onSelect}
         onOpenChange={() => {
+          setFilterValue("");
           setIsOpen(false);
         }}
         toggle={toggle}

diff --git a/client/src/app/pages/applications/analysis-wizard/set-targets.tsx b/client/src/app/pages/applications/analysis-wizard/set-targets.tsx
@@ -16,7 +16,7 @@ import { AnalysisWizardFormValues } from "./schema";
 import { useSetting } from "@app/queries/settings";
 import { useFetchTargets } from "@app/queries/targets";
 import { Target } from "@app/api/models";
-import { SimpleSelect } from "@app/components/SimpleSelect";
+import { SimpleSelectTypeahead } from "@app/components/SimpleSelectTypeahead";
 
 export const SetTargets: React.FC = () => {
   const { t } = useTranslation();
@@ -135,20 +135,28 @@ export const SetTargets: React.FC = () => {
           {t("wizard.terms.setTargets")}
         </Title>
         <Text>{t("wizard.label.setTargets")}</Text>
-        <SimpleSelect
-          width={200}
-          variant="typeahead"
-          id="action-select"
-          toggleId="action-select-toggle"
-          toggleAriaLabel="Action select dropdown toggle"
-          aria-label={"Select provider"}
-          value={provider}
-          options={["Java", "Go"]}
-          onChange={(selection) => {
-            setProvider(selection as string);
-          }}
-        />
       </TextContent>
+      <SimpleSelectTypeahead
+        width={200}
+        value={provider}
+        toggleAriaLabel="Action select dropdown toggle"
+        toggleId="action-select-toggle"
+        hideClearButton
+        id="action-select"
+        options={[
+          {
+            value: "Java",
+            children: "Java",
+          },
+          {
+            value: "Go",
+            children: "Go",
+          },
+        ]}
+        onChange={(selection) => {
+          setProvider(selection as string);
+        }}
+      />
       {values.selectedTargets.length === 0 &&
         values.customRulesFiles.length === 0 &&
         !values.sourceRepository && (
@@ -158,7 +166,6 @@ export const SetTargets: React.FC = () => {
             title={t("wizard.label.skipTargets")}
           />
         )}
-
       <Gallery hasGutter>
         {targetOrderSetting.isSuccess
           ? targetOrderSetting.data.map((id, index) => {

diff --git a/client/src/app/pages/applications/applications-table/applications-table.tsx b/client/src/app/pages/applications/applications-table/applications-table.tsx
@@ -340,12 +340,12 @@ export const ApplicationsTable: React.FC = () => {
         getItemValue: (item) => item?.name || "",
       },
       {
-        key: "archetype",
-        title: t("terms.archetype"),
+        key: "archetypes",
+        title: t("terms.archetypes"),
         type: FilterType.multiselect,
         placeholderText:
           t("actions.filterBy", {
-            what: t("terms.archetype").toLowerCase(),
+            what: t("terms.archetypes").toLowerCase(),
           }) + "...",
         getItemValue: (item) => {
           const archetypeNames = item?.archetypes

diff --git a/client/src/app/pages/controls/stakeholder-groups/stakeholder-groups.tsx b/client/src/app/pages/controls/stakeholder-groups/stakeholder-groups.tsx
@@ -240,12 +240,12 @@ export const StakeholderGroups: React.FC = () => {
                   <EmptyStateIcon icon={CubesIcon} />
                   <Title headingLevel="h2" size="lg">
                     {t("composed.noDataStateTitle", {
-                      what: t("terms.stakeholder").toLowerCase(),
+                      what: t("terms.stakeholderGroup").toLowerCase(),
                     })}
                   </Title>
                   <EmptyStateBody>
                     {t("composed.noDataStateBody", {
-                      what: t("terms.stakeholder").toLowerCase(),
+                      what: t("terms.stakeholderGroup").toLowerCase(),
                     })}
                   </EmptyStateBody>
                 </EmptyState>