Website Management
Relevant source files
The following files were used as context for generating this wiki page:
Website Management is a core feature of Umami that allows users to register, configure, and manage the websites they wish to track. This system handles the full lifecycle of a website entity, from creation and association with a user or team, to data management operations like resetting statistics or complete deletion.
Data Model
The central entity in website management is the Website model. While the Prisma schema is not directly present, its structure can be inferred from API payloads and database queries. A website can be owned by a single user or belong to a team.
Sources: src/app/api/websites/route.ts:31-37, src/queries/prisma/website.ts:101-109, scripts/seed/index.ts:100-109
ER Diagram
This diagram shows the Website entity and its relationships with the User and Team entities.
Website Fields
| Field | Type | Description |
|---|---|---|
id | uuid | The unique identifier for the website. Can be pre-assigned on creation. |
name | string | A user-friendly name for the website (max 100 chars). |
domain | string | The domain of the website (max 500 chars). |
shareId | string | An optional, unique ID for sharing the website's stats publicly. |
userId | uuid | Foreign key to the User who owns the website (if not part of a team). |
teamId | uuid | Foreign key to the Team that owns the website. |
createdBy | uuid | Foreign key to the User who created the website record. |
resetAt | datetime | Timestamp of when the website's statistics were last reset. |
deletedAt | datetime | Timestamp for soft-deleting the website (in cloud mode). |
Sources: src/app/api/websites/route.ts:31-37, src/queries/prisma/website.ts:143-150, src/queries/prisma/website.ts:182-188
API Endpoints
Website management is handled via a set of RESTful API endpoints located at /api/websites. These endpoints support full CRUD (Create, Read, Update, Delete) operations.
Sources: src/app/api/websites/route.ts, cypress/e2e/api-website.cy.ts
Website Creation Flow
This sequence diagram illustrates the process of creating a new website.
Endpoint Details
GET /api/websites
Retrieves a paginated list of websites for the authenticated user.
| Parameter | Type | Description |
|---|---|---|
includeTeams | string (optional) | If present, the query will also include websites from teams where the user is an owner. |
search | string (optional) | Filters websites by name or domain. |
page | number (optional) | The page number for pagination. |
pageSize | number (optional) | The number of items per page. |
Sources: src/app/api/websites/route.ts:11-27, cypress/e2e/api-website.cy.ts:106-118
POST /api/websites
Creates a new website.
| Body Parameter | Type | Description |
|---|---|---|
name | string | The name of the website. |
domain | string | The domain of the website. |
id | uuid (optional) | A specific UUID to assign to the new website. |
teamId | uuid (optional) | The ID of the team to associate the website with. |
shareId | string (optional) | A public sharing identifier. |
Sources: src/app/api/websites/route.ts:29-73, cypress/e2e/api-website.cy.ts:36-50
GET /api/websites/{websiteId}
Retrieves a single website by its ID.
Sources: cypress/e2e/api-website.cy.ts:120-131
POST /api/websites/{websiteId}
Updates an existing website.
| Body Parameter | Type | Description |
|---|---|---|
name | string (optional) | The new name for the website. |
domain | string (optional) | The new domain for the website. |
shareId | string (optional) | The new public sharing identifier. |
Sources: cypress/e2e/api-website.cy.ts:133-156
POST /api/websites/{websiteId}/reset
Resets all collected statistics for a website. This action deletes all associated session, websiteEvent, eventData, sessionData, and revenue records but keeps the website settings intact.
Sources: src/queries/prisma/website.ts:130-161, cypress/e2e/api-website.cy.ts:158-169
DELETE /api/websites/{websiteId}
Deletes a website and all its associated data. This is a destructive operation.
Sources: src/queries/prisma/website.ts:163-201, cypress/e2e/api-website.cy.ts:171-182
Backend Logic
The core database operations for website management are defined in src/queries/prisma/website.ts. These functions use Prisma to interact with the database.
Key Functions
| Function | Description |
|---|---|
getWebsite(websiteId) | Fetches a single website by its ID. |
getWebsites(criteria, filters) | A generic function to fetch a paginated and filtered list of websites. |
getUserWebsites(userId, filters) | Fetches all websites owned directly by a user. |
getTeamWebsites(teamId, filters) | Fetches all websites owned by a specific team. |
getAllUserWebsitesIncludingTeamOwner(userId, filters) | Fetches websites owned by the user directly and websites from teams where the user is an owner. |
createWebsite(data) | Creates a new website record in the database. |
updateWebsite(websiteId, data) | Updates an existing website record. |
resetWebsite(websiteId) | Executes a transaction to delete all analytics data for a website. |
deleteWebsite(websiteId) | Executes a transaction to delete a website and all its related data, including reports and segments. |
*Sources: src/queries/prisma/website.ts
Website Deletion Flow
The deleteWebsite function performs a cascading delete within a database transaction to ensure data integrity.
This diagram shows the multiple tables that are cleaned up when a website is deleted.
Sources: src/queries/prisma/website.ts:163-201
Frontend and User Interaction
The user interface for managing websites is primarily located under the /settings/websites path.
Sources: cypress/e2e/website.cy.ts:9, src/app/(main)/websites/WebsitesPage.tsx
Websites Page
The WebsitesPage component serves as the main entry point for website management. It displays a header with an "Add website" button and a data table listing the user's websites.
- Component:
WebsitesPage - Path:
src/app/(main)/websites/WebsitesPage.tsx - Key Children:
PageHeader: Contains the title "Websites".WebsiteAddButton: A button that initiates the flow for adding a new website.WebsitesDataTable: A table that lists websites belonging to the user or the selected team.
Sources: src/app/(main)/websites/WebsitesPage.tsx:11-22
User Actions
End-to-end tests in cypress/e2e/website.cy.ts describe the user flows for managing websites:
-
Add a Website:
- User navigates to
/settings/websites. - Clicks the "Add website" button.
- Fills in the "Name" and "Domain" fields.
- Submits the form, and the new website appears in the list.
Sources: cypress/e2e/website.cy.ts:9-24
- User navigates to
-
Edit a Website:
- User clicks the "Edit" button for a website.
- Navigates to the website's settings page.
- Modifies the "Name" and "Domain".
- Saves the changes. The tracking code is updated to reflect the new domain.
Sources: cypress/e2e/website.cy.ts:26-43
-
Delete a Website:
- From the website's settings page, the user navigates to the "Data" tab.
- Clicks the "Delete" button.
- Confirms the action by typing "DELETE" in a confirmation dialog.
- The website is removed from the system.
Sources: cypress/e2e/website.cy.ts:59-71
Data Seeding
The project includes a seeding script that can programmatically create websites and populate them with sample analytics data. The createWebsite function within the seeder is a clear example of how a website can be created with essential properties.
// From scripts/seed/index.ts
async function createWebsite(
prisma: PrismaClient,
name: string,
domain: string,
adminUserId: string,
): Promise<string> {
const websiteId = uuid();
await prisma.website.create({
data: {
id: websiteId,
name,
domain,
userId: adminUserId,
createdBy: adminUserId,
},
});
return websiteId;
}
Sources: scripts/seed/index.ts:98-114