Merge pull request #7976 from fjordllc/feature/rewrite-recent-reports…

…-from-vue-or-react-to-html 「直近の日報」を非Vue/React化
fjordllc · Aug 21, 2024 · 507edb8 · 507edb8
2 parents 0b91ea1 + 1aadae6
commit 507edb8
Show file tree

Hide file tree

Showing 11 changed files with 30 additions and 89 deletions.
diff --git a/app/controllers/products_controller.rb b/app/controllers/products_controller.rb
@@ -16,6 +16,7 @@ def show
     @practice = find_practice
     @learning = @product.learning # decoratorメソッド用にcontrollerでインスタンス変数化
     @tweet_url = @practice.tweet_url(practice_completion_url(@practice.id))
+    @recent_reports = Report.list.where(user_id: @product.user.id).limit(10)
     respond_to do |format|
       format.html
       format.md

diff --git a/app/controllers/reports_controller.rb b/app/controllers/reports_controller.rb
@@ -20,6 +20,7 @@ def index
 
   def show
     @products = @report.user.products.not_wip.order(published_at: :desc)
+    @recent_reports = Report.list.where(user_id: @report.user.id).limit(10)
     respond_to do |format|
       format.html
       format.md

diff --git a/app/javascript/components/user-recent-reports.vue b/app/javascript/components/user-recent-reports.vue
diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
@@ -64,7 +64,6 @@ import UsersAnswers from '../components/users-answers.vue'
 import User from '../components/user.vue'
 import Watches from '../components/watches.vue'
 import WatchToggle from '../components/watch-toggle.vue'
-import UserRecentReports from '../components/user-recent-reports.vue'
 import Footprints from '../components/footprints.vue'
 import QuestionAnswers from '../components/question-answers.vue'
 import SadReports from '../components/sad_reports.vue'
@@ -81,7 +80,6 @@ mounter.addComponent(UsersAnswers)
 mounter.addComponent(User)
 mounter.addComponent(Watches)
 mounter.addComponent(WatchToggle)
-mounter.addComponent(UserRecentReports)
 mounter.addComponent(Footprints)
 mounter.addComponent(QuestionAnswers)
 mounter.addComponent(SadReports)

diff --git a/app/views/products/_report.html.slim b/app/views/products/_report.html.slim
diff --git a/app/views/products/show.html.slim b/app/views/products/show.html.slim
@@ -78,7 +78,7 @@ header.page-header
                     | 提出物
             .side-tabs-contents
               .side-tabs-contents__item#side-tabs-content-1
-                div(data-vue="UserRecentReports" data-vue-user-id:number="#{@product.user.id}")
+                = render partial: 'reports/recent_reports', locals: { header_display: true }
               .side-tabs-contents__item#side-tabs-content-2
                 = render 'practice_memo', practice_id: @product.practice_id
               .side-tabs-contents__item#side-tabs-content-3

diff --git a/app/views/reports/_recent_reports.html.slim b/app/views/reports/_recent_reports.html.slim
@@ -0,0 +1,18 @@
+.page-content.reports
+  .card-list.a-card
+    - if header_display
+      .card-header.is-sm
+        h2.card-header__title
+          | 直近の日報
+      hr.a-border
+    - if @recent_reports.any?
+      .card-list__items
+        = render partial: 'reports/report', collection: @recent_reports, locals: { user_icon_display: false, actions_display: false }
+    - else
+      .card-body
+        .card__description
+          .o-empty-message
+            .o-empty-message__icon
+              i.fa-regular.fa-sad-tear
+            .o-empty-message__text
+              | 日報はまだありません。
diff --git a/app/views/reports/_report.html.slim b/app/views/reports/_report.html.slim
@@ -1,7 +1,8 @@
 .card-list-item(class="#{report.wip? ? 'is-wip' : ''}")
   .card-list-item__inner
-    .card-list-item__user
-      = render 'users/icon', user: report.user, link_class: 'card-list-item__user-link', image_class: 'card-list-item__user-icon'
+    - if user_icon_display
+      .card-list-item__user
+        = render 'users/icon', user: report.user, link_class: 'card-list-item__user-link', image_class: 'card-list-item__user-icon'
     .card-list-item__rows
       .card-list-item__row
         .card-list-item-title
@@ -14,7 +15,7 @@
               = link_to report, itemprop: 'url', class: 'card-list-item-title__link a-text-link js-unconfirmed-link' do
                 = image_tag("emotion/#{report.emotion}.svg", alt: report.emotion, class: 'card-list-item-title__emotion-image')
                 = report.title
-          - if current_user == report.user
+          - if current_user == report.user && actions_display
             .card-list-item-title__end
               label.card-list-item-actions__trigger(for="#{report.id}")
                 i.fa-solid.fa-ellipsis-h

diff --git a/app/views/reports/index.html.slim b/app/views/reports/index.html.slim
@@ -37,5 +37,5 @@ header.page-header
           = paginate @reports
           .card-list.a-card
             .card-list__items
-              = render partial: 'reports/report', collection: @reports, as: :report
+              = render partial: 'reports/report', collection: @reports, as: :report, locals: { user_icon_display: true, actions_display: true }
           = paginate @reports
diff --git a/app/views/reports/show.html.slim b/app/views/reports/show.html.slim
@@ -20,7 +20,7 @@
 
 .page-body
   .container.is-xxl
-    .row.justify-center
+    .row.justify-center.is-gutter-width-32
       .col-xl-7.col-xs-12
         .report.page-content
           = render 'report_header', report: @report
@@ -64,7 +64,7 @@
                     | 提出物
             .side-tabs-contents
               .side-tabs-contents__item#side-tabs-content-1
-                = react_component('Reports', userId: @report.user.id, displayUserIcon: false, displayPagination: false)
+                = render partial: 'reports/recent_reports', locals: { header_display: false }
               .side-tabs-contents__item#side-tabs-content-2.is-only-mentor
                 .user-info
                   = render 'users/user_secret_attributes', user: @report.user
@@ -84,7 +84,7 @@
                           .o-empty-message__text
                             | 提出物はまだありません。
         - else
-          = react_component('Reports', userId: @report.user.id, displayUserIcon: false, displayPagination: false)
+          = render partial: 'reports/recent_reports', locals: { header_display: true }
 
 - if flash[:notify_help] && flash[:celebrate_report_count]
     = render '/shared/modal', id: 'modal-notify-help', modal_title: '🎉 おめでとう！', auto_show: true

diff --git a/app/views/reports/unchecked/index.html.slim b/app/views/reports/unchecked/index.html.slim
@@ -25,7 +25,7 @@ header.page-header
           = paginate @reports
           .card-list.a-card
             .card-list__items
-              = render partial: 'reports/report', collection: @reports, as: :report
+              = render partial: 'reports/report', collection: @reports, as: :report, locals: { user_icon_display: true, actions_display: true }
             - if mentor_login?
               = render partial: 'unconfirmed_links_open', locals: { label: '未チェックの日報を一括で開く' }
           = paginate @reports