From 02531b35aab699186b47960635b859f5bbbe0ab0 Mon Sep 17 00:00:00 2001
From: mateuswetah <mateus.m.luna@gmail.com>
Date: Tue, 17 Oct 2023 18:49:50 -0300
Subject: [PATCH] Adds links to item, collection, taxonomy and terms on website
 from admin lists. #814.

---
 .../lists/collections-home-list.vue           |   2 +-
 .../components/lists/collections-list.vue     |  18 +++
 .../admin/components/lists/items-list.vue     | 135 +++++++++++++++++-
 .../components/lists/taxonomies-list.vue      |  22 ++-
 .../lists/terms-list-hierarchical.vue         |  16 ++-
 .../tainacan-repository-subheader.vue         |   6 +-
 .../components/search/filters-items-list.vue  |   2 +-
 src/views/admin/scss/_tables.scss             |   4 +-
 src/views/admin/scss/_view-mode-cards.scss    |   2 +-
 src/views/admin/scss/_view-mode-list.scss     |   2 +-
 src/views/admin/scss/_view-mode-records.scss  |   2 +-
 11 files changed, 198 insertions(+), 13 deletions(-)

diff --git a/src/views/admin/components/lists/collections-home-list.vue b/src/views/admin/components/lists/collections-home-list.vue
index 89406d314..e41799481 100644
--- a/src/views/admin/components/lists/collections-home-list.vue
+++ b/src/views/admin/components/lists/collections-home-list.vue
@@ -260,7 +260,7 @@
                                         popperClass: ['tainacan-tooltip', 'tooltip']     
                                     }"
                                     class="icon">
-                                <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-openurl"/>
+                                <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
                             </span>
                         </a>
                     </li>
diff --git a/src/views/admin/components/lists/collections-list.vue b/src/views/admin/components/lists/collections-list.vue
index 4e82a31ed..9c48239ea 100644
--- a/src/views/admin/components/lists/collections-list.vue
+++ b/src/views/admin/components/lists/collections-list.vue
@@ -349,6 +349,24 @@
                                                 class="tainacan-icon tainacan-icon-1-25em"/>
                                     </span>
                                 </a>
+                                <a 
+                                        id="button-open-external" 
+                                        :aria-label="$i18n.getFrom('collections','view_item')"
+                                        @click.stop="" 
+                                        target="_blank"
+                                        :href="collection.url">                      
+                                    <span 
+                                            v-tooltip="{
+                                                content: $i18n.get('label_view_collection_on_website'),
+                                                autoHide: true,
+                                                popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
+                                                placement: 'auto',
+                                                html: true
+                                            }"
+                                            class="icon">
+                                        <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                                    </span>
+                                </a>
                             </div>
                         </td>
                     </tr>
diff --git a/src/views/admin/components/lists/items-list.vue b/src/views/admin/components/lists/items-list.vue
index 2e364bfda..54ec8bd29 100644
--- a/src/views/admin/components/lists/items-list.vue
+++ b/src/views/admin/components/lists/items-list.vue
@@ -303,6 +303,25 @@
                                         class="has-text-secondary tainacan-icon tainacan-icon-1-25em"/>
                             </span>
                         </a>
+                        <a 
+                                v-if="!isOnTrash"
+                                id="button-open-external" 
+                                :aria-label="$i18n.getFrom('items','view_item')"
+                                @click.stop="" 
+                                target="_blank"
+                                :href="item.url">                      
+                            <span 
+                                    v-tooltip="{
+                                        content: $i18n.get('label_item_page_on_website'),
+                                        autoHide: true,
+                                        popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
+                                        placement: 'auto',
+                                        html: true
+                                    }"
+                                    class="icon">
+                                <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                            </span>
+                        </a>
                     </div>
 
                 </div>
@@ -448,6 +467,25 @@
                                             class="has-text-secondary tainacan-icon tainacan-icon-1-25em"/>
                                 </span>
                             </a>
