localize collectibles tabs (#2700)

Co-authored-by: Jean Ribeiro <[email protected]>

packages/desktop/views/dashboard/collectibles/Collectibles.svelte

@@ -6,7 +6,7 @@
     import { CollectiblesDetailsView, CollectiblesGalleryView, CollectionsGalleryView } from './views'
     import { selectedCollectiblesTab } from '@core/nfts/stores'
 
-    $: $selectedAccountIndex !== undefined && $collectiblesRouter.reset()
+    $: $selectedAccountIndex !== undefined && $collectiblesRouter?.reset()
 
     $: if (features.analytics.dashboardRoute.collectibles.enabled && $collectiblesRoute) {
         Platform.trackEvent('collectibles-route', { route: $collectiblesRoute })
@@ -15,9 +15,9 @@
 
 <div class="w-full h-full flex flex-col flex-nowrap p-8 relative flex-1">
     {#if $collectiblesRoute === CollectiblesRoute.Gallery}
-        {#if $selectedCollectiblesTab?.key === 'collectibles'}
+        {#if $selectedCollectiblesTab === 0}
             <CollectiblesGalleryView />
-        {:else if $selectedCollectiblesTab?.key === 'collections'}
+        {:else if $selectedCollectiblesTab === 1}
             <CollectionsGalleryView />
         {/if}
     {/if}

packages/desktop/views/dashboard/collectibles/components/CollectiblesTabs.svelte

@@ -1,13 +1,24 @@
 <script lang="ts">
     import { Tabs } from '@bloomwalletio/ui'
-    import { COLLECTIBLES_TABS } from '@core/nfts'
     import { selectedCollectiblesTab } from '@core/nfts/stores'
+    import { KeyValue } from '@ui'
+    import features from '@features/features'
+    import { localize } from '@core/i18n'
 
-    const selectedIndex = COLLECTIBLES_TABS.findIndex((tab) => tab.key === $selectedCollectiblesTab?.key)
+    const COLLECTIBLES_TABS: KeyValue<string>[] = [
+        { key: 'collectibles', value: localize('views.collectibles.gallery.title') },
+        ...(features.collectibles?.collections.enabled
+            ? [{ key: 'collections', value: localize('views.collectibles.collectionsGallery.title') }]
+            : []),
+    ]
 </script>
 
 {#if COLLECTIBLES_TABS.length > 1}
     <div class="w-64">
-        <Tabs {selectedIndex} bind:selectedTab={$selectedCollectiblesTab} tabs={COLLECTIBLES_TABS} />
+        <Tabs
+            bind:selectedIndex={$selectedCollectiblesTab}
+            selectedTab={COLLECTIBLES_TABS[$selectedCollectiblesTab]}
+            tabs={COLLECTIBLES_TABS}
+        />
     </div>
 {/if}

packages/shared/src/lib/core/nfts/constants/index.ts

@@ -1,4 +1,3 @@
-export * from './collectibles-tabs.constant'
 export * from './current-irc27-version.constant'
 export * from './default-nft-filter.constant'
 export * from './default-nft-name.constant'

packages/shared/src/lib/core/nfts/stores/selected-collectibles-tabs.store.ts

@@ -1,5 +1,3 @@
-import { KeyValue } from '@ui'
 import { Writable, writable } from 'svelte/store'
-import { COLLECTIBLES_TABS } from '../constants'
 
-export const selectedCollectiblesTab: Writable<KeyValue<string>> = writable(COLLECTIBLES_TABS[0])
+export const selectedCollectiblesTab: Writable<number> = writable(0)