added source insertion logic

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

@@ -1,8 +1,9 @@
 import { Button, Dropdown, Typography, IconChevronDown, IconPlay } from '@supabase/ui'
-import { LogTemplate } from '.'
+import { LogsTableName, LogTemplate } from '.'
 interface Props {
   templates?: LogTemplate[]
   onSelectTemplate: (template: LogTemplate) => void
+  onSelectSource: (source: LogsTableName) => void
   onRun: () => void
   onClear: () => void
   onSave?: () => void
@@ -16,6 +17,7 @@ const LogsQueryPanel: React.FC<Props> = ({
   onRun,
   onClear,
   onSave,
+  onSelectSource,
 }) => (
   <div
     className="
@@ -31,9 +33,9 @@ bg-panel-header-light dark:bg-panel-header-dark
           <Dropdown
             side="bottom"
             align="start"
-            overlay={templates.map((template: LogTemplate) => (
-              <Dropdown.Item key={template.label} onClick={() => onSelectTemplate(template)}>
-                <Typography.Text>{template.label}</Typography.Text>
+            overlay={Object.values(LogsTableName).map((source) => (
+              <Dropdown.Item key={source} onClick={() => onSelectSource(source)}>
+                <Typography.Text>{source}</Typography.Text>
               </Dropdown.Item>
             ))}
           >

studio/pages/project/[ref]/logs-explorer/query.tsx

@@ -5,10 +5,16 @@ import { observer } from 'mobx-react-lite'
 import { Typography, IconAlertCircle, Card, Input } from '@supabase/ui'
 import { withAuth } from 'hooks'
 import CodeEditor from 'components/ui/CodeEditor'
-import { LogsQueryPanel, LogTable, LogTemplate, TEMPLATES } from 'components/interfaces/Settings/Logs'
+import {
+  LogsQueryPanel,
+  LogsTableName,
+  LogTable,
+  LogTemplate,
+  TEMPLATES,
+} from 'components/interfaces/Settings/Logs'
 import { uuidv4 } from 'lib/helpers'
 import useLogsQuery from 'hooks/analytics/useLogsQuery'
-import {LogsExplorerLayout} from 'components/layouts'
+import { LogsExplorerLayout } from 'components/layouts'
 import ShimmerLine from 'components/ui/ShimmerLine'
 import LoadingOpacity from 'components/ui/LoadingOpacity'
 
@@ -52,11 +58,18 @@ export const LogsExplorerPage: NextPage = () => {
     setEditorId(uuidv4())
     changeQuery('')
   }
+  
+  const handleInsertSource = (source: LogsTableName) => {
+    setEditorValue((prev) => prev + source)
+    setEditorId(uuidv4())
+  }
+
   return (
     <LogsExplorerLayout>
       <div className="h-full flex flex-col flex-grow gap-4">
         <div className="border rounded">
           <LogsQueryPanel
+            onSelectSource={handleInsertSource}
             onClear={handleClear}
             onRun={handleRun}
             hasEditorValue={Boolean(editorValue)}