Merge branch 'feat/event-collections' of github.com:supabase/supabase into feat/event-collections

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

@@ -55,7 +55,14 @@ export const CreateWarehouseCollectionModal = (props: Props) => {
           <div className="py-4">
             <Modal.Content>
               <div className="space-y-6">
-                <Input required layout="horizontal" label="Collection name" id="name" name="name"/>
+                <Input
+                  required
+                  layout="horizontal"
+                  label="Collection name"
+                  id="name"
+                  name="name"
+                  autoComplete="off"
+                />
               </div>
             </Modal.Content>
           </div>

apps/studio/components/interfaces/Settings/Logs/LogSelectionRenderers/DefaultExplorerSelectionRenderer.tsx

@@ -13,9 +13,9 @@ const DefaultExplorerSelectionRenderer = ({ log }: any) => {
   }) => {
     return (
       <div className="grid grid-cols-12">
-        <span className="text-foreground-lighter text-sm col-span-4">{label}</span>
+        <span className="text-foreground-lighter text-sm col-span-3">{label}</span>
         <span
-          className={`text-foreground text-sm col-span-8 overflow-x-auto ${
+          className={`text-foreground text-sm col-span-9 overflow-x-auto ${
             code && 'text-xs font-mono'
           }`}
         >

apps/studio/components/interfaces/Settings/Logs/LogTable.tsx

@@ -35,6 +35,7 @@ import LogSelection, { LogSelectionProps } from './LogSelection'
 import type { LogData, QueryType } from './Logs.types'
 import DefaultErrorRenderer from './LogsErrorRenderers/DefaultErrorRenderer'
 import ResourcesExceededErrorRenderer from './LogsErrorRenderers/ResourcesExceededErrorRenderer'
+import { motion } from 'framer-motion'
 
 interface Props {
   data?: Array<LogData | Object>
@@ -357,7 +358,7 @@ const LogTable = ({
               [
                 'font-mono tracking-tight',
                 isEqual(row, focusedLog)
-                  ? '!bg-border-stronger rdg-row--focused'
+                  ? 'rdg-row--focused'
                   : ' !bg-studio hover:!bg-surface-100 cursor-pointer',
               ].join(' ')
             }
@@ -380,14 +381,15 @@ const LogTable = ({
             }}
           />
           {logDataRows.length > 0 ? (
-            <div
-              className={
-                queryType
-                  ? 'flex w-1/2 flex-col'
-                  : focusedLog
-                    ? 'flex w-1/2 flex-col'
-                    : 'hidden w-0'
-              }
+            <motion.div
+              variants={{
+                hidden: { width: 0 },
+                visible: { width: '50%' },
+              }}
+              initial="hidden"
+              animate={focusedLog ? 'visible' : 'hidden'}
+              exit="hidden"
+              transition={{ duration: 0.2 }}
             >
               <LogSelection
                 projectRef={projectRef}
@@ -396,7 +398,7 @@ const LogTable = ({
                 queryType={queryType}
                 params={params}
               />
-            </div>
+            </motion.div>
           ) : null}
         </div>
       </section>

apps/studio/data/collections/collections-query.ts

@@ -55,6 +55,33 @@ export function useCollectionQuery({ projectRef, collectionToken }: CollectionQu
           payload: {
             foo: 'bar',
           },
+          asdas: {
+            foo: 'bar',
+          },
+          srOZS: {
+            foo: 'bar',
+          },
+          BbXnH: {
+            foo: 'bar',
+          },
+          rLgrg: {
+            foo: 'bar',
+          },
+          QdIIk: {
+            foo: 'bar',
+          },
+          yGISs: {
+            foo: 'bar',
+          },
+          Bhryl: {
+            foo: 'bar',
+          },
+          hDUbQ: {
+            foo: 'bar',
+          },
+          iVzfj: {
+            foo: 'bar',
+          },
           created_at: '27/08/2023 11:36:31',
         },
         {

apps/studio/styles/react-data-grid-logs.scss

@@ -15,7 +15,7 @@
 
   .rdg-row {
     &.rdg-row--focused {
-      @apply border-r border-brand;
+      @apply border-r border-brand bg-background-surface-300;
       border-right-width: 4px;
     }