🐛 Add provider to custom target form (#1516)

Resolves https://issues.redhat.com/browse/MTA-1627 as discussed in the
UXD call 11-7-23
<img width="1379" alt="Screenshot 2023-11-07 at 3 50 28 PM"
src="https://github.com/konveyor/tackle2-ui/assets/11218376/71cb21df-fd60-49a6-860f-087c9c66279b">

Signed-off-by: ibolton336 <[email protected]>

client/public/locales/en/translation.json

@@ -276,6 +276,7 @@
     "credentialType": "Credential type",
     "criticality": "Criticality",
     "currentLandscape": "Current landscape",
+    "customTargetOfType": "custom migration target: {{type}}",
     "customTarget": "Custom migration target",
     "customTargets": "Custom migration targets",
     "customTargetsDetails": "Create and manage custom migration targets. You can also drag and drop the cards to rearrange them. Note that any changes to the layout here will be reflected in the Analysis wizard",

client/src/app/api/models.ts

@@ -761,3 +761,4 @@ export interface Archetype {
   assessed?: boolean;
   review?: Ref;
 }
+export type ProviderType = "Java" | "Go";

client/src/app/pages/migration-targets/components/custom-target-form.tsx

@@ -28,7 +28,14 @@ import {
 } from "@app/components/HookFormPFFields";
 import { getAxiosErrorMessage } from "@app/utils/utils";
 import { useCreateFileMutation } from "@app/queries/targets";
-import { IReadFile, New, Rule, Target, TargetLabel } from "@app/api/models";
+import {
+  IReadFile,
+  New,
+  ProviderType,
+  Rule,
+  Target,
+  TargetLabel,
+} from "@app/api/models";
 import { getParsedLabel, parseRules } from "@app/utils/rules-utils";
 import { OptionWithValue, SimpleSelect } from "@app/components/SimpleSelect";
 import { toOptionLike } from "@app/utils/model-utils";
@@ -47,6 +54,7 @@ export interface CustomTargetFormProps {
   target?: Target | null;
   onSaved: (response: AxiosResponse<Target>) => void;
   onCancel: () => void;
+  providerType: ProviderType;
 }
 
 export interface CustomTargetFormValues {
@@ -67,6 +75,7 @@ export const CustomTargetForm: React.FC<CustomTargetFormProps> = ({
   target: initialTarget,
   onSaved,
   onCancel,
+  providerType,
 }) => {
   const { pushNotification } = useContext(NotificationsContext);
   const { t } = useTranslation();
@@ -298,6 +307,7 @@ export const CustomTargetForm: React.FC<CustomTargetFormProps> = ({
             },
           }),
       },
+      provider: providerType || "Java",
     };
 
     if (target) {

client/src/app/pages/migration-targets/migration-targets.tsx

@@ -35,13 +35,13 @@ import { getAxiosErrorMessage } from "@app/utils/utils";
 import { CustomTargetForm } from "./components/custom-target-form";
 import { useSetting, useSettingMutation } from "@app/queries/settings";
 import { useDeleteTargetMutation, useFetchTargets } from "@app/queries/targets";
-import { Target } from "@app/api/models";
+import { ProviderType, Target } from "@app/api/models";
 import { SimpleSelect } from "@app/components/SimpleSelect";
 
 export const MigrationTargets: React.FC = () => {
   const { t } = useTranslation();
   const { pushNotification } = React.useContext(NotificationsContext);
-  const [provider, setProvider] = useState("Java");
+  const [provider, setProvider] = useState<ProviderType>("Java");
 
   const { targets, refetch: refetchTargets } = useFetchTargets();
 
@@ -181,7 +181,7 @@ export const MigrationTargets: React.FC = () => {
               value={provider}
               options={["Java", "Go"]}
               onChange={(selection) => {
-                setProvider(selection as string);
+                setProvider(selection as ProviderType);
               }}
             />
           </GridItem>
@@ -203,14 +203,17 @@ export const MigrationTargets: React.FC = () => {
           title={t(
             targetToUpdate ? "dialog.title.update" : "dialog.title.new",
             {
-              what: t("terms.customTarget").toLowerCase(),
+              what: `${t("terms.customTargetOfType", {
+                type: provider,
+              })}`,
             }
           )}
           variant="medium"
           isOpen={isCreateUpdateModalOpen}
           onClose={() => setCreateUpdateModalState(null)}
         >
           <CustomTargetForm
+            providerType={provider}
             target={targetToUpdate}
             onSaved={onCustomTargetModalSaved}
             onCancel={() => setCreateUpdateModalState(null)}