fix: UI improvements

This commit is contained in:
Philipinho
2026-01-19 21:05:34 +00:00
parent bdf02f593d
commit a1260188ae
6 changed files with 70 additions and 26 deletions
@@ -5,26 +5,27 @@ import {
Badge,
Table,
ActionIcon,
} from '@mantine/core';
import {Link} from 'react-router-dom';
import PageListSkeleton from '@/components/ui/page-list-skeleton.tsx';
import { buildPageUrl } from '@/features/page/page.utils.ts';
import { formattedDate } from '@/lib/time.ts';
import { useRecentChangesQuery } from '@/features/page/queries/page-query.ts';
import { IconFileDescription } from '@tabler/icons-react';
import { getSpaceUrl } from '@/lib/config.ts';
} from "@mantine/core";
import { Link } from "react-router-dom";
import PageListSkeleton from "@/components/ui/page-list-skeleton.tsx";
import { buildPageUrl } from "@/features/page/page.utils.ts";
import { formattedDate } from "@/lib/time.ts";
import { useRecentChangesQuery } from "@/features/page/queries/page-query.ts";
import { IconFileDescription } from "@tabler/icons-react";
import { getSpaceUrl } from "@/lib/config.ts";
import { useTranslation } from "react-i18next";
import { getInitialsColor } from "@/lib/get-initials-color.ts";
interface Props {
spaceId?: string;
}
export default function RecentChanges({spaceId}: Props) {
export default function RecentChanges({ spaceId }: Props) {
const { t } = useTranslation();
const {data: pages, isLoading, isError} = useRecentChangesQuery(spaceId);
const { data: pages, isLoading, isError } = useRecentChangesQuery(spaceId);
if (isLoading) {
return <PageListSkeleton/>;
return <PageListSkeleton />;
}
if (isError) {
@@ -44,8 +45,8 @@ export default function RecentChanges({spaceId}: Props) {
>
<Group wrap="nowrap">
{page.icon || (
<ActionIcon variant='transparent' color='gray' size={18}>
<IconFileDescription size={18}/>
<ActionIcon variant="transparent" color="gray" size={18}>
<IconFileDescription size={18} />
</ActionIcon>
)}
@@ -58,18 +59,23 @@ export default function RecentChanges({spaceId}: Props) {
{!spaceId && (
<Table.Td>
<Badge
color="blue"
color={getInitialsColor(page?.space.name)}
variant="light"
component={Link}
to={getSpaceUrl(page?.space.slug)}
style={{cursor: 'pointer'}}
style={{ cursor: "pointer" }}
>
{page?.space.name}
</Badge>
</Table.Td>
)}
<Table.Td>
<Text c="dimmed" style={{whiteSpace: 'nowrap'}} size="xs" fw={500}>
<Text
c="dimmed"
style={{ whiteSpace: "nowrap" }}
size="xs"
fw={500}
>
{formattedDate(page.updatedAt)}
</Text>
</Table.Td>