From 7107954e21bb2456056e9c21cf4804654e2f19cb Mon Sep 17 00:00:00 2001
From: mateuswetah <mateus.m.luna@gmail.com>
Date: Fri, 27 May 2022 10:40:54 -0300
Subject: [PATCH] Adds totalItems and totalCollections info.

---
 src/components/lists/CollectionsList.vue | 23 +++++++++++++++++++++--
 src/components/lists/ItemsList.vue       |  6 +++---
 src/locales/translation-strings.ts       | 18 ++++++++++++------
 src/pages/HomePage.vue                   | 18 +++++++++++++-----
 src/store/storeTainacan.ts               | 13 ++++++++++---
 5 files changed, 59 insertions(+), 19 deletions(-)

diff --git a/src/components/lists/CollectionsList.vue b/src/components/lists/CollectionsList.vue
index 8075307..7a52fec 100644
--- a/src/components/lists/CollectionsList.vue
+++ b/src/components/lists/CollectionsList.vue
@@ -3,7 +3,23 @@
         <ion-thumbnail slot="start"> 
             <ion-img :src="(collection.thumbnail && collection.thumbnail.thumbnail && collection.thumbnail.thumbnail[0]) ? collection.thumbnail.thumbnail[0] : thumbnailPlaceholder" :alt="collection.name ? collection.name : $('label_collection_without_name')"></ion-img>
         </ion-thumbnail>
-        <ion-label> {{ collection.name ? collection.name : 'Coleção sem nome' }} </ion-label>
+        <ion-label>
+            <h2>
+                {{ collection.name ? collection.name : $t('label_collection_without_name') }}&nbsp;
+                <span v-if="collection.status === 'private'">
+                    <ion-icon :icon="lockClosedOutline"></ion-icon>
+                </span>
+                <span v-else-if="collection.status === 'draft'">
+                    <ion-icon :icon="readerOutline"></ion-icon>
+                </span>
+                <span v-else-if="collection.status === 'trash'">
+                    <ion-icon :icon="trashOutline"></ion-icon>
+                </span>
+            </h2>
+            <p v-if="collection.total_items">
+                {{ $t('total_of_published_items', [collection.total_items.publish]) }}
+            </p>
+        </ion-label>
     </ion-item>
 </template>
 
@@ -13,7 +29,9 @@ import {
     IonImg,
     IonThumbnail,
     IonLabel,
+    IonIcon
 } from '@ionic/vue';
+import { lockClosedOutline, readerOutline, trashOutline } from 'ionicons/icons';
 import { computed } from 'vue';
 
 export default {
@@ -25,10 +43,11 @@ export default {
         IonImg,
         IonThumbnail,
         IonLabel,
+        IonIcon
     },
     setup() {
         const thumbnailPlaceholder = computed (() => require('../../assets/placeholder_square_small.png'))
-        return { thumbnailPlaceholder }
+        return { thumbnailPlaceholder, lockClosedOutline, readerOutline, trashOutline }
     },
 }
 </script>
diff --git a/src/components/lists/ItemsList.vue b/src/components/lists/ItemsList.vue
index 6052dbd..daeca3b 100644
--- a/src/components/lists/ItemsList.vue
+++ b/src/components/lists/ItemsList.vue
@@ -1,10 +1,10 @@
 <template>
     <ion-row class="items-list-container">
-        <ion-col size="6" v-for="item of items" :key="item.id">
+        <ion-col size="4" v-for="item of items" :key="item.id">
             <ion-card button color="light" >
-                <ion-img :src="(item.thumbnail && item.thumbnail['tainacan-medium'] && item.thumbnail['tainacan-medium'][0]) ? item.thumbnail['tainacan-medium'][0] : thumbnailPlaceholder" :alt="item.title ? item.title : 'Imagem de item sem título'"></ion-img>
+                <ion-img :src="(item.thumbnail && item.thumbnail['tainacan-medium'] && item.thumbnail['tainacan-medium'][0]) ? item.thumbnail['tainacan-medium'][0] : thumbnailPlaceholder" :alt="(item.thumbnail_alt ? item.thumbnail_alt : (item.title ? item.title : 'Imagem de item sem título'))"></ion-img>
                 <ion-card-header>
-                    <ion-card-title> {{ item.title ? item.title : $('label_item_without_title') }} </ion-card-title>
+                    <ion-card-title>{{ item.title ? item.title : $('label_item_without_title') }}</ion-card-title>
                 </ion-card-header>
             </ion-card>
         </ion-col>
