This is the legacy app for Sablier V1. If you're looking for the Sablier V2 Safe App, just search for "Sablier" in the Safe Apps Explorer.
This app brings real-time finance to Safe users by allowing them to use the Sablier V1 token streaming protocol. You can read more about Safe Apps here.
Sablier opens up the opportunity for organizations to pay and interact with each other in new ways without having to give custody of funds to a single member:
- Vesting; stream governance tokens to early investors.
- Continuous payroll or freelancing.
- Subscriptions, paying for a product or a service in real-time.
Using this Safe App, you can:
- Create new streams.
- View details on your incoming and outgoing streams.
- Cancel streams as a sender.
- Withdraw from streams as a recipient.
There are multiple ways to access the Safe App:
- Directly on Safe: https://app.safe.global/
- Vercel deployment: https://sablier-safe-app.vercel.app/
The Vercel deployment will automatically update to the newest version of the Sablier V1 Safe app, however for additional security you may want to use the production-ready version on the Safe UI.
If you don't have a Safe multisig but would like to use Sablier V1, you can use the original interfaces:
- v1-pay.sablier.com for creating and canceling streams.
- v1-app.sablier.com for withdrawing from streams.
We highly encourage participation from the community to help shape the development of Sablier. If you are interested in contributing or have any questions, ping us on Discord.
To start developing on the Sablier V1 Safe App, first clone this repository and enter the new directory.
git clone https://github.com/sablier-labs/v1-safe-app.git
cd sablier-safe-app
You will need to create a .env
file. We have provided .env.example
as a template.
cp .env.example .env
Now, install the node dependencies and start the dev server:
yarn install
yarn start
The app will be hosted on http://localhost:3000
.
In order to allow the Safe UI to access the app while it's running on localhost, we need to edit the headers on the dev
server (node_modules/react-scripts/config/webpackDevServer.config.js
) to avoid CORS issues:
headers: {
"Access-Control-Allow-Origin": "\*",
"Access-Control-Allow-Methods": "GET",
"Access-Control-Allow-Headers": "X-Requested-With, content-type, Authorization"
}
We automate injecting these headers in to the server config through react-app-rewired.