Merge pull request #436 from panoratech/feat/ui-fix-oauth-custom

Feat/UI fix oauth custom

apps/client-ts/package.json

@@ -20,13 +20,13 @@
     "@radix-ui/react-label": "^2.0.2",
     "@radix-ui/react-navigation-menu": "^1.1.4",
     "@radix-ui/react-popover": "^1.0.7",
+    "@radix-ui/react-scroll-area": "^1.0.5",
     "@radix-ui/react-select": "^2.0.0",
     "@radix-ui/react-separator": "^1.0.3",
     "@radix-ui/react-slot": "^1.0.2",
     "@radix-ui/react-switch": "^1.0.3",
     "@radix-ui/react-tabs": "^1.0.4",
     "@radix-ui/react-tooltip": "^1.0.7",
-    "@radix-ui/react-scroll-area": "^1.0.5",
     "@tanstack/react-query": "^5.12.2",
     "@tanstack/react-query-devtools": "^5.25.0",
     "@tanstack/react-query-next-experimental": "^5.25.0",
@@ -37,22 +37,25 @@
     "clsx": "^2.1.0",
     "cmdk": "^0.2.1",
     "cookies": "^0.9.1",
+    "coolshapes-react": "^1.0.1",
     "date-fns": "^3.3.1",
+    "jotai": "^2.8.0",
+    "js-cookie": "^3.0.5",
     "lucide-react": "^0.344.0",
     "next": "14.1.2",
     "next-themes": "^0.2.1",
     "posthog-js": "^1.96.1",
     "react": "^18",
     "react-day-picker": "^8.10.0",
     "react-dom": "^18",
-    "react-hook-form": "^7.51.0",
+    "react-hook-form": "^7.51.2",
+    "react-resizable-panels": "^2.0.19",
     "recharts": "^2.10.1",
     "sonner": "^1.4.3",
     "tailwind-merge": "^2.2.1",
     "tailwindcss-animate": "^1.0.7",
     "zod": "^3.22.4",
-    "zustand": "^4.4.7",
-    "js-cookie": "^3.0.5"
+    "zustand": "^4.4.7"
   },
   "devDependencies": {
     "@types/cookies": "^0.9.0",

apps/client-ts/src/app/(Dashboard)/configuration/page.tsx

@@ -42,6 +42,7 @@ import AuthCredentialsTable from "@/components/Configuration/AuthCredentialsTabl
 import useConnectionStrategies from "@/hooks/useConnectionStrategies";
 import { extractAuthMode,extractProvider,extractVertical} from '@panora/shared'
 import { Heading } from "@/components/ui/heading";
+import CustomConnectorPage from "@/components/Configuration/CustomConnectorPage";
 
 export default function Page() {
   const {idProject} = useProjectStore();
@@ -108,7 +109,7 @@ export default function Page() {
     type: cs.type,
     status: cs.status
   }))
-
+ 
   console.log(mappingConnectionStrategies)
 
   return (
@@ -130,8 +131,8 @@ export default function Page() {
               <TabsTrigger value="webhooks">
                 Webhooks
               </TabsTrigger>
-              <TabsTrigger value="0auth">
-                OAuth Credentials
+              <TabsTrigger value="custom">
+                Manage Connectors
               </TabsTrigger>
             </TabsList>
             <TabsContent value="linked-accounts" className="space-y-4">
@@ -227,6 +228,11 @@ export default function Page() {
                 </Card>
               </div>
             </TabsContent>
+
+            <TabsContent value="custom" className="space-y-4">
+              <CustomConnectorPage />
+            </TabsContent>
+
           </Tabs>
         </div>