Skip to content

Commit

Permalink
split app and panel templates into separate file, add message on form…
Browse files Browse the repository at this point in the history 
… submissions
  • Loading branch information
@Joeyh021
Joeyh021 committed Jul 5, 2023
1 parent 04f4d55 commit a307aa9
Show file tree
Hide file tree
Showing 4 changed files with 145 additions and 193 deletions.
47 changes: 29 additions & 18 deletions src/routes/app.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,17 +20,27 @@ pub async fn home() -> impl IntoResponse {

#[derive(Template)]
#[template(path = "app.html")]
struct PanelTemplate {
struct AppTemplate {
username: String,
message: Option<String>,
}

async fn panel(session: ReadableSession, _: State<AppState>) -> Result<impl IntoResponse> {
async fn app(session: ReadableSession, _: State<AppState>) -> Result<impl IntoResponse> {
if session.get::<String>("username").is_none() {
return Err(Redirect::to("/auth/login").into());
}

let username = session.get::<String>("username").unwrap();
Ok(PanelTemplate { username })
Ok(AppTemplate {
username,
message: None,
})
}

#[derive(Template)]
#[template(path = "panel.html")]
struct PanelTemplate {
message: Option<String>,
}

#[derive(Template)]
Expand Down Expand Up @@ -68,25 +78,26 @@ async fn handle_form(
)
.into())
};
//return entire panel, including message and cleared form for htmx to swap in

db::add_new(&f.source, &f.sink, &username, &s.pool)
.await
.context("Could not add new redirect to database")
.map_err(handle_error)
.map_err(|_| {
(
StatusCode::INTERNAL_SERVER_ERROR,
"An error occursed while adding your go link to the database.",
)
})?;

//return updated table for htmx to swap in
//TODO: only return new row, more
Ok(Redirect::to("/app/panel/table"))
Ok(PanelTemplate {
message: Some(
match db::add_new(&f.source, &f.sink, &username, &s.pool).await {
Ok(_) => format!("✅ Added go link \"{}\" link to database", f.source),
Err(sqlx::Error::Database(e)) if e.code() == Some("23505".into()) => {
format!("❌ Go link with source \"{}\" already exists", f.source)
}
Err(e) => {
tracing::error!("Failed to handle form submission: {e:?}");
format!("❌ Failed to add go link to database: {e:?}")
}
},
),
})
}

pub fn app_routes() -> Router<AppState> {
Router::new()
.route("/panel", get(panel).post(handle_form))
.route("/panel", get(app).post(handle_form))
.route("/panel/table", get(table))
}
81 changes: 9 additions & 72 deletions static/output.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -712,10 +712,6 @@ select {
margin: 0.25rem;
}

.m-2 {
margin: 0.5rem;
}

.-mx-4 {
margin-left: -1rem;
margin-right: -1rem;
Expand Down Expand Up @@ -747,18 +743,14 @@ select {
margin-top: 1rem;
}

.mt-auto {
margin-top: auto;
}

.mt-6 {
margin-top: 1.5rem;
}

.mt-5 {
margin-top: 1.25rem;
}

.mt-auto {
margin-top: auto;
}

.block {
display: block;
}
Expand All @@ -779,34 +771,14 @@ select {
display: table;
}

.h-16 {
height: 4rem;
}

.h-8 {
height: 2rem;
}

.max-h-\[40px\] {
max-height: 40px;
}

.max-h-\[60vh\] {
max-height: 60vh;
}

.max-h-\[65vh\] {
max-height: 65vh;
}

.w-16 {
width: 4rem;
}

.w-64 {
width: 16rem;
}

.w-7 {
width: 1.75rem;
}
Expand All @@ -831,20 +803,10 @@ select {
align-items: center;
}

.items-baseline {
align-items: baseline;
}

.justify-between {
justify-content: space-between;
}

.space-y-2 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}

.space-x-2 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0;
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
Expand Down Expand Up @@ -911,11 +873,6 @@ select {
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}

.bg-indigo-600 {
--tw-bg-opacity: 1;
background-color: rgb(79 70 229 / var(--tw-bg-opacity));
}

.bg-white {
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
Expand Down Expand Up @@ -1026,6 +983,11 @@ select {
line-height: 1;
}

.text-lg {
font-size: 1.125rem;
line-height: 1.75rem;
}

.text-sm {
font-size: 0.875rem;
line-height: 1.25rem;
Expand All @@ -1036,11 +998,6 @@ select {
line-height: 1.75rem;
}

.text-lg {
font-size: 1.125rem;
line-height: 1.75rem;
}

.font-bold {
font-weight: 700;
}
Expand Down Expand Up @@ -1110,11 +1067,6 @@ select {
background-color: rgb(29 78 216 / var(--tw-bg-opacity));
}

.hover\:bg-indigo-700:hover {
--tw-bg-opacity: 1;
background-color: rgb(67 56 202 / var(--tw-bg-opacity));
}

.hover\:opacity-80:hover {
opacity: 0.8;
}
Expand All @@ -1124,26 +1076,11 @@ select {
border-color: rgb(99 102 241 / var(--tw-border-opacity));
}

.focus\:outline-none:focus {
outline: 2px solid transparent;
outline-offset: 2px;
}

.focus\:ring-2:focus {
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.focus\:ring-indigo-500:focus {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity));
}

.focus\:ring-offset-2:focus {
--tw-ring-offset-width: 2px;
}

.group:hover .group-hover\:opacity-60 {
opacity: 0.6;
}
Expand Down
105 changes: 2 additions & 103 deletions templates/app.html
View file
Original file line number Diff line number Diff line change
@@ -1,105 +1,4 @@
{% extends "base.html" %} {% block content %}
<div class="text-gray-700">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<form
hx-post=""
hx-target="#link-table"
hx-swap="outerHTML"
class="form flex space-x-2 flex-wrap mt-2 items-center"
>
<h2 class="block font-bold py-2 px-4 mt-5 text-lg">Add new go link</h2>
<div class="form-sink">
<label class="inline-flex text-sm text-gray-700" for="source"
>Source:</label
>
<input
class="block rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500"
type="text"
name="source"
id="source"
required
/>
</div>
<div class="form-source">
<label class="inline-flex text-sm text-gray-700" for="sink"
>Sink:</label
>
<input
class="block rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500"
type="url"
name="sink"
id="sink"
required
/>
</div>
<div class="form-submit">
<label class="inline-flex text-sm" for="submit"></label>
<button
class="block border border-transparent text-white bg-blue-500 hover:bg-blue-700 font-bold py-2 px-4 rounded"
type="submit"
value="Submit"
>
Submit
</button>
</div>
</form>
</div>

<div class="mx-auto max-w-7xl sm:px-6 lg:px-8 py-8 mt-4 flex flex-col">
<div class="-my-2 -mx-4 overflow-auto max-h-[65vh] sm:-mx-6 lg:-mx-8">
<div class="inline-block min-w-full py-2 align-middle md:px-6 lg:px-8">
<div
class="overflow-full shadow ring-1 ring-black ring-opacity-5 md:rounded-lg"
>
<table class="min-w-full divide-y divide-gray-300" id="redirects">
<thead class="bg-gray-100 sticky top-0">
<tr>
<th
scope="col"
class="py-3.5 pl-4 pr-3 text-left text-sm text-gray-900 sm:pl-6"
>Source</th
>
<th
scope="col"
class="px-3 py-3.5 text-left text-sm text-gray-900"
>Usages</th
>
<th
scope="col"
class="px-3 py-3.5 text-left text-sm text-gray-900"
>Created</th
>
<th
scope="col"
class="px-3 py-3.5 text-left text-sm text-gray-900"
>Author</th
>
<th
scope="col"
class="px-3 py-3.5 text-left text-sm text-gray-900"
>Last Used</th
>
<th
scope="col"
class="px-3 py-3.5 text-left text-sm text-gray-900"
>Sink</th
>
</tr>
</thead>
<tbody
class="divide-y divide-gray-200 bg-white"
hx-get="panel/table"
hx-trigger="load"
hx-swap="outerHTML"
>
<tr> <td> Links loading...</td> </tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
{% endblock %} {% block top_right %}
{% extends "base.html" %} {% block content %}{% include "panel.html" %} {%
endblock %} {% block top_right %}
<p class="text-gray-200"> Welcome, {{ username }}</p>
{% endblock %}
Loading

0 comments on commit a307aa9

Please sign in to comment.