+                            <a 
+                                    v-if="!isOnTrash"
+                                    id="button-open-external" 
+                                    :aria-label="$i18n.getFrom('items','view_item')"
+                                    @click.stop="" 
+                                    target="_blank"
+                                    :href="item.url">                      
+                                <span 
+                                        v-tooltip="{
+                                            content: $i18n.get('label_item_page_on_website'),
+                                            autoHide: true,
+                                            popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
+                                            placement: 'auto',
+                                            html: true
+                                        }"
+                                        class="icon">
+                                    <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                                </span>
+                            </a>
                         </div>
                     </div>
                 </li>
@@ -579,6 +617,25 @@
                                         class="has-text-secondary tainacan-icon tainacan-icon-1-25em"/>
                             </span>
                         </a>
+                        <a 
+                                v-if="!isOnTrash"
+                                id="button-open-external" 
+                                :aria-label="$i18n.getFrom('items','view_item')"
+                                @click.stop="" 
+                                target="_blank"
+                                :href="item.url">                      
+                            <span 
+                                    v-tooltip="{
+                                        content: $i18n.get('label_item_page_on_website'),
+                                        autoHide: true,
+                                        popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
+                                        placement: 'auto',
+                                        html: true
+                                    }"
+                                    class="icon">
+                                <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                            </span>
+                        </a>
                     </div>
 
                     <!-- Remaining metadata -->
@@ -802,6 +859,25 @@
                                             class="has-text-secondary tainacan-icon tainacan-icon-1-25em"/>
                                 </span>
                             </a>
+                            <a 
+                                    v-if="!isOnTrash"
+                                    id="button-open-external" 
+                                    :aria-label="$i18n.getFrom('items','view_item')"
+                                    @click.stop="" 
+                                    target="_blank"
+                                    :href="item.url">                      
+                                <span 
+                                        v-tooltip="{
+                                            content: $i18n.get('label_item_page_on_website'),
+                                            autoHide: true,
+                                            popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
+                                            placement: 'auto',
+                                            html: true
+                                        }"
+                                        class="icon">
+                                    <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                                </span>
+                            </a>
                         </div>
 
                         <!-- Remaining metadata -->
@@ -1147,7 +1223,26 @@
                                     <i
                                             :class="{ 'tainacan-icon-delete': !isOnTrash, 'tainacan-icon-deleteforever': isOnTrash }"
                                             class="has-text-secondary tainacan-icon tainacan-icon-1-25em"/>
-                                </span>
+                                    </span>
+                                </a>
+                                <a 
+                                        v-if="!isOnTrash"
+                                        id="button-open-external" 
+                                        :aria-label="$i18n.getFrom('items','view_item')"
+                                        @click.stop="" 
+                                        target="_blank"
+                                        :href="item.url">                      
+                                    <span 
+                                            v-tooltip="{
+                                                content: $i18n.get('label_item_page_on_website'),
+                                                autoHide: true,
+                                                popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
+                                                placement: 'auto',
+                                                html: true
+                                            }"
+                                            class="icon">
+                                        <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                                    </span>
                                 </a>
                             </div>
                         </td>
@@ -1304,6 +1399,25 @@
                                         class="has-text-secondary tainacan-icon tainacan-icon-1-25em"/>
                             </span>
                         </a>
+                        <a 
+                                v-if="!isOnTrash"
+                                id="button-open-external" 
+                                :aria-label="$i18n.getFrom('items','view_item')"
+                                @click.stop="" 
+                                target="_blank"
+                                :href="item.url">                      
+                            <span 
+                                    v-tooltip="{
+                                        content: $i18n.get('label_item_page_on_website'),
+                                        autoHide: true,
+                                        popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
+                                        placement: 'auto',
+                                        html: true
+                                    }"
+                                    class="icon">
+                                <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                            </span>
+                        </a>
                     </div>
 
                     <!-- Remaining metadata -->  
@@ -1779,6 +1893,25 @@
                                                         class="has-text-secondary tainacan-icon tainacan-icon-1-25em"/>
                                             </span>
                                         </a>
+                                        <a 
+                                                v-if="!isOnTrash"
+                                                id="button-open-external" 
+                                                :aria-label="$i18n.getFrom('items','view_item')"
+                                                @click.stop="" 
+                                                target="_blank"
+                                                :href="item.url">                      
+                                            <span 
+                                                    v-tooltip="{
+                                                        content: $i18n.get('label_item_page_on_website'),
+                                                        autoHide: true,
+                                                        popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
+                                                        placement: 'auto',
+                                                        html: true
+                                                    }"
+                                                    class="icon">
+                                                <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                                            </span>
+                                        </a>
                                     </div>
 
                                     <!-- Remaining metadata -->
diff --git a/src/views/admin/components/lists/taxonomies-list.vue b/src/views/admin/components/lists/taxonomies-list.vue
index d717e59be..80d0f68a7 100644
--- a/src/views/admin/components/lists/taxonomies-list.vue
+++ b/src/views/admin/components/lists/taxonomies-list.vue
@@ -235,6 +235,25 @@
                                                 class="has-text-secondary tainacan-icon tainacan-icon-1-25em"/>
                                     </span>
                                 </a>
+                                <a 
+                                        v-if="!isOnTrash"
+                                        id="button-open-external" 
+                                        :aria-label="$i18n.getFrom('taxonomies','view_item')"
+                                        @click.stop="" 
+                                        target="_blank"
+                                        :href="themeTaxonomiesURL + taxonomy.slug">                      
+                                    <span 
+                                            v-tooltip="{
+                                                content: $i18n.get('label_taxonomy_page_on_website'),
+                                                autoHide: true,
+                                                popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
+                                                placement: 'auto',
+                                                html: true
+                                            }"
+                                            class="icon">
+                                        <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                                    </span>
+                                </a>
                             </div>
                         </td>
                     </tr>
@@ -263,7 +282,8 @@
                 selected: [],
                 allOnPageSelected: false,
                 isSelecting: false,
-                adminUrl: tainacan_plugin.admin_url
+                adminUrl: tainacan_plugin.admin_url,
+                themeTaxonomiesURL: tainacan_plugin.theme_taxonomy_list_url
             }
         },
         computed: {
diff --git a/src/views/admin/components/lists/terms-list-hierarchical.vue b/src/views/admin/components/lists/terms-list-hierarchical.vue
index 7f6612c74..dd38b63cb 100644
--- a/src/views/admin/components/lists/terms-list-hierarchical.vue
+++ b/src/views/admin/components/lists/terms-list-hierarchical.vue
@@ -136,9 +136,23 @@
                                                 placement: 'bottom'
                                             }"
                                             class="icon">
-                                        <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
+                                        <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-delete"/>
                                     </span>
                                 </button>
+                                <a 
+                                        target="_blank"
+                                        :href="term.url">
+                                    <span
+                                            v-tooltip="{
+                                                content: $i18n.get('label_term_page_on_website'),
+                                                autoHide: true,
+                                                popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
+                                                placement: 'bottom'
+                                            }"
+                                            class="icon">
+                                        <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
+                                    </span>
+                                </a>
                             </div>
                         </label>
                         <button
diff --git a/src/views/admin/components/navigation/tainacan-repository-subheader.vue b/src/views/admin/components/navigation/tainacan-repository-subheader.vue
index 31062b922..7be6eecc8 100644
--- a/src/views/admin/components/navigation/tainacan-repository-subheader.vue
+++ b/src/views/admin/components/navigation/tainacan-repository-subheader.vue
@@ -72,7 +72,7 @@
                         class="button"
                         id="view-collection-button">
                     <span class="icon">
