728 Adopter dashboard adoption applications #738
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,10 @@ | ||
| class ApplicationRecord < ActiveRecord::Base | ||
| primary_abstract_class | ||
|
|
||
| # This method is used to translate the enum values for i18n. | ||
| def human_enum_name(enum) | ||
| enum_i18n_key = enum.to_s | ||
| value = send(enum) | ||
| I18n.t("activerecord.attributes.#{model_name.i18n_key}.#{enum_i18n_key}.#{value}") | ||
| end | ||
| end |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,118 +1,117 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <%= render "layouts/shared/head" %> | ||
| <body> | ||
| <%= render "layouts/shared/flash_messages" %> | ||
| <%= render 'layouts/shared/navbar' %> | ||
|
|
||
| <!-- Page Content --> | ||
| <main> | ||
| <section class="pt-5 pb-5"> | ||
| <div class="container-lg"> | ||
| <div class="row align-items-center"> | ||
| <!-- User info --> | ||
| <div class="col-xl-12 col-lg-12 col-md-12 col-12"> | ||
| <!-- Bg --> | ||
| <div class="rounded-top" style="background: url('/assets/background/profile-bg.jpg') no-repeat; background-size: cover; height: 100px;"></div> | ||
| <div class="card px-4 pt-2 pb-4 shadow-sm rounded-top-0 rounded-bottom-0 rounded-bottom-md-2"> | ||
| <div class="d-flex align-items-end justify-content-between"> | ||
| <div class="d-flex align-items-center"> | ||
| <div class="me-2 position-relative d-flex justify-content-end align-items-end mt-n5"> | ||
| <%= render_avatar_partial(xl: true) %> | ||
| </div> | ||
| <div class="lh-1"> | ||
| <h2 class="mb-0"><%= "#{current_user.first_name} #{current_user.last_name}" %></h2> | ||
| </div> | ||
| </div> | ||
| <div> | ||
| <a href="add-course.html" class="btn btn-primary d-none d-md-block">Sample Button</a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Content --> | ||
|
|
||
| <div class="row mt-0 mt-md-4"> | ||
| <div class="col-lg-3 col-md-4 col-12"> | ||
| <!-- Side navbar --> | ||
| <nav class="navbar navbar-expand-md shadow-sm mb-4 mb-lg-0 sidenav"> | ||
| <!-- Menu --> | ||
| <a class="d-xl-none d-lg-none d-md-none text-inherit fw-bold" href="#">Menu</a> | ||
| <!-- Button --> | ||
| <button class="navbar-toggler d-md-none icon-shape icon-sm rounded bg-primary text-light" type="button" data-bs-toggle="collapse" data-bs-target="#sidenav" aria-controls="sidenav" aria-expanded="false" aria-label="Toggle navigation"> | ||
| <span class="fe fe-menu"></span> | ||
| </button> | ||
| <!-- Collapse navbar --> | ||
| <div class="collapse navbar-collapse" id="sidenav"> | ||
| <div class="navbar-nav flex-column"> | ||
| <span class="navbar-header">Dashboard</span> | ||
| <ul class="list-unstyled ms-n2 mb-4"> | ||
| <!-- Nav item --> | ||
| <li class="nav-item"> | ||
| <%= active_link_to adopter_fosterer_dashboard_index_path, class: "nav-link" do %> | ||
| <i class="fe fe-home nav-icon"></i> My Dashboard | ||
| <% end %> | ||
| </li> | ||
| <!-- Nav item --> | ||
| <li class="nav-item"> | ||
| <%= active_link_to adopter_fosterer_adopter_applications_path, class: "nav-link" do %> | ||
| <i class="fe fe-book nav-icon"></i> <%= t("dashboard.applications.header_title")%> | ||
|
Comment on lines
+60
to
+61
There was a problem hiding this comment. Sorry the diff is showing everything. This is the only real change for this file. |
||
| <% end %> | ||
| </li> | ||
| <!-- Nav item --> | ||
| <li class="nav-item"> | ||
| <%= active_link_to adopter_fosterer_dashboard_index_path, class: "nav-link" do %> | ||
| <i class="fe fe-star nav-icon"></i> My Pets | ||
| <% end %> | ||
| </li> | ||
| <!-- Nav item --> | ||
| <li class="nav-item"> | ||
| <%= active_link_to adopter_fosterer_dashboard_index_path, class: "nav-link" do %> | ||
| <i class="fe fe-dollar-sign nav-icon"></i> Donate | ||
| <% end %> | ||
| </li> | ||
| <!-- Nav item --> | ||
| <li class="nav-item"> | ||
| <%= active_link_to faq_index_path, class: "nav-link" do %> | ||
| <i class="fe fe-help-circle nav-icon"></i> FAQ | ||
| <% end %> | ||
| </li> | ||
| </ul> | ||
| <!-- Navbar header --> | ||
| <span class="navbar-header">Account Settings</span> | ||
| <ul class="list-unstyled ms-n2 mb-0"> | ||
| <!-- Nav item --> | ||
| <li class="nav-item"> | ||
| <%= active_link_to edit_user_registration_path, class: "nav-link" do %> | ||
| <i class="fe fe-settings nav-icon"></i> Edit Settings | ||
| <% end %> | ||
| </li> | ||
| <!-- Nav item --> | ||
| <li class="nav-item"> | ||
| <%= button_to destroy_user_session_path, method: :delete, data: { turbo: false }, class: 'nav-link' do %> | ||
| <i class="fe fe-power nav-icon"></i> Log Out | ||
| <% end %> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <%= active_link_to adopter_fosterer_dashboard_index_path, class: "nav-link" do %> | ||
| <i class="fe fe-trash nav-icon"></i> Delete Account | ||
| <% end %> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| </nav> | ||
| </div> | ||
| <div class="col-lg-9 col-md-8 col-12"> | ||
| <!-- Card --> | ||
| <%= yield %> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| </main> | ||
| </body> | ||
| </html> | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,34 @@ | ||
| <%= turbo_refreshes_with method: :morph, scroll: :preserve %> | ||
|
|
||
| <% pet = application.pet %> | ||
| <div class="card card-hover mx-1 my-4 col-sm-5" style='"overflow: hidden'> | ||
| <%= link_to image_tag(pet.images.attached? ? pet.images.first : 'coming_soon.jpg', class: 'card-img-top pet-card'), adoptable_pet_path(pet) %> | ||
| <ul class="list-group list-group-flush"> | ||
| <li class="list-group-item d-flex justify-content-between"> | ||
| <h5 class="card-title mb-0 fs-3"> | ||
| <%= link_to pet.name, adoptable_pet_path(pet) %> | ||
| </h5> | ||
| </li> | ||
| <% li_classes = %w[list-group-item text-secondary] %> | ||
| <li class="list-group-item d-flex flex-wrap justify-content-between text-secondary"> | ||
| <span class="fw-semibold"><%= t("dashboard.applications.created")%>:</span> | ||
| <%= l application.created_at.to_date, format: :long %> | ||
| </li> | ||
| <li class="list-group-item d-flex flex-wrap justify-content-between text-secondary"> | ||
| <div class="me-1 fw-semibold"><%= t("dashboard.applications.status")%>:</div> | ||
| <div> | ||
| <%= application.human_enum_name(:status) %> | ||
| </div> | ||
| </li> | ||
| <li class="list-group-item d-flex justify-content-center"> | ||
| <% unless application.status == 'withdrawn' || application.status == 'adoption_made'%> | ||
| <%= button_to t("dashboard.applications.withdraw_application"), | ||
| adopter_fosterer_adopter_application_path(application, adopter_application: | ||
| { status: 'withdrawn'}), method: :patch, class: 'btn | ||
| btn-outline-danger', data: { turbo_confirm: | ||
| t("dashboard.applications.confirm_withdraw") + " for " + | ||
| pet.name.capitalize + "?"} %> | ||
| <% end %> | ||
| </li> | ||
| </ul> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,51 @@ | ||
| <%= turbo_refreshes_with method: :morph, scroll: :preserve %> | ||
|
|
||
| <!-- table --> | ||
| <div class="card"> | ||
| <table class="table mb-0 text-nowrap table-hover table-centered"> | ||
| <thead> | ||
| <tr> | ||
| <th scope="col"><%= t("dashboard.applications.name")%></th> | ||
| <th scope="col"><%= t("dashboard.applications.created")%></th> | ||
| <th scope="col"><%= t("dashboard.applications.status")%></th> | ||
| <th scope="col"></th> | ||
| </tr> | ||
| </thead> | ||
| <tbody> | ||
| <% applications.each do |app| %> | ||
| <%= turbo_stream_from app %> | ||
| <% pet = app.pet %> | ||
| <tr> | ||
| <td> | ||
| <div class="d-flex align-items-center"> | ||
| <%= image_tag(pet.images.attached? ? pet.images.first : | ||
| 'coming_soon.jpg', class: 'rounded-3', style: "height: 50px; width: 50px; object-fit: cover;") %> | ||
| <div class="ms-3"> | ||
| <h4 class="mb-0"> | ||
| <%= link_to pet.name, adoptable_pet_path(pet) %> | ||
| </h4> | ||
| </div> | ||
| </div> | ||
| </td> | ||
| <td> | ||
| <%# localize date %> | ||
| <%= l app.created_at.to_date, format: :long %> | ||
| </td> | ||
| <td> | ||
| <%= app.human_enum_name(:status) %> | ||
| </td> | ||
| <td> | ||
| <% unless app.status == 'withdrawn' || app.status == 'adoption_made'%> | ||
| <%= button_to t("dashboard.applications.withdraw_application"), | ||
| adopter_fosterer_adopter_application_path(app, adopter_application: | ||
| { status: 'withdrawn'}), method: :patch, class: 'btn | ||
| btn-outline-danger', data: { turbo_confirm: | ||
| t("dashboard.applications.confirm_withdraw") + " for " + | ||
| pet.name.capitalize + "?"} %> | ||
| <% end %> | ||
| </td> | ||
| </tr> | ||
| <% end %> | ||
| </tbody> | ||
| </table> | ||
| </div> |
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I really need to brush up on Turbo :) I have no idea how this works.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is part of the new Turbo 8. When the adopter application is changed a message is sent over action cable.
This is a quick read on it
It makes it really easy to update without having to do a bunch of turbo_streams and targeting specific id's. You can see in the first half of the video the status and button is update after withdrawing. The second half is just a bonus. I didn't really need to do any extra work but if the staff were to change the status of the app while the adopter was looking at it, the status will be updated without the adopter having to refresh.
Screencast from 05-24-2024 03:16:29 PM.webm
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ah that is so handy.