From f4e1498df15858f83531b134226712929d8578a7 Mon Sep 17 00:00:00 2001
From: Anton <anton@scinote.net>
Date: Mon, 16 Sep 2024 11:50:54 +0200
Subject: [PATCH 1/2] Add repository item card to storage container [SCI-11048]

---
 .../packs/vue/storage_locations_container.js  |  2 +-
 .../vue/repository_item_sidebar/locations.vue | 18 +++++++++++--
 .../vue/storage_locations/container.vue       | 18 +++++--------
 .../renderers/item_name_renderer.vue          | 26 +++++++++++++++++++
 ...rage_location_repository_row_serializer.rb |  6 ++++-
 app/views/storage_locations/show.html.erb     |  1 +
 6 files changed, 55 insertions(+), 16 deletions(-)
 create mode 100644 app/javascript/vue/storage_locations/renderers/item_name_renderer.vue

diff --git a/app/javascript/packs/vue/storage_locations_container.js b/app/javascript/packs/vue/storage_locations_container.js
index abf6912c3..e7f2e6259 100644
--- a/app/javascript/packs/vue/storage_locations_container.js
+++ b/app/javascript/packs/vue/storage_locations_container.js
@@ -7,4 +7,4 @@ const app = createApp();
 app.component('StorageLocationsContainer', StorageLocationsContainer);
 app.config.globalProperties.i18n = window.I18n;
 app.use(PerfectScrollbar);
-mountWithTurbolinks(app, '#StorageLocationsContainer');
+window.StorageLocationsContainer = mountWithTurbolinks(app, '#StorageLocationsContainer');
diff --git a/app/javascript/vue/repository_item_sidebar/locations.vue b/app/javascript/vue/repository_item_sidebar/locations.vue
index 7b3898797..4f61847c1 100644
--- a/app/javascript/vue/repository_item_sidebar/locations.vue
+++ b/app/javascript/vue/repository_item_sidebar/locations.vue
@@ -22,7 +22,9 @@
           <div v-for="(position) in location.positions" :key="position.id">
             <div v-if="position.metadata.position" class="flex items-center font-sm gap-1 uppercase bg-sn-grey-300 rounded pl-1.5 pr-2">
               {{ formatPosition(position.metadata.position) }}
-              <i v-if="repositoryRow.permissions.can_manage" class="sn-icon sn-icon-unlink-italic-s cursor-pointer"></i>
+              <i v-if="repositoryRow.permissions.can_manage"
+                 @click="unassignRow(location.id, position.id)"
+                 class="sn-icon sn-icon-unlink-italic-s cursor-pointer"></i>
             </div>
           </div>
         </div>
@@ -41,8 +43,11 @@
 
 <script>
 import AssignModal from '../storage_locations/modals/assign.vue';
+import axios from '../../packs/custom_axios.js';
+
 import {
-  storage_location_path
+  storage_location_path,
+  unassign_rows_storage_location_path
 } from '../../routes.js';
 
 export default {
@@ -71,6 +76,15 @@ export default {
     },
     numberToLetter(number) {
       return String.fromCharCode(96 + number);
+    },
+    unassignRow(locationId, rowId) {
+      axios.post(unassign_rows_storage_location_path({ id: locationId }), { ids: [rowId] })
+        .then(() => {
+          this.$emit('reloadRow');
+          if (window.StorageLocationsContainer) {
+            window.StorageLocationsContainer.$refs.container.reloadingTable = true;
+          }
+        });
     }
   }
 };
diff --git a/app/javascript/vue/storage_locations/container.vue b/app/javascript/vue/storage_locations/container.vue
index dccaeb41c..905868b44 100644
--- a/app/javascript/vue/storage_locations/container.vue
+++ b/app/javascript/vue/storage_locations/container.vue
@@ -63,6 +63,7 @@ import AssignModal from './modals/assign.vue';
 import ImportModal from './modals/import.vue';
 import ConfirmationModal from '../shared/confirmation_modal.vue';
 import RemindersRender from './renderers/reminders.vue';
