Spaces:
Runtime error
Runtime error
Create app.py
Browse files
app.py
ADDED
@@ -0,0 +1,157 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
import streamlit as st
|
2 |
+
from streamlit_supabase_auth_ui.widgets import __login__
|
3 |
+
|
4 |
+
__login__obj = __login__(auth_token = st.secrets["courier_auth_token"],
|
5 |
+
company_name = "Streamlit Supabase Auth UI Demo",
|
6 |
+
width = 200, height = 250,
|
7 |
+
logout_button_name = 'Logout', hide_menu_bool = False,
|
8 |
+
hide_footer_bool = False,
|
9 |
+
lottie_url = 'https://assets2.lottiefiles.com/packages/lf20_jcikwtux.json')
|
10 |
+
|
11 |
+
LOGGED_IN= __login__obj.build_login_ui()
|
12 |
+
|
13 |
+
if LOGGED_IN == True:
|
14 |
+
|
15 |
+
st.markdown("""#streamlit_supabase_auth_ui
|
16 |
+
|
17 |
+
## Seamless Supabase authentication for seamless Streamlit apps
|
18 |
+
|
19 |
+
### Purpose and Inspiration
|
20 |
+
|
21 |
+
[**Streamlit**](https://streamlit.io/) is a popular backend-to-frontend app development framework for python, and over the years several solutions have been developed to tackle user authentication and management for Streamlit apps.
|
22 |
+
|
23 |
+
The most popular of them, [streamlit-authenticator](https://github.com/mkhorasani/Streamlit-Authenticator)and [streamlit_login_auth_ui](https://github.com/GauriSP10/streamlit_login_auth_ui), although offering several advanced functionalities and dynamic UIs, lack a reliable backend, database-centered user management (which is generally performed through local files).
|
24 |
+
|
25 |
+
We decided to build a new authentication UI, based on [Gauri Prabhakar](https://github.com/GauriSP10)'s login interface, that combines the power of [**Supabase**](https://supabase.co)PostgreSQL databases with the seamless frontend components from **Streamlit**, connecting it also to the e-mail notifications service offered by [**Courier**](https://www.courier.com/) .
|
26 |
+
|
27 |
+
The UI has login, user registration, password reset and 'forgot password' functionalities, as well as a logout one.
|
28 |
+
|
29 |
+
So, let's get started!🚀
|
30 |
+
|
31 |
+
### Third party services
|
32 |
+
|
33 |
+
#### 1. Supabase
|
34 |
+
|
35 |
+
We will need a Supabase account to build a project, retrieve its URL and ANON key and create a `user_authentication` database, that will connect our UI to the backend, database-centered user-management.
|
36 |
+
|
37 |
+
In order to do that, we:
|
38 |
+
|
39 |
+
1. Create a [Supabase account](https://supabase.com/dashboard/sign-up)
|
40 |
+
2. Go to [our dashboard](https://supabase.com/dashboard/projects)
|
41 |
+
3. Create a new project
|
42 |
+
4. Go to `Project Settings > API` and copy `URL` under `Project URL` and `anon public` key under `Project API Keys`
|
43 |
+
5. Copy the URL to `supa_url` and the ANON key to `supa_key` in [`.streamlit/secrets.toml`](./.streamlit/secrets.toml)
|
44 |
+
6. Open SQL editor on Supabase and execute the following command:
|
45 |
+
```sql
|
46 |
+
CREATE TABLE user_authentication (
|
47 |
+
id BIGINT GENERATED ALWAYS AS IDENTITY PRIMARY KEY,
|
48 |
+
username VARCHAR(255) DEFAULT NULL,
|
49 |
+
password VARCHAR(255) DEFAULT NULL,
|
50 |
+
email VARCHAR(255) DEFAULT NULL,
|
51 |
+
name VARCHAR(255) DEFAULT NULL,
|
52 |
+
created_at TIMESTAMP DEFAULT NOW()
|
53 |
+
);
|
54 |
+
```
|
55 |
+
|
56 |
+
#### 2. Courier
|
57 |
+
|
58 |
+
We want to send email notifications basically for two reasons:
|
59 |
+
|
60 |
+
- Welcome our new users upon registration
|
61 |
+
- Send them reset passwords when they want to change their old/lost password
|
62 |
+
|
63 |
+
To do so, we use the already mentioned Courier, and so we need to:
|
64 |
+
|
65 |
+
1. [Sign up](https://app.courier.com/signup) to Courier
|
66 |
+
2. Create a new workspace
|
67 |
+
3. Enable an e-mail service provider. The easiest and cheapest choice is **Gmail**: you only need to specify the Gmail account for which you want to activate the service, which will also be one that will send all the emails.
|
68 |
+
4. Retrieve the **authorization token** from `Settings > API Keys`
|
69 |
+
5. Copy the authorization token and place it under `courier_auth_token` in [.streamlit/secrets.toml](./.streamlit/secrets.toml)
|
70 |
+
|
71 |
+
### Create your application
|
72 |
+
|
73 |
+
#### 1. Build from source
|
74 |
+
|
75 |
+
We now want to create our Streamlit application with Supabase authentication and user management, and, in order to do so, we:
|
76 |
+
|
77 |
+
1. Clone this repository and go inside it:
|
78 |
+
```bash
|
79 |
+
git clone https://github.com/AstraBert/streamlit_supabase_auth_ui.git
|
80 |
+
cd streamlit_supabase_auth_ui
|
81 |
+
```
|
82 |
+
2. Create a python virtual environment and activate it:
|
83 |
+
```bash
|
84 |
+
python3 -m venv streamlit-app
|
85 |
+
source streamlit-app/bin/activate
|
86 |
+
```
|
87 |
+
3. Install all the required dependencies:
|
88 |
+
```bash
|
89 |
+
python3 -m pip install -r requirements.txt
|
90 |
+
```
|
91 |
+
4. Modify [`.streamlit/secrets.toml`](./.streamlit/secrets.toml) with the Supabase project URL (`supa_url`), Supabase project ANON key (`supa_key`) and Courier authentication token (`courier_auth_token`) we retrieved beforehand
|
92 |
+
6. Run the application:
|
93 |
+
```bash
|
94 |
+
python3 -m streamlit run app.py
|
95 |
+
```
|
96 |
+
|
97 |
+
You can obviously customize the Streamlit application as much as you want, you will only need to integrate this peace of code to make the Supabase-based auth to work:
|
98 |
+
|
99 |
+
```python
|
100 |
+
import streamlit as st
|
101 |
+
from .streamlit_supabase_auth_ui.widgets import __login__
|
102 |
+
|
103 |
+
__login__obj = __login__(auth_token = st.secrets["courier_auth_token"],
|
104 |
+
company_name = "YOUR-ORG-NAME",
|
105 |
+
width = 200, height = 250,
|
106 |
+
logout_button_name = 'Logout', hide_menu_bool = False,
|
107 |
+
hide_footer_bool = False,
|
108 |
+
lottie_url = 'https://assets2.lottiefiles.com/packages/lf20_jcikwtux.json')
|
109 |
+
|
110 |
+
LOGGED_IN= __login__obj.build_login_ui()
|
111 |
+
|
112 |
+
if LOGGED_IN == True:
|
113 |
+
|
114 |
+
### Your Streamlit app here!
|
115 |
+
```
|
116 |
+
|
117 |
+
#### 2. Get PyPi package
|
118 |
+
|
119 |
+
We made `streamlit-supabase-auth-ui` also a python package available on PyPi, that you can find [here](https://pypi.org/project/streamlit-supabase-auth-ui/).
|
120 |
+
|
121 |
+
To get it, it is sufficient to run:
|
122 |
+
|
123 |
+
```bash
|
124 |
+
python3 -m pip install streamlit-supabase-auth-ui
|
125 |
+
```
|
126 |
+
|
127 |
+
And the installation process will take care of mounting all the necessary dependencies✅
|
128 |
+
|
129 |
+
You can then simply import the package in your code:
|
130 |
+
|
131 |
+
```python
|
132 |
+
import streamlit as st
|
133 |
+
from streamlit_supabase_auth_ui.widgets import __login__
|
134 |
+
|
135 |
+
__login__obj = __login__(auth_token = st.secrets["courier_auth_token"],
|
136 |
+
company_name = "YOUR-ORG-NAME",
|
137 |
+
width = 200, height = 250,
|
138 |
+
logout_button_name = 'Logout', hide_menu_bool = False,
|
139 |
+
hide_footer_bool = False,
|
140 |
+
lottie_url = 'https://assets2.lottiefiles.com/packages/lf20_jcikwtux.json')
|
141 |
+
```
|
142 |
+
|
143 |
+
### Contributions
|
144 |
+
|
145 |
+
Contributions are more than welcome! See [contribution guidelines](./CONTRIBUTING.md) for more information :)
|
146 |
+
|
147 |
+
### Funding
|
148 |
+
|
149 |
+
If you found this project useful, please consider to [fund it](https://github.com/sponsors/AstraBert) and make it grow: let's support open-source together!😊
|
150 |
+
|
151 |
+
### License and rights of usage
|
152 |
+
|
153 |
+
This project is provided under [MIT license](./LICENSE): it will always be open-source and free to use.
|
154 |
+
|
155 |
+
If you use this project, please cite the author: [Astra Clelia Bertelli](https://astrabert.vercel.app)
|
156 |
+
""")
|
157 |
+
|