「今日の気分」のアイコンを日報の一覧に表示した

app/assets/stylesheets/shared/blocks/card-list/_card-list-item-title.sass

@@ -35,6 +35,11 @@
     font-size: .8125rem
     font-weight: 400
 
+.card-list-item-title__emotion-image
+  +size(1.125em)
+  margin-right: .375rem
+  transform: translate(0, -.0625em)
+
 .card-list-item-title__link
   word-break: break-all
   +line-clamp(2)

app/javascript/report.vue

@@ -19,7 +19,12 @@
             h2.card-list-item-title__title
               a.card-list-item-title__link.a-text-link.js-unconfirmed-link(
                 :href='report.url'
-              ) {{ report.title }}
+              )
+                img.card-list-item-title__emotion-image(
+                  :src='emotionImg',
+                  :alt='report.emotion'
+                )
+                | {{ report.title }}
             .card-list-item-title__end(v-if='currentUserId == report.user.id')
               label.card-list-item-actions__trigger(:for='report.id')
                 i.fa-solid.fa-ellipsis-h
@@ -92,6 +97,9 @@ export default {
     },
     wipClass() {
       return { 'is-wip': this.report.wip }
+    },
+    emotionImg() {
+      return `/images/emotion/${this.report.emotion}.svg`
     }
   }
 }

app/views/api/reports/_report.json.jbuilder

@@ -5,3 +5,4 @@ json.url report_url(report)
 json.editURL edit_report_path(report)
 json.newURL new_report_path(id: report)
 json.wip report.wip?
+json.emotion report.emotion

app/views/reports/_report.html.slim

@@ -12,6 +12,7 @@
                   | WIP
             h2.card-list-item-title__title(itemprop='name')
               = 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
             .card-list-item-title__end

test/fixtures/reports.yml

@@ -31,41 +31,47 @@ report3:
 report4:
   user: machida
   title: "Fjord Bootcamp で Bootstrap のバージョン更新"
+  emotion: 2
   description: |-
     Fjord Bootcamp で Bootstrap のバージョン更新を行った他、デザインの微調整を行いました。
   reported_on: "2017-01-01"
 
 report5:
   user: sotugyou
   title: "学習週1日目"
+  emotion: 2
   description: |-
     今日は　Rubyの基礎 を学習しました。
   reported_on: "2017-01-01"
 
 report6:
   user: sotugyou
   title: "学習週2日目"
+  emotion: 2
   description: |-
     今日は　Railsの基礎 を学習しました。
   reported_on: "2017-01-02"
 
 report7:
   user: sotugyou
   title: "学習週3日目"
+  emotion: 2
   description: |-
     今日は　RSpecの基礎 を学習しました。
   reported_on: "2017-01-03"
 
 report8:
   user: mentormentaro
   title: テストの日報
+  emotion: 2
   description: |-
     いろいろやりました。
   reported_on: "2017-01-01"
 
 report9:
   user: sotugyou
   title: WIPの日報
+  emotion: 2
   description: |-
     WIP
   reported_on: "2019-01-01"
@@ -84,19 +90,22 @@ report10:
 report11:
   user: kensyu
   title: 研修の日報
+  emotion: 2
   description:
     研修を行いました。
   reported_on: "2019-01-01"
 
 sotugyou:
   user: sotugyou
   title: テストの日報
+  emotion: 2
   description: いろいろやりました
   reported_on: "2018-02-01"
 
 report12:
   user: mentormentaro
   title: 検索結果確認用-C
+  emotion: 2
   description:
     今年で150歳でーす
   reported_on: "2020-01-01"
@@ -106,6 +115,7 @@ report12:
 report13:
   user: mentormentaro
   title: 検索結果確認用-A
+  emotion: 2
   description:
     きたるべき20世紀
   reported_on: "1900-01-01"
@@ -115,6 +125,7 @@ report13:
 report14:
   user: mentormentaro
   title: 検索結果確認用-B
+  emotion: 2
   description:
     あれから100年か
   reported_on: "2000-01-01"
@@ -140,6 +151,7 @@ report16:
 report17:
   user: mentormentaro
   title: 1時間だけ学習
+  emotion: 2
   description: |-
     mentormentaroです、メンターです。
     今日は1時間学習しました。
@@ -150,6 +162,7 @@ report17:
 report18:
   user: kensyu
   title: テストのnippou
+  emotion: 2
   description: |-
     今日は1時間学習しました。
   reported_on: "2022-04-01"
@@ -174,6 +187,7 @@ report20:
 report21:
   user: sotugyou
   title: "学習週4日目"
+  emotion: 2
   description: |-
     今日は　Vueの基礎 を学習しました。
   practices: practice1
@@ -192,20 +206,23 @@ report22:
 report23:
   user: kensyu
   title: フォローされた日報
+  emotion: 2
   description:
     フォローされました。
   reported_on: "2022-03-31"
 
 report24:
   user: kimura
   title: 検索用の日報
+  emotion: 2
   description:
     ユーザーネームで検索できるよ
   reported_on: "2022-03-31"
 
 report25:
   user: hatsuno
   title: 検索用の日報
+  emotion: 2
   description:
     ユーザーネームで検索できるよ
   reported_on: "2020-11-20"
@@ -256,6 +273,7 @@ report30:
 report31:
   user: kananashi
   title: 最新のwipの日報
+  emotion: 2
   description: |-
     最新のwipの日報です
   reported_on: <%= Time.current %>
@@ -265,6 +283,7 @@ report31:
 report32:
   user: kananashi
   title: wipを除いた最新の日報
+  emotion: 2
   description: |-
     wipを除いた最新の日報です
   reported_on: <%= Time.current - 1.day %>
@@ -284,6 +303,7 @@ report33:
 report34:
   user: kananashi
   title: 最新から10日前の日報
+  emotion: 2
   description: |-
     最新から10日前の日報です
   reported_on: <%= Time.current - 11.day %>
@@ -292,6 +312,7 @@ report34:
 report71:
   user: kimuramitai
   title: "名前の長いメンター用"
+  emotion: 2
   description:
     "名前の長いメンター用"
   reported_on: "2022-04-16"