diff --git a/apps/www/components/Sections/TwitterSocialProof.tsx b/apps/www/components/Sections/TwitterSocialProof.tsx index a9a52d8ede0..a0b84286e12 100644 --- a/apps/www/components/Sections/TwitterSocialProof.tsx +++ b/apps/www/components/Sections/TwitterSocialProof.tsx @@ -9,7 +9,27 @@ function TwitterSocialProof() { // base path for images const { basePath } = useRouter() - const [showAll, setShowAll] = useState(false) + const [tweets, setTweets] = useState(Tweets.slice(0, 10)) + const [showButton, setShowButton] = useState(true) + + const handleShowMore = () => { + setTweets((prevTweets) => [ + ...prevTweets, + ...Tweets.slice(prevTweets.length, prevTweets.length + 10), + ]) + + if (tweets.length >= Tweets.length) { + setShowButton(false) + } + + const container = document.querySelector('.tweet-container') + // @ts-ignore + container.style.height = `${container.clientHeight + 400}px` + + const button = document.querySelector('.show-button') + // @ts-ignore + button.style.marginBottom = `${parseInt(button.style.marginBottom) + 20}px` + } return ( <> @@ -38,9 +58,13 @@ function TwitterSocialProof() {
-
- {!showAll && ( -
+
+ {showButton && ( +
)} {Tweets.map((tweet: any, i: number) => (
@@ -55,10 +79,13 @@ function TwitterSocialProof() {
))} - {!showAll && ( -
-
)} diff --git a/apps/www/components/TweetCard.tsx b/apps/www/components/TweetCard.tsx index 4f78c18094f..52ba28ef201 100644 --- a/apps/www/components/TweetCard.tsx +++ b/apps/www/components/TweetCard.tsx @@ -31,9 +31,7 @@ function TweetCard(props: TweetCard) { ) : (
)} -

- {props.handle} -

+

{props.handle}