From 11f2133a487a988d8c565b1880cdb74dbe19a5c8 Mon Sep 17 00:00:00 2001
From: mit-27 <meetsuthar64@gmail.com>
Date: Tue, 30 Apr 2024 14:15:48 -0400
Subject: [PATCH] =?UTF-8?q?=F0=9F=91=94=20Add=20alert=20dialog=20for=20con?=
 =?UTF-8?q?nection=20and=20api-keys?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/app/(Dashboard)/api-keys/page.tsx     | 90 +++++++++++--------
 .../Connection/AddConnectionButton.tsx        | 16 ++++
 .../hooks/mutations/useProjectMutation.tsx    |  2 +-
 3 files changed, 70 insertions(+), 38 deletions(-)

diff --git a/apps/client-ts/src/app/(Dashboard)/api-keys/page.tsx b/apps/client-ts/src/app/(Dashboard)/api-keys/page.tsx
index d9cb52d67..0e35dbe7d 100644
--- a/apps/client-ts/src/app/(Dashboard)/api-keys/page.tsx
+++ b/apps/client-ts/src/app/(Dashboard)/api-keys/page.tsx
@@ -144,44 +144,60 @@ export default function Page() {
             </Button>
             </DialogTrigger>
             <DialogContent>
-              <DialogHeader>
-                <DialogTitle>Add New Api Key</DialogTitle>
-                <DialogDescription>
-                  Never share this key, you must saved it it will be displayed once !
-                </DialogDescription>
-              </DialogHeader>
-
-              <Form {...form}>
-                <form onSubmit={form.handleSubmit(onSubmit)}>
-                <div className="grid gap-4 py-4">
-                  <div className="grid gap-2">
-                  <FormField
-                        control={form.control}
-                        name="apiKeyIdentifier"
-                        render={({ field }) => (
-                          <FormItem>
-                            <FormLabel>API Key Identifier</FormLabel>
-                            <FormControl>
-                              <Input 
-                              className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none  focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"                              
-                              placeholder="My Best Key For Finance Data" {...field}
-                              />
-                            </FormControl>
-                            <FormDescription>
-                              This is the API Key Identifier of system.
-                            </FormDescription>
-                            <FormMessage />
-                          </FormItem>
-                        )}
-                    />
+              {idProject==="" ? (
+                <>
+                <DialogHeader>
+                  <DialogTitle></DialogTitle>
+                </DialogHeader>
+                <h1>You have to create project in order to create API Key.</h1>
+                <DialogFooter>
+                  <Button variant='outline' type="reset" onClick={() => onCancel()}>Close</Button>
+                </DialogFooter>
+                </>
+              )
+              :
+              (
+                <>
+                <DialogHeader>
+                  <DialogTitle>Add New Api Key</DialogTitle>
+                  <DialogDescription>
+                    Never share this key, you must saved it it will be displayed once !
+                  </DialogDescription>
+                </DialogHeader>
+
+                <Form {...form}>
+                  <form onSubmit={form.handleSubmit(onSubmit)}>
+                  <div className="grid gap-4 py-4">
+                    <div className="grid gap-2">
+                    <FormField
+                          control={form.control}
+                          name="apiKeyIdentifier"
+                          render={({ field }) => (
+                            <FormItem>
+                              <FormLabel>API Key Identifier</FormLabel>
+                              <FormControl>
+                                <Input 
+                                className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none  focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"                              
+                                placeholder="My Best Key For Finance Data" {...field}
+                                />
+                              </FormControl>
+                              <FormDescription>
+                                This is the API Key Identifier of system.
+                              </FormDescription>
+                              <FormMessage />
+                            </FormItem>
+                          )}
+                      />
+                    </div>
                   </div>
-                </div>
-              <DialogFooter>
-                <Button variant='outline' type="reset" onClick={() => onCancel()}>Cancel</Button>
-                <Button type='submit'>Create</Button>
-              </DialogFooter>
-                </form>
-              </Form>
+                <DialogFooter>
+                  <Button variant='outline' type="reset" onClick={() => onCancel()}>Cancel</Button>
+                  <Button type='submit'>Create</Button>
+                </DialogFooter>
+                  </form>
+                </Form>
+                </>
+              )}
             </DialogContent>
           </Dialog>
         </div>
diff --git a/apps/client-ts/src/components/Connection/AddConnectionButton.tsx b/apps/client-ts/src/components/Connection/AddConnectionButton.tsx
index 1344dce95..341f451a3 100644
--- a/apps/client-ts/src/components/Connection/AddConnectionButton.tsx
+++ b/apps/client-ts/src/components/Connection/AddConnectionButton.tsx
@@ -169,6 +169,20 @@ const AddConnectionButton = ({
         </PopoverContent>
       </Popover> 
       <DialogContent>
+        {idProject==="" ? (
+          <>
+            <DialogHeader>
+              <DialogTitle></DialogTitle>
+            </DialogHeader>
+              <h1>You have to create project in order to create Connection.</h1>
+              <DialogFooter>
+                <Button variant='outline' type="reset" onClick={() => setShowNewLinkedUserDialog({open: false})}>Close</Button>
+              </DialogFooter>
+          </>
+        )
+      :
+      (
+        <>
         <DialogHeader>
           <DialogTitle>Share this magic link with your customers</DialogTitle>
           <DialogDescription>
@@ -244,6 +258,8 @@ const AddConnectionButton = ({
         </DialogFooter>
         </form>
         </Form>
+        </>
+      )}
       </DialogContent>
     </Dialog>    
   )
diff --git a/apps/client-ts/src/hooks/mutations/useProjectMutation.tsx b/apps/client-ts/src/hooks/mutations/useProjectMutation.tsx
index 63c98b67b..42c01a4bc 100644
--- a/apps/client-ts/src/hooks/mutations/useProjectMutation.tsx
+++ b/apps/client-ts/src/hooks/mutations/useProjectMutation.tsx
@@ -47,7 +47,7 @@ const useProjectMutation = () => {
         },
         onSuccess: (data) => {
             
-            console.log(data)
+            // console.log(data)
             queryClient.setQueryData<IProDto[]>(['projects'], (oldQueryData = []) => {
                 return [...oldQueryData, data];
             });