When i try uploading file to storage using UppyJs it throws an error stating that Error: Invalid target option given to ProgressBar.If you meant to target an HTML element, please make sure that the element exists. If you meant to target a plugin, please confirm that your

import

statements or

require

calls are correct. Below is the code

import Uppy from '@uppy/core'
import XHRUpload from '@uppy/xhr-upload'
import ProgressBar from '@uppy/progress-bar'
import '@uppy/core/dist/style.min.css';
import '@uppy/progress-bar/dist/style.min.css';
  const uppy = new Uppy()
  uppy.use(XHRUpload, { endpoint: 'https://api.supabase.io/storage/v1/object/public/files' })
  uppy.use(ProgressBar, {
    target: '#progress-bar-container',
    hideAfterFinish: false
  })

  const handlePost = useCallback(async () => {
    if (user) {
      try {
        const { successful } = await uppy.upload()
        if (successful) {
          const file = uppy.getFile('0')
          if (file && file.progress && file.progress.uploadComplete && file.response && file.response.uploadURL) {
            const { data, error } = await supabase.from('category').insert({
              vname: vname,
              selectedValue: selectedValue.category,
              user: user,
              file_url: file.response.uploadURL
            })
            if (data && vname && successful) {
              toast.success('Post uploaded successfully')
              setOpen(false)
              location.reload()
            } else {
              toast.error('Unable to post')
            }
          } else {
            toast.error('File upload is not complete')
          }
        } else {
          toast.error('Something went wrong')
        }
      } catch (error) {
        toast.error('Something went wrong')
      }
    } else {
      toast.error('You need to sign in')
    }
  }, [vname, selectedValue, user, uppy])

I'm doing some stuff on my backend, where I want to "assume" the identity of a user. What would be the easiest way of doing this? I know I can do

supabase.auth.admin.generateLink

and then use that to sign in, but that feels so unnecessary.

Is it possible to manipulate the generated types so that certain rows marked as not null wont be marked as required in the generated types when the value is generated in a trigger? For example I have a

slug

column on the

products

table that has a non null constraint. The slug is generated in a before insert/update trigger on the products table, however when I try to insert a products record, the slug column is required in the types even though technically its not needed for the insert to succeed. Any thoughts?

I have this function:

ts
export async function getFileSignedURLs(filePaths: string[],expire = 120) {
  const { data, error } = await supabase.storage
    .from('user-id-photos')
    .createSignedUrls(filePaths, expire);
    if (error) {
      console.error('🛑 Error getting file signed URL: ', error.message);
      return [];
    }
    console.log(data[0]);
    return data;
}

The

console.log(data[0]);

outputs this:

js
{
  error: null,
  signedURL: '/object/sign/user-id-photos/2454d3f9-fe1e-47e0-bf08-2b53c6c63ada.jpg?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1cmwiOiJ1c2VyLWlkLXBob3Rvcy8yNDU0ZDNmOS1mZTFlLTQ3ZTAtYmYwOC0yYjUzYzZjNjNhZGEuanBnIiwiaWF0IjoxNjgzNTY3Mzc3LCJleHAiOjE2ODM1NzA5Nzd9.7Ep_LFygXHGO7rBQsF65dC_y94RoarUslDsbAeqy710',
  signedUrl: 'http://localhost:54321/storage/v1/object/sign/user-id-photos/2454d3f9-fe1e-47e0-bf08-2b53c6c63ada.jpg?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1cmwiOiJ1c2VyLWlkLXBob3Rvcy8yNDU0ZDNmOS1mZTFlLTQ3ZTAtYmYwOC0yYjUzYzZjNjNhZGEuanBnIiwiaWF0IjoxNjgzNTY3Mzc3LCJleHAiOjE2ODM1NzA5Nzd9.7Ep_LFygXHGO7rBQsF65dC_y94RoarUslDsbAeqy710'
}

As you can see,

signedUrl

is duplicate, and there's no

path

!

I am using nextjs for my frontend. I have nextjs api routes. When user calls api route I would like to first check if user is authenticated then I would need to create Supabase client with service_role, so I can insert data in tables. I couldn't find any examples that use service_role. Is there a better approach? I cannot write rls policy and let user insert it directly because it would be too complex.

Hi, I'm struggling with inserting new data to my Supabase table. As written in the topic, the http request "goes through" and everything looks fine in the console, but I cannot see the new row in the table. Creating new rows using Supabase interface works ok BUT ids increment depending on how many requests I made from the code (eg. the id of the 1st row is not 1 but 4 - I already did 3 tests before). I checked subdomain hash, table name, api key - everything is correct. I set up these RLS policies:

