feat: add in valid query

apps/studio/components/interfaces/DataWarehouse/WarehouseCollectionDetail.tsx

@@ -4,42 +4,39 @@ import ShimmerLine from 'components/ui/ShimmerLine'
 import { useCollectionQuery } from 'data/collections/collections-query'
 import { useRouter } from 'next/router'
 import React, { useEffect } from 'react'
-import { Button, IconRewind } from 'ui'
+import { Button, IconRefreshCcw, IconRewind } from 'ui'
 import { LogTable } from '../Settings/Logs'
 import { useWarehouseQueryQuery } from 'data/analytics/warehouse-query'
 import { useWarehouseCollectionsQuery } from 'data/analytics/warehouse-collections-query'
 
-type Props = {}
-
-export const WarehouseCollectionDetail = (props: Props) => {
+export const WarehouseCollectionDetail = () => {
   const router = useRouter()
   const collectionToken = router.query.collectionToken as string
   const projectRef = router.query.ref as string
   const { data: collections } = useWarehouseCollectionsQuery({ projectRef }, { enabled: true })
   const collection = (collections || []).find((c) => c.token === collectionToken)
   const [params, setParams] = React.useState({
-    project: 'string', // project ref
     sql: `select current_timestamp() as 'time'`,
   })
-  console.log(params.sql)
 
   useEffect(() => {
     if (collection) {
       setParams({
         ...params,
         sql: `
-      select timestamp, id, event_message from \`${collection.name}\`
-      `,
+        select id, timestamp, event_message, metadata as testing from \`${collection.name}\` 
+        where timestamp > '2024-01-01' 
+        order by timestamp desc limit 100
+        `,
       })
     }
   }, [collection])
 
-  const { isLoading, data, isError } = useWarehouseQueryQuery(
+  const { isLoading, data, isError, refetch } = useWarehouseQueryQuery(
     { projectRef, sql: params.sql },
     { enabled: !!params.sql }
   )
-  console.log('data', data)
-  const results = data?.results || []
+  const results = data?.data?.result || []
   const isLoadingOlder = false
   function loadOlder() {
     console.log('loadOlder')
@@ -72,6 +69,15 @@ export const WarehouseCollectionDetail = (props: Props) => {
             >
               Load older
             </Button>
+            <Button
+              onClick={()=> refetch()}
+              icon={<IconRefreshCcw />}
+              type="default"
+              loading={isLoading}
+              disabled={isLoading}
+            >
+              Refresh
+            </Button>
           </div>
         )}
       </div>