### Start Local Supabase Services and Serve Function Source: https://supabase.com/docs/guides/functions/quickstart Starts all Supabase services locally using Docker and then specifically serves the 'hello-world' Edge Function. This command is used for local development and testing. The function will be accessible at a local URL. ```bash supabase start supabase functions serve hello-world ``` -------------------------------- ### Initialize Supabase Project with CLI Source: https://supabase.com/docs/guides/functions/quickstart Initializes a new Supabase project in the current directory or ensures an existing project is configured. This creates a 'supabase' folder with 'config.toml' and an empty 'functions' directory. ```bash supabase init my-edge-functions-project cd my-edge-functions-project ``` ```bash cd your-existing-project supabase init # Initialize Supabase, if you haven't already ``` -------------------------------- ### Local Development Setup Source: https://docs.hcaptcha.com/ Guidance on setting up hCaptcha for local development, addressing common issues like CORS/CORB rules and localhost restrictions. ```APIDOC ## Local Development If you are developing on your local machine there are a few things to keep in mind. Modern browsers have strict CORS and CORB rules, so opening a `file://URI` that loads hCaptcha will not work. Loading hCaptcha from `http://localhost/` will encounter the same issue on some browsers. The hCaptcha API also prohibits `localhost` and `127.0.0.1` as supplied hostnames. The simplest way to circumvent these issues is to add a hosts entry. For example: ``` 127.0.0.1 test.mydomain.com ``` Place this in `/etc/hosts` on Linux, `/private/etc/hosts` on Mac OS X, or `C:\Windows\System32\Drivers\etc\hosts` on Windows. You can then access your local server via http://test.mydomain.com, and everything will work as expected. ``` -------------------------------- ### Flask Backend Integration Example Source: https://docs.hcaptcha.com/ Example of how to integrate hCaptcha verification into a Flask application's login route. ```APIDOC ## Flask Login Route with hCaptcha Verification ### Description This example demonstrates a Flask route that handles user login, including receiving and verifying the hCaptcha token. ### Method POST ### Endpoint /login ### Parameters #### Request Body - **h-captcha-response** (string) - Required - The token generated by the hCaptcha widget on the client side. ### Request Example (The request body is typically sent as form data) ### Response #### Success Response (200) - **status** (string) - Indicates successful login ('Logged in'). #### Error Response (400) - **error** (string) - Message indicating a missing hCaptcha token. #### Error Response (403) - **error** (string) - Message indicating login failure due to invalid hCaptcha verification. ### Code Example (Python/Flask) ```python import os import requests from flask import Flask, request, jsonify H_CAPTCHA_VERIFY_URL = "https://api.hcaptcha.com/siteverify" SECRET_KEY = os.getenv("HCAPTCHA_SECRET", "your_secret_here") app = Flask(__name__) def verify_hcaptcha_token(token: str, remoteip: str = None) -> dict: """Sends a POST request to hCaptcha's /siteverify endpoint and returns a result dict.""" payload = { 'secret': SECRET_KEY, 'response': token } if remoteip: payload['remoteip'] = remoteip response = requests.post(H_CAPTCHA_VERIFY_URL, data=payload) response.raise_for_status() # Raise an exception for bad status codes data = response.json() return { 'success': data.get('success', False), 'challenge_ts': data.get('challenge_ts'), 'hostname': data.get('hostname'), 'error_codes': data.get('error-codes', []) } @app.route('/login', methods=['POST']) def login(): # 1) Get token from form POST token = request.form.get('h-captcha-response') if not token: return jsonify({'error': 'Missing hCaptcha token'}), 400 # 2) Verify token via hCaptcha API result = verify_hcaptcha_token(token, remoteip=request.remote_addr) # 3) Decision logic if result['success']: # Token valid == allow action # Proceed with your login/business logic here return jsonify({'status': 'Logged in'}), 200 else: # Verification failed print('error_codes:', result['error_codes']) return jsonify({'error': 'login failed'}), 403 if __name__ == '__main__': app.run(debug=True, port=5000) ``` ``` -------------------------------- ### TypeScript Types Installation and Usage Source: https://docs.hcaptcha.com/ Instructions on how to install and use hCaptcha TypeScript types to enhance development with type checking. ```APIDOC ## TypeScript Types ### How to install You can install our typescript types `@hcaptcha/types` for the `hcaptcha` global variable using your preferred package manager: ```bash yarn add -D @hcaptcha/types ``` or ```bash npm install -D @hcaptcha/types ``` ### How to use #### Locally ```typescript import '@hcaptcha/types'; // `hcaptcha` now is defined on the global object hcaptcha.execute(); ``` or ```typescript /// // `hcaptcha` now is defined on the global object hcaptcha.execute(); ``` #### Globally Add import or reference to your `.d.ts`: ```typescript import "@hcaptcha/types"; // or /// ``` Or add `"node_modules/@hcaptcha"` to the `typeRoots` in `tsconfig.json` ```json { "compilerOptions": { // ... "typeRoots": [ "node_modules/@hcaptcha" // ... ], // ... }, // ... } ``` ``` -------------------------------- ### Initialize Firebase and Access Cloud Firestore Lite SDK (TypeScript) Source: https://www.npmjs.com/package/firebase Shows how to initialize Firebase and then access the Cloud Firestore Lite SDK to interact with the database. This example includes getting a list of documents from a 'cities' collection. It requires `initializeApp`, `getFirestore`, `collection`, and `getDocs` functions. ```typescript import { initializeApp } from 'firebase/app'; import { getFirestore, collection, getDocs } from 'firebase/firestore/lite'; // TODO: Replace the following with your app's Firebase project configuration const firebaseConfig = { //... }; const app = initializeApp(firebaseConfig); const db = getFirestore(app); // Get a list of cities from your database async function getCities(db) { const citiesCol = collection(db, 'cities'); const citySnapshot = await getDocs(citiesCol); const cityList = citySnapshot.docs.map(doc => doc.data()); return cityList; } ``` -------------------------------- ### JavaScript Math.floor() Examples Source: https://www.w3schools.com/js/js_math.asp Demonstrates the Math.floor() method, which returns the value of a number rounded down to its nearest integer. Examples show rounding for positive numbers. ```javascript Math.floor(4.9); Math.floor(4.4); ``` -------------------------------- ### Installing @supabase/supabase-js Source: https://supabase.com/docs/reference/javascript/using-filters Instructions on how to install the Supabase JavaScript client library using npm, Yarn, pnpm, or CDN links. ```APIDOC ## Installing @supabase/supabase-js ### Install as package You can install @supabase/supabase-js via the terminal. **npm** ```bash npm install @supabase/supabase-js ``` **Yarn** ```bash yarn add @supabase/supabase-js ``` **pnpm** ```bash pnpm add @supabase/supabase-js ``` ### Install via CDN You can install @supabase/supabase-js via CDN links. ```html ``` ### Use at runtime in Deno You can use supabase-js in the Deno runtime via JSR: ```typescript import { createClient } from 'npm:@supabase/supabase-js@2' ``` ``` -------------------------------- ### Install Firebase NPM Module Source: https://www.npmjs.com/package/firebase Instructions for installing the Firebase NPM module using npm init and npm install. This is a prerequisite for using Firebase services in a Node.js environment. ```bash npm init npm install --save firebase ``` -------------------------------- ### Memberstack Installation Script for Webflow Source: https://docs.memberstack.com/hc/en-us/articles/7253090768539-Installing-Memberstack-in-Webflow The standard Memberstack header script to be pasted into the 'Custom code' section of a Webflow project's site settings. This script initializes Memberstack on your website. ```javascript var url = window.location.href; var targetDomain = "webflow.io"; var memberstackAppId = "app_your_application_id_goes_here"; if (url.includes(targetDomain)) { var script = document.createElement("script"); script.setAttribute("type", "text/javascript"); script.setAttribute("data-memberstack-app", memberstackAppId); script.src = "https://static.memberstack.com/scripts/v2/memberstack.js"; document.head.appendChild(script); } ``` -------------------------------- ### FirebaseCore Initialization Source: https://firebase.google.com/docs/reference/js Demonstrates how to initialize FirebaseCore with the provided options. ```APIDOC ## Initialize FirebaseCore ### Description Initializes FirebaseCore with the specified options. This is a prerequisite for using any Firebase services. ### Method N/A (Functionality description) ### Endpoint N/A (Functionality description) ### Parameters - **options** (FIROptions) - Required - The options used to configure Firebase. - **completion** (FIRAppVoidBoolCallback) - Optional - A callback block that is executed when Firebase initialization is complete. ### Request Example ```objectivec // Assuming FIROptions is configured elsewhere [FIRApp configureWithOptions:options]; // With completion handler [FIRApp configureWithOptions:options completion:^(BOOL success, NSError * _Nullable error) { if (success) { NSLog(@"Firebase configured successfully!"); } else { NSLog(@"Firebase configuration failed: %@", error.localizedDescription); } }]; ``` ### Response #### Success Response (Void) Initialization is successful. #### Response Example N/A (Initialization is a side effect) ``` -------------------------------- ### Listing All Pokémon Source: https://pokeapi.co/ Example of how to list all available Pokémon with pagination. ```APIDOC ## GET /pokemon/ ### Description Retrieves a list of all Pokémon, with options for pagination. ### Method GET ### Endpoint `/api/v2/pokemon/` ### Parameters #### Query Parameters - **limit** (integer) - Optional - The maximum number of results to return. - **offset** (integer) - Optional - The number of results to skip. Useful for pagination. ### Request Example ```bash curl "https://pokeapi.co/api/v2/pokemon?limit=100000&offset=0" ``` ### Response #### Success Response (200) - **count** (integer) - The total number of Pokémon available. - **next** (string) - URL for the next page of results. - **previous** (string) - URL for the previous page of results. - **results** (array) - A list of Pokémon, each with a `name` and `url`. #### Response Example ```json { "count": 1281, "next": "https://pokeapi.co/api/v2/pokemon?offset=20&limit=20", "previous": null, "results": [ { "name": "bulbasaur", "url": "https://pokeapi.co/api/v2/pokemon/1/" }, { "name": "ivysaur", "url": "https://pokeapi.co/api/v2/pokemon/2/" } ] } ``` ``` -------------------------------- ### Authentication: Sign Up New User Source: https://supabase.com/docs/reference/javascript/using-filters Details the `signUp` method for creating a new user. Explains the behavior based on email confirmation settings and potential error scenarios. ```APIDOC ## POST /auth/sign-up ### Description Creates a new user account in Supabase. The response differs based on whether email confirmation is enabled in the project settings. ### Method POST ### Endpoint `/auth/sign-up` ### Parameters #### Path Parameters None #### Query Parameters None #### Request Body - **credentials** (object) - Required - Contains user sign-up details. - **email** (string) - Required - The user's email address. - **password** (string) - Required - The user's password. ### Request Example ```json { "example": "const { data, error } = await supabase.auth.signUp({ email: 'example@email.com', password: 'examplepassword' })" } ``` ### Response #### Success Response (200) - **user** (object | null) - The created user object. Null if email confirmation is enabled. - **session** (object | null) - The user's session object. Null if email confirmation is enabled. - **error** (object | null) - An error object if the sign-up failed. #### Response Example ```json { "example": "{\"user\": {\"id\": \"...\", \"email\": \"example@email.com\"}, \"session\": null}" } ``` ``` -------------------------------- ### Get Year from JavaScript Date Object Source: https://www.w3schools.com/js/js_date_methods.asp This snippet shows how to retrieve the full four-digit year from a JavaScript Date object using the getFullYear() method. It includes examples for both specific dates and the current date. ```javascript const d = new Date("2021-03-25"); console.log(d.getFullYear()); // Output: 2021 const now = new Date(); console.log(now.getFullYear()); // Output: Current Year ``` -------------------------------- ### Authentication - signUp Source: https://supabase.com/docs/reference/javascript/not Creates a new user account. Handles email verification and session management. ```APIDOC ## POST /auth/v1/signup ### Description Creates a new user account. Handles email verification and session management. Note that if a user account already exists, an error message attempting to hide this information might be returned. ### Method POST ### Endpoint /auth/v1/signup ### Parameters #### Request Body - **credentials** (object) - Required - User credentials for signup. - **email** (string) - Required - The user's email address. - **password** (string) - Required - The user's password. - **options** (object) - Optional - Additional options for signup. - **emailRedirectTo** (string) - Optional - The URL to redirect to after email confirmation. ### Request Example ```json { "example": "const { data, error } = await supabase.auth.signUp({ email: 'example@user.com', password: 'example-password', options: { emailRedirectTo: 'https://your-app.com/auth/callback' } })" } ``` ### Response #### Success Response (200) - **user** (object) - The created user object. May be null if email confirmation is required and not yet completed. - **session** (object or null) - The user's session object. Will be null if email confirmation is required. - **error** (object) - An error object if the request failed. #### Response Example ```json { "example": "{\"user\": { \"id\": \"...\", \"email\": \"example@user.com\" }, \"session\": null}" } ``` ``` -------------------------------- ### Install hCaptcha TypeScript Types Source: https://docs.hcaptcha.com/ Installs the necessary TypeScript type definitions for the hCaptcha global variable using either Yarn or npm. These types enhance development by providing autocompletion and type checking for hCaptcha functions. ```bash yarn add -D @hcaptcha/types ``` ```bash npm install -D @hcaptcha/types ``` -------------------------------- ### Sign Up (Email + Password) Source: https://context7_llms Creates a new member account using their email and password. ```APIDOC ## Sign Up (Email + Password) ### Description Creates a new member account using their email and password. ### Method POST ### Endpoint /auth/sign-up/email-password ### Parameters #### Request Body - **Email** (string) - Required - The member's email address. - **Password** (string) - Required - The member's password. - **Custom Fields** (object) - Optional - Custom fields for the new member. Each key-value pair represents a custom field. - **Key** (string) - The key of the custom field. - **Value** (any) - The value for the custom field. - **Metadata** (object) - Optional - Additional metadata for the new member. Each key-value pair represents a metadata field. - **Key** (string) - The key of the metadata field. - **Value** (any) - The value for the metadata field. - **Plans** (array) - Optional - Plan connections for the new member. Only free plans can be added during signup. - **Plan ID** (string) - The unique identifier for the plan. ### Request Example ```json { "Email": "newuser@example.com", "Password": "securepassword", "Custom Fields": { "preferred_language": "en" }, "Plans": [ { "Plan ID": "free_plan_1" } ] } ``` ### Response #### Success Response (200) - **member** (object) - The newly created member object. - **tokens** (object) - Authentication tokens. - **accessToken** (string) - The access token. - **type** (string) - The token type. - **expires** (number) - The token expiration timestamp. #### Response Example ```json { "member": { "id": "member_456", "email": "newuser@example.com", "custom_fields": { "preferred_language": "en" } }, "tokens": { "accessToken": "your_access_token_for_new_user", "type": "Bearer", "expires": 1678886400 } } ``` ``` -------------------------------- ### Display Item Index Number (JavaScript) Source: https://docs.wized.com/elements/configuration-types/single-use/render-list Provides an example of how to display the index number for each item in a list, starting from 1 instead of 0. This is achieved by adding 1 to the 'v.i' index variable. ```javascript return v.i + 1; // Displays item number starting from 1 instead of 0 ``` -------------------------------- ### Install and Use Firebase SDK in Node.js (JavaScript) Source: https://www.npmjs.com/package/firebase Installs the Firebase SDK using npm and demonstrates how to initialize the app and access Firestore in a Node.js environment for server or command-line applications. Supports both CommonJS `require` and ES6 `import` syntax. ```bash $ npm init $ npm install --save firebase ``` ```javascript const { initializeApp } = require('firebase/app'); const { getFirestore, collection, getDocs } = require('firebase/firestore'); // ... ``` ```javascript import { initializeApp } from 'firebase/app'; import { getFirestore, collection, getDocs } from 'firebase/firestore'; // ... ``` -------------------------------- ### Create New Edge Function with CLI Source: https://supabase.com/docs/guides/functions/quickstart Generates a new Edge Function with a basic TypeScript template. This creates a function file (e.g., 'index.ts') within the 'supabase/functions/' directory. ```bash supabase functions new hello-world ``` -------------------------------- ### Database Query: Explain Query Plan Source: https://supabase.com/docs/reference/javascript/using-filters Demonstrates how to obtain the EXPLAIN plan for a database query using the `explain()` method. Requires `db_plan_enabled` setting to be true. ```APIDOC ## GET /from/characters ### Description Retrieves the EXPLAIN query plan for a select statement on the 'characters' table. This is useful for performance analysis. ### Method GET ### Endpoint `/from/characters` ### Parameters #### Query Parameters None #### Request Body None ### Request Example ```json { "example": "const { data, error } = await supabase.from('characters').select().explain()" } ``` ### Response #### Success Response (200) - **data** (object | null) - An object containing the EXPLAIN plan details. - **error** (object | null) - An error object if the query failed or `db_plan_enabled` is not set. #### Response Example ```json { "example": "{\"plan\": \"Seq Scan on characters (cost=0.00..11.50 rows=100 width=50)\"}" } ``` ``` -------------------------------- ### Create Supabase Item Request Example (JSON) Source: https://context7_llms This is a conceptual representation of a Supabase 'Create item' request within Wized. It demonstrates how key-value pairs are used to map data to table columns for insertion. The actual implementation would involve configuring these in the Wized interface. ```json { "table": "your_table_name", "fields": { "column1": "value1", "column2": "value2" } } ``` -------------------------------- ### Hide Member-Only Content by Default with Memberstack Source: https://docs.memberstack.com/hc/en-us/articles/7253090768539-Installing-Memberstack-in-Webflow This example demonstrates how to use the `data-ms-bind:style` attribute to hide member-only content by default. This approach is recommended when deferring the Memberstack script load to prevent content flashes before the script initializes. ```html
This content is hidden by default.
``` -------------------------------- ### Deploy Supabase Edge Function Source: https://supabase.com/docs/guides/functions/quickstart This command deploys a Supabase Edge Function named 'hello-world' to the Supabase global edge network. Options are provided to deploy all functions, use API-based deployment, or skip JWT verification for webhooks. ```shell supabase functions deploy hello-world ``` ```shell supabase functions deploy ``` ```shell supabase functions deploy hello-world --use-api ``` ```shell supabase functions deploy hello-world --no-verify-jwt ``` -------------------------------- ### Initializing Supabase Client Source: https://supabase.com/docs/reference/javascript/using-filters Details on how to create a Supabase client instance for use in the browser or other JavaScript environments, including required parameters and options. ```APIDOC ## Initializing Supabase Client Create a new client for use in the browser. ### Parameters * **supabaseUrl** (string) - The unique Supabase URL which is supplied when you create a new project in your project dashboard. * **supabaseKey** (string) - The unique Supabase Key which is supplied when you create a new project in your project dashboard. * **options** (Optional SupabaseClientOptions) - For advanced configurations like custom domains, schemas, or fetch implementations. ### Example ```javascript import { createClient } from '@supabase/supabase-js' // Create a single supabase client for interacting with your database const supabaseUrl = 'https://xyzcompany.supabase.co' const supabaseKey = 'YOUR_SUPABASE_ANON_KEY' const supabase = createClient(supabaseUrl, supabaseKey) ``` ``` -------------------------------- ### Starter Edge Function (TypeScript/Deno) Source: https://supabase.com/docs/guides/functions/quickstart A basic Deno-based Edge Function template that accepts a JSON payload with a 'name' field and returns a JSON response with a greeting message. It's designed to run in the Supabase Edge Functions environment. ```typescript Deno.serve(async (req) => { const { name } = await req.json() const data = { message: `Hello ${name}!`, } return new Response(JSON.stringify(data), { headers: { 'Content-Type': 'application/json' } }) }) ``` -------------------------------- ### Local Development Hosts File Configuration Source: https://docs.hcaptcha.com/ Provides an example of modifying the hosts file to resolve the 'test.mydomain.com' domain to the local machine's IP address (127.0.0.1). This is a workaround for browser CORS/CORB restrictions and hCaptcha API prohibitions on 'localhost' and '127.0.0.1' during local development. ```text 127.0.0.1 test.mydomain.com ``` -------------------------------- ### Sign Up (Passwordless) Source: https://context7_llms Creates a new member account using a magic link sent to their email address. ```APIDOC ## Sign Up (Passwordless) ### Description Creates a new member account using a magic link sent to their email address. This method is used after the member has received the magic link from the 'Send Sign Up Email (Passwordless)' method. ### Method POST ### Endpoint /auth/sign-up/passwordless ### Parameters #### Request Body - **Email** (string) - Required - The member's email address. - **Passwordless Token** (string) - Required - The magic link token received in the email. - **Custom Fields** (object) - Optional - Custom fields for the new member. - **Key** (string) - The key of the custom field. - **Value** (any) - The value for the custom field. - **Metadata** (object) - Optional - Additional metadata for the new member. - **Key** (string) - The key of the metadata field. - **Value** (any) - The value for the metadata field. - **Plans** (array) - Optional - Plan connections for the new member. Only free plans can be added during signup. - **Plan ID** (string) - The unique identifier for the plan. ### Request Example ```json { "Email": "newuser@example.com", "Passwordless Token": "your_signup_magic_token", "Custom Fields": { "newsletter_opt_in": true }, "Plans": [ { "Plan ID": "free_plan_2" } ] } ``` ### Response #### Success Response (200) - **member** (object) - The newly created member object. - **tokens** (object) - Authentication tokens. - **accessToken** (string) - The access token. - **type** (string) - The token type. - **expires** (number) - The token expiration timestamp. #### Response Example ```json { "member": { "id": "member_789", "email": "newuser@example.com", "custom_fields": { "newsletter_opt_in": true } }, "tokens": { "accessToken": "your_access_token_for_new_user_pwless", "type": "Bearer", "expires": 1678886400 } } ``` ``` -------------------------------- ### Verify hCaptcha Token with Python Flask Source: https://docs.hcaptcha.com/ Backend code example using Python and Flask to verify an hCaptcha token received from a user's form submission. It sends the token to the hCaptcha siteverify API and returns the verification result. Requires the 'requests' and 'flask' libraries. ```python import os import requests from flask import Flask, request, jsonify # URL for token verification HCAPTCHA_VERIFY_URL = "https://api.hcaptcha.com/siteverify" # Your secret key from the hCaptcha dashboard SECRET_KEY = os.getenv("HCAPTCHA_SECRET", "your_secret_here") app = Flask(__name__) def verify_hcaptcha_token(token: str, remoteip: str = None) -> dict: """Sends a POST request to hCaptcha's /siteverify endpoint and returns a result dict including 'success' (bool), timestamp, hostname, and any error codes returned.""" payload = { 'secret': SECRET_KEY, 'response': token } if remoteip: payload['remoteip'] = remoteip # recommended, improves accuracy response = requests.post(HCAPTCHA_VERIFY_URL, data=payload) response.raise_for_status() data = response.json() # Example shape: # { # "success": False, # "challenge_ts": "2025-08-01T12:34:56Z", # "hostname": "example.com", # "error-codes": ["invalid-input-response"] # } return { 'success': data.get('success', False), 'challenge_ts': data.get('challenge_ts'), 'hostname': data.get('hostname'), 'error_codes': data.get('error-codes', []) } @app.route('/login', methods=['POST']) def login(): # 1) Get token from form POST token = request.form.get('h-captcha-response') if not token: return jsonify({'error': 'Missing hCaptcha token'}), 400 # 2) Verify token via hCaptcha API result = verify_hcaptcha_token(token, remoteip=request.remote_addr) # 3) Decision logic if result['success']: # Token valid == allow action # Proceed with your login/business logic here return jsonify({'status': 'Logged in'}), 200 else: # Verification failed return jsonify({ 'error': 'login failed', # log error codes from siteverify print('error_codes:', result['error_codes']) }), 403 if __name__ == '__main__': app.run(debug=True, port=5000) ``` -------------------------------- ### Create a Bucket Source: https://supabase.com/docs/reference/javascript/introduction Creates a new Storage bucket. ```APIDOC ## Create a Bucket ### Description Creates a new Storage bucket. ### Method POST ### Endpoint `/storage/v1/buckets` ### Parameters #### Request Body - **id** (string) - Required - A unique identifier for the bucket. - **options** (object) - Optional - Options for the new bucket. - **public** (boolean) - Optional - Whether the bucket is public. - **allowedMimeTypes** (array) - Optional - List of allowed MIME types. - **fileSizeLimit** (integer) - Optional - File size limit in bytes. ### Request Example ```javascript const { data, error } = await supabase.storage.createBucket('avatars', { public: false, allowedMimeTypes: ['image/png'], fileSizeLimit: 1024 }) ``` ### Response #### Success Response (200) - **data** (object) - Details about the created bucket. - **error** (object) - Error details if the request fails. #### Response Example ```json { "data": { ... bucket details ... }, "error": null } ``` ``` -------------------------------- ### Programmatic JavaScript hCaptcha Execution Source: https://docs.hcaptcha.com/ This example demonstrates how to programmatically trigger and manage the hCaptcha widget using JavaScript. It includes functions for rendering the widget, handling successful solves, errors, and token expirations, and programmatically executing the captcha. This approach is useful for invisible captchas or custom user flows. ```javascript let widgetId = null; // will hold the widget ID assigned by hCaptcha function onloadHCaptcha() { // 2. Once SDK is loaded, render invisible hCaptcha widget widgetId = hcaptcha.render('hcaptcha-container', { sitekey: 'your_site_key_here', size: 'invisible', // invisible mode callback: onSolve, 'error-callback': onError, 'expired-callback': onExpired }); } function onSolve(token, key) { // This function is called after successful solve // `token` is the h-captcha-response value console.log('hCaptcha solved:', { token, key }); document.getElementById('demo-form').submit(); // or handle manually } function onError(err) { console.error('hCaptcha error callback:', err); // log to analytics, restart flow } function onExpired() { console.warn('hCaptcha token expired'); // make sure to fetch a new token before user submits form } function onManualStep(event) { event.preventDefault(); // 3. Trigger the hCaptcha flow programmatically if (widgetId === null) { console.error('Widget not yet initialized'); } else { hcaptcha.execute(widgetId); } } ``` -------------------------------- ### User Sign Up Source: https://supabase.com/docs/reference/javascript/not Allows users to sign up with an email and password, or various phone number and password combinations. Supports additional user metadata and redirect URLs. ```APIDOC ## POST /auth/v1/signup ### Description Allows users to sign up with an email and password, or various phone number and password combinations. Supports additional user metadata and redirect URLs. ### Method POST ### Endpoint /auth/v1/signup ### Parameters #### Request Body - **email** (string) - Required - The email address of the user. - **password** (string) - Required - The password for the new user. - **options** (object) - Optional - Additional sign-up options. - **data** (object) - Optional - User metadata to be stored with the user. - **redirect_to** (string) - Optional - A URL to redirect the user to after sign-up. ### Request Example ```json { "email": "example@email.com", "password": "example-password", "options": { "data": { "username": "testuser" }, "redirect_to": "https://your-app.com/welcome" } } ``` ### Response #### Success Response (200) - **user** (object) - The newly created user object. - **session** (object) - The user's session object. #### Response Example ```json { "user": { "id": "d290f1ee-c749-4320-9504-245907029280", "email": "example@email.com", "user_metadata": { "username": "testuser" } }, "session": { "access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...", "refresh_token": "..." } } ``` ``` -------------------------------- ### Initialize Firebase App (TypeScript) Source: https://www.npmjs.com/package/firebase Demonstrates how to initialize a Firebase app instance using the provided configuration. This is the first step before accessing any Firebase services. It requires the `initializeApp` function from the 'firebase/app' package. ```typescript import { initializeApp } from 'firebase/app'; // TODO: Replace the following with your app's Firebase project configuration const firebaseConfig = { //... }; const app = initializeApp(firebaseConfig); ``` -------------------------------- ### Test Local Supabase Edge Function with Curl Source: https://supabase.com/docs/guides/functions/quickstart This snippet demonstrates how to send a POST request to a locally running Supabase Edge Function using curl. It includes setting the authorization header with the publishable key and providing a JSON payload. The expected output is a JSON response from the function. ```shell curl -i --location --request POST 'http://localhost:54321/functions/v1/hello-world' \ --header 'Authorization: Bearer SUPABASE_PUBLISHABLE_KEY' \ --header 'Content-Type: application/json' \ --data '{"name":"Functions"}' ``` -------------------------------- ### Sign up (provider) Source: https://context7_llms Creates a new member account using a third-party authentication provider. ```APIDOC ## Sign up (provider) ### Description Creates a new member account using a third-party authentication provider. ### Method POST ### Endpoint /sign-up-provider ### Parameters #### Request Body - **Provider** (string) - Required - The name of the authentication provider. - **Custom Fields** (array) - Optional - The custom fields for the new member. Each custom field has: - **Key** (string) - Required - The key of the custom field. - **Value** (string) - Required - The value for the custom field. - **Plans** (array) - Optional - The plan connections for the new member. Note that only free plans can be added during signup. Each plan connection has: - **Plan ID** (string) - Required - The unique identifier for the plan. ### Response #### Success Response (200) - The response contains the same data as the [Sign in (email + password)](#sign-in-email--password) method. ### Response Example ```json { "example": "response body from Sign in (email + password)" } ``` ``` -------------------------------- ### Supabase CLI Authentication and Project Linking Source: https://supabase.com/docs/guides/functions/quickstart These commands are used to authenticate with the Supabase CLI and link a local project to a remote Supabase project. 'supabase login' initiates the authentication process, and 'supabase link --project-ref [YOUR_PROJECT_ID]' connects the local repository to a specific Supabase project using its reference ID. ```shell supabase login ``` ```shell supabase projects list ``` ```shell supabase link --project-ref [YOUR_PROJECT_ID] ``` -------------------------------- ### Test Live Supabase Edge Function with Curl Source: https://supabase.com/docs/guides/functions/quickstart This snippet shows how to test a deployed Supabase Edge Function running globally. It uses curl to send a POST request to the function's URL, including the authorization header with the production publishable key and a JSON payload. The expected output is a JSON response from the live function. ```shell curl --request POST 'https://[YOUR_PROJECT_ID].supabase.co/functions/v1/hello-world' \ --header 'Authorization: Bearer SUPABASE_PUBLISHABLE_KEY' \ --header 'Content-Type: application/json' \ --data '{"name":"Production"}' ``` -------------------------------- ### Authentication: Create Client Source: https://supabase.com/docs/reference/javascript/using-filters Shows how to initialize the Supabase client for server-side usage with a given URL and anon key. ```APIDOC ## POST /auth/client ### Description Initializes the Supabase client for server-side operations using the provided Supabase URL and anon key. ### Method POST ### Endpoint `/auth/client` ### Parameters #### Path Parameters None #### Query Parameters None #### Request Body None ### Request Example ```json { "example": "import { createClient } from '@supabase/supabase-js'\nconst supabase = createClient(supabase_url, anon_key)" } ``` ### Response #### Success Response (200) - **client** (object) - The initialized Supabase client instance. #### Response Example ```json { "example": "// Supabase client object" } ``` ``` -------------------------------- ### Sign Up New User with Supabase Auth Source: https://supabase.com/docs/reference/javascript/not Creates a new user account in Supabase using the .signUp() method with user credentials. Behavior regarding email confirmation and returned session data depends on project settings. Handles existing user scenarios with specific error messages or obfuscated user objects. ```javascript const { data, error } = await supabase.auth.signUp(credentials) ``` -------------------------------- ### Get Millisecond from JavaScript Date Object Source: https://www.w3schools.com/js/js_date_methods.asp This snippet demonstrates how to get the millisecond (0-999) from a JavaScript Date object using the getMilliseconds() method. ```javascript const d = new Date("2021-03-25T14:30:45.123"); console.log(d.getMilliseconds()); // Output: 123 ``` -------------------------------- ### Get Minute from JavaScript Date Object Source: https://www.w3schools.com/js/js_date_methods.asp This snippet shows how to get the minute (0-59) from a JavaScript Date object using the getMinutes() method. ```javascript const d = new Date("2021-03-25T14:30:00"); console.log(d.getMinutes()); // Output: 30 ``` -------------------------------- ### Invoke Supabase Edge Function with Supabase Client (JavaScript) Source: https://supabase.com/docs/guides/functions/quickstart This JavaScript code demonstrates how to invoke a deployed Supabase Edge Function from a client-side application using the Supabase JavaScript client library. It initializes the client with the project URL and anon key, then calls the 'hello-world' function with a JSON body. The result, including data and errors, is logged to the console. ```javascript import { createClient } from '@supabase/supabase-js' const supabase = createClient('https://[YOUR_PROJECT_ID].supabase.co', 'YOUR_ANON_KEY') const { data, error } = await supabase.functions.invoke('hello-world', { body: { name: 'JavaScript' }, }) console.log(data) // { message: "Hello JavaScript!" } ``` -------------------------------- ### Creating Native Requests Source: https://context7_llms Guides users on how to create requests for Wized's native integrations (Supabase, Memberstack, Firebase, Airtable) by selecting an app and a predefined method. ```APIDOC ## Creating Native Requests ### Description This section outlines the process for creating API requests when using Wized's native integrations. These integrations simplify communication with services like Supabase, Memberstack, Firebase, and Airtable by providing predefined methods. ### Steps 1. Navigate to the left sidebar and click on `Requests` to open the requests panel. 2. Click the `+` icon to create a new request. 3. In the right panel, name the request and select the desired **native app** (e.g., Firebase, Airtable). 4. Once the app is selected, configure the request using dropdown menus: - Choose a **method** relevant to the app (e.g., `Get List Items`, `Create Item`, `Login`). - Provide any required **inputs** based on the chosen method. Refer to the specific native integration's documentation for available methods and their parameters. ### Example (Login Request) For a login request, you will typically need to provide `email` and `password` fields. ``` -------------------------------- ### Get Month from JavaScript Date Object Source: https://www.w3schools.com/js/js_date_methods.asp This snippet illustrates how to get the month from a JavaScript Date object using the getMonth() method. It highlights that months are zero-indexed, with January being 0 and December being 11. ```javascript const d = new Date("2021-03-25"); console.log(d.getMonth()); // Output: 2 (March is the 3rd month, index 2) ``` -------------------------------- ### Creating REST Requests Source: https://context7_llms Explains how to set up custom API requests using the REST integration, allowing interaction with any third-party service by configuring method, endpoint, parameters, headers, and body. ```APIDOC ## Creating REST Requests ### Description This section details how to create custom API requests using Wized's REST integration. This is useful for connecting to any third-party service not covered by native integrations. ### Steps 1. Navigate to the left sidebar and click on `Requests`. 2. Click the `+` icon to create a new request. 3. In the right panel, name the request and select **REST** as the app. 4. Manually configure the request: - Choose the **HTTP method** (`GET`, `POST`, `PUT`, `PATCH`, `DELETE`). - Set the **endpoint URL** (relative path only). - Define **parameters, headers, and body** using key-value pairs. Values can be dynamic using Wized’s [function editor](/function-editor/) to pull data from cookies, variables, request responses, URL parameters, etc. ### Note Refer to the specific API's documentation for details on endpoints, parameters, headers, and request body structure. ``` -------------------------------- ### Install Supabase JS Client via Yarn Source: https://supabase.com/docs/reference/javascript/using-filters Installs the @supabase/supabase-js package using Yarn, an alternative package manager for JavaScript. This command is equivalent to the npm installation for managing project dependencies. ```bash yarn add @supabase/supabase-js ``` -------------------------------- ### Get Query Execution Plan with Supabase explain() Source: https://supabase.com/docs/reference/javascript/not Retrieves the EXPLAIN plan for a Supabase query using .select().explain(). This requires enabling the 'db_plan_enabled' setting and can be used with options like 'analyze' and 'verbose' to get detailed execution information. ```javascript const { data, error } = await supabase.from('characters').select().explain() ``` -------------------------------- ### User Sign Up Source: https://supabase.com/docs/reference/javascript/using-filters Allows users to sign up with an email and password, or with a phone number and password (SMS/WhatsApp). Supports inclusion of additional user metadata and a redirect URL. ```APIDOC ## POST /auth/v1/signup ### Description Sign up a new user with email and password, or phone number and password. Supports additional user metadata and redirect URL. ### Method POST ### Endpoint /auth/v1/signup ### Parameters #### Request Body - **email** (string) - Required - User's email address. - **password** (string) - Required - User's password. - **phone** (string) - Optional - User's phone number. - **data** (object) - Optional - Additional user metadata. - **key** (string) - Optional - Metadata key. - **value** (any) - Optional - Metadata value. - **redirect_to** (string) - Optional - URL to redirect after sign-up. ### Request Example ```json { "email": "example@email.com", "password": "example-password", "options": { "data": { "username": "johndoe" }, "redirect_to": "https://example.com/welcome" } } ``` ### Response #### Success Response (200) - **user** (object) - User object. - **id** (string) - User ID. - **email** (string) - User's email. - **created_at** (string) - Timestamp of creation. - **session** (object) - Session object. - **access_token** (string) - Access token. - **refresh_token** (string) - Refresh token. #### Response Example ```json { "user": { "id": "a1b2c3d4-e5f6-7890-1234-567890abcdef", "email": "example@email.com", "created_at": "2023-10-27T10:00:00.000Z" }, "session": { "access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...", "refresh_token": "aBcDeFgHiJkLmNoPqRsTuVwXyZ1234567890" } } ``` ``` -------------------------------- ### Get Day of Week from JavaScript Date Object Source: https://www.w3schools.com/js/js_date_methods.asp This snippet shows how to get the day of the week (0-6) from a JavaScript Date object using the getDay() method, where 0 represents Sunday and 6 represents Saturday. ```javascript const d = new Date("2021-03-25"); // March 25, 2021 was a Thursday console.log(d.getDay()); // Output: 4 ``` -------------------------------- ### Get Time in Milliseconds since Epoch (Unix Time) Source: https://www.w3schools.com/js/js_date_methods.asp This snippet shows how to get the total number of milliseconds that have elapsed since January 1, 1970, 00:00:00 UTC (the Unix epoch), using the getTime() method. ```javascript const d = new Date(); console.log(d.getTime()); // Output: Number of milliseconds since epoch ```