auto open create extension dialog

Author: josefbender

frontend/src/pages/admin/extensions/ExtensionsPage.tsx

@@ -3,7 +3,7 @@ import { IconPlus } from '@tabler/icons-react';
 import { useMutation, useQuery } from '@tanstack/react-query';
 import { useEffect, useState } from 'react';
 import { FormProvider, useForm } from 'react-hook-form';
-import { useParams } from 'react-router-dom';
+import { useParams, useSearchParams } from 'react-router-dom';
 import { toast } from 'react-toastify';
 import { useApi } from 'src/api';
 import { BucketDto, ExtensionDto } from 'src/api/generated';
@@ -23,7 +23,19 @@ export function ExtensionsPage() {
 
   const configurationParam = useParams<'id'>();
   const configurationId = +configurationParam.id!;
-  const [toCreate, setToCreate] = useState<boolean>();
+  const [searchParams, setSearchParams] = useSearchParams();
+
+  const toCreate = searchParams.get('add-extension') === 'true';
+
+  const setToCreate = (value: boolean) => {
+    const newParams = new URLSearchParams(searchParams);
+    if (value) {
+      newParams.set('add-extension', 'true');
+    } else {
+      newParams.delete('add-extension');
+    }
+    setSearchParams(newParams);
+  };
   const [toUpdate, setToUpdate] = useState<ExtensionDto | null>();
   const { extensions, specs, removeExtension, setExtension, setExtensions } = useExtensionsStore();
 

frontend/src/pages/admin/extensions/UpsertConfigurationDialog.tsx

@@ -1,6 +1,7 @@
 import { Button, Flex, Portal, Switch, Textarea, TextInput } from '@mantine/core';
 import { useForm } from '@mantine/form';
 import { useMutation } from '@tanstack/react-query';
+import { useNavigate } from 'react-router-dom';
 import z from 'zod';
 import { ConfigurationDto, UpsertConfigurationDto, useApi } from 'src/api';
 import { FormAlert, MAX_SUGGESTIONS, Modal } from 'src/components';
@@ -35,14 +36,16 @@ interface UpsertConfigurationDialogProps {
 
 export function UpsertConfigurationDialog(props: UpsertConfigurationDialogProps) {
   const { onCreate, onUpdate, onClose, target } = props;
+  const navigate = useNavigate();
 
   const api = useApi();
 
   const creating = useMutation({
     mutationFn: (request: UpsertConfigurationDto) => api.extensions.postConfiguration(request),
-    onSuccess: (response) => {
+    onSuccess: async (response) => {
       onCreate(response);
       onClose();
+      await navigate(`/admin/assistants/${response.id}?add-extension=true`);
     },
   });