From 9f32867b7c591eddfcda470f969e0393c50d19a4 Mon Sep 17 00:00:00 2001
From: jonny paulino <jonnyzico10@gmail.com>
Date: Wed, 18 Dec 2024 13:15:50 -0300
Subject: [PATCH] ajustes layout e nomeclatura

---
 .env                                          |  4 +-
 src/Assets/css/styles.css                     |  9 +++
 src/Components/Card/CardClassroom/index.tsx   |  4 +-
 src/Components/ContentPage/index.tsx          | 52 +++++++++++++-----
 src/Components/Layout/TopBar/Logout/index.tsx |  4 +-
 src/Components/Layout/TopBar/index.tsx        |  2 +-
 src/Components/Menu/index.tsx                 |  2 +-
 .../BeneficiariesCreate/index.tsx             |  6 +-
 .../ModalCreateRegisterClassroom/index.tsx    |  4 +-
 .../Beneficiaries/BeneficiariesEdit/index.tsx |  2 +-
 .../Beneficiaries/BeneficiariesList/index.tsx | 31 +++++++----
 src/Pages/Classroom/ClassroomCriar/index.tsx  |  2 +-
 .../ModalChangeClaassroom/index.tsx           |  4 +-
 src/Pages/Classroom/ListClassroom/index.tsx   | 55 +++++++++++--------
 src/Pages/Form/CreateForms/Config/index.tsx   |  2 +-
 src/Pages/InitialPage/index.tsx               |  2 +-
 src/Pages/Projects/CreateProjects/index.tsx   | 12 ++--
 src/Pages/Projects/ProjectOne/index.tsx       | 18 +++---
 src/Pages/Projects/ProjectsList/index.tsx     | 46 ++++++++--------
 .../Register/Wizard/Steps/Start/index.tsx     |  6 +-
 src/Pages/Schedule/FormSchedule/index.tsx     |  2 +-
 .../CreateTechnologySocial/index.tsx          |  2 +-
 .../TecnologySocialList/index.tsx             | 18 +-----
 src/Pages/Users/CreateUser/index.tsx          |  2 +-
 src/Pages/Users/Inputs/index.tsx              |  4 +-
 src/Pages/Users/ListUsers.tsx                 |  4 +-
 26 files changed, 168 insertions(+), 131 deletions(-)

diff --git a/.env b/.env
index 77602a0..7c3a28b 100644
--- a/.env
+++ b/.env
@@ -1,2 +1,2 @@
-REACT_APP_API_PATH=http://localhost:3000/
-# REACT_APP_API_PATH=https://br-ipti-beneficiarios.azurewebsites.net/
\ No newline at end of file
+# REACT_APP_API_PATH=http://localhost:3000/
+REACT_APP_API_PATH=https://br-ipti-beneficiarios.azurewebsites.net/
\ No newline at end of file
diff --git a/src/Assets/css/styles.css b/src/Assets/css/styles.css
index 2ee0ab8..bfbd3bb 100644
--- a/src/Assets/css/styles.css
+++ b/src/Assets/css/styles.css
@@ -25,6 +25,15 @@
   h1 {
     font-family: "Poppins Regular";
     text-transform: uppercase;
+    font-size: 24px;
+  }
+
+  h2 {
+    font-size: 18px;
+  }
+
+  h3 {
+    font-size: 14px;
   }
 
   @font-face {
diff --git a/src/Components/Card/CardClassroom/index.tsx b/src/Components/Card/CardClassroom/index.tsx
index 4a4eaac..9bbbfc1 100644
--- a/src/Components/Card/CardClassroom/index.tsx
+++ b/src/Components/Card/CardClassroom/index.tsx
@@ -80,7 +80,7 @@ const CardClassroom = ({
         <Row style={{ gap: 16 }}>
           <Row style={{ gap: 8, alignItems: "center" }}>
             <img src={pessoas} alt="" style={{ width: 24 }} />
-            <p>Participantes: {registrationCount}</p>
+            <p style={{fontSize: "10px"}}>Participantes: {registrationCount}</p>
           </Row>
           <Column id="center">
             <Row>
@@ -89,7 +89,7 @@ const CardClassroom = ({
                 alt=""
                 style={{ height: 16, marginRight: 2 }}
               />
-              <Row style={{ fontSize: "14px" }}>
+              <Row style={{ fontSize: "10px" }}>
                 Status: {" "}<Padding padding="2px" />
                 {status === Status.PENDING ? (
                   <p style={{ fontWeight: "600" }}> Pendente</p>
diff --git a/src/Components/ContentPage/index.tsx b/src/Components/ContentPage/index.tsx
index 4d7fc97..b0bacf0 100644
--- a/src/Components/ContentPage/index.tsx
+++ b/src/Components/ContentPage/index.tsx
@@ -1,16 +1,40 @@
-import { ReactNode } from "react";
-import { Container, Padding } from "../../Styles/styles"
+import { MouseEventHandler, ReactNode } from "react";
+import { Column, Container, Padding, Row } from "../../Styles/styles";
+import { Button } from "primereact/button";
 
-const ContentPage = ({ description, title, children }: { title: string, description: string, children: ReactNode }) => {
-    return (
-        <Container>
-            <h1>{title}</h1>
-            <Padding padding="8px" />
-            <p>{description}</p>
-            <Padding padding="8px" />
-            {children}
-        </Container>
-    )
-}
+const ContentPage = ({
+  description,
+  title,
+  children,
+  addButton,
+  onClick, labelButton,
+  permissionButton
+}: {
+  title: string;
+  description: string;
+  children: ReactNode;
+  addButton?: boolean,
+  permissionButton?: boolean,
+  labelButton?: string,
+  onClick?: MouseEventHandler<HTMLButtonElement> | undefined
+}) => {
+  return (
+    <Container>
+      <Row id="space-between">
+        <Column>
+          <h1>{title}</h1>
+          <Padding padding="4px" />
+          <p>{description}</p>
+        </Column>
+        <Column id="center">
+        {(addButton && permissionButton) && <Button style={{height: "42px"}} label={labelButton ?? "Adicionar"} onClick={onClick} icon={"pi pi-plus"} />}
+        </Column>
+      </Row>
+      <Padding padding="4px" />
 
-export default ContentPage;
\ No newline at end of file
+      {children}
+    </Container>
+  );
+};
+
+export default ContentPage;
diff --git a/src/Components/Layout/TopBar/Logout/index.tsx b/src/Components/Layout/TopBar/Logout/index.tsx
index a19521e..7864b14 100644
--- a/src/Components/Layout/TopBar/Logout/index.tsx
+++ b/src/Components/Layout/TopBar/Logout/index.tsx
@@ -1,5 +1,5 @@
 import { logout } from "../../../../Services/localstorage";
-import { Padding } from "../../../../Styles/styles";
+import { Column, Padding } from "../../../../Styles/styles";
 import { Container } from "./style";
 
 
@@ -7,7 +7,9 @@ const LogoutTopBar = () => {
     return (
         <Container onClick={() => { logout(); window.location.reload() }}>
             <div className="flex flex-row">
+                <Column id="center">
                 <i className="pi pi-sign-out"></i>
+                </Column>
                 <Padding padding="2px" />
                 <div>Sair</div>
             </div>
diff --git a/src/Components/Layout/TopBar/index.tsx b/src/Components/Layout/TopBar/index.tsx
index 4e4bb62..a075b57 100644
--- a/src/Components/Layout/TopBar/index.tsx
+++ b/src/Components/Layout/TopBar/index.tsx
@@ -61,7 +61,7 @@ const TopBar = ({
           <Column className="w-12rem md:w-20rem">
             {props.project ? (
               <DropdownComponent
-                placerholder="Projetos"
+                placerholder="Plano de trabalho"
                 options={props.project}
                 value={verifyValueProject(parseInt(GetIdTs()!))}
                 onChange={(e) => {
diff --git a/src/Components/Menu/index.tsx b/src/Components/Menu/index.tsx
index 70281b1..186714f 100644
--- a/src/Components/Menu/index.tsx
+++ b/src/Components/Menu/index.tsx
@@ -112,7 +112,7 @@ const Menu = ({ viewdMenu }: { viewdMenu: boolean }) => {
           />
           <Padding />
           <Item
-            text={"Projetos"}
+            text={"Planos de trabalho"}
             funcActiv={() => {
               setActive(3);
               menuItem("3");
diff --git a/src/Pages/Beneficiaries/BeneficiariesCreate/index.tsx b/src/Pages/Beneficiaries/BeneficiariesCreate/index.tsx
index 7fa1656..a787910 100644
--- a/src/Pages/Beneficiaries/BeneficiariesCreate/index.tsx
+++ b/src/Pages/Beneficiaries/BeneficiariesCreate/index.tsx
@@ -57,7 +57,7 @@ const RegistrationPage = () => {
       .nullable()
       .required("Data de nascimento é obrigatória"),
     zone: Yup.string().nullable().required("Zona é obrigatório"),
-    project: Yup.string().nullable().required("Projeto é obrigatório"),
+    project: Yup.string().nullable().required("Plano de Trabalho é obrigatório"),
     classroom: Yup.string().nullable().required("Turma é obrigatório"),
     state: Yup.string().nullable().required("Estado é obrigatório"),
     city: Yup.string().nullable().required("Cidade é obrigatório"),
@@ -88,7 +88,7 @@ const RegistrationPage = () => {
               <Form>
                 <Column>
                   <Row id="end">
-                    <Button label="Criar" type="submit" />
+                    <Button label="Criar" type="submit" icon={"pi pi-plus"} />
                   </Row>
                 </Column>
                 <Padding padding="8px" />
@@ -341,7 +341,7 @@ const RegistrationPage = () => {
                     <Padding />
                     <DropdownComponent
                       value={props.project}
-                      placerholder="Selecione o projeto"
+                      placerholder="Selecione o plano de trabalho"
                       name="project"
                       onChange={(e) => {
                         props.setProject(e.target.value);
diff --git a/src/Pages/Beneficiaries/BeneficiariesEdit/ModalCreateRegisterClassroom/index.tsx b/src/Pages/Beneficiaries/BeneficiariesEdit/ModalCreateRegisterClassroom/index.tsx
index fda2c86..29036f7 100644
--- a/src/Pages/Beneficiaries/BeneficiariesEdit/ModalCreateRegisterClassroom/index.tsx
+++ b/src/Pages/Beneficiaries/BeneficiariesEdit/ModalCreateRegisterClassroom/index.tsx
@@ -38,11 +38,11 @@ const ModalCreateRegisterClassroom = ({
             <Form>
               <div className="grid">
                 <div className="col-12">
-                  <label>Projeto</label>
+                  <label>Plano de trabalho</label>
                   <Padding />
                   <DropdownComponent
                     value={props.project}
-                    placerholder="Selecione o projeto"
+                    placerholder="Selecione o Plano de trabalho"
                     name="deficiency"
                     onChange={(e) => props.setProject(e.target.value)}
                     options={props.projectRequet}
diff --git a/src/Pages/Beneficiaries/BeneficiariesEdit/index.tsx b/src/Pages/Beneficiaries/BeneficiariesEdit/index.tsx
index b567180..9c4e5eb 100644
--- a/src/Pages/Beneficiaries/BeneficiariesEdit/index.tsx
+++ b/src/Pages/Beneficiaries/BeneficiariesEdit/index.tsx
@@ -467,7 +467,7 @@ const BeneficiariesEditPage = () => {
         tableStyle={{ minWidth: "50rem" }}
         header={renderHeader}
       >
-        <Column field="classroom.project.name" header="Projeto"></Column>
+        <Column field="classroom.project.name" header="Plano de trabalho"></Column>
         <Column field="classroom.name" header="Turma"></Column>
         <Column body={StatusBody} header="Status"></Column>
         <Column header="Ações" body={ActionBeneficiariesBody}></Column>
diff --git a/src/Pages/Beneficiaries/BeneficiariesList/index.tsx b/src/Pages/Beneficiaries/BeneficiariesList/index.tsx
index 8157fdf..4259ffe 100644
--- a/src/Pages/Beneficiaries/BeneficiariesList/index.tsx
+++ b/src/Pages/Beneficiaries/BeneficiariesList/index.tsx
@@ -33,7 +33,9 @@ const BeneficiariesList = () => {
 
 const BeneficiariesListPage = () => {
   const props = useContext(BeneficiariesListContext) as BeneficiariesListType;
-  const propsAplication = useContext(AplicationContext) as PropsAplicationContext;
+  const propsAplication = useContext(
+    AplicationContext
+  ) as PropsAplicationContext;
   const history = useNavigate();
 
   const [visible, setVisible] = useState<any>();
@@ -94,24 +96,31 @@ const BeneficiariesListPage = () => {
 
   return (
     <>
-      <ContentPage title="Beneficiários" description="Visualização dos beneficiários da tecnologia.">
-        <Row id="end">
-
-          {propsAplication.project
-            ? (
+      <ContentPage
+        title="Beneficiários"
+        description="Visualização dos beneficiários da tecnologia."
+      >
+        <Padding padding="4px" />
+        {propsAplication.project ? (
+          <div className="grid">
+            <div className="col-12 md:col-6">
+              <label>Filtrar por tecnologia</label>
+              <Padding />
               <DropdownComponent
                 placerholder="Escolha uma tecnologia"
-                options={[{ name: "Todos", id: undefined }, ...propsAplication.project]}
+                options={[
+                  { name: "Todos", id: undefined },
+                  ...propsAplication.project,
+                ]}
                 value={props.tsId}
                 optionsValue="id"
-
                 onChange={(e) => {
                   props.setTsId(e.target.value);
                 }}
               />
-            ) : null}{" "}
-        </Row>
-        <Padding padding="16px" />
+            </div>
+          </div>
+        ) : null}{" "}
         <Row style={{ gap: 8 }}>
           {props.nameFilter?.length! > 0 && (
             <Chip label={"Nome: " + props.nameFilter} />
diff --git a/src/Pages/Classroom/ClassroomCriar/index.tsx b/src/Pages/Classroom/ClassroomCriar/index.tsx
index bb02898..97cbcb6 100644
--- a/src/Pages/Classroom/ClassroomCriar/index.tsx
+++ b/src/Pages/Classroom/ClassroomCriar/index.tsx
@@ -47,7 +47,7 @@ const FormClassroomPage = () => {
                             ) : null}
                             <Padding padding="16px" />
                             <Row id="end">
-                                <Button label="Criar" />
+                                <Button label="Criar" icon={"pi pi-plus"} />
                             </Row>
                         </Form>
                     )
diff --git a/src/Pages/Classroom/ClassroomOne/ModalChangeClaassroom/index.tsx b/src/Pages/Classroom/ClassroomOne/ModalChangeClaassroom/index.tsx
index c852f4f..65db4c4 100644
--- a/src/Pages/Classroom/ClassroomOne/ModalChangeClaassroom/index.tsx
+++ b/src/Pages/Classroom/ClassroomOne/ModalChangeClaassroom/index.tsx
@@ -24,7 +24,7 @@ const ModalChange = ({
   const { data: tsOneRequest } = useFetchRequestTsLists(undefined);
 
   const schema = Yup.object().shape({
-    idProject: Yup.string().nullable().required("Projeto é obrigatório"),
+    idProject: Yup.string().nullable().required("Plano de trabalho é obrigatório"),
   });
 
   return (
@@ -52,7 +52,7 @@ const ModalChange = ({
             <Form>
               <div className="grid">
                 <div className="col-12 md:col-6">
-                  <label>Escolha um projeto</label>
+                  <label>Escolha um Plano de trabalho</label>
                   <Padding />
                   <DropdownComponent
                     value={values.idProject}
diff --git a/src/Pages/Classroom/ListClassroom/index.tsx b/src/Pages/Classroom/ListClassroom/index.tsx
index 7840abd..9b78260 100644
--- a/src/Pages/Classroom/ListClassroom/index.tsx
+++ b/src/Pages/Classroom/ListClassroom/index.tsx
@@ -1,4 +1,3 @@
-import { Button } from "primereact/button";
 import { useContext } from "react";
 import { useNavigate } from "react-router-dom";
 import CardClassroom from "../../../Components/Card/CardClassroom";
@@ -13,7 +12,7 @@ import ClassroomProvider, {
 import { ClassroomTypes } from "../../../Context/Classroom/type";
 import { ROLE } from "../../../Controller/controllerGlobal";
 import { idProject } from "../../../Services/localstorage";
-import { Column, Padding, Row } from "../../../Styles/styles";
+import { Column, Padding } from "../../../Styles/styles";
 import { PropsAplicationContext } from "../../../Types/types";
 
 const ListClassroom = () => {
@@ -35,28 +34,36 @@ const ListClassroomPage = () => {
   if (props.isLoading) return <Loading />;
 
   return (
-    <ContentPage title="Turmas" description="Visualização das turmas.">
-      <Padding padding="16px" />
-      <Row id="space-between">
-        <Column>
-          <label>Projeto</label>
-          <Padding />
-          <div className="w-12rem md:w-16rem">
-            <DropdownComponent placerholder="Escolha o projeto" options={props.tsOne?.project} optionsLabel="name" optionsValue="id" value={props.project} onChange={(e) => { console.log(e.value); props.setProject(e.value); idProject(e.value) }} />
-          </div>
-        </Column>
-        {(propsAplication.user?.role === ROLE.ADMIN ||
-          propsAplication.user?.role === ROLE.COORDINATORS) && (
-            <Column id="end">
-              <Button
-                label="Criar turma"
-                icon={"pi pi-plus"}
-                onClick={() => history("/turma/criar/" + props.project)}
-              />
-            </Column>
-          )}
-      </Row>
-      <Padding padding="32px" />
+    <ContentPage
+      title="Turmas"
+      description="Visualização das turmas."
+      permissionButton={
+        propsAplication.user?.role === ROLE.ADMIN ||
+        propsAplication.user?.role === ROLE.COORDINATORS
+      }
+      addButton
+      onClick={() => history("/turma/criar/" + props.project)}
+    >
+      <Column>
+        <label>Plano de trabalho</label>
+        <Padding />
+        <div className="w-12rem md:w-16rem">
+          <DropdownComponent
+            placerholder="Escolha o plano de trabalho"
+            options={props.tsOne?.project}
+            optionsLabel="name"
+            optionsValue="id"
+            value={props.project}
+            onChange={(e) => {
+              console.log(e.value);
+              props.setProject(e.value);
+              idProject(e.value);
+            }}
+          />
+        </div>
+      </Column>
+
+      <Padding padding="8px" />
       {props?.classrooms?.length > 0 ? (
         <div className="grid">
           {props.classrooms?.map((item: any, index: number) => {
diff --git a/src/Pages/Form/CreateForms/Config/index.tsx b/src/Pages/Form/CreateForms/Config/index.tsx
index 6cb6bb3..52a980c 100644
--- a/src/Pages/Form/CreateForms/Config/index.tsx
+++ b/src/Pages/Form/CreateForms/Config/index.tsx
@@ -29,7 +29,7 @@ const Config = () => {
                 <Padding padding="8px" />
                 <label>Destino do formulário</label>
                 <Padding />
-                <Dropdown options={project} placeholder="Escolher Projeto" optionLabel="name" />
+                <Dropdown options={project} placeholder="Escolher Plano de trabalho" optionLabel="name" />
                 <Padding padding="8px" />
             </Column>
         </div>
diff --git a/src/Pages/InitialPage/index.tsx b/src/Pages/InitialPage/index.tsx
index 241f7ea..2231fb8 100644
--- a/src/Pages/InitialPage/index.tsx
+++ b/src/Pages/InitialPage/index.tsx
@@ -190,7 +190,7 @@ const InitialPage = () => {
         </div>
         <div className="col-12 md:col-4 lg:col-2">
           <CardQuant
-            title="Total de Projetos"
+            title="Total de planos de trabalho"
             quant={chart?.totalProjects!}
             color="blue"
           />
diff --git a/src/Pages/Projects/CreateProjects/index.tsx b/src/Pages/Projects/CreateProjects/index.tsx
index 58b175e..720ca50 100644
--- a/src/Pages/Projects/CreateProjects/index.tsx
+++ b/src/Pages/Projects/CreateProjects/index.tsx
@@ -35,7 +35,7 @@ const CreateProjectsPage = () => {
   };
 
   return (
-    <ContentPage title="Criar projeto" description="Criar um novo projeto.">
+    <ContentPage title="Criar plano de trabalho" description="Criar um novo plano de trabalho.">
       <Padding padding="16px" />
       <Formik
         initialValues={initialValues}
@@ -54,17 +54,17 @@ const CreateProjectsPage = () => {
           return (
             <Form>
               <Row id="end">
-                <Button label="Criar" />
+                <Button label="Criar" icon={"pi pi-plus"} />
               </Row>
               <Padding padding="32px" />
               <div className="grid">
                 <div className="col-12 md:col-6">
-                  <label>Nome do projeto *</label>
+                  <label>Nome do plano de trabalho *</label>
                   <Padding />
                   <TextInput
                     name="name"
                     onChange={handleChange}
-                    placeholder="Nome do Projeto*"
+                    placeholder="Nome do plano de trabalho*"
                     value={values.name}
                   />
                   <Padding />
@@ -75,13 +75,13 @@ const CreateProjectsPage = () => {
                   ) : null}
                 </div>
                 <div className="col-12 md:col-6">
-                  <label>Porcentagem de aprovação do projeto *</label>
+                  <label>Porcentagem de aprovação do plano de trabalho *</label>
                   <Padding />
                   <InputNumberComponent
                     name="approval_percentage"
                     onChange={handleChange}
                     suffix="%"
-                    placeholder="Porcentagem de aprovação do projeto *"
+                    placeholder="Porcentagem de aprovação do plano de trabalho *"
                     value={values.approval_percentage}
                   />
                   <Padding />
diff --git a/src/Pages/Projects/ProjectOne/index.tsx b/src/Pages/Projects/ProjectOne/index.tsx
index af9aeb6..d1af365 100644
--- a/src/Pages/Projects/ProjectOne/index.tsx
+++ b/src/Pages/Projects/ProjectOne/index.tsx
@@ -57,7 +57,7 @@ const ProjectOnePage = () => {
   });
 
   return (
-    <ContentPage title={props.project?.project.name!} description="Detalhes do seu projeto">
+    <ContentPage title={props.project?.project.name!} description="Detalhes do seu plano de trabalho">
       {edit ? (
         <Formik
           initialValues={initialValues}
@@ -90,12 +90,12 @@ const ProjectOnePage = () => {
                 <Padding padding="32px" />
                 <div className="grid">
                   <div className="col-12 md:col-6">
-                    <label>Nome do projeto *</label>
+                    <label>Nome do plano de trabalho *</label>
                     <Padding />
                     <TextInput
                       name="name"
                       onChange={handleChange}
-                      placeholder="Nome do Projeto*"
+                      placeholder="Nome do plano de trabalho*"
                       value={values.name}
                     />
                     <Padding />
@@ -106,13 +106,13 @@ const ProjectOnePage = () => {
                     ) : null}
                   </div>
                   <div className="col-12 md:col-6">
-                    <label>Parâmetro para aprovação do projeto *</label>
+                    <label>Parâmetro para aprovação do plano de trabalho *</label>
                     <Padding />
                     <InputNumberComponent
                       name="approval_percentage"
                       onChange={handleChange}
                       suffix="%"
-                      placeholder="Parâmetro para aprovação do projeto *"
+                      placeholder="Parâmetro para aprovação do plano de trabalho *"
                       value={values.approval_percentage}
                     />
                     <Padding />
@@ -124,14 +124,14 @@ const ProjectOnePage = () => {
                     ) : null}
                   </div>
                   <div className="col-12 md:col-6">
-                    <label>Adicionar ou mudar Régua do projeto</label>
+                    <label>Adicionar ou mudar Régua do plano de trabalho</label>
                     <Padding />
                     <label>* Imagem para adicionar aos relatórios</label>
                     <Padding />
                     <TextInput
                       onChange={(e) => setFieldValue("file", e.target?.files![0])}
                       name="file"
-                      placeholder="Régua do projeto*"
+                      placeholder="Régua do plano de trabalho*"
                       type="file"
                     />
                     <Padding />
@@ -175,7 +175,7 @@ const ProjectOnePage = () => {
           </Row>
           {props.project?.project.ruler_url && <div>
             <Padding />
-            <h4>Régua de marca do projeto</h4>
+            <h4>Régua de marca do plano de trabalho</h4>
             <Padding />
             <Column>
               <label>* Imagem para adicionar aos relatórios</label>
@@ -190,7 +190,7 @@ const ProjectOnePage = () => {
         <div className="col-12 md:col-6">
           <CardQuant
             quant={props.project?.project.approval_percentage + "%"}
-            title="Parâmetro para aprovação do projeto"
+            title="Parâmetro para aprovação do plano de trabalho"
             color="navy_blue"
           />
         </div>
diff --git a/src/Pages/Projects/ProjectsList/index.tsx b/src/Pages/Projects/ProjectsList/index.tsx
index a6f52ff..39219bd 100644
--- a/src/Pages/Projects/ProjectsList/index.tsx
+++ b/src/Pages/Projects/ProjectsList/index.tsx
@@ -1,4 +1,3 @@
-import { Button } from "primereact/button";
 import { useContext } from "react";
 import { useNavigate } from "react-router-dom";
 import CardProject from "../../../Components/Card/CardProject";
@@ -10,7 +9,7 @@ import ProjectListProvider, {
 } from "../../../Context/Project/ProjectList/context";
 import { ProjectListTypes } from "../../../Context/Project/ProjectList/type";
 import { ROLE } from "../../../Controller/controllerGlobal";
-import { Padding, Row } from "../../../Styles/styles";
+import { Padding } from "../../../Styles/styles";
 import { PropsAplicationContext } from "../../../Types/types";
 
 const ProjectsList = () => {
@@ -29,30 +28,29 @@ const ProjectsListPage = () => {
 
   const props = useContext(ProjectListContext) as ProjectListTypes;
 
-
   return (
-    <ContentPage title="Projetos" description="Visualização dos projetos.">
-      <Padding padding="16px" />
-      {(propsAplication.user?.role === ROLE.ADMIN ||
-        propsAplication.user?.role === ROLE.COORDINATORS) && (
-        <Row id="end" style={{ width: "100%" }}>
-          <Button
-            label="Criar Projeto"
-            icon={"pi pi-plus"}
-            onClick={() => history("/projetos/criar")}
-          />
-        </Row>
-      )}
+    <ContentPage
+      title="Planos de trabalho"
+      description="Visualização dos planos de trabalho."
+      permissionButton={
+        propsAplication.user?.role === ROLE.ADMIN ||
+        propsAplication.user?.role === ROLE.COORDINATORS
+      }
+      addButton
+      onClick={() => history("/projetos/criar")}
+    >
       <Padding padding="16px" />
-      {props.tsOne?.project?.length! > 0 ? (<div className="grid">
-        {props.tsOne?.project?.map((item, index) => {
-          return (
-            <div className="col-12 md:col-6 lg:col-4" key={index}>
-              <CardProject title={item.name} id={item.id} />
-            </div>
-          );
-        })}
-      </div>) : (
+      {props.tsOne?.project?.length! > 0 ? (
+        <div className="grid">
+          {props.tsOne?.project?.map((item, index) => {
+            return (
+              <div className="col-12 md:col-6 lg:col-4" key={index}>
+                <CardProject title={item.name} id={item.id} />
+              </div>
+            );
+          })}
+        </div>
+      ) : (
         <Empty title="Tecnologias" />
       )}
     </ContentPage>
diff --git a/src/Pages/Register/Wizard/Steps/Start/index.tsx b/src/Pages/Register/Wizard/Steps/Start/index.tsx
index 43ff903..2bf480b 100644
--- a/src/Pages/Register/Wizard/Steps/Start/index.tsx
+++ b/src/Pages/Register/Wizard/Steps/Start/index.tsx
@@ -18,13 +18,13 @@ const Start = () => {
   return (
     <>
       <Column className="contentStart" id="center">
-        <ImageTextSteps img={homeImg} title="Matrícula Online" subTitle={<p style={{ textAlign: "center" }}>Bem-vindo ao Matrícula online, para <br /> iniciar escolha o projeto
+        <ImageTextSteps img={homeImg} title="Matrícula Online" subTitle={<p style={{ textAlign: "center" }}>Bem-vindo ao Matrícula online, para <br /> iniciar escolha o plano de trabalho
           e clique no botão abaixo</p>} />
         <Row id="center">
           <div className="col-12 md:col-4">
-            <DropdownComponent placerholder="Escolha o projeto" onChange={(e) => {props.setClassroom(e.target.value)}} options={props.project} optionsLabel="name" value={props.classroom} />
+            <DropdownComponent placerholder="Escolha o plano de trabalho" onChange={(e) => {props.setClassroom(e.target.value)}} options={props.project} optionsLabel="name" value={props.classroom} />
             {!props.classroom && true ? (
-              <div style={{ color: "red", marginTop: "8px" }}>Projeto é obrigatório</div>
+              <div style={{ color: "red", marginTop: "8px" }}>Plano de trabalho é obrigatório</div>
             ) : null}
           </div>
         </Row>
diff --git a/src/Pages/Schedule/FormSchedule/index.tsx b/src/Pages/Schedule/FormSchedule/index.tsx
index d2853ae..f8ed143 100644
--- a/src/Pages/Schedule/FormSchedule/index.tsx
+++ b/src/Pages/Schedule/FormSchedule/index.tsx
@@ -83,7 +83,7 @@ const FormSchedulePage = () => {
                   </div> */}
                     <Padding padding="16px" />
                     <Row id="end">
-                      <Button label="Criar" />
+                      <Button label="Criar" icon={"pi pi-plus"} />
                     </Row>
                   </Form>
                 );
diff --git a/src/Pages/TecnologySocial/CreateTechnologySocial/index.tsx b/src/Pages/TecnologySocial/CreateTechnologySocial/index.tsx
index 23aa69e..0aedc11 100644
--- a/src/Pages/TecnologySocial/CreateTechnologySocial/index.tsx
+++ b/src/Pages/TecnologySocial/CreateTechnologySocial/index.tsx
@@ -45,7 +45,7 @@ const CreateTechnologySocialPage = () => {
           return (
             <Form>
               <Row id="end">
-                <Button label="Criar" />
+                <Button label="Criar" icon={"pi pi-plus"} />
               </Row>
               <div className="col-12 md:col-6">
                 <label>Nome*</label>
diff --git a/src/Pages/TecnologySocial/TecnologySocialList/index.tsx b/src/Pages/TecnologySocial/TecnologySocialList/index.tsx
index 53b6bbb..28391ab 100644
--- a/src/Pages/TecnologySocial/TecnologySocialList/index.tsx
+++ b/src/Pages/TecnologySocial/TecnologySocialList/index.tsx
@@ -1,4 +1,3 @@
-import { Button } from "primereact/button";
 import { useContext } from "react";
 import { useNavigate } from "react-router-dom";
 import CardTs from "../../../Components/Card/CardTs";
@@ -7,9 +6,9 @@ import Empty from "../../../Components/Empty";
 import Loading from "../../../Components/Loading";
 import { AplicationContext } from "../../../Context/Aplication/context";
 import { ROLE } from "../../../Controller/controllerGlobal";
-import { Padding, Row } from "../../../Styles/styles";
-import { PropsAplicationContext } from "../../../Types/types";
 import { idTs, menuItem } from "../../../Services/localstorage";
+import { Padding } from "../../../Styles/styles";
+import { PropsAplicationContext } from "../../../Types/types";
 
 const TecnologySocial = () => {
   const history = useNavigate();
@@ -19,18 +18,7 @@ const TecnologySocial = () => {
 
   if (!propsAplication.project) return <Loading />;
   return (
-    <ContentPage title="Tecnologias" description="Visualização das tecnologias sociais.">
-      <Padding padding="16px" />
-
-      {propsAplication.user?.role === ROLE.ADMIN && (
-        <Row id="end" style={{ width: "100%" }}>
-          <Button
-            label="Criar Tecnologia Social"
-            icon={"pi pi-plus"}
-            onClick={() => history("/tecnologias/criar")}
-          />
-        </Row>
-      )}
+    <ContentPage title="Tecnologias" description="Visualização das tecnologias sociais." permissionButton={propsAplication.user?.role === ROLE.ADMIN} addButton onClick={() => history("/tecnologias/criar")} >
       <Padding padding="16px" />
       {propsAplication.project.length > 0 ? (
       <div className="grid">
diff --git a/src/Pages/Users/CreateUser/index.tsx b/src/Pages/Users/CreateUser/index.tsx
index 717a9fa..52b8eda 100644
--- a/src/Pages/Users/CreateUser/index.tsx
+++ b/src/Pages/Users/CreateUser/index.tsx
@@ -113,7 +113,7 @@ const CreateUserPage = () => {
                 </div>
               </div>{" "}
               <Padding padding="16px" />
-              <Button label="Criar" />
+              <Button label="Criar" icon={"pi pi-plus"} />
             </Form>
           );
         }}
diff --git a/src/Pages/Users/Inputs/index.tsx b/src/Pages/Users/Inputs/index.tsx
index f5c464b..334549b 100644
--- a/src/Pages/Users/Inputs/index.tsx
+++ b/src/Pages/Users/Inputs/index.tsx
@@ -101,7 +101,7 @@ const InputsUser = ({
           ) : null}
         </div>
         <div className="col-12 md:col-6">
-          <label>Projetos</label>
+          <label>Tecnologia</label>
           <Padding />
           <MultiSelect
             options={projects}
@@ -110,7 +110,7 @@ const InputsUser = ({
             value={values.project}
             onChange={handleChange}
             filter
-            placeholder="Projetos"
+            placeholder="Tecnologia"
             maxSelectedLabels={3}
             className="w-full"
           />
diff --git a/src/Pages/Users/ListUsers.tsx b/src/Pages/Users/ListUsers.tsx
index 3be7cf4..1918152 100644
--- a/src/Pages/Users/ListUsers.tsx
+++ b/src/Pages/Users/ListUsers.tsx
@@ -89,7 +89,7 @@ const ListUsersPage = () => {
         className="flex justify-content-between"
         // style={{ background: color.colorCard }}
       >
-        <Button label="Criar usuário" onClick={() => history("/users/criar")} />
+        <Button label="Criar usuário" onClick={() => history("/users/criar")} icon={"pi pi-plus"} />
 
         <div>
           <DropdownComponent optionsLabel="name" value={props.role} onChange={(e) => props.setRole(e.target.value)} optionsValue="id" placerholder="Filtrar tipo de usuário" options={propsAplication.user?.role === ROLE.ADMIN
@@ -116,7 +116,7 @@ const ListUsersPage = () => {
   return (
     <>
       <ContentPage title="Usuários" description="Lista usuários do MeuBen.">
-        <Padding padding="16px" />
+        <Padding padding="8px" />
         <DataTable value={props.users} header={renderHeader} paginator rows={10} rowsPerPageOptions={[5, 10, 25, 50]} tableStyle={{ minWidth: "50rem" }}>
           <Column field="name" header="Nome"></Column>
           <Column field="username" header="Usuário"></Column>