mirror of
https://github.com/supabase/supabase.git
synced 2026-05-06 22:18:00 +08:00
Removing all the unneccessary items from our docs. We might need it later on. But we don't for now...
This commit is contained in:
12
web/docs/common/CommonResponses.mdx
Normal file
12
web/docs/common/CommonResponses.mdx
Normal file
@@ -0,0 +1,12 @@
|
||||
|
||||
#### 400 Bad request
|
||||
An invalid syntax or configuration was sent.
|
||||
|
||||
#### 401 Unauthorized
|
||||
Invalid credentials were provided.
|
||||
|
||||
#### 404 Not found
|
||||
Requested resource cannot be found.
|
||||
|
||||
#### 500 Internal Server Error
|
||||
The server was unable to encounter the situation it encountered.
|
||||
@@ -1,472 +0,0 @@
|
||||
---
|
||||
id: filters
|
||||
title: 'Query Filters'
|
||||
---
|
||||
|
||||
import Tabs from '@theme/Tabs';
|
||||
import TabItem from '@theme/TabItem';
|
||||
|
||||
We will be using this table as reference for our examples:
|
||||
```json
|
||||
{
|
||||
"companies":[
|
||||
{ "name": "Pied Piper", "employeeCount": 10 },
|
||||
{ "name": "Hooli", "employeeCount": 1000 },
|
||||
{ "name": "Yao Net", "employeeCount": 100 },
|
||||
{ "name": "See Food App", "employeeCount": null }
|
||||
]
|
||||
}
|
||||
```
|
||||
## Order
|
||||
```js
|
||||
order(columnName, ascending=false, nullsFirst=false)
|
||||
```
|
||||
|
||||
Returns an ordered array of rows based on stated preferences.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the order on.
|
||||
|
||||
#### ascending
|
||||
`optional` boolean
|
||||
Determines whether the order will be ascending or descending. Default value will be **false**.
|
||||
|
||||
#### nullsFirst
|
||||
`optional` boolean
|
||||
Determines whether null values will be displayed first or not. Default value will be **false**.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").order("employeeCount", true, true)
|
||||
```
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "See Food App", "employeeCount": null },
|
||||
{ "name": "Pied Piper", "employeeCount": 10 },
|
||||
{ "name": "Yao Net", "employeeCount": 100 },
|
||||
{ "name": "Hooli", "employeeCount": 1000 }
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Range
|
||||
```js
|
||||
range(from, to?)
|
||||
```
|
||||
|
||||
Returns an array of rows based on specified range and position of rows with regards to the table.
|
||||
|
||||
### Method arguments
|
||||
#### from
|
||||
`required` integer
|
||||
Index or position of the start of the specified range.
|
||||
|
||||
|
||||
#### to
|
||||
`optional` integer
|
||||
Index or position of the end of the specified range. If not stated, all remaining rows after the starting index will be returned.
|
||||
|
||||
### Example
|
||||
#### With both `from` and `to` specified
|
||||
```js
|
||||
supabase.get("companies").range(0,2)
|
||||
```
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Pied Piper", "employeeCount": 10 },
|
||||
{ "name": "Hooli", "employeeCount": 1000 },
|
||||
{ "name": "Yao Net", "employeeCount": 100 }
|
||||
]
|
||||
|
||||
```
|
||||
|
||||
#### With `from` only specified
|
||||
```js
|
||||
supabase.get("companies").range(1)
|
||||
```
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Yao Net", "employeeCount": 100 },
|
||||
{ "name": "See Food App", "employeeCount": null }
|
||||
]
|
||||
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Single
|
||||
```js
|
||||
single()
|
||||
```
|
||||
Returns the first row of the table as an object and **not** as an array.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").single()
|
||||
```
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
{ "name": "Pied Piper", "employeeCount": 10 }
|
||||
```
|
||||
---
|
||||
|
||||
## Match
|
||||
```js
|
||||
match(filterObject)
|
||||
```
|
||||
|
||||
Returns an array of rows that exactly match the specified filterObject.
|
||||
|
||||
### Method arguments
|
||||
#### filterObject
|
||||
`required` object
|
||||
Object contains column names and the desired values.
|
||||
|
||||
### Example
|
||||
#### Generic
|
||||
```js
|
||||
supabase.get("companies").match({ "name": "Pied Piper", "employeeCount": 10 })
|
||||
```
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Pied Piper", "employeeCount": 10 }
|
||||
]
|
||||
```
|
||||
|
||||
#### No matches
|
||||
```js
|
||||
supabase.get("companies").match({ "name": "Pied Piper", "employeeCount": 50 })
|
||||
```
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
# Advanced Filtering
|
||||
|
||||
## Equals
|
||||
```js
|
||||
eq(columnName, filterValue)
|
||||
```
|
||||
Returns an array of rows whose value on the stated columnName exactly matches the specified filterValue.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the match on.
|
||||
|
||||
#### filterValue
|
||||
`required`
|
||||
Value to match. Data type is dependent on the columnName specified.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").eq("name", "Hooli")
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Hooli", "employeeCount": 1000 }
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Greater Than
|
||||
```js
|
||||
gt(columnName, filterValue)
|
||||
```
|
||||
|
||||
Returns an array of rows whose value on the stated columName is greater than the specified filterValue.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the comparison on.
|
||||
|
||||
#### filterValue
|
||||
`required`
|
||||
Value to compare to. Data type is dependent on the columnName specified.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").gt("employeeCount", 10)
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Hooli", "employeeCount": 1000 },
|
||||
{ "name": "Yao Net", "employeeCount": 100 }
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Less Than
|
||||
```js
|
||||
lt(columnName, filterValue)
|
||||
```
|
||||
|
||||
Returns an array of rows whose value on the stated columnName is less than the specified filterValue.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the comparison on.
|
||||
|
||||
#### filterValue
|
||||
`required`
|
||||
Value to compare to. Data type is dependent on the columnName specified.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").lt("employeeCount", "1000")
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Pied Piper", "employeeCount": 10 },
|
||||
{ "name": "Yao Net", "employeeCount": 100 }
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Greater Than or Equal
|
||||
```js
|
||||
gte(columnName, filterValue)
|
||||
```
|
||||
|
||||
Returns an array of rows whose value on the stated columName is greater than or equal to the specified filterValue.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the comparison on.
|
||||
|
||||
#### filterValue
|
||||
`required`
|
||||
Value to compare to. Data type is dependent on the columnName specified.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").gte("employeeCount", 10)
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Pied Piper", "employeeCount": 10 },
|
||||
{ "name": "Hooli", "employeeCount": 1000 },
|
||||
{ "name": "Yao Net", "employeeCount": 100 }
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Less Than or Equal
|
||||
```js
|
||||
lte(columnName, filterValue)
|
||||
```
|
||||
|
||||
Returns an array of rows whose value on the stated columnName is less than or equal to the specified filterValue.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the comparison on.
|
||||
|
||||
#### filterValue
|
||||
`required`
|
||||
Value to compare to. Data type is dependent on the columnName specified.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").lte("employeeCount", "1000")
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Pied Piper", "employeeCount": 10 },
|
||||
{ "name": "Hooli", "employeeCount": 1000 },
|
||||
{ "name": "Yao Net", "employeeCount": 100 }
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Like
|
||||
```js
|
||||
like(columnName, stringPattern)
|
||||
```
|
||||
|
||||
Returns an array of rows whose value in the stated columnName matches the supplied pattern.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the comparison on.
|
||||
|
||||
#### stringPattern
|
||||
`required` string
|
||||
String pattern to compare to. A comprehensive guide on how to form proper patterns can be found [here](https://www.postgresql.org/docs/current/functions-matching.html).
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").like("name", "%ao%")
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Yao Net", "employeeCount": 100 }
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Ilike
|
||||
```js
|
||||
ilike(columnName, filterValue)
|
||||
```
|
||||
|
||||
A case-insensitive version of [like(columnName, filterValue)](../library/filters#like).
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the match on.
|
||||
|
||||
#### stringPattern
|
||||
`required` string
|
||||
String pattern to compare to. A comprehensive guide on how to form patterns can be found [here](https://www.postgresql.org/docs/current/functions-matching.html).
|
||||
|
||||
### Example
|
||||
#### Using like
|
||||
```js
|
||||
supabase.get("companies").like("name", "_pi%")
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[]
|
||||
```
|
||||
|
||||
#### Using ilike
|
||||
```js
|
||||
supabase.get("companies").ilike("name", "_pi%")
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Pied Piper", "employeeCount": 10}
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Is
|
||||
```js
|
||||
is(columnName, filterValue)
|
||||
```
|
||||
|
||||
A check for exact equality (**null**, **true**, **false**), returns an array of rows whose value on the stated columnName exactly match the specified filterValue.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the match on.
|
||||
|
||||
#### filterValue
|
||||
`required` boolean **OR** null
|
||||
Value to match.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").is("employeeCount", null)
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "See Food App", "employeeCount": null }
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## In
|
||||
```js
|
||||
in(columnName, filterArray)
|
||||
```
|
||||
|
||||
Returns an array of rows whose value on the stated columnName is found on the specified filterArray.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the match on.
|
||||
|
||||
#### filterArray
|
||||
`required` array
|
||||
Array of values to find a match. Data type of values is dependent on the columnName specified.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").in("name", ["Hooli", "Pied Piper", "Google"])
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Pied Piper", "employeeCount": 10 },
|
||||
{ "name": "Hooli", "employeeCount": 1000 }
|
||||
]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Not
|
||||
```js
|
||||
not(columnName, filterValue)
|
||||
```
|
||||
|
||||
Returns of array of rows whose value on the stated columnName is **not** equal to the specified value.
|
||||
|
||||
### Method arguments
|
||||
#### columnName
|
||||
`required` string
|
||||
Name of chosen column to base the match on.
|
||||
|
||||
#### filterValue
|
||||
`required`
|
||||
Value to **not** match. Data type is dependent on the columnName specified.
|
||||
|
||||
### Example
|
||||
```js
|
||||
supabase.get("companies").not("name", "See Food App")
|
||||
```
|
||||
|
||||
The following will be returned with status code `200 OK`:
|
||||
```json
|
||||
[
|
||||
{ "name": "Pied Piper", "employeeCount": 10 },
|
||||
{ "name": "Hooli", "employeeCount": 1000 },
|
||||
{ "name": "Yao Net", "employeeCount": 100 }
|
||||
]
|
||||
```
|
||||
|
||||
@@ -6,6 +6,8 @@ title: 'Reading your data'
|
||||
import Tabs from '@theme/Tabs'
|
||||
import TabItem from '@theme/TabItem'
|
||||
import DummyData from '../common/DummyData.mdx'
|
||||
import CommonResponses from '../common/CommonResponses.mdx'
|
||||
import Collapsable from '../../src/components/Collapsable'
|
||||
|
||||
We will be using these tables as reference for our examples:
|
||||
|
||||
@@ -32,6 +34,10 @@ const getCities = async () => {
|
||||
}
|
||||
```
|
||||
|
||||
<details>
|
||||
<summary>Show response</summary>
|
||||
<div>
|
||||
|
||||
Calling `getCities()` will return the following response:
|
||||
|
||||
```json
|
||||
@@ -45,6 +51,9 @@ Calling `getCities()` will return the following response:
|
||||
]
|
||||
```
|
||||
|
||||
</div>
|
||||
</details>
|
||||
|
||||
### Getting specific columns
|
||||
|
||||
Get all cities but only return the name.
|
||||
@@ -67,6 +76,10 @@ const getCities = async () => {
|
||||
}
|
||||
```
|
||||
|
||||
<details>
|
||||
<summary><b>Show response</b></summary>
|
||||
<div>
|
||||
|
||||
Calling `getCities()` will return the following response:
|
||||
|
||||
```json
|
||||
@@ -80,6 +93,9 @@ Calling `getCities()` will return the following response:
|
||||
]
|
||||
```
|
||||
|
||||
</div>
|
||||
</details>
|
||||
|
||||
### Query foreign tables
|
||||
|
||||
Get all users and return all information about them and the companies they belong to.
|
||||
@@ -109,8 +125,8 @@ const getCountries = async () => {
|
||||
|
||||
|
||||
<details>
|
||||
<summary><b>Show response</b></summary>
|
||||
<div>
|
||||
<summary><b>Show response</b></summary>
|
||||
<div>
|
||||
|
||||
Calling `getCountries()` will return the following response:
|
||||
|
||||
@@ -155,88 +171,448 @@ Calling `getCountries()` will return the following response:
|
||||
]
|
||||
```
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</details>
|
||||
|
||||
## Reference
|
||||
|
||||
---
|
||||
|
||||
---
|
||||
|
||||
---
|
||||
|
||||
--
|
||||
|
||||
```js
|
||||
supabase.get(tableName, options?)
|
||||
### `get()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {2}
|
||||
supabase
|
||||
.get(tableName)
|
||||
```
|
||||
|
||||
Given the `options?` set (if any), this **asynchronously** gets all rows from the specified `tableName` in your database.
|
||||
|
||||
## Method arguments
|
||||
|
||||
### tableName
|
||||
|
||||
`required` string
|
||||
##### tableName `:string`
|
||||
Name of table in the database that will be read from.
|
||||
|
||||
### options
|
||||
|
||||
`optional` object
|
||||
All available options and examples it their usage can be found [here](../library/options).
|
||||
----
|
||||
|
||||
## Additional filtering
|
||||
### `select()`
|
||||
|
||||
### Select
|
||||
|
||||
```js
|
||||
select(columnQuery)
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.select(columnNames)
|
||||
```
|
||||
|
||||
Returns an array of rows with only columns specified in `columnQuery`.
|
||||
|
||||
#### Method arguments
|
||||
|
||||
##### columnQuery
|
||||
|
||||
`required` array
|
||||
##### columnName `:string`
|
||||
Select only the specified columns. For example `select('id, name')`. Similar to a GraphQL, if a foreign key constraint exists between this table
|
||||
and another, information from the other table can be requested as well. For example:
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
// From the 'users' table
|
||||
;`
|
||||
Id,
|
||||
fullName,
|
||||
companyId
|
||||
`
|
||||
```
|
||||
|
||||
String containing column names that are found in the table. The pattern/ syntax would be as shown above.
|
||||
If a foreign key constraint exists between this table and another, information from
|
||||
the other table can be requested as well. The pattern/ syntax is shown below:
|
||||
|
||||
```js
|
||||
// From the 'users' table
|
||||
;`
|
||||
fullName,
|
||||
companies {
|
||||
supabase
|
||||
.get('countries')
|
||||
.select(`
|
||||
name,
|
||||
employeeCount
|
||||
}
|
||||
`
|
||||
cities {
|
||||
name,
|
||||
population
|
||||
}
|
||||
`)
|
||||
```
|
||||
|
||||
Instead of stating the column name with the foreign key constraint, the name of the other table is mentioned instead
|
||||
along with the desired column names from that table.
|
||||
|
||||
##### Example
|
||||
----
|
||||
|
||||
### `order()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.order(columnName, sortAscending, nullsFirst)
|
||||
```
|
||||
|
||||
Orders your data before fetching.
|
||||
|
||||
##### columnName `:string`
|
||||
Name of chosen column to base the order on.
|
||||
|
||||
##### sortAscending `:boolean? | Default is false`
|
||||
Specifies whether the order will be ascending or descending.
|
||||
|
||||
##### nullsFirst `:boolean? | Default is false`
|
||||
Specifies whether null values will be displayed first.
|
||||
|
||||
----
|
||||
|
||||
### `range()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.range(fromIndex, toIndex)
|
||||
```
|
||||
|
||||
Paginates your request.
|
||||
|
||||
##### fromIndex `:integer`
|
||||
Index or position of the start of the specified range.
|
||||
|
||||
##### toIndex `:integer?`
|
||||
Index or position of the end of the specified range. If not stated, all remaining rows after the starting index will be returned.
|
||||
|
||||
----
|
||||
|
||||
### `single()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.single()
|
||||
```
|
||||
|
||||
Returns the first row of the table as an object and **not** as an array.
|
||||
|
||||
----
|
||||
|
||||
### `match()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.match(filterObject)
|
||||
```
|
||||
|
||||
Returns an array of rows that exactly match the specified filterObject.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.match({ 'continent': 'Asia'})
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
|
||||
##### filterObject `:object`
|
||||
An object of `{ 'columnName': 'criteria' }`
|
||||
|
||||
----
|
||||
|
||||
### `eq()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.eq(columnName, filterValue)
|
||||
```
|
||||
|
||||
"Equals": Returns an array of rows whose value on the stated columnName exactly matches the specified filterValue.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.eq('name', 'New Zealand')
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### filterValue `{:string|:integer|:boolean}`
|
||||
Value to match.
|
||||
|
||||
----
|
||||
|
||||
### `gt()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.gt(columnName, filterValue)
|
||||
```
|
||||
|
||||
"Greater Than": Returns an array of rows whose value on the stated columnName exactly matches the specified filterValue.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.gt('id', 20)
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### filterValue `{:string|:integer|:boolean}`
|
||||
Value to compare to.
|
||||
|
||||
----
|
||||
|
||||
|
||||
### `lt()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.lt(columnName, filterValue)
|
||||
```
|
||||
|
||||
"Less Than": Returns an array of rows whose value on the stated columnName is less than the specified filterValue.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.lt('id', 20)
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### filterValue `{:string|:integer|:boolean}`
|
||||
Value to compare to.
|
||||
|
||||
----
|
||||
|
||||
### `gte()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.gte(columnName, filterValue)
|
||||
```
|
||||
|
||||
"Greater Than or Equal": Returns an array of rows whose value on the stated columName is greater than or equal to the specified filterValue.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.gte('id', 20)
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### filterValue `{:string|:integer|:boolean}`
|
||||
Value to compare to.
|
||||
|
||||
----
|
||||
|
||||
### `lte()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.lte(columnName, filterValue)
|
||||
```
|
||||
|
||||
"Less Than or Equal": Returns an array of rows whose value on the stated columnName is less than or equal to the specified filterValue.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.gte('id', 20)
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### filterValue `{:string|:integer|:boolean}`
|
||||
Value to compare to.
|
||||
|
||||
----
|
||||
|
||||
### `like()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.like(columnName, stringPattern)
|
||||
```
|
||||
|
||||
Returns an array of rows whose value in the stated columnName matches the supplied pattern.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.like('name', '%United%')
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### stringPattern `:string`
|
||||
String pattern to compare to. A comprehensive guide on how to form proper patterns can be found [here](https://www.postgresql.org/docs/current/functions-matching.html).
|
||||
|
||||
|
||||
----
|
||||
|
||||
### `ilike()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.ilike(columnName, stringPattern)
|
||||
```
|
||||
|
||||
A case-insensitive version of `like()`.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.ilike('name', '%united%')
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### stringPattern `:string`
|
||||
String pattern to compare to. A comprehensive guide on how to form proper patterns can be found [here](https://www.postgresql.org/docs/current/functions-matching.html).
|
||||
|
||||
|
||||
----
|
||||
|
||||
|
||||
### `is()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.is(columnName, stringPattern)
|
||||
```
|
||||
|
||||
A check for exact equality (**null**, **true**, **false**), returns an array of rows whose value on the stated columnName exactly match the specified filterValue.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.is('name', null)
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### stringPattern `{:null|:boolean}`
|
||||
Value to match.
|
||||
|
||||
----
|
||||
|
||||
### `in()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.is(columnName, filterArray)
|
||||
```
|
||||
|
||||
Returns an array of rows whose value on the stated columnName is found on the specified filterArray.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.in('name', ['China', 'France'])
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### filterArray `:array`
|
||||
Array of values to find a match. Data type of values is dependent on the columnName specified.
|
||||
|
||||
|
||||
----
|
||||
|
||||
### `not()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {3}
|
||||
supabase
|
||||
.get(tableName)
|
||||
.not(columnName, filterValue)
|
||||
```
|
||||
|
||||
Returns an array of rows whose value on the stated columnName is found on the specified filterArray.
|
||||
|
||||
<Collapsable title="Toggle Example">
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js
|
||||
supabase
|
||||
.get('countries')
|
||||
.not('name', 'China')
|
||||
```
|
||||
|
||||
</Collapsable>
|
||||
|
||||
##### columnName `:string`
|
||||
Name of database column.
|
||||
|
||||
##### filterValue `{:string|:integer|:boolean}`
|
||||
Value to **not** match.
|
||||
|
||||
----
|
||||
|
||||
Click [here](../library/get#using-select) to view some examples.
|
||||
|
||||
### Common Filters
|
||||
|
||||
Other common filters can be found [here](../library/filters).
|
||||
|
||||
## Responses
|
||||
|
||||
Aside from the status code `200 OK`, other common responses can be found [here](../library/responses).
|
||||
#### 200 OK
|
||||
Successful request
|
||||
|
||||
<CommonResponses />
|
||||
@@ -18,7 +18,7 @@ yarn install @supabase/supabase-js
|
||||
```js
|
||||
import { createClient } from '@supabase/supabase-js'
|
||||
|
||||
// Create a single supbase client for interacting with your database
|
||||
// Create a single supabase client for interacting with your database
|
||||
const supabase = createClient("https://xyzcompany.supabase.io", "1a2b-3c4d-5e6f-7g8h");
|
||||
```
|
||||
|
||||
|
||||
@@ -1,146 +0,0 @@
|
||||
---
|
||||
id: options
|
||||
title: 'Available Options'
|
||||
---
|
||||
|
||||
import Tabs from '@theme/Tabs';
|
||||
import TabItem from '@theme/TabItem';
|
||||
|
||||
A list of all available options that can be specified under the `options?` parameter.
|
||||
|
||||
## headers
|
||||
`optional` object
|
||||
Custom headers to be sent. A complete list of headers can be found [here](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers).
|
||||
|
||||
### Example
|
||||
<Tabs
|
||||
defaultValue="nodeJs"
|
||||
values={[
|
||||
{ label: 'Node.js', value: 'nodeJs', },
|
||||
{ label: 'Python', value: 'py', },
|
||||
]
|
||||
}>
|
||||
<TabItem value="nodeJs">
|
||||
|
||||
```js {9-14}
|
||||
const postUsers = async () => {
|
||||
try {
|
||||
let users = await supabase
|
||||
.post(
|
||||
"users",
|
||||
[
|
||||
{ name: "Nelson Bighetti" },
|
||||
],
|
||||
{
|
||||
headers:{
|
||||
"Content-Type": "application/x-www-form-urlencoded"
|
||||
"X-requested-With": "XMLHttpRequest"
|
||||
}
|
||||
}
|
||||
)
|
||||
return users
|
||||
} catch (error) {
|
||||
console.log('Error:', error)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
</TabItem>
|
||||
|
||||
<TabItem value="py">
|
||||
|
||||
```py
|
||||
# TODO
|
||||
```
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
---
|
||||
|
||||
## withCredentials
|
||||
`optional` boolean
|
||||
Determines the ability to send cookies from origin.
|
||||
|
||||
### Example
|
||||
Setting withCredentials with value **true** allows the request to send cookies from origin
|
||||
<Tabs
|
||||
defaultValue="nodeJs"
|
||||
values={[
|
||||
{ label: 'Node.js', value: 'nodeJs', },
|
||||
{ label: 'Python', value: 'py', },
|
||||
]
|
||||
}>
|
||||
<TabItem value="nodeJs">
|
||||
|
||||
```js {9}
|
||||
const postUsers = async () => {
|
||||
try {
|
||||
let users = await supabase
|
||||
.post(
|
||||
"users",
|
||||
[
|
||||
{ name: "Nelson Bighetti" },
|
||||
],
|
||||
{ withCredentials: true }
|
||||
)
|
||||
return users
|
||||
} catch (error) {
|
||||
console.log('Error:', error)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
</TabItem>
|
||||
|
||||
<TabItem value="py">
|
||||
|
||||
```py
|
||||
# TODO
|
||||
```
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
---
|
||||
|
||||
## timeout
|
||||
`optional` integer
|
||||
Specifies the amount of time in milliseconds before the request times out.
|
||||
|
||||
### Example
|
||||
Setting a timeout of value 5000 will cause the request to time out after 5000 milliseconds.
|
||||
<Tabs
|
||||
defaultValue="nodeJs"
|
||||
values={[
|
||||
{ label: 'Node.js', value: 'nodeJs', },
|
||||
{ label: 'Python', value: 'py', },
|
||||
]
|
||||
}>
|
||||
<TabItem value="nodeJs">
|
||||
|
||||
```js {9}
|
||||
const postUsers = async () => {
|
||||
try {
|
||||
let users = await supabase
|
||||
.post(
|
||||
"users",
|
||||
[
|
||||
{ name: "Nelson Bighetti" },
|
||||
],
|
||||
{ timeout: 5000 }
|
||||
)
|
||||
return users
|
||||
} catch (error) {
|
||||
console.log('Error:', error)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
</TabItem>
|
||||
|
||||
<TabItem value="py">
|
||||
|
||||
```py
|
||||
# TODO
|
||||
```
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
@@ -1,16 +0,0 @@
|
||||
---
|
||||
id: responses
|
||||
title: 'Common Responses'
|
||||
---
|
||||
|
||||
## 400 Bad request
|
||||
An invalid syntax or configuration was sent.
|
||||
|
||||
<!-- ## 401 Unauthorized
|
||||
Either authentication is required or invalid credentials were provided under the [`auth` object](https://google.com). -->
|
||||
|
||||
## 404 Not found
|
||||
Requested resource cannot be found.
|
||||
|
||||
## 500 Internal Server Error
|
||||
The server was unable to encounter the situation it encountered.
|
||||
@@ -101,6 +101,39 @@ const listener = supabase
|
||||
.join()
|
||||
```
|
||||
|
||||
### Listening to multiple events
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {9-10}
|
||||
import { createClient } from '@supabase/supabase-js'
|
||||
|
||||
// Create a single supabase client for interacting with your database
|
||||
const supabase = createClient('https://world.supabase.io', '1a2b-3c4d-5e6f-7g8h')
|
||||
|
||||
// Listen to changes
|
||||
const listener = supabase
|
||||
.subscribe('countries')
|
||||
.on('INSERT', handleRecordInserted)
|
||||
.on('DELETE', handleRecordDeleted)
|
||||
.join()
|
||||
```
|
||||
|
||||
### Unsubscribing
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {10}
|
||||
import { createClient } from '@supabase/supabase-js'
|
||||
|
||||
// Create a single supabase client for interacting with your database
|
||||
const supabase = createClient('https://world.supabase.io', '1a2b-3c4d-5e6f-7g8h')
|
||||
|
||||
// Listen to changes
|
||||
const myListener = supabase.subscribe('countries')
|
||||
|
||||
// Unsubscribe from changes
|
||||
supabase.unsubscribe(myListener)
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -139,17 +172,31 @@ supabase
|
||||
supabase
|
||||
.subscribe('tableName')
|
||||
.join()
|
||||
.on('eventName', callbackFunction)
|
||||
.on('eventType', callbackFunction)
|
||||
```
|
||||
|
||||
###### eventType `:string {INSERT|UPDATE|DELETE|*}`
|
||||
The database event which you would like to receive updates for, or you can use the special wildcard `*` to listen to all changes.
|
||||
|
||||
###### eventName `REQUIRED`
|
||||
Can be either a table in your database, or you can use the special wildcard `*` to listen to all changes.
|
||||
|
||||
###### callbackFunction `REQUIRED`
|
||||
###### callbackFunction `:function`
|
||||
A callback that will handle the payload that is sent whenever your database changes. See all Change Events below to understand all the possible payloads.
|
||||
|
||||
|
||||
----
|
||||
|
||||
|
||||
### `unsubscribe()`
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```js {2}
|
||||
supabase
|
||||
.unsubscribe(yourSubscription)
|
||||
```
|
||||
|
||||
###### yourSubscription `:subscription`
|
||||
A listener that was previously created.
|
||||
|
||||
|
||||
----
|
||||
|
||||
## Change Events
|
||||
|
||||
@@ -17,10 +17,7 @@ module.exports = {
|
||||
"library/post",
|
||||
"library/get",
|
||||
"library/patch",
|
||||
"library/delete",
|
||||
"library/filters",
|
||||
"library/options",
|
||||
"library/responses"
|
||||
"library/delete"
|
||||
],
|
||||
Guides:[
|
||||
"guides/examples"
|
||||
|
||||
@@ -1,5 +1,12 @@
|
||||
import React from 'react'
|
||||
|
||||
export default function Collapsable({ children }) {
|
||||
return <div>{children}</div>
|
||||
export default function Collapsable({ title, children }) {
|
||||
return (
|
||||
<details className="Collapsable">
|
||||
<summary>
|
||||
{title}
|
||||
</summary>
|
||||
<div>{children}</div>
|
||||
</details>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -462,7 +462,10 @@ div[class^='sidebar_'] .menu__link.menu__link--active:not(.menu__link--sublist)
|
||||
.DummyData div{
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
summary:hover {
|
||||
.Collapsable summary {
|
||||
font-size: 0.9rem;
|
||||
margin-bottom:20px;
|
||||
}
|
||||
.Collapsable summary:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -1,13 +1,11 @@
|
||||
<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="512" height="512" rx="100" fill="white"/>
|
||||
<rect x="41" y="41" width="430" height="430" rx="80" fill="#1F1F1F"/>
|
||||
<path d="M286.909 92.4831C286.909 85.5889 281.322 80 274.431 80C271.004 80 267.9 81.382 265.645 83.6192L263.912 85.548L167.675 215.658H263.18L286.429 96.0055L286.853 93.6682C286.89 93.2781 286.909 92.8828 286.909 92.4831Z" fill="#3ECF8E"/>
|
||||
<path d="M133 269.336C133 280.366 141.939 289.308 152.965 289.308L153.053 289.308H248.87L263.18 215.658H167.675L138.736 254.783L136.872 257.512C134.438 260.822 133 264.911 133 269.336Z" fill="#3ECF8E"/>
|
||||
<path d="M378 235.631C378 224.6 369.061 215.658 358.035 215.658H357.245H263.18L248.87 289.308H343.202L373.604 248.205L374.817 246.455C376.831 243.337 378 239.62 378 235.631Z" fill="#3ECF8E"/>
|
||||
<path d="M225.533 410.517C225.533 417.411 231.119 423 238.011 423C241.706 423 245.027 421.393 247.311 418.839L247.803 418.285L343.202 289.308H248.87L225.985 407.089L225.924 407.405C225.668 408.4 225.533 409.443 225.533 410.517Z" fill="#3ECF8E"/>
|
||||
<path d="M225.533 410.517C225.533 417.411 231.119 423 238.011 423C241.706 423 245.027 421.393 247.311 418.839L247.803 418.285L343.202 289.308H248.87L225.985 407.089L225.924 407.405C225.668 408.4 225.533 409.443 225.533 410.517Z" fill="url(#paint0_linear)"/>
|
||||
<svg width="375" height="375" viewBox="0 0 375 375" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M218.909 28.4831C218.909 21.5889 213.322 16 206.431 16C203.004 16 199.9 17.382 197.645 19.6192L195.912 21.548L99.675 151.658H195.18L218.429 32.0055L218.853 29.6682C218.89 29.2781 218.909 28.8828 218.909 28.4831Z" fill="#3ECF8E"/>
|
||||
<path d="M65 205.336C65 216.366 73.9385 225.308 84.9647 225.308L85.053 225.308H180.87L195.18 151.658H99.675L70.736 190.783L68.8725 193.512C66.4382 196.822 65 200.911 65 205.336Z" fill="#3ECF8E"/>
|
||||
<path d="M310 171.631C310 160.6 301.061 151.658 290.035 151.658H289.245H195.18L180.87 225.308H275.202L305.604 184.205L306.817 182.455C308.831 179.337 310 175.62 310 171.631Z" fill="#3ECF8E"/>
|
||||
<path d="M157.533 346.517C157.533 353.411 163.119 359 170.011 359C173.706 359 177.027 357.393 179.311 354.839L179.803 354.285L275.202 225.308H180.87L157.985 343.089L157.924 343.405C157.668 344.4 157.533 345.443 157.533 346.517Z" fill="#3ECF8E"/>
|
||||
<path d="M157.533 346.517C157.533 353.411 163.119 359 170.011 359C173.706 359 177.027 357.393 179.311 354.839L179.803 354.285L275.202 225.308H180.87L157.985 343.089L157.924 343.405C157.668 344.4 157.533 345.443 157.533 346.517Z" fill="url(#paint0_linear)"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="304" y1="301" x2="235" y2="423" gradientUnits="userSpaceOnUse">
|
||||
<linearGradient id="paint0_linear" x1="236" y1="237" x2="167" y2="359" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#23915F"/>
|
||||
<stop offset="1" stop-color="#3ECF8E" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.4 KiB |
Reference in New Issue
Block a user