Add filtering to extensions docs

This commit is contained in:
Terry Sutton committed 2023-02-02 22:41:33 -03:30
1 parent 4dd80824d5
commit 1a744bdf20
5 files changed
+268 -110

No files matched your search

-35
View File
@@ -1,35 +0,0 @@
import React, { useState } from 'react'
import extensions from '../data/extensions.json'
export default function Extensions() {
const [filter, setFilter] = useState('')
return (
<>
<div className="mb-8 grid">
<label className="text-xs mb-2">Filter extensions</label>
<input
type="text"
className="border text-gray-200"
placeholder="Extension name"
onChange={(e) => setFilter(e.target.value)}
/>
</div>
<div className="grid sm:grid-cols-2 gap-4">
{extensions
.filter((x) => x.name.indexOf(filter) >= 0)
.map((extension) => (
<div className={' my-2 px-2'} key={extension.name}>
<div className="border rounded-sm p-4">
<h3 className="m-0">
<code className="text-sm">{extension.name}</code>
</h3>
<p className=" mt-4">
{extension.comment.charAt(0).toUpperCase() + extension.comment.slice(1)}
</p>
</div>
</div>
))}
</div>
</>
)
}
+126
View File
@@ -0,0 +1,126 @@
import Link from 'next/link'
import React, { useState } from 'react'
import { IconExternalLink, IconX, Input } from 'ui'
import extensions from '../data/extensions.json'
type extension = {
name: string
schema: string | null
default_version: string
installed_version: string | null
comment: string
tags: string[]
link?: string
}
function getUniqueTags(json: extension[]) {
const tags = []
for (const item of json) {
tags.push(...item.tags)
}
return [...new Set(tags)]
}
export default function Extensions() {
const [searchTerm, setSearchTerm] = useState('')
const [filters, setFilters] = useState([])
const tags = getUniqueTags(extensions)
function handleChecked(tag) {
if (filters.includes(tag)) {
setFilters(filters.filter((x) => x !== tag))
} else {
setFilters([...filters, tag])
}
}
return (
<>
<div className="mb-8 grid">
<label className="mb-2 text-xs text-scale-1100">Search extensions</label>
<Input
type="text"
placeholder="Extension name"
onChange={(e) => setSearchTerm(e.target.value)}
/>
</div>
<div className="lg:grid lg:grid-cols-12">
<div className="col-span-3 not-prose">
<div className="lg:sticky top-24">
<h3 className="text-sm text-scale-1100">Filter</h3>
<ul className="mt-3 flex flex-wrap lg:grid gap-2 grow">
{tags.map((tag) => (
<li>
<label
htmlFor={tag}
className={`text-sm text-scale-900 py-0.5 px-2 capitalize inline-block rounded-lg hover:bg-slate-400 hover:border-slate-400 cursor-pointer border ${
filters.includes(tag) ? 'bg-slate-300 ' : ''
}`}
>
<span className="flex items-center gap-1">
<input
type="checkbox"
className="sr-only"
id={tag}
name={tag}
value={tag}
onChange={() => handleChecked(tag)}
checked={filters.includes(tag)}
/>
{tag}
<span>{filters.includes(tag) && <IconX size={12} />}</span>
</span>
</label>
</li>
))}
</ul>
<p className="mt-2">
<button
type="reset"
className="text-xs hover:underline"
onClick={() => setFilters([])}
>
Reset
</button>
</p>
</div>
</div>
<div className="col-span-9 mt-4 lg:mt-0">
<div className="grid gap-4">
{extensions
.filter((x) => x.name.indexOf(searchTerm) >= 0)
.filter((x) =>
filters.length === 0 ? x : x.tags.some((item) => filters.includes(item))
)
.map((extension) => (
<div className="my-2 px-2 relative" key={extension.name}>
<div className="border rounded-sm p-4">
<h3 className="m-0">
<code className="text-sm">{extension.name}</code>
</h3>
<p className=" mt-4">
{extension.comment.charAt(0).toUpperCase() + extension.comment.slice(1)}
</p>
{extension.link && (
<Link href={extension.link}>
<a
target="_blank"
className="absolute top-2 right-4 hover:bg-slate-400 transition-colors p-2 rounded-md"
>
<span>
<IconExternalLink size={14} className="" />
</span>
</a>
</Link>
)}
</div>
</div>
))}
</div>
</div>
</div>
</>
)
}
+141 -70
View File
@@ -4,489 +4,560 @@
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "Used to parse an address into constituent elements. Generally used to support geocoding address normalization step."
"comment": "Used to parse an address into constituent elements. Generally used to support geocoding address normalization step.",
"tags": [],
"link": "http://supabase.com/docs/guides/extensions/etc/etc/etc"
},
{
"name": "address_standardizer-3",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "Used to parse an address into constituent elements. Generally used to support geocoding address normalization step."
"comment": "Used to parse an address into constituent elements. Generally used to support geocoding address normalization step.",
"tags": []
},
{
"name": "address_standardizer_data_us",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "Address Standardizer US dataset example"
"comment": "Address Standardizer US dataset example",
"tags": []
},
{
"name": "address_standardizer_data_us-3",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "Address Standardizer US dataset example"
"comment": "Address Standardizer US dataset example",
"tags": ["addresses"]
},
{
"name": "adminpack",
"schema": null,
"default_version": "2.0",
"installed_version": null,
"comment": "administrative functions for PostgreSQL"
"comment": "administrative functions for PostgreSQL",
"tags": []
},
{
"name": "amcheck",
"schema": null,
"default_version": "1.2",
"installed_version": null,
"comment": "functions for verifying relation integrity"
"comment": "functions for verifying relation integrity",
"tags": []
},
{
"name": "autoinc",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "functions for autoincrementing fields"
"comment": "functions for autoincrementing fields",
"tags": []
},
{
"name": "bloom",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "bloom access method - signature file based index"
"comment": "bloom access method - signature file based index",
"tags": []
},
{
"name": "btree_gin",
"schema": null,
"default_version": "1.3",
"installed_version": null,
"comment": "support for indexing common datatypes in GIN"
"comment": "support for indexing common datatypes in GIN",
"tags": []
},
{
"name": "btree_gist",
"schema": null,
"default_version": "1.5",
"installed_version": null,
"comment": "support for indexing common datatypes in GiST"
"comment": "support for indexing common datatypes in GiST",
"tags": []
},
{
"name": "citext",
"schema": null,
"default_version": "1.6",
"installed_version": null,
"comment": "data type for case-insensitive character strings"
"comment": "data type for case-insensitive character strings",
"tags": []
},
{
"name": "cube",
"schema": null,
"default_version": "1.4",
"installed_version": null,
"comment": "data type for multidimensional cubes"
"comment": "data type for multidimensional cubes",
"tags": []
},
{
"name": "dblink",
"schema": null,
"default_version": "1.2",
"installed_version": null,
"comment": "connect to other PostgreSQL databases from within a database"
"comment": "connect to other PostgreSQL databases from within a database",
"tags": []
},
{
"name": "dict_int",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "text search dictionary template for integers"
"comment": "text search dictionary template for integers",
"tags": []
},
{
"name": "dict_xsyn",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "text search dictionary template for extended synonym processing"
"comment": "text search dictionary template for extended synonym processing",
"tags": []
},
{
"name": "earthdistance",
"schema": null,
"default_version": "1.1",
"installed_version": null,
"comment": "calculate great-circle distances on the surface of the Earth"
"comment": "calculate great-circle distances on the surface of the Earth",
"tags": []
},
{
"name": "file_fdw",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "foreign-data wrapper for flat file access"
"comment": "foreign-data wrapper for flat file access",
"tags": []
},
{
"name": "fuzzystrmatch",
"schema": null,
"default_version": "1.1",
"installed_version": null,
"comment": "determine similarities and distance between strings"
"comment": "determine similarities and distance between strings",
"tags": []
},
{
"name": "hstore",
"schema": null,
"default_version": "1.6",
"installed_version": null,
"comment": "data type for storing sets of (key, value) pairs"
"comment": "data type for storing sets of (key, value) pairs",
"tags": []
},
{
"name": "http",
"schema": "extensions",
"default_version": "1.3",
"installed_version": "1.3",
"comment": "HTTP client for PostgreSQL, allows web page retrieval inside the database."
"comment": "HTTP client for PostgreSQL, allows web page retrieval inside the database.",
"tags": []
},
{
"name": "insert_username",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "functions for tracking who changed a table"
"comment": "functions for tracking who changed a table",
"tags": []
},
{
"name": "intagg",
"schema": null,
"default_version": "1.1",
"installed_version": null,
"comment": "integer aggregator and enumerator (obsolete)"
"comment": "integer aggregator and enumerator (obsolete)",
"tags": []
},
{
"name": "intarray",
"schema": null,
"default_version": "1.2",
"installed_version": null,
"comment": "functions, operators, and index support for 1-D arrays of integers"
"comment": "functions, operators, and index support for 1-D arrays of integers",
"tags": []
},
{
"name": "isn",
"schema": null,
"default_version": "1.2",
"installed_version": null,
"comment": "data types for international product numbering standards"
"comment": "data types for international product numbering standards",
"tags": []
},
{
"name": "lo",
"schema": null,
"default_version": "1.1",
"installed_version": null,
"comment": "Large Object maintenance"
"comment": "Large Object maintenance",
"tags": []
},
{
"name": "ltree",
"schema": null,
"default_version": "1.1",
"installed_version": null,
"comment": "data type for hierarchical tree-like structures"
"comment": "data type for hierarchical tree-like structures",
"tags": []
},
{
"name": "moddatetime",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "functions for tracking last modification time"
"comment": "functions for tracking last modification time",
"tags": []
},
{
"name": "pageinspect",
"schema": null,
"default_version": "1.7",
"installed_version": null,
"comment": "inspect the contents of database pages at a low level"
"comment": "inspect the contents of database pages at a low level",
"tags": []
},
{
"name": "pg_buffercache",
"schema": null,
"default_version": "1.3",
"installed_version": null,
"comment": "examine the shared buffer cache"
"comment": "examine the shared buffer cache",
"tags": []
},
{
"name": "pg_cron",
"schema": "extensions",
"default_version": "1.3",
"installed_version": "1.3",
"comment": "Job scheduler for PostgreSQL"
"comment": "Job scheduler for PostgreSQL",
"tags": []
},
{
"name": "pg_freespacemap",
"schema": null,
"default_version": "1.2",
"installed_version": null,
"comment": "examine the free space map (FSM)"
"comment": "examine the free space map (FSM)",
"tags": []
},
{
"name": "pg_prewarm",
"schema": null,
"default_version": "1.2",
"installed_version": null,
"comment": "prewarm relation data"
"comment": "prewarm relation data",
"tags": []
},
{
"name": "pg_stat_statements",
"schema": null,
"default_version": "1.7",
"installed_version": null,
"comment": "track execution statistics of all SQL statements executed"
"comment": "track execution statistics of all SQL statements executed",
"tags": []
},
{
"name": "pg_trgm",
"schema": null,
"default_version": "1.4",
"installed_version": null,
"comment": "text similarity measurement and index searching based on trigrams"
"comment": "text similarity measurement and index searching based on trigrams",
"tags": []
},
{
"name": "pg_visibility",
"schema": null,
"default_version": "1.2",
"installed_version": null,
"comment": "examine the visibility map (VM) and page-level visibility info"
"comment": "examine the visibility map (VM) and page-level visibility info",
"tags": []
},
{
"name": "pgaudit",
"schema": null,
"default_version": "1.4",
"installed_version": null,
"comment": "provides auditing functionality"
"comment": "provides auditing functionality",
"tags": []
},
{
"name": "pgcrypto",
"schema": "extensions",
"default_version": "1.3",
"installed_version": "1.3",
"comment": "cryptographic functions"
"comment": "cryptographic functions",
"tags": []
},
{
"name": "pgjwt",
"schema": "extensions",
"default_version": "0.1.0",
"installed_version": "0.1.0",
"comment": "JSON Web Token API for Postgresql"
"comment": "JSON Web Token API for Postgresql",
"tags": []
},
{
"name": "pgrowlocks",
"schema": null,
"default_version": "1.2",
"installed_version": null,
"comment": "show row-level locking information"
"comment": "show row-level locking information",
"tags": []
},
{
"name": "pgstattuple",
"schema": null,
"default_version": "1.5",
"installed_version": null,
"comment": "show tuple-level statistics"
"comment": "show tuple-level statistics",
"tags": []
},
{
"name": "pgtap",
"schema": null,
"default_version": "1.1.0",
"installed_version": null,
"comment": "Unit testing for PostgreSQL"
"comment": "Unit testing for PostgreSQL",
"tags": []
},
{
"name": "plcoffee",
"schema": null,
"default_version": "3.0alpha",
"installed_version": null,
"comment": "PL/CoffeeScript (v8) trusted procedural language"
"comment": "PL/CoffeeScript (v8) trusted procedural language",
"tags": []
},
{
"name": "pljava",
"schema": null,
"default_version": "1.6.0",
"installed_version": null,
"comment": "PL/Java procedural language (https://tada.github.io/pljava/)"
"comment": "PL/Java procedural language (https://tada.github.io/pljava/)",
"tags": []
},
{
"name": "plls",
"schema": null,
"default_version": "3.0alpha",
"installed_version": null,
"comment": "PL/LiveScript (v8) trusted procedural language"
"comment": "PL/LiveScript (v8) trusted procedural language",
"tags": []
},
{
"name": "plpgsql",
"schema": "pg_catalog",
"default_version": "1.0",
"installed_version": "1.0",
"comment": "PL/pgSQL procedural language"
"comment": "PL/pgSQL procedural language",
"tags": []
},
{
"name": "plpgsql_check",
"schema": null,
"default_version": "1.11",
"installed_version": null,
"comment": "extended check for plpgsql functions"
"comment": "extended check for plpgsql functions",
"tags": []
},
{
"name": "plv8",
"schema": null,
"default_version": "3.0alpha",
"installed_version": null,
"comment": "PL/JavaScript (v8) trusted procedural language"
"comment": "PL/JavaScript (v8) trusted procedural language",
"tags": []
},
{
"name": "postgis",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS geometry and geography spatial types and functions"
"comment": "PostGIS geometry and geography spatial types and functions",
"tags": ["GIS"]
},
{
"name": "postgis-3",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS geometry and geography spatial types and functions"
"comment": "PostGIS geometry and geography spatial types and functions",
"tags": ["GIS"]
},
{
"name": "postgis_raster",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS raster types and functions"
"comment": "PostGIS raster types and functions",
"tags": ["GIS"]
},
{
"name": "postgis_raster-3",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS raster types and functions"
"comment": "PostGIS raster types and functions",
"tags": ["GIS"]
},
{
"name": "postgis_sfcgal",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS SFCGAL functions"
"comment": "PostGIS SFCGAL functions",
"tags": ["GIS"]
},
{
"name": "postgis_sfcgal-3",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS SFCGAL functions"
"comment": "PostGIS SFCGAL functions",
"tags": ["GIS"]
},
{
"name": "postgis_tiger_geocoder",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS tiger geocoder and reverse geocoder"
"comment": "PostGIS tiger geocoder and reverse geocoder",
"tags": ["GIS"]
},
{
"name": "postgis_tiger_geocoder-3",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS tiger geocoder and reverse geocoder"
"comment": "PostGIS tiger geocoder and reverse geocoder",
"tags": ["GIS"]
},
{
"name": "postgis_topology",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS topology spatial types and functions"
"comment": "PostGIS topology spatial types and functions",
"tags": ["GIS"]
},
{
"name": "postgis_topology-3",
"schema": null,
"default_version": "3.1.1",
"installed_version": null,
"comment": "PostGIS topology spatial types and functions"
"comment": "PostGIS topology spatial types and functions",
"tags": ["GIS"]
},
{
"name": "postgres_fdw",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "foreign-data wrapper for remote PostgreSQL servers"
"comment": "foreign-data wrapper for remote PostgreSQL servers",
"tags": []
},
{
"name": "refint",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "functions for implementing referential integrity (obsolete)"
"comment": "functions for implementing referential integrity (obsolete)",
"tags": []
},
{
"name": "seg",
"schema": null,
"default_version": "1.3",
"installed_version": null,
"comment": "data type for representing line segments or floating-point intervals"
"comment": "data type for representing line segments or floating-point intervals",
"tags": []
},
{
"name": "sslinfo",
"schema": null,
"default_version": "1.2",
"installed_version": null,
"comment": "information about SSL certificates"
"comment": "information about SSL certificates",
"tags": []
},
{
"name": "tablefunc",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "functions that manipulate whole tables, including crosstab"
"comment": "functions that manipulate whole tables, including crosstab",
"tags": []
},
{
"name": "tcn",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "Triggered change notifications"
"comment": "Triggered change notifications",
"tags": ["notifications"]
},
{
"name": "tsm_system_rows",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "TABLESAMPLE method which accepts number of rows as a limit"
"comment": "TABLESAMPLE method which accepts number of rows as a limit",
"tags": []
},
{
"name": "tsm_system_time",
"schema": null,
"default_version": "1.0",
"installed_version": null,
"comment": "TABLESAMPLE method which accepts time in milliseconds as a limit"
"comment": "TABLESAMPLE method which accepts time in milliseconds as a limit",
"tags": []
},
{
"name": "unaccent",
"schema": null,
"default_version": "1.1",
"installed_version": null,
"comment": "text search dictionary that removes accents"
"comment": "text search dictionary that removes accents",
"tags": []
},
{
"name": "uuid-ossp",
"schema": "extensions",
"default_version": "1.1",
"installed_version": "1.1",
"comment": "generate universally unique identifiers (UUIDs)"
"comment": "generate universally unique identifiers (UUIDs)",
"tags": []
},
{
"name": "vector",
"schema": "extensions",
"default_version": "0.4.0",
"installed_version": null,
"comment": "vector data type with similarity search"
"comment": "vector data type with similarity search",
"tags": []
},
{
"name": "xml2",
"schema": null,
"default_version": "1.1",
"installed_version": null,
"comment": "XPath querying and XSLT"
"comment": "XPath querying and XSLT",
"tags": []
},
{
"name": "pg_repack",
"schema": "extensions",
"default_version": "1.4.8",
"installed_version": "1.4.8",
"comment": "optimize physical storage and remove bloat from tables and indexes"
"comment": "optimize physical storage and remove bloat from tables and indexes",
"tags": []
}
]
@@ -23,10 +23,6 @@ Supabase has pre-installed some of the most useful open source extensions.
2. Click **Extensions** in the sidebar.
3. Enable or disable an extension.
<video width="99%" muted playsInline controls={true}>
<source src="/docs/videos/toggle-extensions.mp4" type="video/mp4" muted playsInline />
</video>
</TabPanel>
<TabPanel id="sql" label="SQL">
+1 -1
View File
@@ -6,7 +6,7 @@
"paths": {
"~/*": ["./*"]
},
"target": "es5",
"target": "es2015",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,