create component w/ william

src/components/ProgressBar/index.tsx

@@ -4,13 +4,7 @@ import React from "react";
 const ProgressBar = (): React.ReactElement => {
   return (
     <>
-      <Progress
-        h="25px"
-        w="120px"
-        value={20}
-        transform="rotate(270deg)"
-        borderRadius="6px"
-      />
+      <Progress h="25px" w="120px" value={20} borderRadius="6px" />
       <Text>33,3%</Text>
     </>
   );

src/components/SeeTasks/index..tsx

+import { Box } from "@chakra-ui/react";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import React from "react";
+
+import Button from "../Button";
+import ProgressBar from "../ProgressBar";
+
+const SeeTasks = (): React.ReactElement => {
+  return (
+    <Box>
+      <FontAwesomeIcon icon="tasks" color="#f9c201" size="3x" />
+      <ProgressBar />
+      <Button
+        theme="secondary"
+        w="60%"
+        _hover={{ background: "yellow.400" }}
+        _active={{ background: "yellow.400" }}
+      >
+        VER TAREFAS
+      </Button>
+    </Box>
+  );
+};
+
+export default SeeTasks;

src/pages/EventDetails/index.tsx

@@ -17,6 +17,7 @@ import Carousel from "../../components/Carousel";
 import EventInfo from "../../components/EventInfo";
 import { Header } from "../../components/NewHeader";
 import ProgressBar from "../../components/ProgressBar";
+import SeeTasks from "../../components/SeeTasks/index.";
 import StaticMap from "../../components/StaticMap";
 import { EventDetailsResponseDTO } from "../../model/eventModel";
 import {
@@ -126,11 +127,8 @@ const EventDetails = (): React.ReactElement => {
           mt="10px"
           borderRadius="10px"
         />
-        <Text ml="10px" fontSize="14px">
-          Como posso ajudar?
-        </Text>
 
-        <HStack>
+        {/* <HStack>
           <Flex
             w="50%"
             maxH={{ sm: "115px" }}
@@ -147,9 +145,11 @@ const EventDetails = (): React.ReactElement => {
             justifyContent="center"
             alignItems="center"
           >
-            <ProgressBar />
+
           </Flex>
-        </HStack>
+        </HStack> */}
+
+        <SeeTasks />
 
         <Flex
           flexDir="column"

src/utils/library.ts

@@ -14,6 +14,7 @@ import {
   faCalendarAlt,
   faClock,
   faMapMarkerAlt,
+  faTasks,
 } from "@fortawesome/free-solid-svg-icons";
 
 library.add(
@@ -30,5 +31,6 @@ library.add(
   faArrowLeft,
   faCalendarAlt,
   faClock,
-  faMapMarkerAlt
+  faMapMarkerAlt,
+  faTasks
 );