diff --git a/plugins/Last.fm/src/ui/pages/Settings.tsx b/plugins/Last.fm/src/ui/pages/Settings.tsx index c8e2af1..af7d916 100644 --- a/plugins/Last.fm/src/ui/pages/Settings.tsx +++ b/plugins/Last.fm/src/ui/pages/Settings.tsx @@ -1,13 +1,12 @@ import { plugin } from "@vendetta"; -import { Forms } from "@vendetta/ui/components"; -import { useProxy } from "@vendetta/storage"; import { getAssetIDByName } from "@vendetta/ui/assets"; import { showToast } from "@vendetta/ui/toasts"; import { React } from "@vendetta/metro/common"; -import { ScrollView, View, Linking } from "react-native"; +import { Linking } from "react-native"; import { changelog, currentVersion } from "../../changelog"; import { findByProps } from "@vendetta/metro"; +const { ScrollView } = findByProps("ScrollView"); const { TableRowGroup, TableSwitchRow, Stack, TableRow } = findByProps( "TableSwitchRow", "TableRowGroup", @@ -21,18 +20,20 @@ import Constants from "../../constants"; import { initialize } from "../../manager"; import { lastfmClient } from "../../utils/lastfm"; +const get = (k: string, fallback: any = "") => plugin.storage[k] ?? fallback; +const set = (k: string, v: any) => (plugin.storage[k] = v); + export default function Settings() { - useProxy(currentSettings); + const [_, forceUpdate] = React.useReducer((x) => ~x, 0); + const update = () => forceUpdate(); const [loading, setLoading] = React.useState(false); - const saveSettings = (key: string, value: any) => { - currentSettings[key] = value; - plugin.storage[key] = value; - }; - const testConnection = async () => { - if (!currentSettings.username || !currentSettings.apiKey) { + const username = get("username"); + const apiKey = get("apiKey"); + + if (!username || !apiKey) { showToast( "Please enter both username and API key", getAssetIDByName("Small"), @@ -62,21 +63,29 @@ export default function Settings() { saveSettings("username", v)} + value={get("username")} + onChange={(v: string) => { + set("username", v); + update(); + }} isClearable /> saveSettings("apiKey", v)} + value={get("apiKey")} + onChange={(v: string) => { + set("apiKey", v); + update(); + }} secureTextEntry={true} isClearable /> Linking.openURL("https://www.last.fm/api/")} + subLabel="https://www.last.fm/api/account/create" + onPress={() => + Linking.openURL("https://www.last.fm/api/account/create") + } /> saveSettings("appName", v)} + value={get("appName", Constants.DEFAULT_SETTINGS.appName)} + onChange={(v: string) => { + set("appName", v); + update(); + }} isClearable /> { const interval = Number(v); if (interval >= Constants.MIN_UPDATE_INTERVAL) { - saveSettings("timeInterval", interval); + set("timeInterval", interval); + update(); } else { showToast( `Minimum interval is ${Constants.MIN_UPDATE_INTERVAL} seconds`, @@ -118,43 +133,44 @@ export default function Settings() { - saveSettings("listeningTo", value) - } + value={get("listeningTo", Constants.DEFAULT_SETTINGS.listeningTo)} + onValueChange={(value: boolean) => { + set("listeningTo", value); + update(); + }} /> - saveSettings("showTimestamp", value) - } + value={get( + "showTimestamp", + Constants.DEFAULT_SETTINGS.showTimestamp, + )} + onValueChange={(value: boolean) => { + set("showTimestamp", value); + update(); + }} /> - saveSettings("ignoreSpotify", value) - } + value={get( + "ignoreSpotify", + Constants.DEFAULT_SETTINGS.ignoreSpotify, + )} + onValueChange={(value: boolean) => { + set("ignoreSpotify", value); + update(); + }} /> - saveSettings("verboseLogging", value) - } + value={get( + "verboseLogging", + Constants.DEFAULT_SETTINGS.verboseLogging, + )} + onValueChange={(value: boolean) => { + set("verboseLogging", value); + update(); + }} />