mirror of
https://github.com/noodlapp/noodl-docs.git
synced 2026-01-11 23:02:54 +01:00
Initial commit
Co-Authored-By: kotte <14197736+mrtamagotchi@users.noreply.github.com> Co-Authored-By: mikaeltellhed <2311083+mikaeltellhed@users.noreply.github.com> Co-Authored-By: Tore Knudsen <18231882+torekndsn@users.noreply.github.com> Co-Authored-By: Michael Cartner <32543275+michaelcartner@users.noreply.github.com>
This commit is contained in:
Eric Tuvesson
49
library/prefabs/xano/components/setup-xanoclient/README.md
Normal file
49
library/prefabs/xano/components/setup-xanoclient/README.md
Normal file
@@ -0,0 +1,49 @@
|
||||
---
|
||||
title: Setup XanoClient
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
# Setup XanoClient
|
||||
|
||||
This component is used to configure the Xano Client, enabling your app to establish connections and query your endpoints.
|
||||
|
||||
This prefab will not work unless you place one instance of the Setup Xano Client component in your projects Home Component and set the `API Group Base URL` and `Datasource` values:
|
||||
|
||||
<div className="ndl-image-with-background xl">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
The `API Group Base URL` can be found here in Xano:
|
||||
|
||||
<div className="ndl-image-with-background">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
## Inputs
|
||||
|
||||
| Data | Description |
|
||||
| ---------------------------------------------------- | -------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-data">API Group Base URL</span> | The base Request URL used to call all the endpoints of the API Groups. |
|
||||
| <span className="ndl-data">Datasource</span> | The data environment to be used in your Xano workspace. Defaults to `live`. |
|
||||
| <span className="ndl-data">Auth Login Path</span> | The path to the login endpoint. Defaults to `/auth/login`. |
|
||||
| <span className="ndl-data">Auth Signup Path</span> | The path to the signup endpoint. Defaults to `/auth/signup`. |
|
||||
| <span className="ndl-data">Auth Me Path</span> | The path to the endpoint containing the user information. Defaults to `/auth/me` |
|
||||
|
||||
After the Xano Client has been set up you can find all the input values in the following Noodl variables:
|
||||
|
||||
- `Noodl.Variables.xanoApiGroupBaseUrl`
|
||||
- `Noodl.Variables.xanoDatasource`
|
||||
- `Noodl.Variables.xanoAuthSignupPath`
|
||||
- `Noodl.Variables.xanoAuthLoginPath`
|
||||
- `Noodl.Variables.xanoAuthMePath`
|
||||
|
||||
## Outputs
|
||||
|
||||
| Signals | Description |
|
||||
| ------------------------------------------- | -------------------------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Success</span> | Sends a signal when the Xano Client initilized successfully. |
|
||||
| <span className="ndl-signal">Failure</span> | Sends a signal when the Xano Client failed initializing. Outputs the error message in the console. |
|
||||
@@ -0,0 +1,35 @@
|
||||
---
|
||||
title: authToken Refresh
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
# authToken Refresh
|
||||
|
||||
This component is used to automatically refresh the user **authToken**.
|
||||
|
||||
<div className="ndl-image-with-background xl">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
> Please note that [Xano Client](/library/prefabs/xano/components/setup-xanoclient/) needs to be set up in your app before you can properly use this component.
|
||||
|
||||
## Inputs
|
||||
|
||||
| Data | Description |
|
||||
| ----------------------------------------------- | ---------------------------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-data">TTL</span> | Sets the duration before refreshing the authToken. It is commonly set to half of the token duration. |
|
||||
| <span className="ndl-data">Endpoint Path</span> | Sets the API endpoint path (used with the `API Group Base URL`) to refresh the user authToken. |
|
||||
|
||||
| Signals | Description |
|
||||
| ----------------------------------------- | ---------------------------- |
|
||||
| <span className="ndl-signal">Start</span> | Starts the refresh sequence. |
|
||||
| <span className="ndl-signal">Stop</span> | Stops the refresh sequence. |
|
||||
|
||||
## Outputs
|
||||
|
||||
| Signals | Description |
|
||||
| ------------------------------------------- | -------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Success</span> | Sends a signal when the request succeeded. |
|
||||
| <span className="ndl-signal">Failure</span> | Sends a signal when an error occurred, and logs an error message in the console. |
|
||||
38
library/prefabs/xano/components/xano-current-user/README.md
Normal file
38
library/prefabs/xano/components/xano-current-user/README.md
Normal file
@@ -0,0 +1,38 @@
|
||||
---
|
||||
title: Current User
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
# Current User
|
||||
|
||||
This component is used to fetch information from the current logged in users `/auth/me` path in Xano.
|
||||
|
||||
<div className="ndl-image-with-background xl">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
On a request it checks if the user is still logged in by looking for a valid **authToken**. The **authToken** is automatically generated when the user is logged in.
|
||||
|
||||
> Please note that [Xano Client](/library/prefabs/xano/components/setup-xanoclient/) needs to be set up in your app before you can properly use this component.
|
||||
|
||||
## Inputs
|
||||
|
||||
| Signals | Description |
|
||||
| ----------------------------------------- | ------------------------------------------------- |
|
||||
| <span className="ndl-signal">Fetch</span> | Send a Signal to this input to retrieve the data. |
|
||||
|
||||
## Outputs
|
||||
|
||||
| Data | Description |
|
||||
| ------------------------------------------- | -------------------------------------------------------------------------- |
|
||||
| <span className="ndl-data">Logged In</span> | `true` if the user is logged in, `false` if not. |
|
||||
| <span className="ndl-data">Xano ID</span> | The users ID. |
|
||||
| <span className="ndl-data">Email</span> | The users email. |
|
||||
| <span className="ndl-data">User Data</span> | All the data retrieved from the `/auth/me` endpoint of the logged in user. |
|
||||
|
||||
| Signals | Description |
|
||||
| ------------------------------------------- | -------------------------------------------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Success</span> | Sends a signal when the request succeeded. |
|
||||
| <span className="ndl-signal">Failure</span> | Sends a signal when an error occurred, or if the **authToken** is expired, and logs an error message in the console. |
|
||||
50
library/prefabs/xano/components/xano-log-in/README.md
Normal file
50
library/prefabs/xano/components/xano-log-in/README.md
Normal file
@@ -0,0 +1,50 @@
|
||||
---
|
||||
title: Log In
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
# Log In
|
||||
|
||||
This component is used to log in a user.
|
||||
|
||||
<div className="ndl-image-with-background xl">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
> Please note that [Xano Client](/library/prefabs/xano/components/setup-xanoclient/) needs to be set up in your app before you can properly use this component.
|
||||
|
||||
## On success
|
||||
|
||||
When a user has successfully been logged in the **Log In** component will create a Noodl Object with the id `currentUser`. This object contains all the user data retrieved from Xanos `/auth/me` endpoint.
|
||||
|
||||
A successful signup will also trigger a `Xano User Logged In` event. You can hook into to this event anywhere in your app using a [Receive Event](/nodes/events/receive-event/) node.
|
||||
|
||||
## Keeping the user logged in
|
||||
|
||||
To keep the user logged in for longer periods of time you need to refresh the **authToken**. This can be done by placing the following nodes in the **home component**:
|
||||
|
||||
<div className="ndl-image-with-background l">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
## Inputs
|
||||
|
||||
| Data | Description |
|
||||
| ------------------------------------------ | -------------------------------------------- |
|
||||
| <span className="ndl-data">Email</span> | The email of the user you want to log in. |
|
||||
| <span className="ndl-data">Password</span> | The password of the user you want to log in. |
|
||||
|
||||
| Signals | Description |
|
||||
| -------------------------------------- | ------------------------------------------------------ |
|
||||
| <span className="ndl-signal">Do</span> | Send a Signal to this input to send the login request. |
|
||||
|
||||
## Outputs
|
||||
|
||||
| Signals | Description |
|
||||
| ------------------------------------------- | -------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Success</span> | Sends a signal when the request succeeded. |
|
||||
| <span className="ndl-signal">Failure</span> | Sends a signal when an error occurred, and logs an error message in the console. |
|
||||
44
library/prefabs/xano/components/xano-log-out/README.md
Normal file
44
library/prefabs/xano/components/xano-log-out/README.md
Normal file
@@ -0,0 +1,44 @@
|
||||
---
|
||||
title: Log Out
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
# Log Out
|
||||
|
||||
This component is used to log in a user.
|
||||
|
||||
<div className="ndl-image-with-background xl">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
> Please note that [Xano Client](/library/prefabs/xano/components/setup-xanoclient/) needs to be set up in your app before you can properly use this component.
|
||||
|
||||
## On success
|
||||
|
||||
When a user has successfuly been logged out the **Log Out** component will empty the Noodl Object with the id `currentUser`.
|
||||
|
||||
A successful signup will also trigger a `Xano User Logged Out` event. You can hook into to this event anywhere in your app using a [Receive Event](/nodes/events/receive-event/) node. This event can be used to stop the **authToken** refresh.
|
||||
|
||||
## If you are refreshing the authToken
|
||||
|
||||
Don't forget to turn off the **authToken** refresh if you have added that to your app. This can be done by placing the following nodes in the **home component**:
|
||||
|
||||
<div className="ndl-image-with-background l">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
## Inputs
|
||||
|
||||
| Signals | Description |
|
||||
| -------------------------------------- | ------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Do</span> | Send a Signal to this input to send the logout request. |
|
||||
|
||||
## Outputs
|
||||
|
||||
| Signals | Description |
|
||||
| ------------------------------------------- | ------------------------------------------ |
|
||||
| <span className="ndl-signal">Success</span> | Sends a signal when the request succeeded. |
|
||||
33
library/prefabs/xano/components/xano-request/README.md
Normal file
33
library/prefabs/xano/components/xano-request/README.md
Normal file
@@ -0,0 +1,33 @@
|
||||
---
|
||||
title: Request
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
# Request
|
||||
|
||||
This component is used to call Xano API endpoints.
|
||||
|
||||
> Please note that [Xano Client](/library/prefabs/xano/components/setup-xanoclient/) needs to be set up in your app before you can properly use this component.
|
||||
|
||||
## Inputs
|
||||
|
||||
| Data | Description |
|
||||
| ---------------------------------------------- | --------------------------------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-data">Endpoint</span> | The path of the endpoint to be called within the API Group, like `/auth/signup` or `/auth/login`. |
|
||||
| <span className="ndl-data">Request Type</span> | The type of request you want send. Follows the HTTP standards `GET`, `POST`, `PUT`, `PATCH` and `DELETE`. |
|
||||
| <span className="ndl-data">Data</span> | A JSON formatted payload that will be sent as Request Body. |
|
||||
|
||||
| Signals | Description |
|
||||
| -------------------------------------- | -------------------------------------------------- |
|
||||
| <span className="ndl-signal">Do</span> | Sends a Signal to this input to start the request. |
|
||||
|
||||
## Outputs
|
||||
|
||||
| Data | Description |
|
||||
| ------------------------------------------ | --------------------------------------------- |
|
||||
| <span className="ndl-data">Response</span> | The JSON formatted response from the request. |
|
||||
|
||||
| Signals | Description |
|
||||
| ------------------------------------------- | -------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Success</span> | Sends a signal when the request succeeded. |
|
||||
| <span className="ndl-signal">Failure</span> | Sends a signal when an error occurred, and logs an error message in the console. |
|
||||
40
library/prefabs/xano/components/xano-sign-up/README.md
Normal file
40
library/prefabs/xano/components/xano-sign-up/README.md
Normal file
@@ -0,0 +1,40 @@
|
||||
---
|
||||
title: Sign Up
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
# Sign Up
|
||||
|
||||
This component is used create a new user in Xano.
|
||||
|
||||
<div className="ndl-image-with-background xl">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
> Please note that [Xano Client](/library/prefabs/xano/components/setup-xanoclient/) needs to be set up in your app before you can properly use this component.
|
||||
|
||||
## On success
|
||||
|
||||
When a new user has successfully been registered the **Sign Up** component will create a Noodl Object with the id `currentUser`. This object contains all the user data retrieved from Xanos `/auth/me` endpoint.
|
||||
|
||||
A successful signup will also trigger a `Xano User Logged In` event. You can hook into to this event anywhere in your app using a [Receive Event](/nodes/events/receive-event/) node.
|
||||
|
||||
## Inputs
|
||||
|
||||
| Data | Description |
|
||||
| ------------------------------------------ | --------------------------------------------- |
|
||||
| <span className="ndl-data">Email</span> | The email of the user you want to sign up. |
|
||||
| <span className="ndl-data">Password</span> | The password of the user you want to sign up. |
|
||||
|
||||
| Signals | Description |
|
||||
| -------------------------------------- | ------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Do</span> | Send a Signal to this input to send the signup request. |
|
||||
|
||||
## Outputs
|
||||
|
||||
| Signals | Description |
|
||||
| ------------------------------------------- | -------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Success</span> | Sends a signal when the request succeeded. |
|
||||
| <span className="ndl-signal">Failure</span> | Sends a signal when an error occurred, and logs an error message in the console. |
|
||||
@@ -0,0 +1,49 @@
|
||||
---
|
||||
title: Update Current User
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
# Update Current User
|
||||
|
||||
This component is used to update information in the current logged in users `/auth/me` path in Xano.
|
||||
|
||||
<div className="ndl-image-with-background xl">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
> Please note that [Xano Client](/library/prefabs/xano/components/setup-xanoclient/) needs to be set up in your app before you can properly use this component.
|
||||
|
||||
## Setting up endpoint
|
||||
|
||||
Xano does not create this endpoint by default for the user table. You have to create it manually, with a POST verb:
|
||||
|
||||
<div className="ndl-image-with-background">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
## On success
|
||||
|
||||
When the data has successfully been updated the **Update Current User** component will also update the Noodl Object with the id `currentUser`.
|
||||
|
||||
A successful update will also trigger a `Xano currentUser Updated` event. You can hook into to this event anywhere in your app using a [Receive Event](/nodes/events/receive-event/) node.
|
||||
|
||||
## Inputs
|
||||
|
||||
| Data | Description |
|
||||
| -------------------------------------- | ---------------------------- |
|
||||
| <span className="ndl-data">Data</span> | The data you want to update. |
|
||||
|
||||
| Signals | Description |
|
||||
| -------------------------------------- | ----------------------------------------------- |
|
||||
| <span className="ndl-signal">Do</span> | Send a Signal to this input to update the data. |
|
||||
|
||||
## Outputs
|
||||
|
||||
| Signals | Description |
|
||||
| ------------------------------------------- | -------------------------------------------------------------------------------- |
|
||||
| <span className="ndl-signal">Success</span> | Sends a signal when the request succeeded. |
|
||||
| <span className="ndl-signal">Failure</span> | Sends a signal when an error occurred, and logs an error message in the console. |
|
||||
Reference in New Issue
Block a user