feat: intiial local logflare integration

studio/.env

@@ -9,7 +9,8 @@ SUPABASE_PUBLIC_URL=http://localhost:8000
 SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyAgCiAgICAicm9sZSI6ICJhbm9uIiwKICAgICJpc3MiOiAic3VwYWJhc2UtZGVtbyIsCiAgICAiaWF0IjogMTY0MTc2OTIwMCwKICAgICJleHAiOiAxNzk5NTM1NjAwCn0.dc_X5iR_VP_qT0zsiyj_I_OZ2T9FtRU2BBNWN8Bu4GE
 SUPABASE_SERVICE_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyAgCiAgICAicm9sZSI6ICJzZXJ2aWNlX3JvbGUiLAogICAgImlzcyI6ICJzdXBhYmFzZS1kZW1vIiwKICAgICJpYXQiOiAxNjQxNzY5MjAwLAogICAgImV4cCI6IDE3OTk1MzU2MDAKfQ.DaYlNEoUrrEn2Ig7tqibS-PHK5vgusbcbo7X36XVt4Q
 SENTRY_IGNORE_API_RESOLUTION_ERROR=1
-
+LOGFLARE_URL:http://localhost:54329
+LOGFLARE_API_KEY=api-key
 # TODO: evaluate these variables at runtime instead
 # https://nextjs.org/docs/basic-features/environment-variables#loading-environment-variables
 NEXT_PUBLIC_SITE_URL=http://localhost:3000

studio/components/interfaces/Settings/Logs/LogsQueryPanel.tsx

@@ -14,6 +14,7 @@ import Link from 'next/link'
 import React from 'react'
 import { checkPermissions } from 'hooks'
 import { useProfileQuery } from 'data/profile/profile-query'
