The react-zen DataTable lays its columns out on a CSS Grid with fixed pixel widths, so the sum of column widths becomes the table's max-content. Without an overflow boundary that width propagates up through the surrounding flex chain into the Tabs panel grid track, forcing every ancestor wider than the viewport. Dropping in overflow-x: auto alone is not enough because the wrapper still stretches to its parent's width, and the parent's width is still driven by max-content from the table. Wrap the rendered DataTable in DataGrid in a single-column CSS Grid sized as minmax(0, 1fr) with overflow-x: auto. The minmax explicitly caps the wrapper's track at the available 1fr space (instead of following content's max-content), so the wrapper takes its size from the layout and overflow-x: auto produces a horizontal scrollbar when the table is wider than the viewport. No prop changes; every DataGrid consumer (sessions, websites, links, pixels, boards, team admin, etc.) gets the behaviour without any caller-side change. Verified in playwright on the sessions table at 1024 viewport: the table stays inside the card and exposes a horizontal scrollbar so all 9 columns are reachable. At 1600 viewport the table fits naturally and no scrollbar appears.
Umami
Umami is a simple, fast, privacy-focused alternative to Google Analytics.
🚀 Getting Started
A detailed getting started guide can be found at umami.is/docs.
🛠 Installing from Source
Requirements
- A server with Node.js version 18.18+.
- A PostgreSQL database version v12.14+.
Get the source code and install packages
git clone https://github.com/umami-software/umami.git
cd umami
pnpm install
Configure Umami
Create an .env file with the following:
DATABASE_URL=connection-url
The connection URL format:
postgresql://username:mypassword@localhost:5432/mydb
Build the Application
pnpm run build
The build step will create tables in your database if you are installing for the first time. It will also create a login user with username admin and password umami.
Start the Application
pnpm run start
By default, this will launch the application on http://localhost:3000. You will need to either proxy requests from your web server or change the port to serve the application directly.
🐳 Installing with Docker
Umami provides Docker images as well as a Docker compose file for easy deployment.
Docker image:
docker pull docker.umami.is/umami-software/umami:latest
Docker compose (Runs Umami with a PostgreSQL database):
docker compose up -d
🔄 Getting Updates
To get the latest features, simply do a pull, install any new dependencies, and rebuild:
git pull
pnpm install
pnpm build
To update the Docker image, simply pull the new images and rebuild:
docker compose pull
docker compose up --force-recreate -d
