App.js
unknown
javascript
3 years ago
2.1 kB
9
Indexable
import React, { cloneElement, useState } from "react";
import { View, TextInput, TouchableOpacity, Text } from "react-native";
import Clipboard from "@react-native-clipboard/clipboard";
export default function App() {
const [isLoading, setIsLoading] = useState(false);
const [website, setWebsite] = useState("");
const [downloadLink, setDLlink] = useState(false);
const [showCopyButton, setShowCopyButton] = useState(false);
const getyoutubelink = async () => {
setShowCopyButton(false);
setIsLoading(true);
// code to get download link
setShowCopyButton(true);
setIsLoading(false);
};
const copyToClipboard = () => {
Clipboard.setString("moji");
setShowCopyButton(false);
};
return (
<View
style={{
flex: 1,
gap: 25,
flexDirection: "column",
justifyContent: "center",
alignItems: "center",
}}
>
<TextInput
placeholder="Enter the address"
onChangeText={setWebsite}
value={website}
style={{
borderColor: "black",
borderWidth: 1,
padding: 10,
paddingLeft: 23,
paddingRight: 23,
borderRadius: 150,
width: 290,
}}
/>
<TouchableOpacity
style={{
backgroundColor: "#0091EA",
alignItems: "center",
padding: 10,
marginTop: 10,
width: 150,
borderRadius: 25,
}}
onPress={getyoutubelink}
disabled={isLoading}
>
<Text style={{ color: "#fff", fontSize: 16 }}>
{isLoading ? "please wait" : "Get download link"}
</Text>
</TouchableOpacity>
{showCopyButton && (
<TouchableOpacity
style={{
backgroundColor: "#0091EA",
alignItems: "center",
padding: 10,
marginTop: 10,
borderRadius: 5,
}}
onPress={copyToClipboard}
>
<Text style={{ color: "#fff", fontSize: 16 }}>Copy the link</Text>
</TouchableOpacity>
)}
</View>
);
}
Editor is loading...