Fix rollups category displaying

Author: GusevPM

pages/rollups.vue

@@ -95,6 +95,19 @@ const categories = computed(() => {
 	
 	return res	
 })
+const getCategoryDisplayName = (category) => {
+	switch (category) {
+		case 'nft':
+			return 'NFT'
+
+		case 'uncategorized':
+			return 'Other'
+
+		default:
+			return capitilize(category)
+	}
+}
+
 const filters = reactive({
 	categories: categories.value?.reduce((a, b) => ({ ...a, [b]: false }), {}),
 })
@@ -279,7 +292,7 @@ watch(
 								<Text size="12" weight="600" color="primary" style="text-transform: capitalize">
 									{{ Object.keys(filters.categories)
 										.filter((c) => filters.categories[c])
-										.map(c => c === 'nft' ? c.toUpperCase() : capitilize(c))
+										.map(c => getCategoryDisplayName(c))
 										.join(", ")
 									}}
 								</Text>
@@ -298,7 +311,7 @@ watch(
 										v-model="filters.categories[c]"
 									>
 										<Text size="12" weight="500" color="primary">
-											{{ c === 'nft' ? c.toUpperCase() : capitilize(c) }}
+											{{ getCategoryDisplayName(c) }}
 										</Text>
 									</Checkbox>
 								</Flex>
@@ -417,7 +430,7 @@ watch(
 								<td>
 									<NuxtLink :to="`/rollup/${r.slug}`">
 										<Flex align="center">
-											<Text size="13" weight="600" color="primary"> {{ r.category === 'nft' ? r.category.toUpperCase() : capitilize(r.category) }} </Text>
+											<Text size="13" weight="600" color="primary"> {{ getCategoryDisplayName(r.category) }} </Text>
 										</Flex>
 									</NuxtLink>
 								</td>

pages/widgets/rollups.vue

@@ -91,6 +91,19 @@ const categories = computed(() => {
 })
 const selectedCategories = ref([])
 
+const getCategoryDisplayName = (category) => {
+	switch (category) {
+		case 'nft':
+			return 'NFT'
+
+		case 'uncategorized':
+			return 'Other'
+
+		default:
+			return capitilize(category)
+	}
+}
+
 const handleSelectCategory = (category) => {
 	if (selectedCategories.value.includes(category)) {
 		selectedCategories.value = selectedCategories.value.filter(c => c !== category)
@@ -232,7 +245,7 @@ watch(
 					:class="[$style.chip, selectedCategories.includes(c) && $style.active]"
 				>
 					<Flex align="center" :class="$style.content">
-						<Text size="12" weight="600" color="primary"> {{ c === 'nft' ? c.toUpperCase() : capitilize(c) }} </Text>
+						<Text size="12" weight="600" color="primary"> {{ getCategoryDisplayName(c) }} </Text>
 					</Flex>
 				</Flex>
 
@@ -346,12 +359,7 @@ watch(
 							<Flex align="center" :class="$style.chip" :style="{ borderRadius: '8px' }">
 								<Flex align="center" :class="$style.content" :style="{ padding: '4px 8px' }">
 									<Text size="12" color="tertiary">
-										{{ r.category === 'nft'
-											? r.category.toUpperCase()
-											: r.category === 'uncategorized'
-												? 'Other'
-												: capitilize(r.category)
-										}}
+										{{ getCategoryDisplayName(r.category) }}
 									</Text>
 								</Flex>
 							</Flex>