From 87f1ee4c5dcb71dff4c44010dadce285c9e1ac68 Mon Sep 17 00:00:00 2001
From: Bill <billsonnn@live.com>
Date: Wed, 2 Mar 2022 22:52:15 -0500
Subject: [PATCH] More group updates

---
 .../groups/views/GroupInformationView.tsx     | 19 +++++-------
 .../groups/views/GroupMembersView.tsx         | 29 +++++++++----------
 .../groups/views/GroupRoomInformationView.tsx | 11 +++----
 3 files changed, 25 insertions(+), 34 deletions(-)

diff --git a/src/components/groups/views/GroupInformationView.tsx b/src/components/groups/views/GroupInformationView.tsx
index 757acdb4..aef5b7af 100644
--- a/src/components/groups/views/GroupInformationView.tsx
+++ b/src/components/groups/views/GroupInformationView.tsx
@@ -25,7 +25,7 @@ export const GroupInformationView: FC<GroupInformationViewProps> = props =>
 {
     const { groupInformation = null, onClose = null } = props;    
 
-    const isRealOwner = () => (groupInformation && (groupInformation.ownerName === GetSessionDataManager().userName));
+    const isRealOwner = (groupInformation && (groupInformation.ownerName === GetSessionDataManager().userName));
     
     const joinGroup = () => (groupInformation && TryJoinGroup(groupInformation.id));
 
@@ -43,7 +43,7 @@ export const GroupInformationView: FC<GroupInformationViewProps> = props =>
     {
         if(groupInformation.membershipType === GroupMembershipType.NOT_MEMBER || groupInformation.membershipType === GroupMembershipType.REQUEST_PENDING) return null;
 
-        if(isRealOwner()) return <i className="icon icon-group-owner" title={ LocalizeText('group.youareowner') } />;
+        if(isRealOwner) return <i className="icon icon-group-owner" title={ LocalizeText('group.youareowner') } />;
 
         if(groupInformation.isAdmin) return <i className="icon icon-group-admin" title={ LocalizeText('group.youareadmin') } />;
 
@@ -52,20 +52,17 @@ export const GroupInformationView: FC<GroupInformationViewProps> = props =>
 
     const getButtonText = () =>
     {
-        if(groupInformation.type === GroupType.PRIVATE) return '';
+        if(isRealOwner) return 'group.youareowner';
 
-        if(isRealOwner()) return 'group.youareowner';
+        if(groupInformation.type === GroupType.PRIVATE) return '';
 
         if(groupInformation.membershipType === GroupMembershipType.MEMBER) return 'group.leave';
 
-        if(groupInformation.membershipType === GroupMembershipType.NOT_MEMBER && groupInformation.type === GroupType.REGULAR) return 'group.join';
+        if((groupInformation.membershipType === GroupMembershipType.NOT_MEMBER) && groupInformation.type === GroupType.REGULAR) return 'group.join';
 
-        if(groupInformation.type === GroupType.EXCLUSIVE)
-        {
-            if(groupInformation.membershipType === GroupMembershipType.NOT_MEMBER) return 'group.requestmembership';
+        if(groupInformation.membershipType === GroupMembershipType.REQUEST_PENDING) return 'group.membershippending';
 
-            if(groupInformation.membershipType === GroupMembershipType.REQUEST_PENDING) return 'group.membershippending';
-        }
+        if((groupInformation.membershipType === GroupMembershipType.NOT_MEMBER) && groupInformation.type === GroupType.EXCLUSIVE) return 'group.requestmembership';
     }
 
     const handleButtonClick = () =>
@@ -143,7 +140,7 @@ export const GroupInformationView: FC<GroupInformationViewProps> = props =>
                         <Text small underline pointer>{ LocalizeText('group.showgroups') }</Text>
                     </Column>
                     { (groupInformation.type !== GroupType.PRIVATE) && 
-                        <Button disabled={ (groupInformation.membershipType === GroupMembershipType.REQUEST_PENDING) || isRealOwner() } onClick={ handleButtonClick }>
+                        <Button disabled={ (groupInformation.membershipType === GroupMembershipType.REQUEST_PENDING) || isRealOwner } onClick={ handleButtonClick }>
                             { LocalizeText(getButtonText()) }
                         </Button> }
                 </Column>
diff --git a/src/components/groups/views/GroupMembersView.tsx b/src/components/groups/views/GroupMembersView.tsx
index a4064cdc..f6f86ea0 100644
--- a/src/components/groups/views/GroupMembersView.tsx
+++ b/src/components/groups/views/GroupMembersView.tsx
@@ -1,6 +1,5 @@
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { GroupAdminGiveComposer, GroupAdminTakeComposer, GroupConfirmMemberRemoveEvent, GroupConfirmRemoveMemberComposer, GroupMemberParser, GroupMembersComposer, GroupMembersEvent, GroupMembershipAcceptComposer, GroupMembershipDeclineComposer, GroupMembersParser, GroupRank, GroupRemoveMemberComposer, ILinkEventTracker } from '@nitrots/nitro-renderer';
-import classNames from 'classnames';
 import { FC, useCallback, useEffect, useState } from 'react';
 import { AddEventLinkTracker, GetSessionDataManager, GetUserProfile, LocalizeText, RemoveLinkEventTracker } from '../../../api';
 import { Base, Button, Column, Flex, Grid, Text } from '../../../common';
@@ -20,10 +19,6 @@ export const GroupMembersView: FC<{}> = props =>
     const [ searchQuery, setSearchQuery ] = useState<string>('');
     const [ removingMemberName, setRemovingMemberName ] = useState<string>(null);
 
-    const previousPage = () => setPageId(prevValue => (prevValue - 1));
-
-    const nextPage = () => setPageId(prevValue => (prevValue + 1));
-
     const getRankDescription = (member: GroupMemberParser) =>
     {
         if(member.rank === GroupRank.OWNER) return 'group.members.owner';
@@ -47,7 +42,7 @@ export const GroupMembersView: FC<{}> = props =>
 
     const toggleAdmin = (member: GroupMemberParser) =>
     {
-        if(member.rank === GroupRank.OWNER) return;
+        if(!membersData.admin || (member.rank === GroupRank.OWNER)) return;
         
         if(member.rank !== GroupRank.ADMIN) SendMessageHook(new GroupAdminGiveComposer(membersData.groupId, member.id));
         else SendMessageHook(new GroupAdminTakeComposer(membersData.groupId, member.id));
@@ -57,7 +52,7 @@ export const GroupMembersView: FC<{}> = props =>
 
     const acceptMembership = (member: GroupMemberParser) =>
     {
-        if(member.rank !== GroupRank.REQUESTED) return;
+        if(!membersData.admin || (member.rank !== GroupRank.REQUESTED)) return;
         
         SendMessageHook(new GroupMembershipAcceptComposer(membersData.groupId, member.id));
 
@@ -66,6 +61,8 @@ export const GroupMembersView: FC<{}> = props =>
 
     const removeMemberOrDeclineMembership = (member: GroupMemberParser) =>
     {
+        if(!membersData.admin) return;
+
         if(member.rank === GroupRank.REQUESTED)
         {
             SendMessageHook(new GroupMembershipDeclineComposer(membersData.groupId, member.id));
@@ -191,22 +188,22 @@ export const GroupMembersView: FC<{}> = props =>
                                         <AvatarImageView figure={ member.figure } headOnly={ true } direction={ 2 } />
                                     </div>
                                     <Column grow gap={ 1 }>
-                                        <Text bold small pointer onClick={ () => GetUserProfile(member.id) }>{ member.name }</Text>
+                                        <Text bold small pointer onClick={ event => GetUserProfile(member.id) }>{ member.name }</Text>
                                         { (member.rank !== GroupRank.REQUESTED) &&
-                                            <Text small italics variant="muted">{ LocalizeText('group.members.since', ['date'], [member.joinedAt]) }</Text> }
+                                            <Text small italics variant="muted">{ LocalizeText('group.members.since', [ 'date' ], [ member.joinedAt ]) }</Text> }
                                     </Column>
                                     <Column gap={ 1 }>
                                         { (member.rank !== GroupRank.REQUESTED) &&
                                             <Flex center>
-                                                <i className={ 'icon icon-group-small-' + classNames({ 'owner': (member.rank === GroupRank.OWNER), 'admin': (member.rank === GroupRank.ADMIN), 'not-admin': (member.rank === GroupRank.MEMBER), 'cursor-pointer': membersData.admin }) } title={ LocalizeText(getRankDescription(member)) } onClick={ () => toggleAdmin(member) } />
+                                                <Base pointer={ membersData.admin } className={ `icon icon-group-small-${ ((member.rank === GroupRank.OWNER) ? 'owner' : (member.rank === GroupRank.ADMIN) ? 'admin' : (membersData.admin && (member.rank === GroupRank.MEMBER)) ? 'not-admin' : '') }` } title={ LocalizeText(getRankDescription(member)) } onClick={ event => toggleAdmin(member) } />
                                             </Flex> }
-                                        { (member.rank === GroupRank.REQUESTED) &&
+                                        { membersData.admin && (member.rank === GroupRank.REQUESTED) &&
                                             <Flex alignItems="center">
-                                                <Base pointer className="nitro-friends-spritesheet icon-accept" title={ LocalizeText('group.members.accept') } onClick={ () => acceptMembership(member) }></Base>
+                                                <Base pointer className="nitro-friends-spritesheet icon-accept" title={ LocalizeText('group.members.accept') } onClick={ event => acceptMembership(member) }></Base>
                                             </Flex> }
-                                        { (member.rank !== GroupRank.OWNER) && membersData.admin && (member.id !== GetSessionDataManager().userId) &&
+                                        { membersData.admin && (member.rank !== GroupRank.OWNER) && (member.id !== GetSessionDataManager().userId) &&
                                             <Flex alignItems="center">
-                                                <Base pointer className="nitro-friends-spritesheet icon-deny" title={ LocalizeText(member.rank === GroupRank.REQUESTED ? 'group.members.reject' : 'group.members.kick') } onClick={ () => removeMemberOrDeclineMembership(member) }></Base>
+                                                <Base pointer className="nitro-friends-spritesheet icon-deny" title={ LocalizeText(member.rank === GroupRank.REQUESTED ? 'group.members.reject' : 'group.members.kick') } onClick={ event => removeMemberOrDeclineMembership(member) }></Base>
                                             </Flex> }
                                     </Column>
                                 </Flex>
@@ -214,13 +211,13 @@ export const GroupMembersView: FC<{}> = props =>
                         }) }
                 </Grid>
                 <Flex gap={ 1 } justifyContent="between" alignItems="center">
-                    <Button disabled={ (membersData.pageIndex === 0) } onClick={ previousPage }>
+                    <Button disabled={ (membersData.pageIndex === 0) } onClick={ event => setPageId(prevValue => (prevValue - 1)) }>
                         <FontAwesomeIcon icon="chevron-left" />
                     </Button>
                     <Text small>
                         { LocalizeText('group.members.pageinfo', ['amount', 'page', 'totalPages'], [membersData.totalMembersCount.toString(), (membersData.pageIndex + 1).toString(), totalPages.toString()]) }
                     </Text>
-                    <Button disabled={ (membersData.pageIndex === (totalPages - 1)) } onClick={ nextPage }>
+                    <Button disabled={ (membersData.pageIndex === (totalPages - 1)) } onClick={ event => setPageId(prevValue => (prevValue + 1)) }>
                         <FontAwesomeIcon icon="chevron-right" />
                     </Button>
                 </Flex>
diff --git a/src/components/groups/views/GroupRoomInformationView.tsx b/src/components/groups/views/GroupRoomInformationView.tsx
index 789cfb69..31c70a34 100644
--- a/src/components/groups/views/GroupRoomInformationView.tsx
+++ b/src/components/groups/views/GroupRoomInformationView.tsx
@@ -90,18 +90,15 @@ export const GroupRoomInformationView: FC<{}> = props =>
     {
         if(isRealOwner) return 'group.manage';
 
-        if(groupInformation.type === GroupType.PRIVATE) return '';        
+        if(groupInformation.type === GroupType.PRIVATE) return '';
 
         if(groupInformation.membershipType === GroupMembershipType.MEMBER) return 'group.leave';
 
-        if(groupInformation.membershipType === GroupMembershipType.NOT_MEMBER && groupInformation.type === GroupType.REGULAR) return 'group.join';
+        if((groupInformation.membershipType === GroupMembershipType.NOT_MEMBER) && groupInformation.type === GroupType.REGULAR) return 'group.join';
 
-        if(groupInformation.type === GroupType.EXCLUSIVE)
-        {
-            if(groupInformation.membershipType === GroupMembershipType.NOT_MEMBER) return 'group.requestmembership';
+        if(groupInformation.membershipType === GroupMembershipType.REQUEST_PENDING) return 'group.membershippending';
 
-            if(groupInformation.membershipType === GroupMembershipType.REQUEST_PENDING) return 'group.membershippending';
-        }
+        if((groupInformation.membershipType === GroupMembershipType.NOT_MEMBER) && groupInformation.type === GroupType.EXCLUSIVE) return 'group.requestmembership';
     }
 
     const handleButtonClick = () =>