✨ New features

panoratech · Jun 14, 2024 · c8a89a0 · c8a89a0
1 parent a77bc47
commit c8a89a0
Show file tree

Hide file tree

Showing 17 changed files with 1,578 additions and 1,487 deletions.
diff --git a/.env.example b/.env.example
@@ -30,6 +30,8 @@ POSTGRES_DB=panora_db
 POSTGRES_HOST=postgres
 POSTGRES_PASSWORD=my_password
 
+# Endpoint on which realtime webhooks are sent to 
+WEBHOOK_INGRESS=http://localhost:3000
 
 # Each Provider is of form PROVIDER_VERTICAL_SOFTWAREMODE_ATTRIBUTE
 # ================================================

diff --git a/apps/client-ts/src/components/Configuration/Connector/ConnectorDisplay.tsx b/apps/client-ts/src/components/Configuration/Connector/ConnectorDisplay.tsx
@@ -8,7 +8,7 @@ import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "
 import { PasswordInput } from "@/components/ui/password-input"
 import { z } from "zod"
 import config from "@/lib/config"
-import { AuthStrategy, providerToType, Provider, extractProvider, extractVertical } from "@panora/shared"
+import { AuthStrategy, providerToType, Provider, extractProvider, extractVertical, needsSubdomain } from "@panora/shared"
 import { useEffect, useState } from "react"
 import useProjectStore from "@/state/projectStore"
 import { usePostHog } from 'posthog-js/react'
