Skip to content

fix: use applicationuserlistQuery from ChannelSetting #419

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Mar 3, 2023
Merged

fix: use applicationuserlistQuery from ChannelSetting #419

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
e54dcaa
fix: use applicationuserlistQuery from ChannelSetting
sravan-s Mar 2, 2023
edc721a
fix: UI of channel setting
sravan-s Mar 2, 2023
0fc16c2
fix: add padding and change badge color
sravan-s Mar 3, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 7 additions & 2 deletions src/smart-components/ChannelSettings/components/ModerationPanel/InviteUsersModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,11 +26,16 @@ export default function InviteUsers({
const sdk = state?.stores?.sdkStore?.sdk;
const globalUserListQuery = state?.config?.userListQuery;

const { channel, overrideInviteUser } = useChannelSettingsContext();
const { channel, overrideInviteUser, queries } = useChannelSettingsContext();
const userFilledQuery = {
...queries?.applicationUserListQuery,
};
const { stringSet } = useLocalization();

useEffect(() => {
const userListQuery = globalUserListQuery ? globalUserListQuery() : sdk?.createApplicationUserListQuery();
const userListQuery = globalUserListQuery
? globalUserListQuery()
: sdk?.createApplicationUserListQuery(userFilledQuery);
if (userListQuery?.next) {
userListQuery.next().then((members) => {
setMembers(members);
Expand Down
11 changes: 8 additions & 3 deletions src/smart-components/ChannelSettings/components/UserPanel/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import './user-panel.scss';

import React, { useContext, useState } from 'react';

import { LocalizationContext } from '../../../../lib/LocalizationContext';
Expand All @@ -23,7 +25,7 @@ const UserPanel: React.FC = () => {
const [showAccordion, setShowAccordion] = useState(false);
const { channel } = useChannelSettingsContext();
return (
<>
<div className='sendbird-channel-settings__user-panel'>
<div
className={[
'sendbird-channel-settings__panel-item',
Expand All @@ -47,7 +49,10 @@ const UserPanel: React.FC = () => {
color={LabelColors.ONBACKGROUND_1}
>
{stringSet.CHANNEL_SETTING__MEMBERS__TITLE}
<Badge count={kFormatter(channel?.memberCount)} />
<Badge
className={"sendbird-channel-settings__badge"}
count={kFormatter(channel?.memberCount)}
/>
</Label>
<Icon
className={[
Expand All @@ -65,7 +70,7 @@ const UserPanel: React.FC = () => {
<MemberList />
)
}
</>
</div>
);
}

Expand Down
36 changes: 36 additions & 0 deletions src/smart-components/ChannelSettings/components/UserPanel/user-panel.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
@import '../../../../styles/variables';
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Visual fixes: Screen Shot 2023-03-03 at 1 25 19 AM

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Also scroll in popup

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

image

Why this doesn't look same current state?

Copy link
Contributor Author

@sravan-s sravan-s Mar 3, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is not same screen ~, your screenshot is from admin, this one is from user ~

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Aha!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

but, I need to probably change the color of badge and add little top-padding


.sendbird-more-members__popup-scroll {
max-height: 420px;
overflow-x: hidden;
overflow-y: scroll;
@include mobile() {
max-height: 100%;
}
.sendbird-user-list-item__operator {
right: 72px;
}
.sendbird-user-list-item__title {
max-width: 240px;
}
}

.sendbird-channel-settings__badge {
position: absolute;
right: 48px;
@include themed() {
background-color: t(bg-2);
}
.sendbird-label {
@include themed() {
color: t(on-bg-2);
}
}
}

.sendbird-channel-settings__user-panel {
.sendbird-channel-settings-accordion__footer {
padding-left: 14px;
padding-top: 14px;
}
}