Feat(UI): Added announcement filter option for activity feeds. (#6669)

* Added announcement filter option in thread filter dropdown for activity feeds

* Added alt props for icons and minor improvement in dropdownlist
This commit is contained in:
Aniket Katkar 2022-08-09 18:19:17 +05:30 committed by GitHub
parent fa98e05ee3
commit ec41f7be15
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 95 additions and 15 deletions

View File

@ -5,22 +5,50 @@ export const filterList = [
{ {
name: 'All Activity', name: 'All Activity',
value: 'ALL', value: 'ALL',
icon: <SVGIcons alt="" icon={Icons.ALL_APPLICATION} width="16px" />, icon: (
<SVGIcons
alt="All Activity"
className="tw-mr-2"
icon={Icons.ALL_APPLICATION}
width="16px"
/>
),
}, },
{ {
name: 'My Data', name: 'My Data',
value: 'OWNER', value: 'OWNER',
icon: <SVGIcons alt="" icon={Icons.FOLDER} width="16px" />, icon: (
<SVGIcons
alt="My Data"
className="tw-mr-2"
icon={Icons.FOLDER}
width="16px"
/>
),
}, },
{ {
name: 'Mentions', name: 'Mentions',
value: 'MENTIONS', value: 'MENTIONS',
icon: <SVGIcons alt="" icon={Icons.MENTIONS} width="16px" />, icon: (
<SVGIcons
alt="Mentions"
className="tw-mr-2"
icon={Icons.MENTIONS}
width="16px"
/>
),
}, },
{ {
name: 'Following', name: 'Following',
value: 'FOLLOWS', value: 'FOLLOWS',
icon: <SVGIcons alt="" icon={Icons.STAR} width="16px" />, icon: (
<SVGIcons
alt="Following"
className="tw-mr-2"
icon={Icons.STAR}
width="16px"
/>
),
}, },
]; ];
@ -28,17 +56,45 @@ export const threadFilterList = [
{ {
name: 'All Threads', name: 'All Threads',
value: 'ALL', value: 'ALL',
icon: <SVGIcons alt="" icon={Icons.ALL_APPLICATION} width="16px" />, icon: (
<SVGIcons
alt="All Threads"
className="tw-mr-2"
icon={Icons.ALL_APPLICATION}
width="16px"
/>
),
}, },
{ {
name: 'Task', name: 'Task',
value: 'Task', value: 'Task',
icon: <SVGIcons alt="" icon={Icons.TASK} width="16px" />, icon: (
<SVGIcons alt="Task" className="tw-mr-2" icon={Icons.TASK} width="16px" />
),
}, },
{ {
name: 'Conversation', name: 'Conversation',
value: 'Conversation', value: 'Conversation',
icon: <SVGIcons alt="" icon={Icons.COMMENT_GREY} width="16px" />, icon: (
<SVGIcons
alt="Conversation"
className="tw-mr-2"
icon={Icons.COMMENT_GREY}
width="16px"
/>
),
},
{
name: 'Announcement',
value: 'Announcement',
icon: (
<SVGIcons
alt="Announcement"
className="tw-mr-2"
icon={Icons.ANNOUNCEMENT_BLACK}
width="16px"
/>
),
}, },
]; ];

View File

@ -5,16 +5,37 @@ export const userPageFilterList = [
{ {
name: 'My Data', name: 'My Data',
value: 'OWNER', value: 'OWNER',
icon: <SVGIcons alt="" icon={Icons.FOLDER} width="16px" />, icon: (
<SVGIcons
alt="My Data"
className="tw-mr-2"
icon={Icons.FOLDER}
width="16px"
/>
),
}, },
{ {
name: 'Mentions', name: 'Mentions',
value: 'MENTIONS', value: 'MENTIONS',
icon: <SVGIcons alt="" icon={Icons.MENTIONS} width="16px" />, icon: (
<SVGIcons
alt="Mentions"
className="tw-mr-2"
icon={Icons.MENTIONS}
width="16px"
/>
),
}, },
{ {
name: 'Following', name: 'Following',
value: 'FOLLOWS', value: 'FOLLOWS',
icon: <SVGIcons alt="" icon={Icons.STAR} width="16px" />, icon: (
<SVGIcons
alt="Following"
className="tw-mr-2"
icon={Icons.STAR}
width="16px"
/>
),
}, },
]; ];

View File

@ -121,11 +121,14 @@ const DropDownList: FunctionComponent<DropDownListProp> = ({
{item.type === 'user' ? ( {item.type === 'user' ? (
<UserTag id={item.value as string} name={item.name as string} /> <UserTag id={item.value as string} name={item.name as string} />
) : ( ) : (
<>
{item.icon}
<p <p
className={classNames('tw-truncate', widthClass)} className={classNames('tw-truncate', widthClass)}
title={item.name as string}> title={item.name as string}>
{item.name} {item.name}
</p> </p>
</>
)} )}
</div> </div>
); );