+import { IS_PLATFORM } from 'lib/constants'
 
 export interface LogsQueryPanelProps {
   templates?: LogTemplate[]
@@ -131,7 +132,7 @@ const LogsQueryPanel = ({
                 <Button type="default" onClick={onClear}>
                   Clear query
                 </Button>
-                {onSave && (
+                {IS_PLATFORM &&  onSave && (
                   <Tooltip.Root delayDuration={0}>
                     <Tooltip.Trigger>
                       <Button

studio/components/layouts/LogsLayout/LogsMenu.utils.ts

@@ -1,75 +1,75 @@
 import { Project } from 'types'
-import { ProductMenuGroup } from 'components/ui/ProductMenu/ProductMenu.types'
+import { ProductMenuGroup, ProductMenuGroupItem } from 'components/ui/ProductMenu/ProductMenu.types'
 import { IS_PLATFORM } from 'lib/constants'
 
 export const generateLogsMenu = (project?: Project): ProductMenuGroup[] => {
   const ref = project?.ref ?? 'default'
 
   return [
-    ...(IS_PLATFORM
-      ? [
-          {
-            title: 'Logs Explorer',
-            items: [
-              { key: 'explorer', name: 'Query', root: true },
-              { key: 'saved', name: 'Saved Queries' },
-              { key: 'recent', name: 'Recent Queries' },
-              { key: 'templates', name: 'Templates' },
-            ].map(({ key, name, root }) => ({
-              name,
-              key,
-              url: `/project/${ref}/logs/explorer${root ? '' : '/' + key}`,
+    {
+      title: 'Logs Explorer',
+      items: (
+        [
+          { key: 'explorer', name: 'Query', root: true },
+          IS_PLATFORM ? { key: 'saved', name: 'Saved Queries' } : null,
+          { key: 'recent', name: 'Recent Queries' },
+          { key: 'templates', name: 'Templates' },
+        ].filter((item) => item) as { name: string; key: string; root: boolean }[]
+      ).map(({ key, name, root }) => ({
+        name,
+        key,
+        url: `/project/${ref}/logs/explorer${root ? '' : '/' + key}`,
+        items: [],
+      })),
+    },
+    {
+      items: [
+        {
+          name: IS_PLATFORM ? 'API Edge Network' : 'Kong API',
+          key: 'edge-logs',
+          url: `/project/${ref}/logs/edge-logs`,
+          items: [],
+        },
+        {
+          name: 'Postgres',
+          key: 'postgres-logs',
+          url: `/project/${ref}/logs/postgres-logs`,
+          items: [],
+        },
+        {
+          name: 'PostgREST',
+          key: 'postgrest-logs',
+          url: `/project/${ref}/logs/postgrest-logs`,
+          items: [],
+        },
+        IS_PLATFORM
+          ? {
+              name: 'PgBouncer',
+              key: 'pgbouncer-logs',
+              url: `/project/${ref}/logs/pgbouncer-logs`,
               items: [],
-            })),
-          },
-          {
-            items: [
-              {
-                name: 'API Edge Network',
-                key: 'edge-logs',
-                url: `/project/${ref}/logs/edge-logs`,
-                items: [],
-              },
-              {
-                name: 'Postgres',
-                key: 'postgres-logs',
-                url: `/project/${ref}/logs/postgres-logs`,
-                items: [],
-              },
-              {
-                name: 'PostgREST',
-                key: 'postgrest-logs',
-                url: `/project/${ref}/logs/postgrest-logs`,
-                items: [],
-              },
-              {
-                name: 'PgBouncer',
-                key: 'pgbouncer-logs',
-                url: `/project/${ref}/logs/pgbouncer-logs`,
-                items: [],
-              },
-              {
-                name: 'Auth',
-                key: 'auth-logs',
-                url: `/project/${ref}/logs/auth-logs`,
-                items: [],
-              },
-              {
-                name: 'Storage',
-                key: 'storage-logs',
-                url: `/project/${ref}/logs/storage-logs`,
-                items: [],
-              },
-
-              {
-                name: 'Realtime',
-                key: 'realtime-logs',
-                url: `/project/${ref}/logs/realtime-logs`,
-                items: [],
-              },
-            ],
-          },
-        ]
-      : []),
+            }
+          : null,
+        ,
+        {
+          name: 'Auth',
+          key: 'auth-logs',
+          url: `/project/${ref}/logs/auth-logs`,
+          items: [],
+        },
+        {
+          name: 'Storage',
+          key: 'storage-logs',
+          url: `/project/${ref}/logs/storage-logs`,
+          items: [],
+        },
+        {
+          name: 'Realtime',
+          key: 'realtime-logs',
+          url: `/project/${ref}/logs/realtime-logs`,
+          items: [],
+        },
+      ].filter((item) => item) as ProductMenuGroupItem[],
+    },
   ]
 }

studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.utils.tsx

@@ -139,22 +139,18 @@ export const generateOtherRoutes = (ref?: string, project?: ProjectBase): Route[
           },
         ]
       : []),
-    ...(IS_PLATFORM
-      ? [
-          {
-            key: 'logs',
-            label: 'Logs',
-            icon: <IconList size={18} strokeWidth={2} />,
-            link:
-              ref &&
-              (isProjectPaused
-                ? homeUrl
-                : isProjectBuilding
-                ? buildingUrl
-                : `/project/${ref}/logs/explorer`),
-          },
-        ]
-      : []),
+    {
+      key: 'logs',
+      label: 'Logs',
+      icon: <IconList size={18} strokeWidth={2} />,
+      link:
+        ref &&
+        (isProjectPaused
+          ? homeUrl
+          : isProjectBuilding
+          ? buildingUrl
+          : `/project/${ref}/logs/explorer`),
+    },
     {
       key: 'api',
       label: 'API Docs',

studio/pages/api/constants.ts

@@ -1,5 +1,5 @@
 const PUBLIC_URL = new URL(process.env.SUPABASE_PUBLIC_URL || 'http://localhost:8000')
-
+export const PROJECT_ANALYTICS_URL = `${PUBLIC_URL.origin}/analytics/v1/`
 export const PROJECT_REST_URL = `${PUBLIC_URL.origin}/rest/v1/`
 export const PROJECT_ENDPOINT = PUBLIC_URL.host
 export const PROJECT_ENDPOINT_PROTOCOL = PUBLIC_URL.protocol.replace(':', '')

studio/pages/api/projects/[ref]/analytics/endpoints/[name].ts

@@ -0,0 +1,40 @@
+import { NextApiRequest, NextApiResponse } from 'next'
+import apiWrapper from 'lib/api/apiWrapper'
+import { PROJECT_ANALYTICS_URL } from 'pages/api/constants'
+import { get } from 'lib/common/fetch'
+
+export default (req: NextApiRequest, res: NextApiResponse) => apiWrapper(req, res, handler)
+
+async function handler(req: NextApiRequest, res: NextApiResponse) {
+  const { method } = req
+
+  switch (method) {
+    case 'GET':
+      console.log(req)
+      const result = await proxyRequest(req)
+      return res.status(200).json(result)
+    default:
+      res.setHeader('Allow', ['GET'])
+      res.status(405).json({ data: null, error: { message: `Method ${method} Not Allowed` } })
+  }
+}
+
+const proxyRequest = async (req: NextApiRequest) => {
+  const { name, ...toForward } = req.query
+  const payload = { ...toForward, project_tier: 'ENTERPRISE' }
+  const search = '?' + new URLSearchParams(payload as any).toString()
+  const apiKey = process.env.LOGFLARE_API_KEY
+  console.log('api key', apiKey)
+  console.log('PROJECT_ANALYTICS_URL', PROJECT_ANALYTICS_URL)
+  const url = `${PROJECT_ANALYTICS_URL}api/endpoints/query/name/${name}${search}`
+  console.log('url', url)
+  const result = await get(url, {
+    headers: {
+      'x-api-key': apiKey,
+      'Content-Type': 'application/json',
+      Accept: 'application/json',
+    },
+  })
+  console.log('result', result)
+  return result
+}