From 6dc6286f89745390b0a3f0a9a54eaae0601b2b65 Mon Sep 17 00:00:00 2001 From: varuogm Date: Fri, 17 May 2024 16:53:34 +0530 Subject: [PATCH 1/2] Added refactoring spree --- src/components/Compare.js | 134 +++++++++++ src/components/Middle.js | 49 ++++ src/components/Profile.js | 298 +++--------------------- src/components/Search.js | 17 +- src/components/{ => atoms}/Accordion.js | 0 src/components/atoms/UserModel.js | 84 +++++++ 6 files changed, 308 insertions(+), 274 deletions(-) create mode 100644 src/components/Compare.js create mode 100644 src/components/Middle.js rename src/components/{ => atoms}/Accordion.js (100%) create mode 100644 src/components/atoms/UserModel.js diff --git a/src/components/Compare.js b/src/components/Compare.js new file mode 100644 index 0000000..014a173 --- /dev/null +++ b/src/components/Compare.js @@ -0,0 +1,134 @@ +import React from "react"; +import { + Box, + Flex, + Input, + Center, + Spacer, + Text, + chakra, + Image, + Heading, + IconButton, + InputGroup, + InputLeftAddon, +} from "@chakra-ui/react"; +import { FiSearch } from "react-icons/fi"; + +const Compare = ({ + check, + Name, + friendUsername, + onFriendChangeHandler, + submitfriendHandler, + userImg, + frienduserImg, +}) => { + return ( + <> + + Compare friends stats + + + + A Mock compare with your friend stats + + + + + + + {" "} + VS + + + + + + Compare + } /> + + + +
+ + + + + + {" "} + VS + + + + + + +
+ + + + ); +}; +export default Compare; diff --git a/src/components/Middle.js b/src/components/Middle.js new file mode 100644 index 0000000..23e16cd --- /dev/null +++ b/src/components/Middle.js @@ -0,0 +1,49 @@ +import React from "react"; +import { Box, Flex, IconButton, Tooltip, Text, Spacer } from "@chakra-ui/react"; +import { FaGithub } from "react-icons/fa"; +import CATS from "../Assests/Images/Cats.png"; + +const Middle = ({ check }) => { + return ( + <> + + Cats-pic + + + + + + {" "} + What a cute cat likes.Maybe some cat-food but im special i want + your opinion on how much rating you would give this{" "} + + + Also share and stars⭐ are appreciated !! MEOWW + + + } + isRound="true" + > + + + + + + + + + + ); +}; + +export default Middle; diff --git a/src/components/Profile.js b/src/components/Profile.js index b56d8b7..c4c593f 100644 --- a/src/components/Profile.js +++ b/src/components/Profile.js @@ -1,36 +1,26 @@ import React, { useState } from "react"; import { Box, - Flex, - Input, - Tooltip, - Center, Spacer, - Text, - chakra, - Image, - Heading, useToast, - IconButton, - InputGroup, useColorMode, - InputLeftAddon, useMediaQuery, } from "@chakra-ui/react"; //Assests -import { FaGithub, FaLink } from "react-icons/fa"; -import { FiSearch } from "react-icons/fi"; -import CATS from "../Assests/Images/Cats.png"; import CAT from "../Assests/Images/Kitty.gif"; //Coponents -import AccordionComponent from "./Accordion"; +import AccordionComponent from "./atoms/Accordion"; import Footer from "./Footer"; import HeaderComponent from "./Header"; +import SearchInput from "./Search"; +import Compare from "./Compare"; +import Middle from "./Middle"; import CatClicker from "./atoms/CatClicker"; import WinnerText from "./Winner"; +import UserModel from "./atoms/UserModel"; const Profile = () => { let GouravImage = "https://i.ibb.co/b29dG1G/JEo6-Jh-S1-400x400.jpg"; @@ -91,6 +81,7 @@ const Profile = () => { const profile = await fetch(`https://api.github.com/users/${username}`); const profileJson = await profile.json(); + console.log(profileJson); if (profileJson) { setLoc(profileJson.location); @@ -127,258 +118,37 @@ const Profile = () => {
- {/* SearchComponent start */} - - - - -
- - lets Find Out - } /> - - - {/* SearchComponent end */} - { - //horizontal card remaining - } - {show === true && ( - <> -
- - - + - - - {Bio} - - - {Name !== "" && Name !== null && ( - - {" "} - {"Hi πŸ‘‹, i am " + Name + " !"} - - )} - - πŸ‘¨β€πŸš€ Followers - {followers}{" "} - - - πŸ‘¨β€πŸ’» Following - {following}{" "} - - - πŸŽ’ Total Repos - {Totalrepo} - - {loc !== "" && ( - - {" "} - {"πŸ“ Location -" + loc} - - )} - {Bloglink !== "" && ( - - {" "} - {"πŸ“š Look on my blogs here- " + Bloglink} - window.open(Bloglink, "_blank")} - icon={} - /> - - )} - -
- - )} - - - - Cats-pic + )} - - - - - {" "} - What a cute cat likes.Maybe some cat-food but im special i - want your opinion on how much rating you would give this{" "} - - - Also share and stars⭐ are appreciated !! MEOWW - - - } - isRound="true" - > - - - - - - - - - - {/* comparison of frinds */} - - - Compare friends stats - - - - A Mock compare with your friend stats - - - - - - - {" "} - VS - - - - - - Compare - } /> - - - -
- - - - - - {" "} - VS - + - - - - -
- + {show === true && ( { /> )} - {/* cat clicker start */} - {/* cat clicker end */}