add secret groups field functionality

backend/src/integrations/apps.ts

@@ -754,9 +754,35 @@ const getAppsNorthflank = async ({ accessToken }: { accessToken: string }) => {
     return {
       name: a.name,
       appId: a.id,
+      secretGroups: []
     };
   });
 
+  for (let i = 0; i < apps.length; i++) {
+    const appName = apps[i].name;
+    const {
+      data: {
+        data: {
+          secrets
+        }
+      }
+    } = await standardRequest.get(
+      `${INTEGRATION_NORTHFLANK_API_URL}/v1/projects/${appName}/secrets`,
+      {
+        headers: {
+          Authorization: `Bearer ${accessToken}`,
+          "Accept-Encoding": "application/json",
+        },
+      }
+    );
+
+    const secretGroups = secrets.map((a: any) => {
+      return a.id
+    });
+
+    apps[i].secretGroups = secretGroups
+  }
+
   return apps;
 };
 

frontend/src/hooks/api/integrationAuth/types.ts

@@ -13,6 +13,7 @@ export type App = {
   name: string;
   appId?: string;
   owner?: string;
+  secretGroups?: string[];
 };
 
 export type Team = {

frontend/src/pages/integrations/northflank/create.tsx

@@ -32,6 +32,8 @@ export default function NorthflankCreateIntegrationPage() {
   const [selectedSourceEnvironment, setSelectedSourceEnvironment] = useState("");
   const [secretPath, setSecretPath] = useState("/");
   const [targetApp, setTargetApp] = useState("");
+  const [secretGroupList, setSecretGroupList] = useState<any>([]);
+  const [targetSecretGroup, setTargetSecretGroup] = useState<any>("");
 
   const [isLoading, setIsLoading] = useState(false);
 
@@ -51,6 +53,18 @@ export default function NorthflankCreateIntegrationPage() {
     }
   }, [integrationAuthApps]);
 
+  useEffect(() => {
+    if (integrationAuthApps) {
+      if (integrationAuthApps.length > 0) {
+        const selectedApp = integrationAuthApps?.filter((integrationAuthApp) => integrationAuthApp.name === targetApp);
+        setSecretGroupList(selectedApp[0].secretGroups);
+        setTargetSecretGroup(selectedApp[0]?.secretGroups[0]);
+      } else {
+        setTargetSecretGroup("none");
+      }
+    }
+  }, [targetApp])
+
   const handleButtonClick = async () => {
     try {
       if (!integrationAuth?._id) return;
@@ -137,6 +151,29 @@ export default function NorthflankCreateIntegrationPage() {
             )}
           </Select>
         </FormControl>
+        <FormControl label="Secret Group" className="mt-4">
+          <Select
+            value={targetSecretGroup}
+            onValueChange={(val) => setTargetSecretGroup(val)}
+            className="w-full border border-mineshaft-500"
+            isDisabled={secretGroupList.length === 0}
+          >
+            {secretGroupList.length > 0 ? (
+              secretGroupList.map((group: any) => (
+                <SelectItem
+                  value={group}
+                  key={`target-secret-group-${group}`}
+                >
+                  {group}
+                </SelectItem>
+              ))
+            ) : (
+              <SelectItem value="none" key="target-secret-group-none">
+                No secret groups found
+              </SelectItem>
+            )}
+          </Select>
+        </FormControl>
         <Button
           onClick={handleButtonClick}
           color="mineshaft"