Skip to content
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.

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

Fix dashboard items #1007

Merged
merged 12 commits into from
Nov 11, 2023
2 changes: 1 addition & 1 deletion src/assets/css/app.css
Original file line number Diff line number Diff line change
Expand Up @@ -5560,7 +5560,7 @@ fieldset:disabled .btn {
box-shadow: var(--bs-toast-box-shadow);
border-radius: var(--bs-toast-border-radius);
}
.toast.showing {
.showing {
opacity: 0;
}
.toast:not(.show) {
Expand Down
15 changes: 15 additions & 0 deletions src/screens/OrganizationDashboard/OrganizationDashboard.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,21 @@ describe('Organisation Dashboard Page', () => {

// Checking if membership requests are rendered
expect(screen.getByText('Jane Doe')).toBeInTheDocument();

const peopleBtn = screen.getByText('Members');
const adminBtn = screen.getByText('Admins');
const postBtn = screen.getAllByText('Posts');
const eventBtn = screen.getAllByText('Events');
const blockUserBtn = screen.getByText('Blocked Users');
const requestBtn = screen.getByText('Requests');
userEvent.click(peopleBtn);
userEvent.click(adminBtn);
userEvent.click(postBtn[0]);
userEvent.click(eventBtn[0]);
userEvent.click(postBtn[1]);
userEvent.click(eventBtn[1]);
userEvent.click(blockUserBtn);
userEvent.click(requestBtn);
});

test('Testing buttons and checking empty events, posts and membership requests', async () => {
Expand Down
74 changes: 62 additions & 12 deletions src/screens/OrganizationDashboard/OrganizationDashboard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,12 @@ function organizationDashboard(): JSX.Element {
const { t } = useTranslation('translation', { keyPrefix: 'dashboard' });
document.title = t('title');
const currentUrl = window.location.href.split('=')[1];
const peopleLink = `/orgpeople/id=${currentUrl}`;
const postsLink = `/orgpost/id=${currentUrl}`;
const eventsLink = `/orgevents/id=${currentUrl}`;
const blockUserLink = `/blockuser/id=${currentUrl}`;
const requestLink = '/requests';

const history = useHistory();
const [upcomingEvents, setUpcomingEvents] = useState<
InterfaceQueryOrganizationEventListItem[]
Expand Down Expand Up @@ -120,42 +126,90 @@ function organizationDashboard(): JSX.Element {
</Row>
) : (
<Row style={{ display: 'flex' }}>
<Col xs={6} sm={4} className="mb-4">
<Col
xs={6}
sm={4}
role="button"
className="mb-4"
onClick={(): void => {
history.push(peopleLink);
}}
>
<DashBoardCard
count={data?.organizations[0].members?.length}
title={t('members')}
icon={<UsersIcon fill="var(--bs-primary)" />}
/>
</Col>
<Col xs={6} sm={4} className="mb-4">
<Col
xs={6}
sm={4}
role="button"
className="mb-4"
onClick={(): void => {
history.push(peopleLink);
}}
>
<DashBoardCard
count={data?.organizations[0].admins?.length}
title={t('admins')}
icon={<AdminsIcon fill="var(--bs-primary)" />}
/>
</Col>
<Col xs={6} sm={4} className="mb-4">
<Col
xs={6}
sm={4}
role="button"
className="mb-4"
onClick={(): void => {
history.push(postsLink);
}}
>
<DashBoardCard
count={postData?.postsByOrganization?.length}
title={t('posts')}
icon={<PostsIcon fill="var(--bs-primary)" />}
/>
</Col>
<Col xs={6} sm={4} className="mb-4">
<Col
xs={6}
sm={4}
role="button"
className="mb-4"
onClick={(): void => {
history.push(eventsLink);
}}
>
<DashBoardCard
count={eventData?.eventsByOrganization?.length}
title={t('events')}
icon={<EventsIcon fill="var(--bs-primary)" />}
/>
</Col>
<Col xs={6} sm={4} className="mb-4">
<Col
xs={6}
sm={4}
role="button"
className="mb-4"
onClick={(): void => {
history.push(blockUserLink);
}}
>
<DashBoardCard
count={data?.organizations[0].blockedUsers?.length}
title={t('blockedUsers')}
icon={<BlockedUsersIcon fill="var(--bs-primary)" />}
/>
</Col>
<Col xs={6} sm={4} className="mb-4">
<Col
xs={6}
sm={4}
role="button"
className="mb-4"
onClick={(): void => {
history.push(requestLink);
}}
>
<DashBoardCard
count={data?.organizations[0].membershipRequests?.length}
title={t('requests')}
Expand All @@ -175,9 +229,7 @@ function organizationDashboard(): JSX.Element {
size="sm"
variant="light"
data-testid="viewAllEvents"
onClick={(): void =>
history.push(`/orgevents/id=${currentUrl}`)
}
onClick={(): void => history.push(eventsLink)}
>
{t('viewAll')}
</Button>
Expand Down Expand Up @@ -214,9 +266,7 @@ function organizationDashboard(): JSX.Element {
size="sm"
variant="light"
data-testid="viewAllPosts"
onClick={(): void =>
history.push(`/orgpost/id=${currentUrl}`)
}
onClick={(): void => history.push(postsLink)}
>
{t('viewAll')}
</Button>
Expand Down
Loading