directly import react & react-native

This commit is contained in:
amsyarasyiq 2023-04-05 14:37:50 +08:00
parent 5938714c73
commit 9a98225dd7
4 changed files with 149 additions and 146 deletions

View file

@ -73,10 +73,7 @@ async function buildPlugin(plugin) {
}, },
plugins: [ plugins: [
nodeResolve({ nodeResolve({
resolveOnly: (id) => ![ resolveOnly: (id) => !["react", "react-native"].includes(id)
"react",
"react-native"
].includes(id)
}), }),
commonjs(), commonjs(),
{ {

View file

@ -1,4 +1,4 @@
import { NavigationNative, React, ReactNative } from "@vendetta/metro/common"; import { NavigationNative, React } from "@vendetta/metro/common";
import { storage } from "@vendetta/plugin"; import { storage } from "@vendetta/plugin";
import { useProxy } from "@vendetta/storage"; import { useProxy } from "@vendetta/storage";
import { getAssetIDByName } from "@vendetta/ui/assets"; import { getAssetIDByName } from "@vendetta/ui/assets";
@ -9,7 +9,9 @@ import { currentSettings } from ".";
import Constants from "./constants"; import Constants from "./constants";
import { initialize } from "./utils"; import { initialize } from "./utils";
const { ScrollView, TouchableOpacity, Text } = ReactNative; import { useEffect } from "react";
import { ScrollView, Text, TouchableOpacity } from "react-native";
const { FormInput, FormDivider, FormSwitchRow, FormText, FormIcon } = Forms; const { FormInput, FormDivider, FormSwitchRow, FormText, FormIcon } = Forms;
function UpdateButton() { function UpdateButton() {
@ -35,7 +37,7 @@ export default function Settings() {
const settings = useProxy(storage) as PluginSettings; const settings = useProxy(storage) as PluginSettings;
const navigation = NavigationNative.useNavigation(); const navigation = NavigationNative.useNavigation();
React.useEffect(() => { useEffect(() => {
navigation.setOptions({ navigation.setOptions({
title: "Last.fm Configuration", title: "Last.fm Configuration",
headerRight: UpdateButton headerRight: UpdateButton

View file

@ -1,13 +1,14 @@
import { findByStoreName } from "@vendetta/metro"; import { findByStoreName } from "@vendetta/metro";
import { NavigationNative, React, ReactNative, stylesheet } from "@vendetta/metro/common"; import { NavigationNative, React, stylesheet } from "@vendetta/metro/common";
import { useProxy } from "@vendetta/storage"; import { useProxy } from "@vendetta/storage";
import { getAssetIDByName } from "@vendetta/ui/assets"; import { getAssetIDByName } from "@vendetta/ui/assets";
import { Forms } from "@vendetta/ui/components"; import { Forms } from "@vendetta/ui/components";
import { settings, SettingsSchema } from "."; import { useEffect, useState } from "react";
import { FlatList, Image, ScrollView, TouchableOpacity } from "react-native";
import { SettingsSchema, settings } from ".";
const UserStore = findByStoreName("UserStore"); const UserStore = findByStoreName("UserStore");
const { ScrollView, TouchableOpacity, Image, FlatList } = ReactNative;
const { FormInput, FormDivider, FormText, FormIcon, FormRow, FormSection, FormSwitchRow } = Forms; const { FormInput, FormDivider, FormText, FormIcon, FormRow, FormSection, FormSwitchRow } = Forms;
const styles = stylesheet.createThemedStyleSheet({ const styles = stylesheet.createThemedStyleSheet({
@ -28,7 +29,7 @@ function AddButton({ callback }: { callback: () => void }) {
} }
function AddRow({ onFinish }: { onFinish: () => void }) { function AddRow({ onFinish }: { onFinish: () => void }) {
const [value, setValue] = React.useState(""); const [value, setValue] = useState("");
const onPressCallback = () => { const onPressCallback = () => {
if (!isNaN(parseInt(value)) && UserStore.getUser(value) && !settings.exempted.includes(value)) { if (!isNaN(parseInt(value)) && UserStore.getUser(value) && !settings.exempted.includes(value)) {
@ -61,10 +62,10 @@ function AddRow({ onFinish }: { onFinish: () => void }) {
export default function Settings() { export default function Settings() {
useProxy(settings) as SettingsSchema; useProxy(settings) as SettingsSchema;
const [shouldShowAdd, setShouldShowAdd] = React.useState(false); const [shouldShowAdd, setShouldShowAdd] = useState(false);
const navigation = NavigationNative.useNavigation(); const navigation = NavigationNative.useNavigation();
React.useEffect(() => { useEffect(() => {
navigation.setOptions({ navigation.setOptions({
headerRight: () => <AddButton callback={() => setShouldShowAdd(true)} /> headerRight: () => <AddButton callback={() => setShouldShowAdd(true)} />
}); });

View file

@ -1,11 +1,12 @@
import { React, ReactNative, stylesheet } from "@vendetta/metro/common"; import { React, stylesheet } from "@vendetta/metro/common";
import { storage } from "@vendetta/plugin"; import { storage } from "@vendetta/plugin";
import { useProxy } from "@vendetta/storage"; import { useProxy } from "@vendetta/storage";
import { semanticColors } from "@vendetta/ui"; import { semanticColors } from "@vendetta/ui";
import { Forms } from "@vendetta/ui/components"; import { Forms } from "@vendetta/ui/components";
import { ScrollView } from "react-native";
const { FormSection, FormInput, FormRow, FormSwitch, FormText } = Forms; const { FormSection, FormInput, FormRow, FormSwitch, FormText } = Forms;
const { ScrollView } = ReactNative;
const styles = stylesheet.createThemedStyleSheet({ const styles = stylesheet.createThemedStyleSheet({
subText: { subText: {
@ -22,135 +23,137 @@ const styles = stylesheet.createThemedStyleSheet({
export default function Settings() { export default function Settings() {
const settings = useProxy(storage) as { [key: string]: any }; const settings = useProxy(storage) as { [key: string]: any };
return (<ScrollView> return (
<FormSection title="Basic"> <ScrollView>
<FormInput <FormSection title="Basic">
title="Application Name" <FormInput
value={settings.app_name} title="Application Name"
placeholder="Vendetta" value={settings.app_name}
onChange={v => settings.app_name = v} placeholder="Vendetta"
/> onChange={v => settings.app_name = v}
<FormInput />
title="Application ID" <FormInput
value={settings.application_id} title="Application ID"
placeholder="1054951789318909972" value={settings.application_id}
onChange={v => settings.application_id = v} placeholder="1054951789318909972"
keyboardType="numeric" onChange={v => settings.application_id = v}
/> keyboardType="numeric"
<FormInput />
title="Type" <FormInput
value={settings.type} title="Type"
placeholder="0" value={settings.type}
onChange={v => settings.type = v} placeholder="0"
keyboardType="numeric" onChange={v => settings.type = v}
/> keyboardType="numeric"
<FormInput />
title="Details" <FormInput
value={settings.details} title="Details"
placeholder="Competitive" value={settings.details}
onChange={v => settings.details = v} placeholder="Competitive"
/> onChange={v => settings.details = v}
<FormInput />
title="State" <FormInput
value={settings.state} title="State"
placeholder="Playing Solo" value={settings.state}
onChange={v => settings.state = v} placeholder="Playing Solo"
/> onChange={v => settings.state = v}
</FormSection> />
<FormSection title="Images"> </FormSection>
<FormInput <FormSection title="Images">
title="Large Image Asset Key or URL" <FormInput
value={settings.large_image} title="Large Image Asset Key or URL"
placeholder="large_image_here" value={settings.large_image}
onChange={v => settings.large_image = v} placeholder="large_image_here"
/> onChange={v => settings.large_image = v}
<FormInput />
title="Large Image Text" <FormInput
value={settings.large_image_text} title="Large Image Text"
placeholder="Playing on Joe's lobby" value={settings.large_image_text}
disabled={!settings.large_image} placeholder="Playing on Joe's lobby"
onChange={v => settings.large_image_text = v} disabled={!settings.large_image}
/> onChange={v => settings.large_image_text = v}
<FormInput />
title="Small Image Asset Key or URL" <FormInput
value={settings.small_image} title="Small Image Asset Key or URL"
placeholder="small_image_here" value={settings.small_image}
onChange={v => settings.small_image = v} placeholder="small_image_here"
/> onChange={v => settings.small_image = v}
<FormInput />
title="Small Image Text" <FormInput
value={settings.small_image_text} title="Small Image Text"
placeholder="Solo" value={settings.small_image_text}
disabled={!settings.small_image} placeholder="Solo"
onChange={v => settings.small_image_text = v} disabled={!settings.small_image}
/> onChange={v => settings.small_image_text = v}
<FormText style={styles.subText}> />
{"Image assets key can be either a Discord app asset's name or a URL to an image."} <FormText style={styles.subText}>
</FormText> {"Image assets key can be either a Discord app asset's name or a URL to an image."}
</FormSection> </FormText>
<FormSection title="Timestamps"> </FormSection>
<FormRow <FormSection title="Timestamps">
label="Enable timestamps" <FormRow
subLabel="Set whether to show timestamps or not" label="Enable timestamps"
trailing={<FormSwitch subLabel="Set whether to show timestamps or not"
value={settings.enable_timestamps} trailing={<FormSwitch
onValueChange={v => settings.enable_timestamps = v} value={settings.enable_timestamps}
/>} onValueChange={v => settings.enable_timestamps = v}
/> />}
<FormInput />
title="Start Timestamp (seconds)" <FormInput
value={settings.start_timestamp} title="Start Timestamp (seconds)"
placeholder="1234567890" value={settings.start_timestamp}
disabled={!settings.enable_timestamps} placeholder="1234567890"
onChange={v => settings.start_timestamp = v} disabled={!settings.enable_timestamps}
keyboardType="numeric" onChange={v => settings.start_timestamp = v}
/> keyboardType="numeric"
<FormInput />
title="End Timestamp (seconds)" <FormInput
value={settings.end_timestamp} title="End Timestamp (seconds)"
placeholder="1234567890" value={settings.end_timestamp}
disabled={!settings.enable_timestamps} placeholder="1234567890"
onChange={v => settings.end_timestamp = v} disabled={!settings.enable_timestamps}
keyboardType="numeric" onChange={v => settings.end_timestamp = v}
/> keyboardType="numeric"
<FormRow />
label="Use current time as start timestamp" <FormRow
subLabel="This will override the start timestamp you set above" label="Use current time as start timestamp"
disabled={!settings.enable_timestamps} subLabel="This will override the start timestamp you set above"
onPress={() => settings.start_timestamp = String(Date.now())} disabled={!settings.enable_timestamps}
trailing={FormRow.Arrow} onPress={() => settings.start_timestamp = String(Date.now())}
/> trailing={FormRow.Arrow}
<FormText style={styles.subText}> />
Leaving start timestamp blank will use the time the Discord started. <FormText style={styles.subText}>
</FormText> Leaving start timestamp blank will use the time the Discord started.
</FormSection> </FormText>
<FormSection title="Buttons"> </FormSection>
<FormInput <FormSection title="Buttons">
title="First Button Text" <FormInput
value={settings.button1_text} title="First Button Text"
placeholder="random link #1" value={settings.button1_text}
onChange={v => settings.button1_text = v} placeholder="random link #1"
/> onChange={v => settings.button1_text = v}
<FormInput />
title="First Button URL" <FormInput
value={settings.button1_URL} title="First Button URL"
placeholder="https://discord.com/vanityurl/dotcom/steakpants/flour/flower/index11.html" value={settings.button1_URL}
disabled={!settings.button1_text} placeholder="https://discord.com/vanityurl/dotcom/steakpants/flour/flower/index11.html"
onChange={v => settings.button1_URL = v} disabled={!settings.button1_text}
/> onChange={v => settings.button1_URL = v}
<FormInput />
title="Second Button Text" <FormInput
value={settings.button2_text} title="Second Button Text"
placeholder="random link #2" value={settings.button2_text}
onChange={v => settings.button2_text = v} placeholder="random link #2"
/> onChange={v => settings.button2_text = v}
<FormInput />
title="Second Button URL" <FormInput
value={settings.button2_URL} title="Second Button URL"
placeholder="https://youtu.be/w0AOGeqOnFY" value={settings.button2_URL}
disabled={!settings.button2_text} placeholder="https://youtu.be/w0AOGeqOnFY"
onChange={v => settings.button2_URL = v} disabled={!settings.button2_text}
/> onChange={v => settings.button2_URL = v}
</FormSection> />
</ScrollView>); </FormSection>
</ScrollView>
);
} }