Fix settings scrolling

plugins/Last.fm/src/index.tsx

@@ -3,7 +3,7 @@ import { FluxDispatcher } from "@vendetta/metro/common";
 import { getAssetIDByName } from "@vendetta/ui/assets";
 import { showToast } from "@vendetta/ui/toasts";
 import { React } from "@vendetta/metro/common";
-import { View } from "react-native";
+import { ScrollView } from "react-native";
 import { Forms } from "@vendetta/ui/components";
 
 import { lazy } from "react";
@@ -43,18 +43,18 @@ export const currentSettings = new Proxy(plugin.storage, {
   },
 });
 
-// Wrap Settings component in error boundary
+// Settings component with error handling
 const Settings = lazy(() =>
   import("./ui/pages/Settings").catch((err) => {
     console.error("[Last.fm] Failed to load settings:", err);
     return {
       default: () => (
-        <View style={{ padding: 16 }}>
+        <ScrollView style={{ flex: 1 }} contentContainerStyle={{ padding: 16 }}>
           <FormText style={{ color: "#ED4245" }}>
             Failed to load Last.fm settings. Please check your connection and
             reload Discord.
           </FormText>
-        </View>
+        </ScrollView>
       ),
     };
   }),
@@ -84,17 +84,15 @@ async function tryInitialize() {
 
 export default {
   settings: () => (
-    <View style={{ flex: 1 }}>
-      <React.Suspense
-        fallback={
-          <View style={{ padding: 16 }}>
-            <FormText>Loading Last.fm settings...</FormText>
-          </View>
-        }
-      >
-        <Settings />
-      </React.Suspense>
-    </View>
+    <React.Suspense
+      fallback={
+        <ScrollView style={{ flex: 1 }} contentContainerStyle={{ padding: 16 }}>
+          <FormText>Loading Last.fm settings...</FormText>
+        </ScrollView>
+      }
+    >
+      <Settings />
+    </React.Suspense>
   ),
   onLoad() {
     pluginState.pluginStopped = false;

plugins/Last.fm/src/ui/pages/Settings.tsx

@@ -4,7 +4,7 @@ import { useProxy } from "@vendetta/storage";
 import { getAssetIDByName } from "@vendetta/ui/assets";
 import { showToast } from "@vendetta/ui/toasts";
 import { React } from "@vendetta/metro/common";
-import { View } from "react-native";
+import { ScrollView, View } from "react-native";
 
 import { currentSettings, pluginState } from "../..";
 import Constants from "../../constants";
@@ -49,7 +49,12 @@ export default function Settings() {
   };
 
   return (
-    <View style={{ flex: 1 }}>
+    <ScrollView
+      style={{ flex: 1 }}
+      contentContainerStyle={{ paddingBottom: 20 }}
+      bounces={false}
+      showsVerticalScrollIndicator={true}
+    >
       <FormSection title="Account Settings">
         <FormInput
           title="Last.fm Username"
@@ -176,7 +181,7 @@ export default function Settings() {
 
       <FormSection title="Plugin Status">
         <View style={{ padding: 10 }}>
-          <FormText>
+          <FormText style={{ marginBottom: 4 }}>
             Status: {pluginState.pluginStopped ? "Stopped" : "Running"}
           </FormText>
           <FormText>
@@ -186,9 +191,17 @@ export default function Settings() {
         </View>
       </FormSection>
 
-      <FormText style={{ padding: 16, opacity: 0.5, textAlign: "center" }}>
+      <FormText
+        style={{
+          padding: 16,
+          opacity: 0.5,
+          textAlign: "center",
+          marginTop: 8,
+          marginBottom: 8,
+        }}
+      >
         Version 2.0.0
       </FormText>
-    </View>
+    </ScrollView>
   );
 }