fix render loop
This commit is contained in:
parent
967dfea182
commit
278f3f96f8
@ -113,6 +113,8 @@ export default function MemberCard(props) {
|
|||||||
}, [member.description, member.color, member.birthday, member.display_name, member.pronouns, member.avatar_url, member.proxy_tags]);
|
}, [member.description, member.color, member.birthday, member.display_name, member.pronouns, member.avatar_url, member.proxy_tags]);
|
||||||
|
|
||||||
const submitEdit = data => {
|
const submitEdit = data => {
|
||||||
|
props.edit(Object.assign(member, data));
|
||||||
|
|
||||||
fetch(`${API_URL}m/${member.id}`,{
|
fetch(`${API_URL}m/${member.id}`,{
|
||||||
method: 'PATCH',
|
method: 'PATCH',
|
||||||
body: JSON.stringify(data),
|
body: JSON.stringify(data),
|
||||||
@ -132,6 +134,8 @@ export default function MemberCard(props) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const submitPrivacy = data => {
|
const submitPrivacy = data => {
|
||||||
|
props.edit(Object.assign(member, data));
|
||||||
|
|
||||||
fetch(`${API_URL}m/${member.id}`,{
|
fetch(`${API_URL}m/${member.id}`,{
|
||||||
method: 'PATCH',
|
method: 'PATCH',
|
||||||
body: JSON.stringify(data),
|
body: JSON.stringify(data),
|
||||||
@ -181,6 +185,7 @@ export default function MemberCard(props) {
|
|||||||
const submitProxy = data => {
|
const submitProxy = data => {
|
||||||
|
|
||||||
const newdata = {proxy_tags: data.proxy_tags.filter(tag => !(tag.prefix === "" && tag.suffix === ""))}
|
const newdata = {proxy_tags: data.proxy_tags.filter(tag => !(tag.prefix === "" && tag.suffix === ""))}
|
||||||
|
props.edit(Object.assign(member, newdata));
|
||||||
|
|
||||||
fetch(`${API_URL}m/${member.id}`,{
|
fetch(`${API_URL}m/${member.id}`,{
|
||||||
method: 'PATCH',
|
method: 'PATCH',
|
||||||
@ -192,7 +197,7 @@ export default function MemberCard(props) {
|
|||||||
).then (data => {
|
).then (data => {
|
||||||
setMember(prevState => {return {...prevState, ...data}});
|
setMember(prevState => {return {...prevState, ...data}});
|
||||||
setProxyTags(data.proxy_tags);
|
setProxyTags(data.proxy_tags);
|
||||||
setErrorAlert(false)
|
setErrorAlert(false);
|
||||||
setProxyMode(false);
|
setProxyMode(false);
|
||||||
}
|
}
|
||||||
).catch (error => {
|
).catch (error => {
|
||||||
@ -203,14 +208,6 @@ export default function MemberCard(props) {
|
|||||||
|
|
||||||
const didMount = useRef(false);
|
const didMount = useRef(false);
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (didMount.current) {
|
|
||||||
props.edit(member);
|
|
||||||
} else {
|
|
||||||
didMount.current = true;
|
|
||||||
}
|
|
||||||
}, [props, member]);
|
|
||||||
|
|
||||||
function copyLink() {
|
function copyLink() {
|
||||||
var link = `https://spectralitree.github.io/pk-webs/profile/${sysID}/${member.id}`
|
var link = `https://spectralitree.github.io/pk-webs/profile/${sysID}/${member.id}`
|
||||||
var textField = document.createElement('textarea')
|
var textField = document.createElement('textarea')
|
||||||
|
@ -84,7 +84,7 @@ export default function Memberlist() {
|
|||||||
})
|
})
|
||||||
|
|
||||||
const currentMembers = Members1.filter(member => {
|
const currentMembers = Members1.filter(member => {
|
||||||
if (!value & privacyFilter === 'all') return true;
|
if (!value) return true;
|
||||||
|
|
||||||
if (privacyFilter === 'private') {
|
if (privacyFilter === 'private') {
|
||||||
if (member.visibility !== 'private') {
|
if (member.visibility !== 'private') {
|
||||||
@ -138,7 +138,7 @@ export default function Memberlist() {
|
|||||||
const memberList = sortMembers.map((member) => <BS.Card key={member.id}>
|
const memberList = sortMembers.map((member) => <BS.Card key={member.id}>
|
||||||
<MemberCard
|
<MemberCard
|
||||||
member={member}
|
member={member}
|
||||||
edit={memberEdit => {setMembers(members.map(member => member.id === memberEdit.id ? Object.assign(member, memberEdit) : member)); console.log(members)}}
|
edit={memberEdit => setMembers(members.map(member => member.id === memberEdit.id ? Object.assign(member, memberEdit) : member))}
|
||||||
/>
|
/>
|
||||||
</BS.Card>
|
</BS.Card>
|
||||||
);
|
);
|
||||||
@ -250,11 +250,11 @@ export default function Memberlist() {
|
|||||||
<BS.Pagination className="ml-auto mr-auto">
|
<BS.Pagination className="ml-auto mr-auto">
|
||||||
{ currentPage === 1 ? <BS.Pagination.Prev disabled/> : <BS.Pagination.Prev onClick={() => setCurrentPage(currentPage - 1)} />}
|
{ currentPage === 1 ? <BS.Pagination.Prev disabled/> : <BS.Pagination.Prev onClick={() => setCurrentPage(currentPage - 1)} />}
|
||||||
{ currentPage < 3 ? "" : <BS.Pagination.Item onClick={() => setCurrentPage(1)} active={1 === active}>{1}</BS.Pagination.Item>}
|
{ currentPage < 3 ? "" : <BS.Pagination.Item onClick={() => setCurrentPage(1)} active={1 === active}>{1}</BS.Pagination.Item>}
|
||||||
{ currentPage < 4 ? "" :<BS.Pagination.Ellipsis disabled />}
|
{ currentPage < 4 ? "" : currentPage < 5 ? <BS.Pagination.Item onClick={() => setCurrentPage(2)} active={2 === active}>{2}</BS.Pagination.Item> : <BS.Pagination.Ellipsis disabled />}
|
||||||
{ currentPage > 1 ? <BS.Pagination.Item onClick={() => setCurrentPage(currentPage - 1)}>{currentPage - 1}</BS.Pagination.Item> : "" }
|
{ currentPage > 1 ? <BS.Pagination.Item onClick={() => setCurrentPage(currentPage - 1)}>{currentPage - 1}</BS.Pagination.Item> : "" }
|
||||||
<BS.Pagination.Item onClick={() => setCurrentPage(currentPage)} active={currentPage === active}>{currentPage}</BS.Pagination.Item>
|
<BS.Pagination.Item onClick={() => setCurrentPage(currentPage)} active={currentPage === active}>{currentPage}</BS.Pagination.Item>
|
||||||
{ currentPage < pageAmount ? <BS.Pagination.Item onClick={() => setCurrentPage(currentPage + 1)}>{currentPage + 1}</BS.Pagination.Item> : "" }
|
{ currentPage < pageAmount ? <BS.Pagination.Item onClick={() => setCurrentPage(currentPage + 1)}>{currentPage + 1}</BS.Pagination.Item> : "" }
|
||||||
{ currentPage > pageAmount - 3 ? "" : <BS.Pagination.Ellipsis disabled />}
|
{ currentPage > pageAmount - 3 ? "" : currentPage === pageAmount - 3 ? <BS.Pagination.Item onClick={() => setCurrentPage(pageAmount - 1)} active={pageAmount - 1 === active}>{pageAmount - 1}</BS.Pagination.Item> : <BS.Pagination.Ellipsis disabled />}
|
||||||
{ currentPage > pageAmount - 2 ? "" : <BS.Pagination.Item onClick={() => setCurrentPage(pageAmount)} active={pageAmount === active}>{pageAmount}</BS.Pagination.Item>}
|
{ currentPage > pageAmount - 2 ? "" : <BS.Pagination.Item onClick={() => setCurrentPage(pageAmount)} active={pageAmount === active}>{pageAmount}</BS.Pagination.Item>}
|
||||||
{ currentPage === pageAmount ? <BS.Pagination.Next disabled /> :<BS.Pagination.Next onClick={() => setCurrentPage(currentPage + 1)} />}
|
{ currentPage === pageAmount ? <BS.Pagination.Next disabled /> :<BS.Pagination.Next onClick={() => setCurrentPage(currentPage + 1)} />}
|
||||||
</BS.Pagination>
|
</BS.Pagination>
|
||||||
@ -391,6 +391,19 @@ export default function Memberlist() {
|
|||||||
<BS.Accordion className="mb-3 mt-3 w-100" defaultActiveKey="0">
|
<BS.Accordion className="mb-3 mt-3 w-100" defaultActiveKey="0">
|
||||||
{memberList}
|
{memberList}
|
||||||
</BS.Accordion>
|
</BS.Accordion>
|
||||||
|
<BS.Row className="justify-content-md-center">
|
||||||
|
<BS.Pagination className="ml-auto mr-auto">
|
||||||
|
{ currentPage === 1 ? <BS.Pagination.Prev disabled/> : <BS.Pagination.Prev onClick={() => setCurrentPage(currentPage - 1)} />}
|
||||||
|
{ currentPage < 3 ? "" : <BS.Pagination.Item onClick={() => setCurrentPage(1)} active={1 === active}>{1}</BS.Pagination.Item>}
|
||||||
|
{ currentPage < 4 ? "" : currentPage < 5 ? <BS.Pagination.Item onClick={() => setCurrentPage(2)} active={2 === active}>{2}</BS.Pagination.Item> : <BS.Pagination.Ellipsis disabled />}
|
||||||
|
{ currentPage > 1 ? <BS.Pagination.Item onClick={() => setCurrentPage(currentPage - 1)}>{currentPage - 1}</BS.Pagination.Item> : "" }
|
||||||
|
<BS.Pagination.Item onClick={() => setCurrentPage(currentPage)} active={currentPage === active}>{currentPage}</BS.Pagination.Item>
|
||||||
|
{ currentPage < pageAmount ? <BS.Pagination.Item onClick={() => setCurrentPage(currentPage + 1)}>{currentPage + 1}</BS.Pagination.Item> : "" }
|
||||||
|
{ currentPage > pageAmount - 3 ? "" : currentPage === pageAmount - 3 ? <BS.Pagination.Item onClick={() => setCurrentPage(pageAmount - 1)} active={pageAmount - 1 === active}>{pageAmount - 1}</BS.Pagination.Item> : <BS.Pagination.Ellipsis disabled />}
|
||||||
|
{ currentPage > pageAmount - 2 ? "" : <BS.Pagination.Item onClick={() => setCurrentPage(pageAmount)} active={pageAmount === active}>{pageAmount}</BS.Pagination.Item>}
|
||||||
|
{ currentPage === pageAmount ? <BS.Pagination.Next disabled /> :<BS.Pagination.Next onClick={() => setCurrentPage(currentPage + 1)} />}
|
||||||
|
</BS.Pagination>
|
||||||
|
</BS.Row>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
</>
|
</>
|
||||||
@ -398,7 +411,7 @@ export default function Memberlist() {
|
|||||||
<Route path={`${path}/:memberID`}>
|
<Route path={`${path}/:memberID`}>
|
||||||
{ isLoading ? <Loading/> :
|
{ isLoading ? <Loading/> :
|
||||||
<MemberPages members={members}
|
<MemberPages members={members}
|
||||||
edit={memberEdit => {setMembers(members.map(member => member.id === memberEdit.id ? Object.assign(member, memberEdit) : member)); console.log(members)}}/>}
|
edit={memberEdit => setMembers(members.map(member => member.id === memberEdit.id ? Object.assign(member, memberEdit) : member))}/>}
|
||||||
</Route>
|
</Route>
|
||||||
</Switch>
|
</Switch>
|
||||||
)
|
)
|
||||||
|
Loading…
Reference in New Issue
Block a user