diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabFeatured.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabFeatured.tsx new file mode 100644 index 0000000000..b447894c50 --- /dev/null +++ b/libs/remix-ui/home-tab/src/lib/components/homeTabFeatured.tsx @@ -0,0 +1,52 @@ +/* eslint-disable @typescript-eslint/no-unused-vars */ +import React, { useEffect, useState, useRef } from 'react' + +function HomeTabFeatured () { + const [state, setState] = useState<{ + searchInput: string + }>({ + searchInput: '' + }) + useEffect(() => { + + document.addEventListener("keyup", (e) => handleSearchKeyDown(e)) + + return () => { + document.removeEventListener("keyup", handleSearchKeyDown) + } + }, []) + + const searchInputRef = useRef(null) + const remiAudioEl = useRef(null) + + const playRemi = async () => { + remiAudioEl.current.play() + } + const handleSearchKeyDown = (e: KeyboardEvent) => { + if (e.target !== searchInputRef.current) return + if (e.key === "Enter") { + openLink() + setState(prevState => { + return { ...prevState, searchInput: '' } + }) + searchInputRef.current.value = "" + } + } + + const openLink = (url = "") => { + if (url === "") { + window.open("https://remix-ide.readthedocs.io/en/latest/search.html?q=" + state.searchInput + "&check_keywords=yes&area=default", '_blank') + } else { + window.open(url, '_blank') + } + } + + return ( +
+ +
+
+ ) +} + +export default HomeTabFeatured diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabFeaturedPlugins.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabFeaturedPlugins.tsx new file mode 100644 index 0000000000..d13c0da443 --- /dev/null +++ b/libs/remix-ui/home-tab/src/lib/components/homeTabFeaturedPlugins.tsx @@ -0,0 +1,52 @@ +/* eslint-disable @typescript-eslint/no-unused-vars */ +import React, { useEffect, useState, useRef } from 'react' + +function HomeTabFeaturedPlugins () { + const [state, setState] = useState<{ + searchInput: string + }>({ + searchInput: '' + }) + useEffect(() => { + + document.addEventListener("keyup", (e) => handleSearchKeyDown(e)) + + return () => { + document.removeEventListener("keyup", handleSearchKeyDown) + } + }, []) + + const searchInputRef = useRef(null) + const remiAudioEl = useRef(null) + + const playRemi = async () => { + remiAudioEl.current.play() + } + const handleSearchKeyDown = (e: KeyboardEvent) => { + if (e.target !== searchInputRef.current) return + if (e.key === "Enter") { + openLink() + setState(prevState => { + return { ...prevState, searchInput: '' } + }) + searchInputRef.current.value = "" + } + } + + const openLink = (url = "") => { + if (url === "") { + window.open("https://remix-ide.readthedocs.io/en/latest/search.html?q=" + state.searchInput + "&check_keywords=yes&area=default", '_blank') + } else { + window.open(url, '_blank') + } + } + + return ( +
+ +
+
+ ) +} + +export default HomeTabFeaturedPlugins diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabFile.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabFile.tsx index 4b6609c613..c7780c7f1c 100644 --- a/libs/remix-ui/home-tab/src/lib/components/homeTabFile.tsx +++ b/libs/remix-ui/home-tab/src/lib/components/homeTabFile.tsx @@ -137,7 +137,7 @@ function HomeTabFile ({plugin}: HomeTabFileProps) {
- + { diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabGetStarted.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabGetStarted.tsx new file mode 100644 index 0000000000..6eba73163a --- /dev/null +++ b/libs/remix-ui/home-tab/src/lib/components/homeTabGetStarted.tsx @@ -0,0 +1,19 @@ +/* eslint-disable @typescript-eslint/no-unused-vars */ +import React, { useEffect, useState, useRef } from 'react' + +function HomeTabGetStarted () { + const [state, setState] = useState<{ + searchInput: string + }>({ + searchInput: '' + }) + + return ( +
+ +
+
+ ) +} + +export default HomeTabGetStarted diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabLearn.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabLearn.tsx index d53d103cfe..785d234ba1 100644 --- a/libs/remix-ui/home-tab/src/lib/components/homeTabLearn.tsx +++ b/libs/remix-ui/home-tab/src/lib/components/homeTabLearn.tsx @@ -1,14 +1,23 @@ /* eslint-disable @typescript-eslint/no-unused-vars */ import React, { useEffect, useState, useContext } from 'react' import { ThemeContext } from '../themeContext' +declare global { + interface Window { + _paq: any + } +} +const _paq = window._paq = window._paq || [] //eslint-disable-line enum VisibleTutorial { Basics, Intermediate, Advanced } +interface HomeTabLearnProps { + plugin: any +} -function HomeTabLearn () { +function HomeTabLearn ({plugin}: HomeTabLearnProps) { const [state, setState] = useState<{ visibleTutorial: VisibleTutorial }>({ @@ -18,13 +27,19 @@ function HomeTabLearn () { const themeFilter = useContext(ThemeContext) const openLink = () => { - window.open("https://remix-ide.readthedocs.io/en/latest/search.html?q=learneth&check_keywords=yes&area=default", '_blank') + window.open("https://remix-ide.readthedocs.io/en/latest/remix_tutorials_learneth.html?highlight=learneth#learneth-tutorial-repos", '_blank') + } + + const startLearnEth = async () => { + await plugin.appManager.activatePlugin(['solidity', 'LearnEth', 'solidityUnitTesting']) + plugin.verticalIcons.select('LearnEth') + _paq.push(['trackEvent', 'homeTab', 'startLearnEth']) } return (
- +
-
} - - +
} - +
}
diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabScamAlert.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabScamAlert.tsx new file mode 100644 index 0000000000..94ff388dd8 --- /dev/null +++ b/libs/remix-ui/home-tab/src/lib/components/homeTabScamAlert.tsx @@ -0,0 +1,29 @@ +/* eslint-disable @typescript-eslint/no-unused-vars */ +import React, { useEffect, useState, useRef } from 'react' + +function HomeTabScamAlert () { + return ( +
+ +
+ + + Scam Alerts: + + + The only URL Remix uses is remix.ethereum.org + + + Beware of online videos promoting "liquidity front runner bots": + Learn more + + + Additional safety tips:  here + +
+
+
+ ) +} + +export default HomeTabScamAlert diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx index a53e4c4329..379bdd809d 100644 --- a/libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx +++ b/libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx @@ -63,6 +63,10 @@ function HomeTabTitle () { onClick={ ()=> openLink("https://twitter.com/EthereumRemix")} className="h-100 pl-2 btn fab fa-twitter"> + The Native IDE for Solidity Development. diff --git a/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.tsx b/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.tsx index c3f56d458d..b123a1c7e4 100644 --- a/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.tsx +++ b/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.tsx @@ -8,6 +8,9 @@ import BasicLogo from 'libs/remix-ui/vertical-icons-panel/src/lib/components/Bas import HomeTabTitle from './components/homeTabTitle' import HomeTabFile from './components/homeTabFile' import HomeTabLearn from './components/homeTabLearn' +import HomeTabScamAlert from './components/homeTabScamAlert' +import HomeTabGetStarted from './components/homeTabGetStarted' +import HomeTabFeatured from './components/homeTabFeatured' declare global { interface Window { @@ -65,7 +68,6 @@ export const RemixUiHomeTab = (props: RemixUiHomeTabProps) => { document.body.removeChild(scriptTwitter) } }, []) - const startSolidity = async () => { await plugin.appManager.activatePlugin(['solidity', 'udapp', 'solidityStaticAnalysis', 'solidityUnitTesting']) @@ -101,23 +103,19 @@ export const RemixUiHomeTab = (props: RemixUiHomeTabProps) => { return (
-
+
- +
-
+
- -
-
- -
-
-
+ + +
) @@ -134,22 +132,7 @@ export default RemixUiHomeTab
-
- - - Scam Alerts: - - - The only URL Remix uses is remix.ethereum.org - - - Beware of online videos promoting "liquidity front runner bots": - Learn more - - - Additional safety tips:  here - -
+
playRemi() } alt="">