feat: toggle-able swiping

locales/en-US.yml

@@ -1053,6 +1053,7 @@ recommendedInstancesDescription: "Recommended servers separated by line breaks t
 caption: "Auto Caption"
 splash: "Splash Screen"
 updateAvailable: "There might be an update available!"
+swipeOnMobile: "Allow swiping between pages"
 swipeOnDesktop: "Allow mobile-style swiping on desktop"
 logoImageUrl: "Logo image URL"
 showAdminUpdates: "Indicate a new Calckey version is avaliable (admin only)"

packages/client/src/pages/settings/general.vue

@@ -45,6 +45,9 @@
 				class="_formBlock"
 				>{{ i18n.ts.useReactionPickerForContextMenu }}</FormSwitch
 			>
+			<FormSwitch v-model="swipeOnMobile" class="_formBlock">{{
+				i18n.ts.swipeOnMobile
+			}}</FormSwitch>
 			<FormSwitch v-model="swipeOnDesktop" class="_formBlock">{{
 				i18n.ts.swipeOnDesktop
 			}}</FormSwitch>
@@ -339,6 +342,9 @@ const showUpdates = computed(defaultStore.makeGetterSetter("showUpdates"));
 const swipeOnDesktop = computed(
 	defaultStore.makeGetterSetter("swipeOnDesktop")
 );
+const swipeOnMobile = computed(
+	defaultStore.makeGetterSetter("swipeOnMobile")
+);
 const showAdminUpdates = computed(
 	defaultStore.makeGetterSetter("showAdminUpdates")
 );
@@ -379,6 +385,7 @@ watch(
 		overridedDeviceKind,
 		showAds,
 		showUpdates,
+		swipeOnMobile,
 		swipeOnDesktop,
 		seperateRenoteQuote,
 		showAdminUpdates,

packages/client/src/pages/timeline.vue

@@ -45,12 +45,7 @@
 						:modules="[Virtual]"
 						:space-between="20"
 						:virtual="true"
-						:allow-touch-move="
-							!(
-								deviceKind === 'desktop' &&
-								!defaultStore.state.swipeOnDesktop
-							)
-						"
+						:allow-touch-move="defaultStore.state.swipeOnMobile && ( deviceKind !== 'desktop' || defaultStore.state.swipeOnDesktop )"
 						@swiper="setSwiperRef"
 						@slide-change="onSlideChange"
 					>

packages/client/src/store.ts

@@ -314,6 +314,10 @@ export const defaultStore = markRaw(
 			where: "device",
 			default: false,
 		},
+		swipeOnMobile: {
+			where: "device",
+			default: true,
+		},
 		showAdminUpdates: {
 			where: "account",
 			default: true,