[Settings] Overhaul
This commit is contained in:
parent
a46c9c8828
commit
304757d374
8 changed files with 105 additions and 69 deletions
5
src/def.d.ts
vendored
5
src/def.d.ts
vendored
|
@ -59,6 +59,11 @@ interface Plugin {
|
|||
js: string;
|
||||
}
|
||||
|
||||
interface Settings {
|
||||
debuggerUrl: string;
|
||||
developerSettings: boolean;
|
||||
}
|
||||
|
||||
type Indexable<Type> = { [index: string]: Type }
|
||||
|
||||
interface VendettaObject {
|
||||
|
|
5
src/lib/settings.ts
Normal file
5
src/lib/settings.ts
Normal file
|
@ -0,0 +1,5 @@
|
|||
import createStorage from "@lib/storage";
|
||||
import { Settings } from "@types";
|
||||
|
||||
// TODO: Switch to using 'any' as type?
|
||||
export default createStorage<Settings>("VENDETTA_SETTINGS");
|
|
@ -1,5 +1,6 @@
|
|||
import { Forms } from "@ui/components";
|
||||
import { getAssetIDByName } from "@ui/assets";
|
||||
import settings from "@/lib/settings";
|
||||
|
||||
const { FormRow, FormSection, FormDivider } = Forms;
|
||||
|
||||
|
@ -23,13 +24,17 @@ export default function SettingsSection({ navigation }: SettingsSectionProps) {
|
|||
trailing={FormRow.Arrow}
|
||||
onPress={() => navigation.push("VendettaPlugins")}
|
||||
/>
|
||||
<FormDivider />
|
||||
<FormRow
|
||||
label="Asset Browser"
|
||||
leading={() => <FormRow.Icon source={getAssetIDByName("grid")} />}
|
||||
trailing={FormRow.Arrow}
|
||||
onPress={() => navigation.push("VendettaAssetBrowser")}
|
||||
/>
|
||||
{settings.developerSettings && (
|
||||
<>
|
||||
<FormDivider />
|
||||
<FormRow
|
||||
label="Developer"
|
||||
leading={() => <FormRow.Icon source={getAssetIDByName("ic_progress_wrench_24px")} />}
|
||||
trailing={FormRow.Arrow}
|
||||
onPress={() => navigation.push("VendettaDeveloper")}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</FormSection>
|
||||
)
|
||||
}
|
|
@ -5,7 +5,7 @@ import findInReactTree from "@utils/findInReactTree";
|
|||
import SettingsSection from "@ui/settings/components/SettingsSection";
|
||||
import General from "@ui/settings/pages/General";
|
||||
import Plugins from "@ui/settings/pages/Plugins";
|
||||
import AssetBrowser from "@ui/settings/pages/AssetBrowser";
|
||||
import Developer from "@ui/settings/pages/Developer";
|
||||
|
||||
const screensModule = findByDisplayName("getScreens", false);
|
||||
const settingsModule = findByDisplayName("UserSettingsOverviewWrapper", false);
|
||||
|
@ -23,10 +23,10 @@ export default function initSettings() {
|
|||
title: "Plugins",
|
||||
render: Plugins
|
||||
},
|
||||
VendettaAssetBrowser: {
|
||||
title: "Asset Browser",
|
||||
render: AssetBrowser,
|
||||
},
|
||||
VendettaDeveloper: {
|
||||
title: "Developer",
|
||||
render: Developer
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
@ -1,30 +0,0 @@
|
|||
import { ReactNative as RN } from "@metro/common";
|
||||
import { Forms } from "@ui/components";
|
||||
import { all } from "@ui/assets";
|
||||
import AssetDisplay from "@ui/settings/components/AssetDisplay";
|
||||
|
||||
const { FormInput, FormDivider } = Forms;
|
||||
|
||||
export default function AssetBrowser() {
|
||||
const [searchName, setSearchName] = React.useState("");
|
||||
|
||||
return (
|
||||
<>
|
||||
<FormInput
|
||||
value={searchName}
|
||||
onChange={(v: string) => setSearchName(v)}
|
||||
title="SEARCH"
|
||||
/>
|
||||
<RN.FlatList
|
||||
data={Object.values(all).filter(a => a.name.includes(searchName))}
|
||||
renderItem={({ item }) => (
|
||||
<>
|
||||
<AssetDisplay asset={item} />
|
||||
<FormDivider />
|
||||
</>
|
||||
)}
|
||||
keyExtractor={item => item.name}
|
||||
/>
|
||||
</>
|
||||
)
|
||||
}
|
53
src/ui/settings/pages/Developer.tsx
Normal file
53
src/ui/settings/pages/Developer.tsx
Normal file
|
@ -0,0 +1,53 @@
|
|||
import { ReactNative as RN } from "@metro/common";
|
||||
import { Forms } from "@ui/components";
|
||||
import { getAssetIDByName } from "@ui/assets";
|
||||
import { connectToDebugger } from "@lib/debug";
|
||||
import { all } from "@ui/assets";
|
||||
import settings from "@lib/settings";
|
||||
import AssetDisplay from "@ui/settings/components/AssetDisplay";
|
||||
|
||||
const { FormSection, FormRow, FormInput, FormDivider } = Forms;
|
||||
|
||||
export default function Developer() {
|
||||
const [debuggerUrl, setDebuggerUrl] = React.useState(settings.debuggerUrl || "");
|
||||
const [searchName, setSearchName] = React.useState("");
|
||||
|
||||
return (
|
||||
<>
|
||||
<FormSection title="Debug">
|
||||
<FormInput
|
||||
value={debuggerUrl}
|
||||
onChange={(v: string) => {
|
||||
settings.debuggerUrl = v;
|
||||
setDebuggerUrl(v);
|
||||
}}
|
||||
title="DEBUGGER URL"
|
||||
/>
|
||||
<FormDivider />
|
||||
<FormRow
|
||||
label="Connect to debug websocket"
|
||||
leading={() => <FormRow.Icon source={getAssetIDByName("copy")} />}
|
||||
trailing={FormRow.Arrow}
|
||||
onPress={() => connectToDebugger(debuggerUrl)}
|
||||
/>
|
||||
</FormSection>
|
||||
<FormSection title="Assets">
|
||||
<FormInput
|
||||
value={searchName}
|
||||
onChange={(v: string) => setSearchName(v)}
|
||||
title="SEARCH"
|
||||
/>
|
||||
<RN.FlatList
|
||||
data={Object.values(all).filter(a => a.name.includes(searchName))}
|
||||
renderItem={({ item }) => (
|
||||
<>
|
||||
<AssetDisplay asset={item} />
|
||||
<FormDivider />
|
||||
</>
|
||||
)}
|
||||
keyExtractor={item => item.name}
|
||||
/>
|
||||
</FormSection>
|
||||
</>
|
||||
)
|
||||
}
|
|
@ -1,17 +1,17 @@
|
|||
import { ReactNative as RN, url } from "@metro/common";
|
||||
import { DISCORD_SERVER, GITHUB } from "@lib/constants";
|
||||
import { connectToDebugger } from "@lib/debug";
|
||||
import { getAssetIDByName } from "@ui/assets";
|
||||
import { Forms } from "@ui/components";
|
||||
import Version from "@ui/settings/components/Version";
|
||||
import settings from "@lib/settings";
|
||||
|
||||
const { FormRow, FormSection, FormInput, FormDivider } = Forms;
|
||||
const { FormRow, FormSection, FormDivider, FormSwitch } = Forms;
|
||||
const InfoDictionaryManager = RN.NativeModules.InfoDictionaryManager;
|
||||
const hermesProps = window.HermesInternal.getRuntimeProperties();
|
||||
const rnVer = RN.Platform.constants.reactNativeVersion;
|
||||
|
||||
export default function General() {
|
||||
const [debuggerUrl, setDebuggerUrl] = React.useState("");
|
||||
const [devSettings, setDevSettings] = React.useState(settings.developerSettings || false);
|
||||
|
||||
const versions = [
|
||||
{
|
||||
|
@ -41,39 +41,18 @@ export default function General() {
|
|||
<FormSection title="Links">
|
||||
<FormRow
|
||||
label="Discord Server"
|
||||
leading={() => <FormRow.Icon source={getAssetIDByName("Discord")} />}
|
||||
leading={<FormRow.Icon source={getAssetIDByName("Discord")} />}
|
||||
trailing={FormRow.Arrow}
|
||||
onPress={() => url.openURL(DISCORD_SERVER)}
|
||||
/>
|
||||
<FormDivider />
|
||||
<FormRow
|
||||
label="GitHub"
|
||||
leading={() => <FormRow.Icon source={getAssetIDByName("img_account_sync_github_white")} />}
|
||||
leading={<FormRow.Icon source={getAssetIDByName("img_account_sync_github_white")} />}
|
||||
trailing={FormRow.Arrow}
|
||||
onPress={() => url.openURL(GITHUB)}
|
||||
/>
|
||||
</FormSection>
|
||||
<FormSection title="Debug">
|
||||
<FormInput
|
||||
value={debuggerUrl}
|
||||
onChange={(v: string) => setDebuggerUrl(v)}
|
||||
title="DEBUGGER URL"
|
||||
/>
|
||||
<FormDivider />
|
||||
<FormRow
|
||||
label="Connect to debug websocket"
|
||||
leading={() => <FormRow.Icon source={getAssetIDByName("copy")} />}
|
||||
trailing={FormRow.Arrow}
|
||||
onPress={() => connectToDebugger(debuggerUrl)}
|
||||
/>
|
||||
<FormDivider />
|
||||
<FormRow
|
||||
label="Reload Discord"
|
||||
leading={() => <FormRow.Icon source={getAssetIDByName("ic_message_retry")} />}
|
||||
trailing={FormRow.Arrow}
|
||||
onPress={() => RN.NativeModules.BundleUpdaterManager.reload()}
|
||||
/>
|
||||
</FormSection>
|
||||
<FormSection title="Versions">
|
||||
{versions.map((v) => (
|
||||
<>
|
||||
|
@ -82,6 +61,26 @@ export default function General() {
|
|||
</>
|
||||
))}
|
||||
</FormSection>
|
||||
<FormSection title="Actions">
|
||||
<FormRow
|
||||
label="Reload Discord"
|
||||
leading={<FormRow.Icon source={getAssetIDByName("ic_message_retry")} />}
|
||||
trailing={FormRow.Arrow}
|
||||
onPress={() => RN.NativeModules.BundleUpdaterManager.reload()}
|
||||
/>
|
||||
<FormDivider />
|
||||
<FormRow
|
||||
label="Developer Settings"
|
||||
leading={<FormRow.Icon source={getAssetIDByName("ic_progress_wrench_24px")} />}
|
||||
trailing={<FormSwitch
|
||||
value={devSettings}
|
||||
onValueChange={(v: boolean) => {
|
||||
settings.developerSettings = v;
|
||||
setDevSettings(v);
|
||||
}}
|
||||
/>}
|
||||
/>
|
||||
</FormSection>
|
||||
</RN.ScrollView>
|
||||
)
|
||||
}
|
|
@ -11,7 +11,6 @@ export default function Plugins() {
|
|||
const [pluginUrl, setPluginUrl] = React.useState("");
|
||||
const [pluginList, setPluginList] = React.useState(plugins);
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
<FormInput
|
||||
|
|
Loading…
Reference in a new issue