pl-fe: migrate reports management

Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
This commit is contained in:
nicole mikołajczyk
2025-07-10 18:52:49 +02:00
parent 06c65af212
commit 277f2013f1
12 changed files with 141 additions and 113 deletions

View File

@@ -5,11 +5,11 @@ import List, { ListItem } from 'pl-fe/components/list';
import { CardTitle } from 'pl-fe/components/ui/card';
import Icon from 'pl-fe/components/ui/icon';
import Stack from 'pl-fe/components/ui/stack';
import { useAppSelector } from 'pl-fe/hooks/use-app-selector';
import { useFeatures } from 'pl-fe/hooks/use-features';
import { useInstance } from 'pl-fe/hooks/use-instance';
import { useOwnAccount } from 'pl-fe/hooks/use-own-account';
import { usePendingUsersCount } from 'pl-fe/queries/admin/use-accounts';
import { usePendingReportsCount } from 'pl-fe/queries/admin/use-reports';
import sourceCode from 'pl-fe/utils/code';
import { Counter } from '../components/counter';
@@ -24,9 +24,7 @@ const Dashboard: React.FC = () => {
const { account } = useOwnAccount();
const { data: awaitingApprovalCount = 0 } = usePendingUsersCount();
const { pendingReports } = useAppSelector((state) => ({
pendingReports: state.admin.openReports.length,
}));
const { data: pendingReportsCount = 0 } = usePendingReportsCount();
const v = features.version;
@@ -117,7 +115,7 @@ const Dashboard: React.FC = () => {
label={<FormattedMessage id='admin.dashcounters.domain_count_label' defaultMessage='peers' />}
/>
<List>
<ListItem size='sm' to='/pl-fe/admin/reports' label={<FormattedMessage id='admin.links.pending_reports' defaultMessage='{count, plural, one {{formattedCount} pending report} other {{formattedCount} pending reports}}' values={{ count: pendingReports, formattedCount: <strong><FormattedNumber value={pendingReports} /></strong> }} />} />
<ListItem size='sm' to='/pl-fe/admin/reports' label={<FormattedMessage id='admin.links.pending_reports' defaultMessage='{count, plural, one {{formattedCount} pending report} other {{formattedCount} pending reports}}' values={{ count: pendingReportsCount, formattedCount: <strong><FormattedNumber value={pendingReportsCount} /></strong> }} />} />
<ListItem size='sm' to='/pl-fe/admin/users' label={<FormattedMessage id='admin.links.pending_users' defaultMessage='{count, plural, one {{formattedCount} pending user} other {{formattedCount} pending users}}' values={{ count: awaitingApprovalCount, formattedCount: <strong><FormattedNumber value={awaitingApprovalCount} /></strong> }} />} />
{/* <ListItem size='sm' to='/pl-fe/admin' label={<FormattedMessage id='admin.links.pending_tags' defaultMessage='{count} pending tags' values={{ count: <strong>0</strong> }} />} />
<ListItem size='sm' to='/pl-fe/admin' label={<FormattedMessage id='admin.links.pending_appeals' defaultMessage='{count} pending appeals' values={{ count: <strong>0</strong> }} />} /> */}

View File

@@ -1,10 +1,8 @@
import React, { useState, useEffect } from 'react';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import { fetchReports } from 'pl-fe/actions/admin';
import ScrollableList from 'pl-fe/components/scrollable-list';
import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch';
import { useAppSelector } from 'pl-fe/hooks/use-app-selector';
import { useReports } from 'pl-fe/queries/admin/use-reports';
import Report from '../components/report';
@@ -16,29 +14,20 @@ const messages = defineMessages({
const Reports: React.FC = () => {
const intl = useIntl();
const dispatch = useAppDispatch();
const [isLoading, setLoading] = useState(true);
const reports = useAppSelector(state => state.admin.openReports);
useEffect(() => {
dispatch(fetchReports())
.then(() => setLoading(false))
.catch(() => {});
}, []);
const showLoading = isLoading && reports.length === 0;
const { data: reportIds = [], isPending } = useReports({
resolved: false,
});
return (
<ScrollableList
scrollKey='adminReports'
isLoading={isLoading}
showLoading={showLoading}
isLoading={isPending}
showLoading={isPending}
emptyMessage={intl.formatMessage(messages.emptyMessage)}
listClassName='divide-y divide-solid divide-gray-200 dark:divide-gray-800'
>
{reports.map(report => report && <Report id={report} key={report} />)}
{reportIds.map(report => report && <Report id={report} key={report} />)}
</ScrollableList>
);
};