chk
/
AppFlowy-Cloud
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: show user list on frontend

This commit is contained in:
Fu Zi Xiang 2023-10-10 16:57:02 +08:00
parent 0ef6095481
commit c91ea9234a
No known key found for this signature in database
7 changed files with 46 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
admin_frontend/README.md
View File

@ -1,4 +1,5 @@
# Admin Frontend # Admin Frontend
- Start the whole stack: `docker compose up -d` - Start the whole stack: `docker compose up -d`
- Go to [web server](localhost) - Go to [web server](localhost)
- Quick rebuild only frontend after editing `docker compose up -d --no-deps --build admin_frontend` - Quick rebuild only frontend after editing `docker compose up -d --no-deps --build admin_frontend`

1
admin_frontend/dev/README.md
View File

@ -1,4 +1,5 @@
# Development # Development
- Run the dev docker compose in the previous directory: `docker compose --file docker-compose-dev.yml up -d` - Run the dev docker compose in the previous directory: `docker compose --file docker-compose-dev.yml up -d`
- cp `dev.env` to `.env` - cp `dev.env` to `.env`
- run the frontend: `cargo watch -x run -w .` - run the frontend: `cargo watch -x run -w .`

4
admin_frontend/src/access_token.rs
View File

@ -23,9 +23,9 @@ where
let token = jar let token = jar
.get("access_token") .get("access_token")
.ok_or(AccessTokenRejection::NoAccessToken)? .ok_or(AccessTokenRejection::NoAccessToken)?
.to_string(); .value();
Ok(WebAccessToken(token)) Ok(WebAccessToken(token.to_string()))
} }
} }

6
admin_frontend/src/templates.rs
View File

@ -11,3 +11,9 @@ pub struct Home;
#[derive(Template)] #[derive(Template)]
#[template(path = "admin.html")] #[template(path = "admin.html")]
pub struct Admin; pub struct Admin;
#[derive(Template)]
#[template(path = "users.html")]
pub struct Users<'a> {
pub users: &'a [gotrue_entity::User],
}

16
admin_frontend/src/web_app.rs
View File

@ -30,8 +30,20 @@ pub async fn admin_users_handler(
State(state): State<AppState>, State(state): State<AppState>,
access_token: WebAccessToken, access_token: WebAccessToken,
) -> Result<Html<String>, RenderError> { ) -> Result<Html<String>, RenderError> {
let users = state.gotrue_client.admin_list_user(&access_token.0).await; let users = state
todo!() .gotrue_client
.admin_list_user(&access_token.0)
.await
.map_or_else(
|err| {
// Log the error and return an empty vector.
println!("Failed to fetch users: {:?}", err);
vec![]
},
|r| r.users,
);
let s = templates::Users { users: &users }.render()?;
Ok(Html(s))
} }
pub async fn login_handler() -> Result<Html<String>, RenderError> { pub async fn login_handler() -> Result<Html<String>, RenderError> {

3
admin_frontend/templates/home.html
View File

@ -9,7 +9,8 @@
.getElementById("logoutBtn") .getElementById("logoutBtn")
.addEventListener("click", function () { .addEventListener("click", function () {
// Remove the cookie by setting its value to an empty string and its expiry date to the past. // Remove the cookie by setting its value to an empty string and its expiry date to the past.
document.cookie = "access_token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; document.cookie =
"access_token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
// Redirect to the login page. // Redirect to the login page.
window.location.href = "/web/login"; window.location.href = "/web/login";

51
admin_frontend/templates/users.html
View File

@ -1,36 +1,25 @@
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<body> <body>
<h1>User List</h1>
<ul id="userList"></ul>
<h1>User List</h1> <table>
<ul id="userList"></ul> <tr>
<th>Id</th>
<th>Email</th>
<th>Created At</th>
</tr>
<script> {% for user in users %}
document.addEventListener("DOMContentLoaded", function () { <tr>
// Fetch the user list from the API <td>{{ user.id|escape }}</td>
fetch('/web-api/users') <td>{{ user.email|escape }}</td>
.then(response => { <td>{{ user.created_at|escape }}</td>
// Check if HTTP status code indicates success </tr>
if (!response.ok) { {% endfor %}
return Promise.reject('Failed to fetch users'); </table>
}
return response.json(); // Parse the JSON response
})
.then(data => {
// Display the users on the page
const userList = document.getElementById('userList');
data.forEach(user => {
const li = document.createElement('li');
li.textContent = `${user.name} (${user.email})`;
userList.appendChild(li);
});
})
.catch(error => {
console.error('Error:', error);
alert('Failed to fetch users');
});
});
</script>
</body> <script></script>
</body>
</html> </html>