sql
CREATE POLICY "Enable read access for all users" ON "public"."profiles"
AS PERMISSIVE FOR SELECT
TO public
USING (true)

sql
CREATE POLICY "Enable insert for everyone" ON "public"."profiles"
AS PERMISSIVE FOR INSERT
TO public

WITH CHECK (true)

Another strange thing is that I have to stringify the object with the data I'm about to post, otherwise I'm getting a "new row violates row-level security policy for table" error. With this stringified object I'm getting the status 201 and no error + no data in the table 😢

So I'm getting super close to getting my security key authentication working. In an api route I match a key to see if it exists in a table, then we can execute logic on the api route by creating a jwt and giving it to our client. So on the client side I have this method:

ts
const handleLoginWithKey = async () => {
  if (!challenge) return
  const token = await loginKey({challenge})
  await manuallySetUser(token)
}

for manuallySetUser, this uses the Supabase provider context to replace the browser client with one that has the authorization header set

ts
export default function SupabaseProvider({children}: { children: React.ReactNode }) {
  const [supabase, setSupabase] = useState(() => createBrowserSupabaseClient())

  /* relevant code */
  const manuallySetUser = async (access_token: string) => setSupabase(() =>
    createBrowserSupabaseClient({
      supabaseUrl: process.env.NEXT_PUBLIC_SUPABASE_URL!,
      supabaseKey: process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
      options: { global: { headers: {
        authorization: `Bearer ${access_token}`,
        }}}
      })
  /*             */

  useEffect(() => {
      // refresh route on auth change
  }, [router, supabase])
  useEffect(() => {
    if (!supabase) return
    getUser()
  }, [supabase])
  return (
    <Context.Provider value={{ supabase: supabase, user, manuallySetUser }}>
      <>{children}</>
    </Context.Provider>
  )
}

export const useSupabase = () => {
    const context = useContext(Context)
    if (context === undefined) throw new Error('useSupabase must be used inside SupabaseProvider')
    return context
}

this ALMOST works, it fails however because for some reason the bearer token is appended rather than set. When looking at the

supabase.co/auth/v1/user

request, this is the authorization header:

Bearer header.anon_data, Bearer header.manually_set_data

which as expected isn't parsed by the auth api,

{"code":401,"msg":"This endpoint requires a Bearer token"}

I have a new installation of Supabase, I went ahead an changed the kong & .env files but I am getting this error once the service runs: supabase_admin@postgres FATAL: password authentication failed for user "supabase_admin" Connection matched pg_hba.conf line 89: "host all all [IP] scram-sha-256" (Postgrex.Error) FATAL 28P01 (invalid_password) password authentication failed for user "supabase_admin" this same goes for admin and postgres users

Hi I currently have this use case where im using this edge function to execute a scheduled function. I needed this function to bypass row-level security, to do this i used the SUPABASE_SERVICE_ROLE_KEY. By default edge functions have access to these environment variables. Guess my question is, is this even secure and safe? Couldn't anyone just download the code and my edge function because the function already have access to these environment varibles ie has access to the value of Deno.env.get('SUPABASE_SERVICE_ROLE_KEY');

I keep getting this error when trying to run me deno tests. I tried all the suggestions. wont work and Deno wont accept the ts-ignore. any suggestions? thanks this is where the test fails.

// @ts-ignore: module not found
import { SupabaseClient } from '@supabase/supabase-js';

and here is my import_maps

{
  "imports": {
    "@supabase/supabase-js": "https://esm.sh/@supabase/supabase-js@2.7.1",
    "asserts": "https://esm.sh/v119/*asserts@4.0.2",
    "denomailer": "https://esm.sh/v119/denomailer@0.0.0",
    "lodash": "https://esm.sh/v119/lodash@4.17.21",
    "oak": "https://deno.land/x/oak/mod.ts",
    "server": "https://deno.land/std/http/server.ts",
    "zod": "https://esm.sh/v119/zod@3.21.4",
    "stripe": "https://esm.sh/stripe@11.1.0?target=deno"
  }
}

I am using VS Code.

Is it possible to use a where clause on a joined table Consider the following query:

js
    const { data, error } = await supabase
        .from('product_groups')
        .select(
            `
    id, 
    name,
    description,
    images,
    products ( * )
  `
        )

This works great, but I need only products where the ``active`` column is set to ``true``, is this possible? I've created a view that does that for me right now but if it's possible without I might aswell

TLDR: Grafana Cloud query returns no data. I've added my data source, I have it selected for a widget within a dashboard but no matter what is sent, I get a positive (200 status) but empty result

[]

I've tried both queries:

realtime_memory_bytes{supabase_project_ref="oocsbdgwapewiegksepf",service_type="middleware"}

and

realtime_memory_bytes{service_type=\"middleware\"} / 1000 / 1000

Am I missing something? Are my queries malformated? I am able to connect to my endpoint via curl and return data. So I know my endpoint and service provider key are valid. Here's the Curl response I get

# HELP realtime_memory_bytes Current realtime memory usage
# TYPE realtime_memory_bytes gauge
realtime_memory_bytes{supabase_project_ref="oocsbdgwapewiegksepf",service_type="middleware"} 1.8446744073709552e+19

Here's the grafana request and response:

{
  "request": {
    "url": "api/ds/query",
    "method": "POST",
    "data": {
      
  "response": {
    "results": {
      "A": {
        "status": 200,
        "frames": [
          {
            "schema": {
              "refId": "A",
              "meta": {
                "typeVersion": [
                  0,
                  0
                ],
                "executedQueryString": "Expr: realtime_memory_bytes{service_type=\\\"middleware\\\"} / 1000 / 1000\nStep: 15s"
              },
              "fields": []
            },
            "data": {
              "values": []
            }
          }
        ],
        "refId": "A"
      }
    }
  }
}

I'm trying to figure out how to locally develop my Supabase app with Google auth, and I'm wondering how I can put my OAuth credentials somewhere without pushing them to Git. Alternatively, should I even have my

config.toml

checked in to source control?

When issuing an update to an array column, can I update the individual array value using the javascript SDK or should I just replace all array items? What is best practice? I'm just trying to get my head around how to update an array column of jsonb values. Sorry if the question seems obvious, I'm just learning a bunch of this backend stuff.

I'm uploading data from a chrome extension, manually inserting the authentication key in the header but for some reason the userId is coming up as null in the supabase admin. After clicking on the key then the key become visible. Is there any way I can fix this?

You might consider deleting the user but not their public.profile/user table entry and marking that as soft delete. Then if they comeback they get a new userID and can use their email again.

I will explain more if asked, its kind of a lot.

js
const categoryId = url.searchParams.get("categoryId"); // 34

const { data: results, error: attributesError } = await locals.supabase.from("attribute").select("*, category_attribute(*)").eq("category_attribute.category_id", categoryId);

console.log(JSON.stringify(results, null, 2));

Outputs this:

[
            {
                attribute_id: 16,
                attribute_name: "Color",
                attribute_description: null,
                attribute_image_path: null,
                category_attribute: [
                    {
                        id: 120,
                        category_id: 34,
                        attribute_id: 16,
                    },
                ],
            },
            {
                attribute_id: 6,
                attribute_name: "Manufacturer",
                attribute_description: null,
                attribute_image_path: null,
                category_attribute: [],
            },
        ];

Not sure what I'm doing wrong here 🤔

Im trying to fetch an example image from my bucket (that is public). Now just normally fetching it using

https://<myID>.supabase.co/storage/v1/object/public/model_thumbnails/imaged.jpg

works. However, everytime i try to resize it using this URL

https://<myID>.supabase.co/storage/v1/render/image/public/model_thumbnails/imaged.jpg?width=800&height=300&resize=contain

it fails and returns an error saying :

json
{"statusCode":"403","error":"FeatureNotEnabled","message":"feature not enabled for this tenant"}

I tried adding the --import-map flag like suggested here https://github.com/denoland/deploy_feedback/issues/17#issuecomment-1076532539 but i get a

Error: unknown flag: --import-map

. here is my simple yaml

name: Deploy Function

on:
    push:
        branches:
            - main
    workflow_dispatch:

jobs:
    deploy:
        runs-on: ubuntu-latest

        env:
            SUPABASE_ACCESS_TOKEN: ${{ secrets.SUPABASE_ACCESS_TOKEN }}
            PROJECT_ID: zkcmpwzbigjgwiesauro

        steps:
            - uses: actions/checkout@v3

            - uses: supabase/setup-cli@v1
              with:
                  version: 1.0.0

            - run: supabase functions deploy contact --import-map=../../supabase/functions/import_map.json --project-ref $PROJECT_ID

Has anyone had luck with github actions where the import map is not at the root?

It is very unclear, but try {shouldSoftDelete:true} instead of true.

I see I can describe my APIs but can not do so for my edge functions

Is it possible to update the column type? I want to change it from using

int8

to

uuid

Thank you

I have a webhook I set up to hit my external api, but there is no logs my api and I am not sure how to debug any failed requests within supabase webhooks

Hi, we're having to do more maintenance than we want to for supporting email sign ups. e.g. recently we hit the email rate limit. We're not sure what happens if we turn it off: we have at least 10% of users signed in through that, and we'd want them to still have a reasonable experience. Is there a way to migrate them to the google provider? What happens to them if we don't? Will the magic link still be available? Any other tips/steps we should take?

I have been using Prisma for the last 6 months. IMHO, It is one of the best ORM solutions. You can read more about Prisma here(https://www.prisma.io/docs/concepts/overview/what-is-prisma). But my experience with Prisma hasn't been perfect. One of the issues that I face with Prisma is managing migrations(you can read more about database migrations with Prisma here - https://www.prisma.io/docs/concepts/components/prisma-migrate/mental-model). I get the dreaded schema drift (you can read what a schema drift is here - https://www.bytebase.com/blog/what-is-database-schema-drift) when trying to push my new schema changes. When you get to this fork in the road Prisma offers two options - either roll back your changes or reset the database. Neither choice is optimal and since we are in early stages of our startup, with test data, I usually chose reset. I have brought up this issue with the Prisma community on their Slack channel. Their stock answer is always

Schema drift refers to any difference between the expected schema (based on your migration history and schema.prisma file) and the actual schema in your database. There isn’t specific documentation that lists all common schema drift causes, but some possible reasons for drift include: Manual changes to the database schema, such as adding or modifying tables, columns, indexes, constraints outside of Prisma Migrate. Incomplete or failed migrations, which leave the schema in an inconsistent state.
Changes to the schema.prisma file that have not been applied as migrations.

Here's my problem. 9 times out of 10 those reasons don't apply to my schema drift. 9 times out of 10 the only thing i have done is added/updated/deleted test data. which is what a database is for, right? So, as a temporary fix I stopped using Prisma migrations altogether and switch to

prisma db push

forcing schema changes. I want to hear how people are managing their migrations. What workflows are you using? cc: @NanoBit

I am implementing tus-js-client to upload files to supabase but it is not working below is the code

const handlePost = useCallback(async () => {
    if (user) {
      try {
        if (vfile) {
          const upload = new tus.Upload(vfile, {
            endpoint: `https://${projectId}.supabase.co/storage/v1/upload/resumable`,
            retryDelays: [0, 3000, 5000, 10000, 20000],
            headers: {
              authorization: `Bearer ${token}`,
              'x-upsert': 'true', // optionally set upsert to true to overwrite existing files
            },
            uploadDataDuringCreation: true,
            metadata: {
              bucketName: 'files',
              objectName: vname,
              contentType: 'image/png',
              cacheControl: 3600,
            },
            chunkSize: 6 * 1024 * 1024, // NOTE: it must be set to 6MB (for now) do not change it
            onError: function (error) {
              console.log('Failed because: ' + error)
              toast.error('something went wrong')
            },
     onProgress: function (bytesUploaded, bytesTotal) {
 var percentage = ((bytesUploaded / bytesTotal) * 100).toFixed(2)
console.log(bytesUploaded, bytesTotal, percentage + '%')
            },
            onSuccess: function () {
              setFile_url(upload.url)
            },
          })
          upload.start()
        }
        if (vname) {
          const data = await supabase.from('category').insert({
            vname: vname,
            selectedValue: selectedValue.category,
            user: user,
          })
          if (data && vname && vfile) {
            toast.success('Post uploaded successfully')
            setOpen(false)
            location.reload()
          } else {
            toast.error('Unable to post')
          }
        }
      } catch (error) {
        toast.error('Something went wrong')
      }
    } else {
      toast.error('You need to sign in')
    }
  }, [vname, vfile, selectedValue, user])

Theres no unique option in the column settings, i cant really have 2 users with the same name..

ugh, so been stuck for a week now trying to self-host supabase in kubernetes. I'm clearly missing something. I can run self-host on docker without issue. But anytime I try to run supabase with an external postgres db, things break and fail. I got most everything to work except storage and realtime. Don't need storage so focus on this realtime issue. First issue I ran across was needing to add a tenant.

curl -X POST \
  -H 'Content-Type: application/json' \
  -H 'Authorization: Bearer REDACTED' \
  -d $'{
    "tenant" : {
      "name": "supabase_realtime_rls",
      "external_id": "supabase-supabase-realtime",
      "jwt_secret": "REDACTED_JWT",
      "extensions": [
        {
          "type": "postgres_cdc_rls",
          "settings": {
            "db_name": "postgres",
            "db_host": "supabase-db.postgres.svc.cluster.local",
            "db_user": "postgres",
            "db_password": "REDACTED",
            "db_port": "5432",
            "region": "fra",
            "poll_interval_ms": 100,
            "poll_max_record_bytes": 1048576,
            "ip_version": 4
          }
        }
      ]
    }
  }' \
  http://localhost:62042/api/tenants

The url for the api ends up referencing an internal url that starts with supabase-supabase-realtime. Hence the external_id is set to that which solved one issue. Next issue now is I am getting "unmatched topic" error on the front-end. I pulled the logs of the realtime bucket and it shows this.

presence_key: "REDACTED", rate_counter: %Realtime.RateCounter{id: {:channel, :events, "supabase-supabase-realtime"}, avg: 0.5, bucket: [1, 0], max_bucket_len: 60, tick: 1000, tick_ref: #Reference<0.1672614097.2835611650.128683>, idle_shutdown: :infinity, idle_shutdown_ref: nil, telemetry: %{emit: true, event_name: [:realtime, :rate_counter, :channel, :events], measurements: %{limit: 100, sum: 0}, metadata: %{id: {:channel, :events, "supabase-supabase-realtime"}, tenant: "supabase-supabase-realtime"}}}, self_broadcast: false, tenant: "supabase-supabase-realtime", tenant_token: "REDACTED_TOKEN", tenant_topic: "supabase-supabase-realtime:public"}, channel: RealtimeWeb.RealtimeChannel, channel_pid: #PID<0.3183.0>, endpoint: RealtimeWeb.Endpoint, handler: RealtimeWeb.UserSocket, id: "user_socket:supabase-supabase-realtime", joined: true, join_ref: "4", private: %{log_handle_in: :debug, log_join: :info}, pubsub_server: Realtime.PubSub, ref: nil, serializer: Phoenix.Socket.V1.JSONSerializer, topic: "realtime:public", transport: :websocket, transport_pid: #PID<0.3181.0>}
09:56:31.206 project=supabase-supabase-realtime [info] Billing metrics: [:realtime, :rate_counter, :channel, :events]
09:56:31.208 project=supabase-supabase-realtime [info] Billing metrics: [:realtime, :rate_counter, :channel, :joins]
09:56:31.534 project=supabase-supabase-realtime external_id=supabase-supabase-realtime [error] GenServer #PID<0.3186.0> terminating
** (FunctionClauseError) no function clause matching in Realtime.PostgresCdc.region_nodes/1
    (realtime 2.7.1) lib/realtime/postgres_cdc.ex:89: Realtime.PostgresCdc.region_nodes(nil)
    (realtime 2.7.1) lib/realtime/postgres_cdc.ex:104: Realtime.PostgresCdc.launch_node/3
    (realtime 2.7.1) lib/extensions/postgres_cdc_rls/cdc_rls.ex:71: Extensions.PostgresCdcRls.start_distributed/1
    (realtime 2.7.1) lib/extensions/postgres_cdc_rls/cdc_rls.ex:16: anonymous fn/3 in Extensions.PostgresCdcRls.handle_connect/1
    (elixir 1.14.3) lib/range.ex:392: Enumerable.Range.reduce/5
    (elixir 1.14.3) lib/enum.ex:2514: Enum.reduce_while/3
    (realtime 2.7.1) lib/realtime_web/channels/realtime_channel.ex:288: RealtimeWeb.RealtimeChannel.handle_info/2
    (phoenix 1.6.13) lib/phoenix/channel/server.ex:343: Phoenix.Channel.Server.handle_info/2

I'm clueless. I notice there is no pg_create_logical_replication_slot being run so no logical slot was made. Assuming there's an error before that occurs ... any help?

Hello my database looks like this and here is any function to get only unique series becouse this getting me all of characters let list = await supabase .from("info") .select("*") .ilike('seria',

%${seria}%

) .order('name') .then(wynik => { return wynik.data; });