Add reminders to item card [SCI-9154] (#6285)

* Add reminders to item card [SCI-9154]

* Refactor item card reminder component [SCI-9154]

app/controllers/repository_rows_controller.rb

@@ -59,6 +59,7 @@ class RepositoryRowsController < ApplicationController
 
     @assigned_modules = @repository_row.my_modules.joins(experiment: :project)
     @viewable_modules = @assigned_modules.viewable_by_user(current_user, current_user.teams)
+    @reminders_present = @repository_row.repository_cells.with_active_reminder(@current_user).any?
   end
 
   def create

app/javascript/vue/repository_item_sidebar/RepositoryItemSidebar.vue

@@ -93,7 +93,10 @@
                 {{ i18n.t('repositories.item_card.custom_columns_label') }}
               </div>
               <div v-if="customColumns?.length > 0" class="flex flex-col gap-4 w-[350px] h-auto">
-                <div v-for="(column, index) in customColumns" class="flex flex-col gap-4 w-[350px] h-auto">
+                <div v-for="(column, index) in customColumns" class="flex flex-col gap-4 w-[350px] h-auto relative">
+                  <span class="absolute right-2 top-6" v-if="column.value.reminder === true">
+                    <Reminder :value="column.value" :valueType="column.value_type" />
+                  </span>
                   <component :is="column.data_type" :key="index" :data_type="column.data_type" :colId="column.id"
                     :colName="column.name" :colVal="column.value" :repositoryRowId="repositoryRowId"
                     :permissions="permissions" @closeSidebar="toggleShowHideSidebar(null)" />
@@ -193,10 +196,12 @@ import RepositoryDateRangeValue from './repository_values/RepositoryDateRangeVal
 import RepositoryTimeRangeValue from './repository_values/RepositoryTimeRangeValue.vue'
 import RepositoryTimeValue from './repository_values/RepositoryTimeValue.vue'
 import ScrollSpy from './repository_values/ScrollSpy.vue';
+import Reminder from './reminder.vue'
 
 export default {
   name: 'RepositoryItemSidebar',
   components: {
+    Reminder,
     RepositoryStockValue,
     RepositoryTextValue,
     RepositoryNumberValue,

app/javascript/vue/repository_item_sidebar/reminder.vue

@@ -0,0 +1,25 @@
+<template v-if="value.reminder === true">
+  <div class="inline-block float-right cursor-pointer relative" data-placement="top" data-toggle="tooltip" :title="value.text"
+     tabindex='-1'>
+    <i class="sn-icon sn-icon-notifications row-reminders-icon"></i>
+    <span :class="`inline-block absolute rounded-full w-2 h-2 right-1 top-0.5 ${reminderColor}`"></span>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'Reminder',
+    props: {
+      valueType: null,
+      value: null,
+    },
+    computed: {
+      reminderColor() {
+        if (this.value.reminder && (this.value.stock_amount > 0 || this.value.days_left > 0)) {
+          return 'bg-sn-alert-brittlebush'
+        }
+        return 'bg-sn-alert-passion';
+      }
+    }
+  }
+</script>

app/serializers/repository_datatable/repository_date_time_value_serializer.rb

@@ -12,9 +12,22 @@ module RepositoryDatatable
 
       if scope.dig(:options, :reminders_enabled) &&
          !scope[:repository].is_a?(RepositorySnapshot) &&
-         scope[:column].reminder_value.present? && scope[:column].reminder_unit.present?
+         scope[:column].reminder_value.present? &&
+         scope[:column].reminder_unit.present?
         reminder_delta = scope[:column].reminder_value.to_i * scope[:column].reminder_unit.to_i
         data[:reminder] = reminder_delta + DateTime.now.to_i >= value_object.data.to_i
+        data[:reminder_message] = scope[:column].reminder_message
+        days_left = ((value_object.data - Time.now.utc) / 1.day).ceil
+        if data[:reminder] && days_left.positive?
+          data[:days_left] = days_left
+          date_expiration =
+            "#{days_left} #{I18n.t("repositories.item_card.reminders.day.#{days_left == 1 ? 'one' : 'other'}")}"
+          data[:text] =
+            "#{I18n.t('repositories.item_card.reminders.date_expiration', date_expiration: date_expiration)}\n
+             #{data[:reminder_message]}"
+        elsif data[:reminder]
+          data[:text] = "#{I18n.t('repositories.item_card.reminders.item_expired')}\n#{data[:reminder_message]}"
+        end
       end
 
       data

app/serializers/repository_datatable/repository_date_value_serializer.rb

@@ -10,11 +10,23 @@ module RepositoryDatatable
 
       if scope.dig(:options, :reminders_enabled) &&
          !scope[:repository].is_a?(RepositorySnapshot) &&
-         scope[:column].reminder_value.present? && scope[:column].reminder_unit.present?
+         scope[:column].reminder_value.present? &&
+         scope[:column].reminder_unit.present?
         reminder_delta = scope[:column].reminder_value.to_i * scope[:column].reminder_unit.to_i
         data[:reminder] = reminder_delta + DateTime.now.to_i >= value_object.data.to_i
+        data[:reminder_message] = scope[:column].reminder_message
+        days_left = ((value_object.data - Time.now.utc) / 1.day).ceil
+        if data[:reminder] && days_left.positive?
+          data[:days_left] = days_left
+          date_expiration =
+            "#{days_left} #{I18n.t("repositories.item_card.reminders.day.#{days_left == 1 ? 'one' : 'other'}")}"
+          data[:text] =
+            "#{I18n.t('repositories.item_card.reminders.date_expiration', date_expiration: date_expiration)}\n
+             #{data[:reminder_message]}"
+        elsif data[:reminder]
+          data[:text] = "#{I18n.t('repositories.item_card.reminders.item_expired')}\n#{data[:reminder_message]}"
+        end
       end
-
       data
     end
   end

app/serializers/repository_datatable/repository_stock_value_serializer.rb

@@ -5,11 +5,23 @@ module RepositoryDatatable
     include Canaid::Helpers::PermissionsHelper
 
     def value
-      {
+      data = {
         stock_formatted: value_object.formatted,
         stock_amount: value_object.data,
         low_stock_threshold: value_object.low_stock_threshold
       }
+      if scope.dig(:options, :reminders_enabled) &&
+         !scope[:repository].is_a?(RepositorySnapshot) &&
+         value_object.data.present? &&
+         value_object.low_stock_threshold.present?
+        data[:reminder] = value_object.low_stock_threshold > value_object.data
+        if data[:reminder] && (data[:stock_amount]).positive?
+          data[:text] = I18n.t('repositories.item_card.reminders.stock_low', stock_formated: data[:stock_formatted])
+        elsif data[:reminder]
+          data[:text] = I18n.t('repositories.item_card.reminders.stock_empty')
+        end
+      end
+      data
     end
   end
 end

app/views/repository_rows/show.json.jbuilder

@@ -14,9 +14,9 @@ json.default_columns do
 end
 json.custom_columns do
   json.array! @repository_row.repository_cells do |repository_cell|
-    json.merge! serialize_repository_cell_value(repository_cell, @repository.team, @repository).merge(
-      repository_cell.repository_column.as_json(only: %i(id name data_type))
-    )
+    json.merge!(**serialize_repository_cell_value(
+      repository_cell, @repository.team, @repository, reminders_enabled: @reminders_present
+    ), **repository_cell.repository_column.as_json(only: %i(id name data_type)))
   end
 end
 

config/locales/en.yml

@@ -2240,9 +2240,17 @@ en:
         added_on: "Added on"
         added_at: "Added at"
         added_by: "Added by"
-      custom_columns_label: "Custom columns"
+      reminders:
+        stock_low: "Only %{stock_formated} left."
+        stock_empty: "No stock left"
+        date_expiration: "This item is expiring in %{date_expiration}."
+        item_expired: "This item has expired."
+        day:
+          one: "day"
+          other: "days"
       stock_export: "Export"
-      no_custom_columns_label: 'This item has no custom columns'
+      custom_columns_label: "Custom columns"
+      no_custom_columns_label: "This item has no custom columns"
       repository_time_range_value:
         no_time_range: 'No time range'
       repository_text_value: