Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
import React, { useState, useEffect } from 'react'
import PropTypes from 'prop-types'
import Table from '../Table'
import MobileTable from '../MobileTable'
import Button from '../Button'
import RegisterUser from '../../containers/Register/RegisterUser'
import { Container, WrapperAddUser } from './styles'
const useViewport = () => {
const [width, setWidth] = useState(window.innerWidth)
useEffect(() => {
const handleWindowResize = () => setWidth(window.innerWidth)
window.addEventListener('resize', handleWindowResize)
return () => window.removeEventListener('resize', handleWindowResize)
}, [])
return { width }
}
<<<<<<< HEAD
const WrapperTable = ({
tableName,
dataUser,
isLoading,
currentUser,
geos,
setPopUpMessage,
setIsPopUpOpen,
}) => {
<<<<<<< HEAD
const [modalIsOpen, setIsOpen] = useState(false)
=======
const [modalIsOpen, setIsOpen] = useState(true)
=======
const WrapperTable = ({ tableName, isMaster, geos }) => {
const [modalIsOpen, setIsOpen] = useState(false)
const [editModalOpen, setEditModalOpen] = useState(false)
>>>>>>> 249956a... add edit user component
>>>>>>> 7c487c4... add edit user component
const { width } = useViewport()
const breakpoint = 750
const handleRegisterNewUser = () => {
setIsOpen(true)
}
const handleEditClick = () => {
setEditModalOpen(true)
}
const closeModal = () => {
setIsOpen(false)
setEditModalOpen(false)
}
return (
<>
{modalIsOpen && (
<RegisterUser
modalTypeName="Adicionar novo"
isOpen={modalIsOpen}
closeModal={closeModal}
tableName={tableName}
geos={geos}
/>
)}
{editModalOpen && (
<RegisterUser
modalTypeName="Editar"
isOpen={modalIsOpen}
closeModal={closeModal}
tableName={tableName}
geos={geos}
setPopUpMessage={setPopUpMessage}
setIsPopUpOpen={setIsPopUpOpen}
/>
)}
<Container modalIsOpen={modalIsOpen}>
<WrapperAddUser>
<h2>{tableName}</h2>
{currentUser.is_master === 1 ? (
<Button
text="Cadastrar novo usuário"
noMargin
lightColor
handleClick={handleRegisterNewUser}
/>
) : null}
</WrapperAddUser>
{width <= breakpoint ? (
<MobileTable
dataUser={dataUser}
isLoading={isLoading}
isMaster={currentUser.is_master}
/>
) : (
<Table
dataUser={dataUser}
isLoading={isLoading}
isMaster={currentUser.is_master}
/>
)}
</Container>
</>
)
}
WrapperTable.propTypes = {
tableName: PropTypes.string.isRequired,
dataUser: PropTypes.arrayOf(
PropTypes.shape({
id: PropTypes.number.isRequired,
name: PropTypes.string.isRequired,
})
).isRequired,
isLoading: PropTypes.bool.isRequired,
currentUser: PropTypes.shape({
is_master: PropTypes.number.isRequired,
}).isRequired,
}
export default WrapperTable
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment