Updates to correspond to API signature

dashboard/src/main/home/cluster-dashboard/stacks/ExpandedStack/ExpandedStack.tsx

@@ -4,7 +4,7 @@ import TabSelector from "components/TabSelector";
 import TitleSection from "components/TitleSection";
 import React, { useContext, useState } from "react";
 import backArrow from "assets/back_arrow.png";
-import { useParams } from "react-router";
+import { useParams, useRouteMatch } from "react-router";
 import api from "shared/api";
 import { Context } from "shared/Context";
 import { useRouting } from "shared/routing";
@@ -44,6 +44,8 @@ const ExpandedStack = () => {
     Context
   );
 
+  const { url } = useRouteMatch();
+
   const [isDeleting, setIsDeleting] = useState(false);
   const [currentTab, setCurrentTab] = useState("apps");
 
@@ -148,7 +150,9 @@ const ExpandedStack = () => {
             component: (
               <>
                 <Gap></Gap>
-                <DynamicLink to={`new-app-resource`}>Add new app</DynamicLink>
+                <DynamicLink to={`${url}/new-app-resource`}>
+                  Add new app
+                </DynamicLink>
                 {currentRevision.id !== stack.latest_revision.id ? (
                   <ChartListWrapper>
                     <Placeholder>

dashboard/src/main/home/cluster-dashboard/stacks/ExpandedStack/NewAppResource/_Settings.tsx

@@ -35,7 +35,6 @@ const Settings = () => {
   const params = useParams<{
     template_name: string;
     template_version: string;
-    namespace: string;
   }>();
   const { stack, refreshStack } = useContext(ExpandedStackStore);
   const { currentProject, currentCluster, setCurrentError } = useContext(
@@ -63,7 +62,7 @@ const Settings = () => {
             id: currentProject.id,
             cluster_id: currentCluster.id,
             name: envGroup.name,
-            namespace: params.namespace,
+            namespace: stack.namespace,
             version: envGroup.env_group_version,
           }
         )
@@ -118,19 +117,19 @@ const Settings = () => {
       await api.addStackAppResource(
         "<token>",
         {
-          app_resource: appResource,
+          ...appResource,
         },
         {
           project_id: currentProject.id,
           cluster_id: currentCluster.id,
-          namespace: params.namespace,
+          namespace: stack.namespace,
           stack_id: stack.id,
         }
       );
 
       await refreshStack();
 
-      pushFiltered(`/stacks/${params.namespace}/${stack.id}`, []);
+      pushFiltered(`/stacks/${stack.namespace}/${stack.id}`, []);
     } catch (error) {
       const axiosError: AxiosError = error;
       if (axiosError.code === "409") {
@@ -144,7 +143,7 @@ const Settings = () => {
   return (
     <NewAppResourceForm
       availableEnvGroups={availableEnvGroups}
-      namespace={params.namespace}
+      namespace={stack.namespace}
       sourceConfig={stack.latest_revision.source_configs[0]}
       templateInfo={{
         name: params.template_name,

dashboard/src/main/home/cluster-dashboard/stacks/ExpandedStack/NewEnvGroup.tsx

@@ -1,18 +1,16 @@
 import { AxiosError } from "axios";
 import React, { useContext } from "react";
-import { useParams } from "react-router";
 import api from "shared/api";
 import { Context } from "shared/Context";
 import { useRouting } from "shared/routing";
 import NewEnvGroupForm from "../components/NewEnvGroupForm";
 import { CreateStackBody } from "../types";
+import { ExpandedStackStore } from "./Store";
 
 const NewEnvGroup = () => {
+  const { stack, refreshStack } = useContext(ExpandedStackStore);
   const { currentProject, currentCluster } = useContext(Context);
-  const { stack_id, namespace } = useParams<{
-    stack_id: string;
-    namespace: string;
-  }>();
+
   const { pushFiltered } = useRouting();
 
   const createEnvGroup = async (
@@ -22,15 +20,18 @@ const NewEnvGroup = () => {
       await api.addStackEnvGroup(
         "<token>",
         {
-          env_group: newEnvGroup,
+          ...newEnvGroup,
         },
         {
           project_id: currentProject.id,
           cluster_id: currentCluster.id,
-          namespace,
-          stack_id,
+          namespace: stack.namespace,
+          stack_id: stack.id,
         }
       );
+
+      await refreshStack();
+      pushFiltered("../" + stack.id, []);
     } catch (error) {
       const axiosError: AxiosError = error;
 
@@ -55,7 +56,7 @@ const NewEnvGroup = () => {
       <NewEnvGroupForm
         onSubmit={createEnvGroup}
         onCancel={() => {
-          pushFiltered("../" + stack_id, []);
+          pushFiltered("../" + stack.id, []);
         }}
       />
     </>

dashboard/src/shared/api.tsx

@@ -2088,9 +2088,7 @@ const updateStackSourceConfig = baseApi<
 );
 
 const addStackAppResource = baseApi<
-  {
-    app_resource: CreateStackBody["app_resources"][0];
-  },
+  CreateStackBody["app_resources"][0],
   {
     project_id: number;
     cluster_id: number;
@@ -2098,7 +2096,7 @@ const addStackAppResource = baseApi<
     stack_id: string;
   }
 >(
-  "POST",
+  "PATCH",
   ({ project_id, cluster_id, namespace, stack_id }) =>
     `/api/v1/projects/${project_id}/clusters/${cluster_id}/namespaces/${namespace}/stacks/${stack_id}/add_application`
 );
@@ -2119,9 +2117,7 @@ const removeStackAppResource = baseApi<
 );
 
 const addStackEnvGroup = baseApi<
-  {
-    env_group: CreateStackBody["env_groups"][0];
-  },
+  CreateStackBody["env_groups"][0],
   {
     project_id: number;
     cluster_id: number;
@@ -2129,7 +2125,7 @@ const addStackEnvGroup = baseApi<
     stack_id: string;
   }
 >(
-  "POST",
+  "PATCH",
   ({ project_id, cluster_id, namespace, stack_id }) =>
     `/api/v1/projects/${project_id}/clusters/${cluster_id}/namespaces/${namespace}/stacks/${stack_id}/add_env_group`
 );