Remove formatting

Bhavika-Maurya · Aug 19, 2022 · 677bf63 · 677bf63
1 parent fe8370c
commit 677bf63
Showing 1 changed file with 51 additions and 60 deletions.
diff --git a/src/common/home/Home.jsx b/src/common/home/Home.jsx
@@ -6,22 +6,23 @@ import { RiSlideshow4Line } from "react-icons/ri";
 import { BiShareAlt, BiAddToQueue } from "react-icons/bi";
 import { BsGithub } from "react-icons/bs";
 import { FiStar } from "react-icons/fi";
-import { FaLightbulb } from "react-icons/fa";
+import { FaLightbulb } from 'react-icons/fa';
 import { ReactComponent as Flower } from "images/icon-flower.svg";
 import { MdManageSearch } from "react-icons/md";
-import YoutubeVideoEmbed from "common/components/YouTubeEmbed";
+import YoutubeVideoEmbed from 'common/components/YouTubeEmbed';
 import FeaturedPlays from "common/playlists/FeaturedPlays";
 import Contributors from "./Contributors";
 import ExtendedFooter from "common/footer/ExtendedFooter";
 import { SearchContext } from "common/search/search-context";
 import { Tweet } from "react-twitter-widgets";
-import Spinner from "../spinner/spinner";
+import Spinner from "../spinner/spinner"
+
+
+
 
 const Home = () => {
  const [gitHubStars, setGitHubStars] = useState("...");
- const { data } = useFetch(
- "https://api.github.com/repos/reactplay/react-play"
- );
+ const { data } = useFetch("https://api.github.com/repos/reactplay/react-play");
  const { setSearchTerm, searchTerm, setFilterQuery } =
  useContext(SearchContext);
  useEffect(() => {
@@ -31,29 +32,30 @@ const Home = () => {
  level_id: "",
  tags: [],
  owner_user_id: "",
- language: "",
+ language: ""
  });
  }, [data, setSearchTerm, searchTerm, setFilterQuery]);
 
  // array of tweet IDs to show on the home page
- const tweetIdArray = [
- "1544376341172068352",
- "1530197614771458049",
- "1529884210269671424",
- "1522165831005728769",
- "1521784126717710336",
- "1518200201302974464",
- "1541802575775035392",
- "1515598358748237830",
- "1528938773710782464",
- "1532349503709122561",
- ];
+  const tweetIdArray = [
+  "1544376341172068352", 
+  "1530197614771458049",
+  "1529884210269671424",
+  "1522165831005728769",
+  "1521784126717710336",
+  "1518200201302974464",
+  "1541802575775035392",
+  "1515598358748237830",
+  "1528938773710782464",
+  "1532349503709122561"
+  ]
 
- // set the state for loading
- const [isTweetsLoading, setTweetsLoading] = useState(true);
+ // set the state for loading
+ const [isTweetsLoading,setTweetsLoading] = useState(true)
+
+ // Function to handle the tweets loading state after tweets have been loaded.
+ const tweetLoadHandler = () => setTweetsLoading(false)
 
- // Function to handle the tweets loading state after tweets have been loaded.
- const tweetLoadHandler = () => setTweetsLoading(false);
 
  return (
  <div>
@@ -92,12 +94,9 @@ const Home = () => {
  </div>{" "}
  </span>
  </a>
- </div>
+ </div> 
  <div className="video">
- <YoutubeVideoEmbed
- videoId="XrWonrp296w"
- title="🤩 Introducing ReactPlay - An Opensource Platform to Create, Learn, and Share ReactJS Projects"
- />
+ <YoutubeVideoEmbed videoId="XrWonrp296w" title="🤩 Introducing ReactPlay - An Opensource Platform to Create, Learn, and Share ReactJS Projects" />
  </div>
  </div>
  </section>
@@ -144,11 +143,7 @@ const Home = () => {
  </li>
  </ul>
  <div className="home-ideas">
- <FaLightbulb
- className="icon"
- color="var(--color-brand-primary)"
- size="48px"
- />
+ <FaLightbulb className="icon" color="var(--color-brand-primary)" size='48px'/>
  <p className="ideas-lead">Not sure how to get started?</p>
  <p className="ideas-title">We have got lot of ideas</p>
  <Link to="/ideas" className="home-anchor">
@@ -165,33 +160,29 @@ const Home = () => {
  </div>
  </section>
  <section className="home-tweets">
- <h3 className="title-primary">
- What Our{" "}
- <strong>
- <span>Community</span>
- </strong>{" "}
- Says!
- </h3>
+ <h3 className="title-primary">
+ What Our <strong>
+ <span>Community</span>
+ </strong> Says!
+ </h3>
 
- {isTweetsLoading && <Spinner />}
- <div
- className={
- isTweetsLoading ? "tweets-container" : "tweets-container active"
- }
- >
- {tweetIdArray.map((id) => (
- <Tweet
- key={id}
- tweetId={id}
- onLoad={tweetLoadHandler}
- options={{
- width: "410",
- conversation: "none",
- cards: "hidden",
- align: "center",
- }}
- />
- ))}
+ {isTweetsLoading && (
+ <Spinner />
+ )}
+ <div className={isTweetsLoading ? "tweets-container" : "tweets-container active"}>
+ {tweetIdArray.map((id) => (
+ <Tweet
+ key={id}
+ tweetId={id}
+ onLoad={tweetLoadHandler}
+ options={{
+ width: "410",
+ conversation: "none",
+ cards: "hidden",
+ align: "center",
+ }}
+ />
+ ))}
  </div>
  </section>
  <section className="home-contributors">
@@ -202,4 +193,4 @@ const Home = () => {
  );
 };
 
-export default Home;
+export default Home;