diff --git a/src/locales/translation-strings.ts b/src/locales/translation-strings.ts
index c40d73a..c82ee5a 100644
--- a/src/locales/translation-strings.ts
+++ b/src/locales/translation-strings.ts
@@ -1,9 +1,9 @@
 export const translationStrings = {
     en: {
         collections: 'Collections',
-        label_view_all_collections: 'View all collections',
+        label_view_all_collections: 'View all {0} collections',
         items: 'Items',
-        label_view_all_items: 'View all items',
+        label_view_all_items: 'View all {0} items',
         label_loading: 'Loading...',
         label_items_list: 'Items list',
         label_collections_list: 'Collections list',
@@ -16,13 +16,16 @@ export const translationStrings = {
         placeholder_user_password: 'your password here',
         label_access_archive: 'Access archive',
         label_item_without_title: 'Item without title',
-        label_collection_without_name: 'Collection without name'
+        label_collection_without_name: 'Collection without name',
+        total_of_published_items: 'Total of {0} published items',
+        label_last_modified_collections: 'Last modified collections',
+        label_last_modified_items: 'Last modified itens'
     },
     pt: {
         collections: "Coleções",
-        label_view_all_collections: "Ver todas as coleções",
+        label_view_all_collections: "Ver todas as {0} coleções",
         items: 'Itens',
-        label_view_all_items: 'Ver todos os itens',
+        label_view_all_items: 'Ver todos os {0} itens',
         label_loading: 'Carregando...',
         label_items_list: 'Lista de itens',
         label_collections_list: 'Lista de coleções',
@@ -35,6 +38,9 @@ export const translationStrings = {
         placeholder_user_password: 'sua senha de usuário aqui',
         label_access_archive: 'Acessar acervo',
         label_item_without_title: 'Item sem título',
-        label_collection_without_name: 'Coleção sem nome'
+        label_collection_without_name: 'Coleção sem nome',
+        total_of_published_items: 'Total de {0} itens públicos',
+        label_last_modified_collections: 'Coleções alteradas recentemente',
+        label_last_modified_items: 'Itens alterados recentemente'
     }
 }
\ No newline at end of file
diff --git a/src/pages/HomePage.vue b/src/pages/HomePage.vue
index 782ece7..eede42b 100644
--- a/src/pages/HomePage.vue
+++ b/src/pages/HomePage.vue
@@ -11,16 +11,24 @@
             </ion-list-header>
             <collections-list :collections="tainacanStore.collections"></collections-list>
         </ion-list>
-        <ion-button fill="clear" size="small" routerLink="/collections">
-            {{ $t('label_view_all_collections') }}
+        <ion-button
+                v-if="tainacanStore.collections.length < tainacanStore.totalCollections"
+                fill="clear"
+                size="small"
+                routerLink="/collections">
+            {{ $t('label_view_all_collections', [tainacanStore.totalCollections]) }}
         </ion-button>
         <ion-list>
             <ion-list-header>
                 {{ $t('items') }}
             </ion-list-header>
             <items-list :items="tainacanStore.items"></items-list>
-            <ion-button fill="clear" size="small" routerLink="/items">
-                 {{ $t('label_view_all_items') }}
+            <ion-button 
+                    v-if="tainacanStore.items.length < tainacanStore.totalItems"
+                    fill="clear"
+                    size="small"
+                    routerLink="/items">
+                {{ $t('label_view_all_items', [tainacanStore.totalItems]) }}
             </ion-button>
         </ion-list>
     </base-layout>
@@ -39,7 +47,7 @@ import {
     IonButton,
     IonLoading,
     IonList,
-    IonListHeader,
+    IonListHeader
 } from '@ionic/vue';
 
 export default {
diff --git a/src/store/storeTainacan.ts b/src/store/storeTainacan.ts
index cfef4f1..da888bc 100644
--- a/src/store/storeTainacan.ts
+++ b/src/store/storeTainacan.ts
@@ -6,8 +6,11 @@ const useTainacanStore = defineStore("tainacan", {
   state() {
     return {
       collections: [],
+      totalCollections: 0,
       collectionItems: [],
+      totalCollectionItems: 0,
       items: [],
+      totalItems: 0,
       siteUrl: "",
       userLogin: "",
       userPassword: "",
@@ -30,10 +33,11 @@ const useTainacanStore = defineStore("tainacan", {
         const response = await axios.get(endpoint);
 
         this.collections = response.data;
+        this.totalCollections = response.headers['x-wp-total'];
 
       } catch (err) {
         this.collections = [];
-
+        this.totalCollections = 0;
         console.error("Erro no carregamento das coleções:", err);
 
         return err;
@@ -56,10 +60,11 @@ const useTainacanStore = defineStore("tainacan", {
         const response = await axios.get(endpoint);
 
         this.collectionItems = response.data.items;
+        this.totalCollectionItems = response.headers['x-wp-total'];
 
       } catch (err) {
         this.collectionItems = [];
-
+        this.totalCollectionItems = 0;
         console.error("Erro no carregamento dos items da coleção:", err);
 
         return err;
@@ -80,10 +85,12 @@ const useTainacanStore = defineStore("tainacan", {
           endpoint += '&orderby=' + params.orderBy;
 
         const response = await axios.get(endpoint);
-
         this.items = response.data.items;
+        this.totalItems = response.headers['x-wp-total'];
+
       } catch (err) {
         this.items = [];
+        this.totalItems = 0;
         console.error("Erro no carregamento dos items:", err);
         return err;
       }