fix(vendors): keep empty states in viewport

This commit is contained in:
Codex Review Integration 2026-09-14 13:31:06 -03:00
parent 886a9f522a
commit 5cadc26fce
3 changed files with 20 additions and 6 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 99 KiB

After

Width:  |  Height:  |  Size: 97 KiB

View file

@ -236,8 +236,12 @@ test.describe("Vendor deterministic pixel regression", () => {
test("empty", async ({ page }) => {
await openVendorPage(page, "empty");
await expect(page.getByText("No active companies found")).toBeVisible();
const emptyState = page.getByText("No active companies found");
await expect(emptyState).toBeVisible();
await expectStableScreenshot(page, "vendor-empty.png");
await page.setViewportSize({ width: 390, height: 844 });
await expect(emptyState).toBeInViewport();
});
test("error", async ({ page }) => {

View file

@ -52,7 +52,15 @@ export function VendorsTable({
<TableContainer
component={Paper}
variant="outlined"
sx={{ mt: 2, mb: 2, flex: "1 1 auto", overflow: "auto", borderRadius: 1.5, fontSize: 13 }}
sx={{
mt: 2,
mb: 2,
flex: "1 1 auto",
overflow: "auto",
borderRadius: 1.5,
fontSize: 13,
containerType: "inline-size",
}}
>
<Table
size="small"
@ -104,14 +112,16 @@ export function VendorsTable({
<TableBody>
{isLoading ? (
<TableRow>
<TableCell colSpan={columnCount} align="center" className="py-10">
<CircularProgress size={28} />
<TableCell colSpan={columnCount} className="py-10">
<Stack sx={{ width: "calc(100cqw - 24px)", alignItems: "center" }}>
<CircularProgress size={28} />
</Stack>
</TableCell>
</TableRow>
) : showEmptyRow ? (
<TableRow>
<TableCell colSpan={columnCount} align="center" className="py-10">
<Stack spacing={1} sx={{ alignItems: "center" }}>
<TableCell colSpan={columnCount} className="py-10">
<Stack spacing={1} sx={{ width: "calc(100cqw - 24px)", alignItems: "center" }}>
<SearchOffOutlinedIcon sx={{ color: "text.secondary", fontSize: 32 }} />
<Text
variant="description"