@@ -26,24 +26,27 @@ interface ItemDisplayProps {
 }
 
 const formSchema = z.object({
+  subdomain: z.string({
+    required_error: "Please Enter a Subdomain",
+  }).optional(),
   client_id : z.string({
     required_error: "Please Enter a Client ID",
-  }),
+  }).optional(),
   client_secret : z.string({
     required_error: "Please Enter a Client Secret",
-  }),
+  }).optional(),
   scope : z.string({
     required_error: "Please Enter a scope",
-  }),
+  }).optional(),
   api_key: z.string({
     required_error: "Please Enter a API Key",
-  }),
+  }).optional(),
   username: z.string({
     required_error: "Please Enter Username",
-  }),
+  }).optional(),
   secret: z.string({
     required_error: "Please Enter Secret",
-  }),
+  }).optional(),
 })
 
 export function ConnectorDisplay({ item }: ItemDisplayProps) {
@@ -62,6 +65,7 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
   const form = useForm<z.infer<typeof formSchema>>({
     resolver: zodResolver(formSchema),
     defaultValues: {
+      subdomain: "",
       client_id: "",
       client_secret: "",
       scope: "",
@@ -88,10 +92,11 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
   };
 
   function onSubmit(values: z.infer<typeof formSchema>) {
-    const { client_id, client_secret, scope, api_key, secret, username } = values;
+    const { client_id, client_secret, scope, api_key, secret, username, subdomain } = values;
     const performUpdate = mappingConnectionStrategies && mappingConnectionStrategies.length > 0;
     switch (item?.authStrategy) {
       case AuthStrategy.oauth2:
+        const needs_subdomain = needsSubdomain(item.name.toLowerCase(), item.vertical!.toLowerCase());
         if (client_id === "" || client_secret === "" || scope === "") {
           if (client_id === "") {
             form.setError("client_id", { "message": "Please Enter Client ID" });
@@ -104,15 +109,27 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
           }
           break;
         }
+        if(needs_subdomain && subdomain == ""){
+          form.setError("subdomain", { "message": "Please Enter Subdomain" });
+        }
+        let ATTRIBUTES = [];
+        let VALUES = [];
+        if(needs_subdomain){
+          ATTRIBUTES = ["subdomain", "client_id", "client_secret", "scope"],
+          VALUES = [subdomain!, client_id!, client_secret!, scope!]
+        }else{
+          ATTRIBUTES = ["client_id", "client_secret", "scope"],
+          VALUES = [client_id!, client_secret!, scope!]
+        }
         if (performUpdate) {
           const dataToUpdate = mappingConnectionStrategies[0];
           toast.promise(
             updateCsPromise({
               id_cs: dataToUpdate.id_connection_strategy,
               updateToggle: false,
               status: dataToUpdate.status,
-              attributes: ["client_id", "client_secret", "scope"],
-              values: [client_id, client_secret, scope]
+              attributes: ATTRIBUTES,
+              values: VALUES
             }), 
               {
               loading: 'Loading...',
@@ -140,8 +157,8 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
           toast.promise(
             createCsPromise({
               type: providerToType(item?.name, item?.vertical!, AuthStrategy.oauth2),
-              attributes: ["client_id", "client_secret", "scope"],
-              values: [client_id, client_secret, scope]
+              attributes: ATTRIBUTES,
+              values: VALUES
             }), 
               {
               loading: 'Loading...',
@@ -183,7 +200,7 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
               updateToggle: false,
               status: dataToUpdate.status,
               attributes: ["api_key"],
-              values: [api_key]
+              values: [api_key!]
             }), 
               {
               loading: 'Loading...',
@@ -212,7 +229,7 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
             createCsPromise({
               type: providerToType(item?.name, item?.vertical!, AuthStrategy.api_key),
               attributes: ["api_key"],
-              values: [api_key]
+              values: [api_key!]
             }), 
               {
               loading: 'Loading...',
@@ -259,7 +276,7 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
               updateToggle: false,
               status: dataToUpdate.status,
               attributes: ["username", "secret"],
-              values: [username, secret]
+              values: [username!, secret!]
             }), 
               {
               loading: 'Loading...',
@@ -289,7 +306,7 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
             createCsPromise({
               type: providerToType(item?.name, item?.vertical!, AuthStrategy.basic),
               attributes: ["username", "secret"],
-              values: [username, secret]
+              values: [username!, secret!]
             }), 
               {
               loading: 'Loading...',
@@ -324,14 +341,19 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
     if (mappingConnectionStrategies && mappingConnectionStrategies.length > 0) {
       fetchCredentials({
         type: mappingConnectionStrategies[0].type,
-        attributes: item?.authStrategy === AuthStrategy.oauth2 ? ["client_id", "client_secret", "scope"]
+        attributes: item?.authStrategy === AuthStrategy.oauth2 ? needsSubdomain(item.name.toLowerCase(), item.vertical!.toLowerCase()) ? ["subdomain", "client_id", "client_secret", "scope"] : ["client_id", "client_secret", "scope"]
           : item?.authStrategy === AuthStrategy.api_key ? ["api_key"] : ["username", "secret"]
       }, {
         onSuccess(data) {
           if (item?.authStrategy === AuthStrategy.oauth2) {
-            form.setValue("client_id", data[0]);
-            form.setValue("client_secret", data[1]);
-            form.setValue("scope", data[2]);
+            let i = 0;
+            if(needsSubdomain(item.name.toLowerCase(), item.vertical!.toLowerCase())){
+              form.setValue("subdomain", data[i]);
+              i = 1;
+            }
+            form.setValue("client_id", data[i]);
+            form.setValue("client_secret", data[i + 1]);
+            form.setValue("scope", data[i + 2]);
           }
           if (item?.authStrategy === AuthStrategy.api_key) {
             form.setValue("api_key", data[0]);
@@ -415,6 +437,25 @@ export function ConnectorDisplay({ item }: ItemDisplayProps) {
               <form onSubmit={form.handleSubmit(onSubmit)}>
                 { item.authStrategy == AuthStrategy.oauth2 &&
                   <>
+
+                    { needsSubdomain(item.name.toLowerCase(), item.vertical!.toLowerCase()) &&
+                      <div className="flex flex-col">
+                        <FormField
+                        name="subdomain"
+                        control={form.control}
+                        render={({field}) => (
+                            <FormItem>
+                                <FormLabel className="flex flex-col">Subdomain</FormLabel>
+                                <FormControl>
+                                <PasswordInput {...field} placeholder="Enter Subdomain (such as https://my-zendesk.com)" />
+                                </FormControl>
+                                <FormMessage/>
+                            </FormItem>
+                        )}
+                        />
+                      </div>
+                    }
+
                     <div className="flex flex-col">
                       <FormField
                         name="client_id"

diff --git a/apps/client-ts/src/components/Connection/ConnectionTable.tsx b/apps/client-ts/src/components/Connection/ConnectionTable.tsx
@@ -55,7 +55,7 @@ export default function ConnectionTable() {
     date: connection.created_at, 
     connectionToken: connection.connection_token!
   }))
-
+  console.log("connections are"  + JSON.stringify(ts))
 
   return (
     <>

diff --git a/apps/client-ts/src/hooks/get/useConnections.tsx b/apps/client-ts/src/hooks/get/useConnections.tsx
@@ -5,6 +5,7 @@ import Cookies from 'js-cookie';
 
 
 const useConnections = () => {
+  console.log(Cookies.get('access_token'))
   return useQuery({
     queryKey: ['connections'], 
     queryFn: async (): Promise<Connection[]> => {

diff --git a/docker-compose.dev.yml b/docker-compose.dev.yml
@@ -39,6 +39,7 @@ services:
       REDIS_PORT: ${REDIS_PORT}
       #REDIS_TLS: 1 # set this variable to 1 when Redis is AWS hosted 
       REDIS_DB: ${REDIS_DB}
+      WEBHOOK_INGRESS: ${WEBHOOK_INGRESS}
       ENCRYPT_CRYPTO_SECRET_KEY: ${ENCRYPT_CRYPTO_SECRET_KEY}
       HUBSPOT_CRM_CLOUD_CLIENT_ID: ${HUBSPOT_CRM_CLOUD_CLIENT_ID}
       HUBSPOT_CRM_CLOUD_CLIENT_SECRET: ${HUBSPOT_CRM_CLOUD_CLIENT_SECRET}
@@ -188,22 +189,23 @@ services:
     volumes:
       - .:/app
 
-  #ngrok:
-    #image: ngrok/ngrok:latest
-    #restart: always
-    #command:
-     # - "start"
-     # - "--all"
-     # - "--config"
-     # - "/etc/ngrok.yml"
-   # volumes:
-   #   - ./ngrok.yml:/etc/ngrok.yml
-   # ports:
-   #   - 4040:4040
-    #depends_on:
-     # api:
-     #   condition: service_healthy
-  #  network_mode: "host"
+  ngrok:
+    image: ngrok/ngrok:latest
+    restart: always
+    command:
+      - "start"
+      - "--all"
+      - "--config"
+      - "/etc/ngrok.yml"
+    volumes:
+      - ./ngrok.yml:/etc/ngrok.yml
+    ports:
+      - 4040:4040
+    depends_on:
+      api:
+        condition: service_healthy
+    network_mode: "host"
+
 
   docs:
     build:

diff --git a/docker-compose.source.yml b/docker-compose.source.yml
@@ -39,6 +39,7 @@ services:
       REDIS_PASS: ${REDIS_PASS}
       BACKEND_PORT: ${BACKEND_PORT}
       REDIS_DB: ${REDIS_DB}
+      WEBHOOK_INGRESS: ${WEBHOOK_INGRESS}
       ENCRYPT_CRYPTO_SECRET_KEY: ${ENCRYPT_CRYPTO_SECRET_KEY}
       HUBSPOT_CRM_CLOUD_CLIENT_ID: ${HUBSPOT_CRM_CLOUD_CLIENT_ID}
       HUBSPOT_CRM_CLOUD_CLIENT_SECRET: ${HUBSPOT_CRM_CLOUD_CLIENT_SECRET}

diff --git a/docker-compose.yml b/docker-compose.yml
@@ -33,6 +33,7 @@ services:
       REDIS_PASS: ${REDIS_PASS}
       REDIS_PORT: ${REDIS_PORT}
       REDIS_DB: ${REDIS_DB}
+      WEBHOOK_INGRESS: ${WEBHOOK_INGRESS}
       ENCRYPT_CRYPTO_SECRET_KEY: ${ENCRYPT_CRYPTO_SECRET_KEY}
       HUBSPOT_CRM_CLOUD_CLIENT_ID: ${HUBSPOT_CRM_CLOUD_CLIENT_ID}
       HUBSPOT_CRM_CLOUD_CLIENT_SECRET: ${HUBSPOT_CRM_CLOUD_CLIENT_SECRET}

diff --git a/ngrok.yml b/ngrok.yml
@@ -1,10 +1,10 @@
 version: 2
-authtoken: YOUR_NGROK_KEY_HERE
+authtoken: 2hkEp1JOOyYzutRyUa5f74UWll5_7oDCZH2Rd5bryqKj9geTV
 log_level: debug
 log: stdout
 
 tunnels:
   api-tunnel:
     proto: http
     addr: 3000
-    domain: your_ngrok_domain_here
+    domain: prepared-wildcat-infinitely.ngrok-free.app