From c9792492cb24dec637cf28dbcc90728415a4eaaf Mon Sep 17 00:00:00 2001
From: ThatOneCalculator <kainoa@t1c.dev>
Date: Wed, 7 Sep 2022 16:18:04 -0700
Subject: [PATCH] fix: :rewind:

---
 package.json                                  |  2 +-
 .../src/components/global/MkPageHeader.vue    |  4 +-
 packages/client/src/pages/notifications.vue   | 57 ++++---------------
 3 files changed, 15 insertions(+), 48 deletions(-)

diff --git a/package.json b/package.json
index f7f1346bbc..39b3c148ac 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "calckey",
-	"version": "12.118.1-calc.2-beta.2-rc.14",
+	"version": "12.118.1-calc.2-beta.2-rc.15",
 	"codename": "aqua",
 	"repository": {
 		"type": "git",
diff --git a/packages/client/src/components/global/MkPageHeader.vue b/packages/client/src/components/global/MkPageHeader.vue
index b5c42be8da..d2062afc73 100644
--- a/packages/client/src/components/global/MkPageHeader.vue
+++ b/packages/client/src/components/global/MkPageHeader.vue
@@ -6,7 +6,7 @@
 	<template v-if="metadata">
 		<div v-if="!hideTitle" class="titleContainer" @click="showTabsPopup">
 			<MkAvatar v-if="metadata.avatar" class="avatar" :user="metadata.avatar" :disable-preview="true" :show-indicator="true"/>
-			<i v-else-if="metadata.icon" class="icon" :class="metadata.icon"></i>
+			<i v-else-if="metadata.icon && !narrow" class="icon" :class="metadata.icon"></i>
 
 			<div class="title">
 				<MkUserName v-if="metadata.userName" :user="metadata.userName" :nowrap="true" class="title"/>
@@ -18,7 +18,7 @@
 		</div>
 		<div class="tabs">
 			<button v-for="tab in tabs" :ref="(el) => tabRefs[tab.key] = el" v-tooltip.noDelay="tab.title" class="tab _button" :class="{ active: tab.key != null && tab.key === props.tab }" @mousedown="(ev) => onTabMousedown(tab, ev)" @click="(ev) => onTabClick(tab, ev)">
-				<i v-if="tab.icon && !narrow" class="icon" :class="tab.icon"></i>
+				<i v-if="tab.icon" class="icon" :class="tab.icon"></i>
 				<span v-if="!tab.iconOnly && !narrow" class="title">{{ tab.title }}</span>
 			</button>
 			<div ref="tabHighlightEl" class="highlight"></div>
diff --git a/packages/client/src/pages/notifications.vue b/packages/client/src/pages/notifications.vue
index 107fb69d63..c99a88ba10 100644
--- a/packages/client/src/pages/notifications.vue
+++ b/packages/client/src/pages/notifications.vue
@@ -9,25 +9,15 @@
 		/>
 	</template>
 	<MkSpacer :content-max="800">
-		<swiper
-			:modules="[Virtual]"
-			:space-between="20"
-			:virtual="true"
-			@swiper="setSwiperRef"
-		>
-			<swiper-slide>
-				<XNotifications class="notifications" :include-types="includeTypes" :unread-only="false"/>
-			</swiper-slide>
-			<swiper-slide>
-				<XNotifications class="notifications" :include-types="includeTypes" :unread-only="true"/>
-			</swiper-slide>
-			<swiper-slide>
-				<XNotes :pagination="mentionsPagination"/>
-			</swiper-slide>
-			<swiper-slide>
-				<XNotes :pagination="directNotesPagination"/>
-			</swiper-slide>
-		</swiper>
+		<div v-if="tab === 'all' || tab === 'unread'">
+			<XNotifications class="notifications" :include-types="includeTypes" :unread-only="unreadOnly"/>
+		</div>
+		<div v-else-if="tab === 'mentions'">
+			<XNotes :pagination="mentionsPagination"/>
+		</div>
+		<div v-else-if="tab === 'directNotes'">
+			<XNotes :pagination="directNotesPagination"/>
+		</div>
 	</MkSpacer>
 </MkStickyContainer>
 </template>
@@ -35,30 +25,21 @@
 <script lang="ts" setup>
 import { computed, ref } from 'vue';
 import { notificationTypes } from 'misskey-js';
-import { Virtual } from 'swiper';
-import { Swiper, SwiperSlide } from 'swiper/vue';
 import XNotifications from '@/components/MkNotifications.vue';
 import XNotes from '@/components/MkNotes.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
 import { deviceKind } from '@/scripts/device-kind';
-import 'swiper/scss';
-import 'swiper/scss/virtual';
+
+let tab = $ref('all');
 let includeTypes = $ref<string[] | null>(null);
 let unreadOnly = $computed(() => tab === 'unread');
 os.api('notifications/mark-all-as-read');
 
-const tab = $computed({
-	get: () => 'all',
-	set: (x) => {
-		syncSlide(['all', 'unread', 'mentions', 'directNotes'].indexOf(x));
-	},
-});
-
 const MOBILE_THRESHOLD = 500;
 const isMobile = ref(
-	deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD,
+	deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD
 );
 window.addEventListener('resize', () => {
 	isMobile.value =
@@ -113,34 +94,20 @@ const headerTabs = $computed(() => [{
 	key: 'all',
 	title: i18n.ts.all,
 	icon: 'fas fa-bell',
-	iconOnly: true,
 }, {
 	key: 'unread',
 	title: i18n.ts.unread,
 	icon: 'fas fa-exclamation',
-	iconOnly: true,
 }, {
 	key: 'mentions',
 	title: i18n.ts.mentions,
 	icon: 'fas fa-at',
-	iconOnly: true,
 }, {
 	key: 'directNotes',
 	title: i18n.ts.directNotes,
 	icon: 'fas fa-envelope',
-	iconOnly: true,
 }]);
 
-let swiperRef = null;
-
-function setSwiperRef(swiper) {
-	swiperRef = swiper;
-}
-
-function syncSlide(index) {
-	swiperRef.slideTo(index);
-}
-
 definePageMetadata(computed(() => ({
 	title: i18n.ts.notifications,
 	icon: 'fas fa-bell',