+import ItemNameRenderer from './renderers/item_name_renderer.vue';
 
 export default {
   name: 'StorageLocationsContainer',
@@ -72,7 +73,8 @@ export default {
     AssignModal,
     ConfirmationModal,
     RemindersRender,
-    ImportModal
+    ImportModal,
+    ItemNameRenderer
   },
   props: {
     canManage: {
@@ -144,7 +146,7 @@ export default {
         field: 'row_name',
         headerName: this.i18n.t('storage_locations.show.table.row_name'),
         sortable: true,
-        cellRenderer: this.rowNameRenderer
+        cellRenderer: ItemNameRenderer
       },
       {
         field: 'stock',
@@ -182,16 +184,8 @@ export default {
     }
   },
   methods: {
-    rowNameRenderer(params) {
-      const { row_name: rowName, hidden } = params.data;
-      if (hidden) {
-        return `
-          <span class="text-sn-grey-700">
-            <i class="sn-icon sn-icon-locked-task"></i> ${this.i18n.t('storage_locations.show.hidden')}
-          </span>
-        `;
-      }
-      return rowName;
+    updateTable() {
+      this.reloadingTable = true;
     },
     handleTableReload(items) {
       this.reloadingTable = false;
diff --git a/app/javascript/vue/storage_locations/renderers/item_name_renderer.vue b/app/javascript/vue/storage_locations/renderers/item_name_renderer.vue
new file mode 100644
index 000000000..b14040ffb
--- /dev/null
+++ b/app/javascript/vue/storage_locations/renderers/item_name_renderer.vue
@@ -0,0 +1,26 @@
+<template>
+  <span>
+    <span v-if="params.data.hidden" class="text-sn-grey-700">
+      <i class="sn-icon sn-icon-locked-task"></i>
+      {{ i18n.t('storage_locations.show.hidden') }}
+    </span>
+    <a
+      :href="params.data.row_url"
+      class="record-info-link"
+      :title="params.data.row_name"
+    >
+      {{ params.data.row_name }}
+    </a>
+  </span>
+</template>
+
+<script>
+export default {
+  name: 'ItemNameRenderer',
+  props: {
+    params: {
+      required: true
+    }
+  }
+};
+</script>
diff --git a/app/serializers/lists/storage_location_repository_row_serializer.rb b/app/serializers/lists/storage_location_repository_row_serializer.rb
index c86b42e94..00509d457 100644
--- a/app/serializers/lists/storage_location_repository_row_serializer.rb
+++ b/app/serializers/lists/storage_location_repository_row_serializer.rb
@@ -6,7 +6,7 @@ module Lists
     include Rails.application.routes.url_helpers
 
     attributes :created_by, :created_on, :position, :row_id, :row_name, :hidden, :position_formatted, :stock,
-               :have_reminders, :reminders_url
+               :have_reminders, :reminders_url, :row_url
 
     def row_id
       object.repository_row.code
@@ -38,6 +38,10 @@ module Lists
       end
     end
 
+    def row_url
+      repository_repository_row_path(object.repository_row.repository, object.repository_row)
+    end
+
     def hidden
       !can_read_repository?(object.repository_row.repository)
     end
diff --git a/app/views/storage_locations/show.html.erb b/app/views/storage_locations/show.html.erb
index eefdfdcf0..0037e222a 100644
--- a/app/views/storage_locations/show.html.erb
+++ b/app/views/storage_locations/show.html.erb
@@ -11,6 +11,7 @@
     <div class="content-body" data-e2e="e2e-CO-storageLocations-box">
       <div id="StorageLocationsContainer" class="fixed-content-body">
         <storage-locations-container
+          ref="container"
           actions-url="<%= actions_toolbar_storage_location_storage_location_repository_rows_path(@storage_location) %>"
           data-source="<%= storage_location_storage_location_repository_rows_path(@storage_location)  %>"
           :can-manage="<%= can_manage_storage_location?(@storage_location) %>"

From bfffcda8aced03cc9dc4a3a00e6c99834bd37e6c Mon Sep 17 00:00:00 2001
From: Anton <anton@scinote.net>
Date: Mon, 16 Sep 2024 11:59:35 +0200
Subject: [PATCH 2/2] Remove unused method from item sidebar title

---
 app/javascript/vue/repository_item_sidebar/Title.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/javascript/vue/repository_item_sidebar/Title.vue b/app/javascript/vue/repository_item_sidebar/Title.vue
index c238c63a1..9bba67953 100644
--- a/app/javascript/vue/repository_item_sidebar/Title.vue
+++ b/app/javascript/vue/repository_item_sidebar/Title.vue
@@ -3,7 +3,7 @@
     :characterMinLimit="0" :allowBlank="false" :smartAnnotation="false"
     :preventLeavingUntilFilled="true"
     :attributeName="`${i18n.t('repositories.item_card.header_title')}`" :singleLine="true"
-    @editingEnabled="editingName = true" @editingDisabled="editingName = false" @update="updateName" @delete="handleDelete"></inline-edit>
+    @editingEnabled="editingName = true" @editingDisabled="editingName = false" @update="updateName"></inline-edit>
   <h4 v-else class="item-name my-auto truncate text-xl" :title="computedName">
     {{ computedName }}
   </h4>