diff --git a/src/Components/TabPanels/PanelComponents/ButtonsArea.js b/src/Components/TabPanels/PanelComponents/ButtonsArea.js index 848001761ebc4f63beb1f5cc1c46a317dc8158ab..1b8633ae0b05f6578b98fbbba427a3172775ed96 100644 --- a/src/Components/TabPanels/PanelComponents/ButtonsArea.js +++ b/src/Components/TabPanels/PanelComponents/ButtonsArea.js @@ -29,16 +29,15 @@ export function ButtonsAreaRecurso(props) { </p> { - props.end ? - null : - <React.Fragment> - <ButtonMostrarMaisRecurso onClick={() => props.showMore(4)}> - <span style={{ color: "#fff", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 4</span> - </ButtonMostrarMaisRecurso> - <ButtonMostrarTodos onClick={() => { props.showMore(20) }}> - <span style={{ color: "#666", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 20</span> - </ButtonMostrarTodos> - </React.Fragment> + !props.end && + <React.Fragment> + <ButtonMostrarMaisRecurso onClick={() => props.showMore(4)}> + <span style={{ color: "#fff", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 4</span> + </ButtonMostrarMaisRecurso> + <ButtonMostrarTodos onClick={() => { props.showMore(20) }}> + <span style={{ color: "#666", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 20</span> + </ButtonMostrarTodos> + </React.Fragment> } </Carregados> @@ -52,18 +51,16 @@ export function ButtonsAreaColecao(props) { {props.sliceLength} coleções carregadas de {props.total} </p> { - props.end ? - null - : - <React.Fragment> - <ButtonMostrarMaisColecao onClick={() => { props.showMore(4) }}> - <span style={{ color: "#fff", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 4</span> - </ButtonMostrarMaisColecao> - - <ButtonMostrarTodos onClick={() => { props.showMore(20) }}> - <span style={{ color: "#666", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 20</span> - </ButtonMostrarTodos> - </React.Fragment> + !props.end && + <React.Fragment> + <ButtonMostrarMaisColecao onClick={() => { props.showMore(4) }}> + <span style={{ color: "#fff", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 4</span> + </ButtonMostrarMaisColecao> + + <ButtonMostrarTodos onClick={() => { props.showMore(20) }}> + <span style={{ color: "#666", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 20</span> + </ButtonMostrarTodos> + </React.Fragment> } </Carregados> ) @@ -77,18 +74,16 @@ export function ButtonsAreaRede(props) { </p> { - props.end ? - null - : - <React.Fragment> - <ButtonMostrarMaisRede onClick={() => { props.showMore(4) }}> - <span style={{ color: "#fff", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 4</span> - </ButtonMostrarMaisRede> - - <ButtonMostrarTodos onClick={() => { props.showMore(20) }}> - <span style={{ color: "#666", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 20</span> - </ButtonMostrarTodos> - </React.Fragment> + !props.end && + <React.Fragment> + <ButtonMostrarMaisRede onClick={() => { props.showMore(4) }}> + <span style={{ color: "#fff", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 4</span> + </ButtonMostrarMaisRede> + + <ButtonMostrarTodos onClick={() => { props.showMore(20) }}> + <span style={{ color: "#666", fontSize: "14px", fontWeight: "500" }}>MOSTRAR MAIS 20</span> + </ButtonMostrarTodos> + </React.Fragment> } </Carregados> diff --git a/src/Components/TabPanels/PanelComponents/NoContent.js b/src/Components/TabPanels/PanelComponents/NoContent.js index ef129ecef30c18abc9ab58d501330ab8b778678f..cf1f405c52870033c676b9a05a244b3bed1a97e2 100644 --- a/src/Components/TabPanels/PanelComponents/NoContent.js +++ b/src/Components/TabPanels/PanelComponents/NoContent.js @@ -18,13 +18,20 @@ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/> import React from 'react' import styled from 'styled-components' +import NoContentImage from '../../../img/img-16.png' -export default function NoContent (props) { + +export default function NoContent(props) { return ( <DivTextoNoPublications> <InnerDiv> - <NoPubSpan>{props.text}</NoPubSpan> + <ImgDiv> + <img alt="" src={NoContentImage} style={{ width: "130px", verticalAlign: "middle", border: "0" }} /> + </ImgDiv> + <TextDiv> + <NoPubSpan>{props.text}</NoPubSpan> + </TextDiv> </InnerDiv> </DivTextoNoPublications> ) @@ -44,11 +51,18 @@ const InnerDiv = styled.div` transform : translateY(-50%); ` +const ImgDiv = styled.div` + margin-bottom: 25px; +` + +const TextDiv = styled.div` +` + export const DivTextoNoPublications = styled.div` height : 360px; - text-align : center; padding-left : 15px; padding-right : 15px; + text-align : center; ` // {/*const DivConteudoNaoPublicado = styled.div` diff --git a/src/Components/TabPanels/PanelComponents/TemplateColecao.js b/src/Components/TabPanels/PanelComponents/TemplateColecao.js index 7af99a6cf6e901be5a1c03276475edb85a4dc44e..cb2146f74e315a2531a677f0bdc6a4acf8e523b8 100644 --- a/src/Components/TabPanels/PanelComponents/TemplateColecao.js +++ b/src/Components/TabPanels/PanelComponents/TemplateColecao.js @@ -109,7 +109,7 @@ export default function PanelTemplateColecao(props) { length={props.length} showMore={props.showMore} total={props.end} - end={String(props.sliceArr.length) === props.end} + end={String(props.sliceArr.length) === props.end || Number(props.sliceArr.length) === props.end} /> } </React.Fragment> diff --git a/src/Components/TabPanels/PanelComponents/TemplateCuradoria.js b/src/Components/TabPanels/PanelComponents/TemplateCuradoria.js index 4426a239ded8dc1c3d42925e8f83caa7c59598d7..d03415734eb03a7a7ea0ecb7671a50840240c815 100644 --- a/src/Components/TabPanels/PanelComponents/TemplateCuradoria.js +++ b/src/Components/TabPanels/PanelComponents/TemplateCuradoria.js @@ -83,7 +83,7 @@ export default function Template(props) { sliceLength={props.sliceArr.length} length={props.length} showMore={props.showMore} - end={String(props.sliceArr.length) === props.end} + end={String(props.sliceArr.length) === props.end || Number(props.sliceArr.length) === props.end} total={props.end} /> } diff --git a/src/Components/TabPanels/PanelComponents/TemplateRecurso.js b/src/Components/TabPanels/PanelComponents/TemplateRecurso.js index 6bf05604c0d56eef5e435c449b2b8cc103517572..6079a52a1a19c3d83531d25394203b1dc26695a9 100644 --- a/src/Components/TabPanels/PanelComponents/TemplateRecurso.js +++ b/src/Components/TabPanels/PanelComponents/TemplateRecurso.js @@ -44,7 +44,9 @@ export default function Template(props) { : props.length === 0 ? ( - <NoContent text={props.noContentText} /> + <NoContent + text={props.noContentText} + /> ) : ( @@ -82,7 +84,7 @@ export default function Template(props) { length={props.length} showMore={props.showMore} total={props.end} - end={String(props.slice.length) === props.end} + end={Number(props.slice.length) === props.end || String(props.slice.length) === props.end} /> } diff --git a/src/Components/TabPanels/PanelComponents/TemplateRede.js b/src/Components/TabPanels/PanelComponents/TemplateRede.js index c792b7d2de531c63ef2ec1b44b2f4a61b992b163..e5d2a845a2b2cc388331c622912ac904844379be 100644 --- a/src/Components/TabPanels/PanelComponents/TemplateRede.js +++ b/src/Components/TabPanels/PanelComponents/TemplateRede.js @@ -94,7 +94,7 @@ export default function PanelTemplateRede(props) { length={props.length} showMore={props.showMore} total={props.end} - end={String(props.sliceArr.length) === props.end} + end={String(props.sliceArr.length) === props.end || Number(props.sliceArr.length) === props.end} /> } </React.Fragment> diff --git a/src/Components/TabPanels/UserPageTabs/PanelColecoes.js b/src/Components/TabPanels/UserPageTabs/PanelColecoes.js index eef4d1eaa7df0728081c75d13d87e15db0f199b7..4e6d490f5871ebdef8ab667556b8b1ca980ebe3d 100644 --- a/src/Components/TabPanels/UserPageTabs/PanelColecoes.js +++ b/src/Components/TabPanels/UserPageTabs/PanelColecoes.js @@ -47,12 +47,12 @@ export default function TabPanelColecoes(props) { const [loadingMoreUserColl, setLoadingMoreUserColl] = useState(false); const [loadingMoreFollowedColl, setLoadingMoreFollowedColl] = useState(false); - const [endOfUserColl, setEndOfUserColl] = useState(false); - const [endOfFollowedColl, setEndOfFollowedColl] = useState(false); + const [endOfUserColl, setEndOfUserColl] = useState(0); + const [endOfFollowedColl, setEndOfFollowedColl] = useState(0); - const removeColl = (itemId) => { - let newSlice = userCollections.filter(item => item.id !== itemId); - setUserCollections(newSlice); + const removeColl = (itemId) => { + let newSlice = userCollections.filter(item => item.id !== itemId); + setUserCollections(newSlice); setEndOfUserColl(String(endOfUserColl - 1)) }; @@ -100,7 +100,6 @@ export default function TabPanelColecoes(props) { (data) => { if (data.errors) { setLoadingMoreUserColl(false); - setEndOfUserColl(true) setErrorInUserColl(true) } else if (data.length >= 1) { @@ -111,12 +110,10 @@ export default function TabPanelColecoes(props) { } else { setLoadingMoreUserColl(false); - setEndOfUserColl(true) } }, (error) => { setLoadingMoreUserColl(false); - setEndOfUserColl(true) setErrorInUserColl(true) } ) @@ -131,7 +128,6 @@ export default function TabPanelColecoes(props) { (data) => { if (data.errors) { setLoadingMoreFollowedColl(false); - setEndOfFollowedColl(true) setErrorInFollowedColl(true) } else if (data.length >= 1) { @@ -142,12 +138,10 @@ export default function TabPanelColecoes(props) { } else { setLoadingMoreFollowedColl(false); - setEndOfFollowedColl(true) } }, (error) => { setLoadingMoreFollowedColl(false); - setEndOfFollowedColl(true) setErrorInFollowedColl(true) } ) @@ -168,18 +162,23 @@ export default function TabPanelColecoes(props) { title={"Minhas Coleções"} length={userCollections.length} noContentText={ - <div> - <img src={PaginaVaziaColecao} alt="PaginaVaziaColecao" style={{ height: "150px", width: "150px", verticalAlign: "middle", border: "0" }} /> - <br /> - <span style={{ fontFamily: "Roboto", fontWeight: "lighter", fontSize: "24px" }}> - Criamos a sua primeira Coleção! - </span> - <p style={{ fontFamily: "Roboto", fontSize: "16px", margin: "10px 0 0", fontWeight: "normal" }}> - Adicione nela recursos que você queira acessar mais tarde. - <br /> - Crie novas coleções clicando no cartão roxo "Criar Colecão". - </p> - </div> + <Grid direction='column' justify='center' alignItems='center'> + <Grid item> + <img src={PaginaVaziaColecao} alt="PaginaVaziaColecao" style={{ height: "150px", width: "150px", verticalAlign: "middle", border: "0" }} /> + </Grid> + <Grid> + <span style={{ fontFamily: "Roboto", fontWeight: "lighter", fontSize: "24px", textAlign: 'center' }}> + Criamos a sua primeira Coleção! + </span> + </Grid> + <Grid> + <p style={{ fontFamily: "Roboto", fontSize: "16px", margin: "10px 0 0", fontWeight: "normal" }}> + Adicione nela recursos que você queira acessar mais tarde. + <br /> + Crie novas coleções clicando no cartão roxo "Criar Colecão". + </p> + </Grid> + </Grid> } sliceArr={userCollections} showMore={showMoreUserCollections} @@ -254,7 +253,9 @@ function Tentativa(props) { ( [ <Grid item lg={6} md={4} sm={6} xs={12}> - <NoContent text={props.noContentText} /> + <div> + {props.noContentText} + </div> </Grid> ] ) diff --git a/src/Components/TabPanels/UserPageTabs/PanelCuradoria.js b/src/Components/TabPanels/UserPageTabs/PanelCuradoria.js index d9a3ac296fd3d2f0b6faa3c765bb701323c1f09c..084f865b9077e0752df8b34d221debade2a35492 100644 --- a/src/Components/TabPanels/UserPageTabs/PanelCuradoria.js +++ b/src/Components/TabPanels/UserPageTabs/PanelCuradoria.js @@ -27,7 +27,7 @@ export default function TabPanelCuradoria(props) { const [errorCurating, setErrorCurating] = useState(false) const [loadingMoreCurating, setLoadingMoreCurating] = useState(false) const [currLimitCurating, setcurrLimitCurating] = useState(4); - const [endOfCurating, setEndofCurating] = useState(); + const [endOfCurating, setEndofCurating] = useState(0); const [curating, setCurating] = useState([]); const showMoreCurating = (limite) => { diff --git a/src/Components/TabPanels/UserPageTabs/PanelFavoritos.js b/src/Components/TabPanels/UserPageTabs/PanelFavoritos.js index 8c9fff1ba0a9dce2b90cdd477ddc0decf8242c32..9cf489886054275662595ce75d29302caf0ab2a0 100644 --- a/src/Components/TabPanels/UserPageTabs/PanelFavoritos.js +++ b/src/Components/TabPanels/UserPageTabs/PanelFavoritos.js @@ -36,8 +36,8 @@ export default function TabPanelFavoritos(props) { const [loadingMoreLearnObj, setLoadingMoreLearnObj] = useState(false) const [loadingMoreColl, setLoadingMoreColl] = useState(false) - const [endOfLearnObj, setEndofLearndObj] = useState(false) - const [endOfColl, setEndoffColl] = useState(false) + const [endOfLearnObj, setEndofLearndObj] = useState(0) + const [endOfColl, setEndoffColl] = useState(0) function handleSuccess(responseArr, headersArr) { @@ -82,7 +82,6 @@ export default function TabPanelFavoritos(props) { (data) => { if (data.errors) { setLoadingMoreLearnObj(false); - setEndofLearndObj(true); setErrorInLikedInLearnObj(true); } else if (data.length >= 1) { @@ -93,12 +92,10 @@ export default function TabPanelFavoritos(props) { } else { setLoadingMoreLearnObj(false); - setEndofLearndObj(true) } }, (error) => { setLoadingMoreLearnObj(false); - setEndofLearndObj(true); setErrorInLikedInLearnObj(true); } ) @@ -113,7 +110,6 @@ export default function TabPanelFavoritos(props) { (data) => { if (data.errors) { setLoadingMoreColl(false); - setEndoffColl(true) setErrorInLikedInColl(true) } if (data.length >= 1) { @@ -124,12 +120,10 @@ export default function TabPanelFavoritos(props) { } else { setLoadingMoreColl(false); - setEndoffColl(true) } }, (error) => { setLoadingMoreColl(false); - setEndoffColl(true) setErrorInLikedInColl(true) } ) @@ -147,14 +141,9 @@ export default function TabPanelFavoritos(props) { [ <React.Fragment> <Template - length={endOfLearnObj} - titleText={"Recursos Favoritados"} - noContentText={<p style={{ fontFamily: "Roboto", fontSize: "16px" }}>Quando você favorita um recurso ele aparece nesta seção. Além disso, você - <br /> - aumenta o prestígio dele na Plataforma. Para favoritar, basta clicar no ícone de - <br /> - coração que aparece nos Recursos. - </p>} + length={likedLearnObjs.length} + titleText={likedLearnObjs.length === 1 ? "Recurso favoritado" : "Recursos favoritados"} + noContentText={"Você não favoritou nenhum recurso ainda"} slice={likedLearnObjs} showMore={showMoreLikedLearnObj} loadingMore={loadingMoreLearnObj} @@ -164,7 +153,7 @@ export default function TabPanelFavoritos(props) { <PanelTemplateColecao title={"Coleções favoritadas"} - length={endOfColl} + length={likedCollections.length} noContentText={"Você ainda não curtiu nenhuma coleção."} sliceArr={likedCollections} showMore={showMoreLikedCollections} diff --git a/src/Components/TabPanels/UserPageTabs/PanelMeusRecursos.js b/src/Components/TabPanels/UserPageTabs/PanelMeusRecursos.js index c6c3099a11ac3007bb63adc605896512d79caea1..46400fa191908298e8c373e83a5971b74da1dcf3 100644 --- a/src/Components/TabPanels/UserPageTabs/PanelMeusRecursos.js +++ b/src/Components/TabPanels/UserPageTabs/PanelMeusRecursos.js @@ -105,7 +105,6 @@ export default function TabPanelAtividades(props) { } else { setLoadingMoreLearnObj(false); - setEndofLearndObj(true) } }, (error) => { @@ -136,7 +135,6 @@ export default function TabPanelAtividades(props) { } else { setLoadingMoreDrafts(false); - setEndofDrafts(true); } }, (error) => { @@ -165,7 +163,6 @@ export default function TabPanelAtividades(props) { } else { setLoadingMoreCurating(false); - setEndofCurating(true); } }, @@ -187,7 +184,7 @@ export default function TabPanelAtividades(props) { ( [ <React.Fragment> - <Template + <Template length={learningObjects.length} titleText={learningObjects.length === 1 ? "Recurso Publicado" : "Recursos Publicados"} noContentText={"Você ainda não publicou nenhum Recurso!"} diff --git a/src/Components/TabPanels/UserPageTabs/PanelRede.js b/src/Components/TabPanels/UserPageTabs/PanelRede.js index 03f4083bb18f0ad729f2a6234ef16c455666cef8..ba5741a5044359462e57d866a74e946c4ae0d444 100644 --- a/src/Components/TabPanels/UserPageTabs/PanelRede.js +++ b/src/Components/TabPanels/UserPageTabs/PanelRede.js @@ -31,12 +31,12 @@ export default function TabPanelRede(props) { const [followingList, setFollowing] = useState([]) const [currFollowingLimit, setCurrFollowingLimit] = useState(12) const [loadingMoreFollowing, setLoadingFollowing] = useState(false) - const [endOfFollowing, setEndOfFollowing] = useState(false) + const [endOfFollowing, setEndOfFollowing] = useState(0) const [followersList, setFollowers] = useState([]) const [currFollowerLimit, setFollowersLimit] = useState(12) const [loadingMoreFollowers, setLoadingMoreFollowers] = useState(false) - const [endOfFollowers, setEndOfFollowers] = useState(false) + const [endOfFollowers, setEndOfFollowers] = useState(0) const showMoreFollowing = (limite) => { setLoadingFollowing(true); @@ -47,7 +47,6 @@ export default function TabPanelRede(props) { (data) => { if (data.errors) { setLoadingFollowing(false); - setEndOfFollowing(true); setErrorInFollowing(true); } else if (data.length >= 1) { @@ -58,12 +57,10 @@ export default function TabPanelRede(props) { } else { setLoadingFollowing(false); - setEndOfFollowing(true); } }, (error) => { setLoadingFollowing(false); - setEndOfFollowing(true); setErrorInFollowing(true); } ) @@ -78,7 +75,6 @@ export default function TabPanelRede(props) { (data) => { if (data.errors) { setLoadingMoreFollowers(false); - setEndOfFollowers(true); setErrorInFollowers(true); } else { @@ -90,13 +86,11 @@ export default function TabPanelRede(props) { } else { setLoadingMoreFollowers(false); - setEndOfFollowers(true) } } }, (error) => { setLoadingMoreFollowers(false); - setEndOfFollowers(true); setErrorInFollowers(true); } ) @@ -118,7 +112,6 @@ export default function TabPanelRede(props) { function handleErrors() { setLoadingMoreFollowers(false); - setEndOfFollowers(true); setErrorInFollowers(true); }