Add manual pagination to Rooms tab in User's profile

This commit is contained in:
Borislav Pantaleev 2025-02-04 23:13:43 +02:00
parent b7e308fe85
commit 3e9bfb605c
3 changed files with 27 additions and 7 deletions

View File

@ -48,7 +48,7 @@ const StyledBadge = styled(Badge, { shouldForwardProp: (prop) => !['badgeColor',
// every 5 minutes
const SERVER_STATUS_INTERVAL_TIME = 5 * 60 * 1000;
// every 5 seconds
const SERVER_CURRENT_PROCCESS_INTERVAL_TIME = 5 * 1000;
const SERVER_CURRENT_PROCCESS_INTERVAL_TIME = 35 * 1000;
const useServerStatus = () => {
const [serverStatus, setServerStatus] = useStore<ServerStatusResponse>("serverStatus", { ok: false, success: false, host: "", results: [] });

View File

@ -497,7 +497,7 @@ export const UserEdit = (props: EditProps) => {
target="user_id"
label={false}
pagination={<UserPagination />}
perPage={50}
perPage={10}
sort={{ field: "created_ts", order: "DESC" }}
>
<Datagrid sx={{ width: "100%" }} bulkActionButtons={<BulkDeleteButton/>}>
@ -516,7 +516,7 @@ export const UserEdit = (props: EditProps) => {
</FormTab>
<FormTab label={translate("resources.rooms.name", { smart_count: 2 })} icon={<ViewListIcon />} path="rooms">
<ReferenceManyField reference="joined_rooms" target="user_id" label={false}>
<ReferenceManyField reference="joined_rooms" target="user_id" label={false} perPage={25} pagination={<Pagination />}>
<Datagrid sx={{ width: "100%" }} rowClick={id => "/rooms/" + id + "/show"} bulkActionButtons={false}>
<ReferenceField reference="rooms" source="id" label={false} link={false} sortable={false}>
<AvatarField source="avatar" sx={{ height: "40px", width: "40px" }} />

View File

@ -16,6 +16,8 @@ import {
import { returnMXID } from "../utils/mxid";
import { MatrixError, displayError } from "../utils/error";
const CACHED_MANY_REF: Record<string, any> = {};
// Adds the access token to all requests
const jsonClient = async (url: string, options: Options = {}) => {
const token = localStorage.getItem("access_token");
@ -706,18 +708,36 @@ const baseDataProvider: SynapseDataProvider = {
dir: getSearchOrder(order),
};
const homeserver = localStorage.getItem("base_url");
if (!homeserver || !(resource in resourceMap)) throw Error("Homeserver not set");
const res = resourceMap[resource];
const ref = res.reference(params.id);
const endpoint_url = `${homeserver}${ref.endpoint}?${new URLSearchParams(filterUndefined(query)).toString()}`;
const { json } = await jsonClient(endpoint_url);
const endpoint_url = `${homeserver}${ref.endpoint}?${new URLSearchParams(filterUndefined(query)).toString()}`;
let jsonData = [];
let total = 0;
if (CACHED_MANY_REF[ref]) {
jsonData = CACHED_MANY_REF[ref]["data"].slice(from, from + perPage);
total = CACHED_MANY_REF[ref]["total"];
} else {
const { json } = await jsonClient(endpoint_url);
jsonData = json[res.data]
total = res.total(json, from, perPage);
if (resource === "joined_rooms") {
// cache will be applied only for joined_rooms
CACHED_MANY_REF[ref] = { data: jsonData, total: total };
jsonData = jsonData.slice(from, from + perPage);
}
}
return {
data: json[res.data].map(res.map),
total: res.total(json, from, perPage),
data: jsonData.map(res.map),
total: total,
};
},