-                        <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-openurl"/>
+                        <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
                     </span>
                     <span class="is-hidden-mobile">{{ $i18n.get('label_view_collection_on_website') }}</span>
                 </a>
@@ -85,7 +85,7 @@
                         class="button"
                         id="view-repository-button--taxonomies">
                     <span class="icon">
-                        <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-openurl"/>
+                        <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
                     </span>
                     <span class="is-hidden-mobile">{{ $i18n.get('label_view_taxonomies_on_website') }}</span>
                 </a>
@@ -98,7 +98,7 @@
                         class="button"
                         id="view-repository-button">
                     <span class="icon">
-                        <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-openurl"/>
+                        <i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-openurl"/>
                     </span>
                     <span class="is-hidden-mobile">{{ $i18n.get('label_view_collections_on_website') }}</span>
                 </a>
diff --git a/src/views/admin/components/search/filters-items-list.vue b/src/views/admin/components/search/filters-items-list.vue
index d1c77c9bd..367c7bad8 100644
--- a/src/views/admin/components/search/filters-items-list.vue
+++ b/src/views/admin/components/search/filters-items-list.vue
@@ -273,7 +273,7 @@
         <section
                 v-if="!isLoadingFilters &&
                     !((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
-                class="is-grouped-centered section">
+                class="is-grouped-centered">
             <div class="content has-text-gray has-text-centered">
                 <p>
                     <span class="icon is-large">
diff --git a/src/views/admin/scss/_tables.scss b/src/views/admin/scss/_tables.scss
index 283e765a1..cab1d87c6 100644
--- a/src/views/admin/scss/_tables.scss
+++ b/src/views/admin/scss/_tables.scss
@@ -304,14 +304,14 @@
                         position: -webkit-sticky !important;
                         right: 0px;
                         top: auto;
-                        width: 80px;
+                        width: 100px;
     
                         .actions-container {
                             display: flex;
                             position: relative;
                             padding: 0;
                             height: 100%;
-                            width: 80px;
+                            width: 100px;
                             z-index: 9;
                             background-color: var(--tainacan-white); 
                             float: right;
diff --git a/src/views/admin/scss/_view-mode-cards.scss b/src/views/admin/scss/_view-mode-cards.scss
index 9ae35b870..ec241c97d 100644
--- a/src/views/admin/scss/_view-mode-cards.scss
+++ b/src/views/admin/scss/_view-mode-cards.scss
@@ -131,7 +131,7 @@
         }
         .metadata-title {
             flex-shrink: 0;
-            padding: 0.6em 5em 0.5em 2.75em;
+            padding: 0.6em 7em 0.5em 2.75em;
             min-height: 40px;
             position: relative;
             font-size: 1em !important; 
diff --git a/src/views/admin/scss/_view-mode-list.scss b/src/views/admin/scss/_view-mode-list.scss
index 5f7899658..2a4c2f724 100644
--- a/src/views/admin/scss/_view-mode-list.scss
+++ b/src/views/admin/scss/_view-mode-list.scss
@@ -102,7 +102,7 @@
         }
         .metadata-title {
             flex-shrink: 0;
-            padding: 0.5em 4.75em 0.5em 2.75em;
+            padding: 0.5em 7em 0.5em 2.75em;
             min-height: 40px;
             position: relative;
             font-size: 1em !important; 
diff --git a/src/views/admin/scss/_view-mode-records.scss b/src/views/admin/scss/_view-mode-records.scss
index 5976b0f17..5d72eade5 100644
--- a/src/views/admin/scss/_view-mode-records.scss
+++ b/src/views/admin/scss/_view-mode-records.scss
@@ -110,7 +110,7 @@
         }
         .metadata-title {
             flex-shrink: 0;
-            padding: 0.5em 4.75em 0.5em 2.75em;
+            padding: 0.5em 7em 0.5em 2.75em;
             font-size: 1.0em !important; 
             min-height: 40px;
             position: relative;