cha0s/reddichat-flat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: unread for friend requests

Browse Source
This commit is contained in:
cha0s 2020-07-25 09:33:47 -05:00
parent 27b3451ad7
commit 1dcbe1f0ca
4 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/client/chat--center.jsx
View File

@ -5,6 +5,8 @@ import React from 'react';
import {useSelector} from 'react-redux'; import {useSelector} from 'react-redux';
import { import {
idSelector,
pendingFriendshipSelector,
unreadChannelSelector, unreadChannelSelector,
unreadUserSelector, unreadUserSelector,
} from '~/common/state/user'; } from '~/common/state/user';
@ -16,9 +18,12 @@ import ChatMessages from './chat--messages';
export default function ChatCenter(props) { export default function ChatCenter(props) {
const {onButton} = props; const {onButton} = props;
const channel = useChannel(); const channel = useChannel();
const id = useSelector(idSelector);
const pendingFriendship = useSelector(pendingFriendshipSelector)
.filter(({addeeId}) => addeeId === id).length;
const unreadChannel = useSelector(unreadChannelSelector); const unreadChannel = useSelector(unreadChannelSelector);
const unreadUser = useSelector(unreadUserSelector); const unreadUser = useSelector(unreadUserSelector);
const unread = unreadChannel + unreadUser; const unread = pendingFriendship + unreadChannel + unreadUser;
return ( return (
<div <div
className="center flexed" className="center flexed"

5
src/client/chat--left.jsx
View File

@ -26,7 +26,8 @@ export default function ChatLeft() {
const active = useSelector(leftActiveIndexSelector); const active = useSelector(leftActiveIndexSelector);
const isOpen = useSelector(leftIsOpenSelector); const isOpen = useSelector(leftIsOpenSelector);
const id = useSelector(idSelector); const id = useSelector(idSelector);
const pendingFriendship = useSelector(pendingFriendshipSelector); const pendingFriendship = useSelector(pendingFriendshipSelector)
.filter(({addeeId}) => addeeId === id).length;
const unreadChannel = useSelector(unreadChannelSelector); const unreadChannel = useSelector(unreadChannelSelector);
const unreadUser = useSelector(unreadUserSelector); const unreadUser = useSelector(unreadUserSelector);
const showsAsOpen = isOpen; const showsAsOpen = isOpen;
@ -37,7 +38,7 @@ export default function ChatLeft() {
label: 'Chat', label: 'Chat',
}, },
{ {
count: unreadUser + pendingFriendship.filter(({addeeId}) => addeeId === id).length, count: unreadUser + pendingFriendship,
icon: '😁', icon: '😁',
label: 'Friends', label: 'Friends',
}, },

6
src/client/chat--leftFriends.jsx
View File

@ -71,7 +71,11 @@ export default function ChatLeftFriends() {
</form> </form>
{pendingIncomingFriendship.length > 0 && ( {pendingIncomingFriendship.length > 0 && (
<> <>
<h2 className="friends__chatsTitle">Incoming requests</h2> <h2 className="friends__chatsTitle">
<span className="unread friends__requests">{pendingIncomingFriendship.length}</span>
{' '}
Incoming requests
</h2>
<ul className="friends__chatsList"> <ul className="friends__chatsList">
{pendingIncomingFriendship.map((friendship) => { {pendingIncomingFriendship.map((friendship) => {
const {addeeId, adderId} = friendship; const {addeeId, adderId} = friendship;

6
src/client/chat--leftFriends.scss
View File

@ -40,3 +40,9 @@
text-transform: uppercase; text-transform: uppercase;
white-space: nowrap; white-space: nowrap;
} }
.friends__requests {
color: #ffffff;
font-size: 0.9em;
padding: 0.5em 0.4em;
}