cleanup and deduplicate breaks frontend tests

time entries

.dockerignore

@@ -0,0 +1,32 @@
+.git
+.gitmodules
+.github
+.DS_Store
+.fleet
+.idea
+.vscode
+*.log
+npm-debug.log
+yarn-error.log
+
+.phpunit.cache
+.phpunit.result.cache
+coverage
+test-results
+playwright-report
+blob-report
+playwright/.cache
+
+node_modules
+extensions/*/node_modules
+
+Homestead.json
+Homestead.yaml
+auth.json
+.env.backup
+.rnd
+
+_ide_helper.php
+.phpstorm.meta.php
+
+storage/logs/*

.github/workflows/build-onpremise.yml

@@ -8,6 +8,7 @@ on:
   pull_request:
     paths:
       - '.github/workflows/build-onpremise.yml'
+      - 'extensions/manifest.json'
       - 'docker/prod/**'
   workflow_dispatch:
 
@@ -35,7 +36,7 @@ jobs:
 
     steps:
       - name: "Check out code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0 # Required for WyriHaximus/github-action-get-previous-tag
 
@@ -91,14 +92,23 @@ jobs:
         if: steps.cache-vendor.outputs.cache-hit != 'true' # Skip if cache hit
 
       - name: "Use Node.js"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 
+      - name: "Read extension manifest"
+        id: extension-manifest
+        run: |
+          {
+            echo "invoicing_repository=$(jq -r '.Invoicing.repository' extensions/manifest.json)"
+            echo "invoicing_ref=$(jq -r '.Invoicing.ref' extensions/manifest.json)"
+          } >> "$GITHUB_OUTPUT"
+
       - name: "Checkout invoicing extension"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
         with:
-          repository: solidtime-io/extension-invoicing
+          repository: ${{ steps.extension-manifest.outputs.invoicing_repository }}
+          ref: ${{ steps.extension-manifest.outputs.invoicing_ref }}
           path: extensions/Invoicing
           ssh-key: ${{ secrets.SSH_PRIVATE_KEY_INVOICING_EXTENSION }}
 

.github/workflows/build-private.yml

@@ -8,6 +8,7 @@ on:
   pull_request:
     paths:
       - '.github/workflows/build-private.yml'
+      - 'extensions/manifest.json'
       - 'docker/prod/**'
   workflow_dispatch:
 permissions:
@@ -22,7 +23,7 @@ jobs:
 
     steps:
       - name: "Check out code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0 # Required for WyriHaximus/github-action-get-previous-tag
 
@@ -68,14 +69,27 @@ jobs:
         run: cat .env
 
       - name: "Use Node.js"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 
+      - name: "Read extension manifest"
+        id: extension-manifest
+        run: |
+          {
+            echo "billing_repository=$(jq -r '.Billing.repository' extensions/manifest.json)"
+            echo "billing_ref=$(jq -r '.Billing.ref' extensions/manifest.json)"
+            echo "services_repository=$(jq -r '.Services.repository' extensions/manifest.json)"
+            echo "services_ref=$(jq -r '.Services.ref' extensions/manifest.json)"
+            echo "invoicing_repository=$(jq -r '.Invoicing.repository' extensions/manifest.json)"
+            echo "invoicing_ref=$(jq -r '.Invoicing.ref' extensions/manifest.json)"
+          } >> "$GITHUB_OUTPUT"
+
       - name: "Checkout billing extension"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
         with:
-          repository: solidtime-io/extension-billing
+          repository: ${{ steps.extension-manifest.outputs.billing_repository }}
+          ref: ${{ steps.extension-manifest.outputs.billing_ref }}
           path: extensions/Billing
           ssh-key: ${{ secrets.SSH_PRIVATE_KEY_BILLING_EXTENSION }}
 
@@ -93,9 +107,10 @@ jobs:
         run: cd extensions/Billing && npm ci
 
       - name: "Checkout services extension"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
         with:
-          repository: solidtime-io/extension-services
+          repository: ${{ steps.extension-manifest.outputs.services_repository }}
+          ref: ${{ steps.extension-manifest.outputs.services_ref }}
           path: extensions/Services
           ssh-key: ${{ secrets.SSH_PRIVATE_KEY_SERVICES_EXTENSION }}
 
@@ -111,9 +126,10 @@ jobs:
         run: cd extensions/Services && npm ci
 
       - name: "Checkout invoicing extension"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
         with:
-          repository: solidtime-io/extension-invoicing
+          repository: ${{ steps.extension-manifest.outputs.invoicing_repository }}
+          ref: ${{ steps.extension-manifest.outputs.invoicing_ref }}
           path: extensions/Invoicing
           ssh-key: ${{ secrets.SSH_PRIVATE_KEY_INVOICING_EXTENSION }}
 

.github/workflows/build-public.yml

@@ -36,7 +36,7 @@ jobs:
 
     steps:
       - name: "Check out code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
         with:
           fetch-depth: 0 # Required for WyriHaximus/github-action-get-previous-tag
 
@@ -92,7 +92,7 @@ jobs:
         if: steps.cache-vendor.outputs.cache-hit != 'true' # Skip if cache hit
 
       - name: "Use Node.js"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 

.github/workflows/generate-api-docs.yml

@@ -29,7 +29,7 @@ jobs:
 
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Setup PHP"
         uses: shivammathur/setup-php@v2

.github/workflows/npm-build.yml

@@ -11,7 +11,7 @@ jobs:
 
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Setup PHP (for Ziggy)"
         uses: shivammathur/setup-php@v2
@@ -24,7 +24,7 @@ jobs:
         run: composer install -n --prefer-dist
 
       - name: "Use Node.js"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 

.github/workflows/npm-format-check.yml

@@ -9,10 +9,10 @@ jobs:
 
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Use Node.js"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 

.github/workflows/npm-lint.yml

@@ -11,10 +11,10 @@ jobs:
 
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Use Node.js"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 

.github/workflows/npm-publish-api.yml

@@ -11,11 +11,11 @@ jobs:
       id-token: write
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
       # Setup .npmrc file to publish to npm
       - name: Install root project dependencies
         run: npm ci
-      - uses: actions/setup-node@v6
+      - uses: actions/setup-node@v7
         with:
           node-version: '20.x'
           registry-url: 'https://registry.npmjs.org'

.github/workflows/npm-publish-ui.yml

@@ -11,9 +11,9 @@ jobs:
       id-token: write
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
       # Setup .npmrc file to publish to npm
-      - uses: actions/setup-node@v6
+      - uses: actions/setup-node@v7
         with:
           node-version: '20.x'
           registry-url: 'https://registry.npmjs.org'

.github/workflows/npm-test-unit.yml

@@ -13,10 +13,10 @@ jobs:
 
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Use Node.js"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 

.github/workflows/npm-typecheck.yml

@@ -10,7 +10,7 @@ jobs:
 
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Setup PHP (for Ziggy)"
         uses: shivammathur/setup-php@v2
@@ -23,7 +23,7 @@ jobs:
         run: composer install -n --prefer-dist
 
       - name: "Use Node.js"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 

.github/workflows/phpstan.yml

@@ -9,7 +9,7 @@ jobs:
 
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Setup PHP"
         uses: shivammathur/setup-php@v2

.github/workflows/phpunit.yml

@@ -36,7 +36,7 @@ jobs:
           --health-retries 5
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Setup PHP"
         uses: shivammathur/setup-php@v2
@@ -48,7 +48,7 @@ jobs:
       - name: "Run composer install"
         run: composer install -n --prefer-dist
 
-      - uses: actions/setup-node@v6
+      - uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 

.github/workflows/pint.yml

@@ -9,7 +9,7 @@ jobs:
 
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Check code style"
         uses: aglipanci/laravel-pint-action@2.6

.github/workflows/playwright.yml

@@ -35,10 +35,10 @@ jobs:
 
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Setup node"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 
@@ -99,10 +99,10 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: "Checkout code"
-        uses: actions/checkout@v6
+        uses: actions/checkout@v7
 
       - name: "Setup node"
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v7
         with:
           node-version: '20.x'
 

.gitignore

@@ -26,9 +26,10 @@ yarn-error.log
 /blob-report/
 /playwright/.cache/
 /coverage
-/extensions
+/extensions/*
 !/extensions/.gitkeep
 !/extensions/extensions_autoload.php
+!/extensions/manifest.json
 /auth.json
 /modules_statuses.json
 /k8s

app/Enums/TagMatchType.php

@@ -0,0 +1,16 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Enums;
+
+use Datomatic\LaravelEnumHelper\LaravelEnumHelper;
+
+enum TagMatchType: string
+{
+    use LaravelEnumHelper;
+
+    case Contains = 'contains';
+
+    case NotContains = 'not_contains';
+}

app/Enums/TimeEntryAggregationType.php

@@ -21,6 +21,7 @@ enum TimeEntryAggregationType: string
     case Billable = 'billable';
     case Description = 'description';
     case Tag = 'tag';
+    case Type = 'type';
 
     public static function fromInterval(TimeEntryAggregationTypeInterval $timeEntryAggregationTypeInterval): TimeEntryAggregationType
     {

app/Enums/TimeEntryType.php

@@ -0,0 +1,15 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Enums;
+
+use Datomatic\LaravelEnumHelper\LaravelEnumHelper;
+
+enum TimeEntryType: string
+{
+    use LaravelEnumHelper;
+
+    case Work = 'work';
+    case Break = 'break';
+}

app/Filament/Resources/UserResource.php

@@ -66,7 +66,7 @@ class UserResource extends Resource
                             ->ignore($record?->getKey()),
                     ])
                     ->rule([
-                        'email',
+                        'email:rfc,strict',
                     ])
                     ->maxLength(255),
                 Forms\Components\Toggle::make('is_placeholder')

app/Http/Controllers/Api/V1/ClientController.php

@@ -43,7 +43,8 @@ class ClientController extends Controller
 
         $clientsQuery = Client::query()
             ->whereBelongsTo($organization, 'organization')
-            ->orderBy('created_at', 'desc');
+            ->orderBy('created_at', 'desc')
+            ->orderBy('id');
 
         if (! $canViewAllClients) {
             $clientsQuery->visibleByEmployee($user);

app/Http/Controllers/Api/V1/InvitationController.php

@@ -42,6 +42,7 @@ class InvitationController extends Controller
 
         $invitations = $organization->organizationInvitations()
             ->orderBy('created_at', 'desc')
+            ->orderBy('id')
             ->paginate(config('app.pagination_per_page_default'));
 
         return InvitationCollection::make($invitations);

app/Http/Controllers/Api/V1/MemberController.php

@@ -61,6 +61,7 @@ class MemberController extends Controller
             ->whereBelongsTo($organization, 'organization')
             ->with(['user'])
             ->orderBy('created_at', 'desc')
+            ->orderBy('id')
             ->paginate(config('app.pagination_per_page_default'));
 
         return MemberCollection::make($members);

app/Http/Controllers/Api/V1/OrganizationController.php

@@ -78,6 +78,9 @@ class OrganizationController extends Controller
         if ($request->getPreventOverlappingTimeEntries() !== null) {
             $organization->prevent_overlapping_time_entries = $request->getPreventOverlappingTimeEntries();
         }
+        if ($request->getBreaksEnabled() !== null) {
+            $organization->breaks_enabled = $request->getBreaksEnabled();
+        }
         $hasBillableRate = $request->has('billable_rate');
         if ($hasBillableRate) {
             $oldBillableRate = $organization->billable_rate;

app/Http/Controllers/Api/V1/ProjectController.php

@@ -62,6 +62,7 @@ class ProjectController extends Controller
 
         $projects = $projectsQuery
             ->orderBy('created_at', 'desc')
+            ->orderBy('id')
             ->paginate(config('app.pagination_per_page_default'));
 
         $showBillableRate = $this->member($organization)->role !== Role::Employee->value || $organization->employees_can_see_billable_rates;

app/Http/Controllers/Api/V1/ProjectMemberController.php

@@ -49,6 +49,7 @@ class ProjectMemberController extends Controller
         $projectMembers = ProjectMember::query()
             ->whereBelongsTo($project, 'project')
             ->orderBy('created_at', 'desc')
+            ->orderBy('id')
             ->paginate(config('app.pagination_per_page_default'));
 
         return new ProjectMemberCollection($projectMembers);

app/Http/Controllers/Api/V1/Public/ReportController.php

@@ -57,9 +57,10 @@ class ReportController extends Controller
         $filter->addEnd($properties->end);
         $filter->addActive($properties->active);
         $filter->addBillable($properties->billable);
+        $filter->addType($properties->timeEntryType);
         $filter->addMemberIdsFilter($properties->memberIds?->toArray());
         $filter->addProjectIdsFilter($properties->projectIds?->toArray());
-        $filter->addTagIdsFilter($properties->tagIds?->toArray());
+        $filter->addTagIdsFilter($properties->tagIds?->toArray(), $properties->tagMatchType);
         $filter->addTaskIdsFilter($properties->taskIds?->toArray());
         $filter->addClientIdsFilter($properties->clientIds?->toArray());
         $timeEntriesQuery = $filter->get();

app/Http/Controllers/Api/V1/ReportController.php

@@ -47,6 +47,7 @@ class ReportController extends Controller
 
         $reports = Report::query()
             ->orderBy('created_at', 'desc')
+            ->orderBy('id')
             ->whereBelongsTo($organization, 'organization')
             ->paginate(config('app.pagination_per_page_default'));
 
@@ -96,6 +97,7 @@ class ReportController extends Controller
         $properties->setClientIds($request->input('properties.client_ids', null));
         $properties->setProjectIds($request->input('properties.project_ids', null));
         $properties->setTagIds($request->input('properties.tag_ids', null));
+        $properties->setTagMatchType($request->getPropertyTagMatchType());
         $properties->setTaskIds($request->input('properties.task_ids', null));
         $properties->weekStart = $request->has('properties.week_start') ? Weekday::from($request->input('properties.week_start')) : $user->week_start;
         $timezone = $user->timezone;
@@ -110,6 +112,7 @@ class ReportController extends Controller
         $properties->timezone = $timezone;
         $properties->roundingType = $request->getPropertyRoundingType();
         $properties->roundingMinutes = $request->getPropertyRoundingMinutes();
+        $properties->timeEntryType = $request->getPropertyTimeEntryType();
         $report->properties = $properties;
         if ($isPublic) {
             $report->share_secret = $reportService->generateSecret();

app/Http/Controllers/Api/V1/TagController.php

@@ -42,6 +42,7 @@ class TagController extends Controller
         $tags = Tag::query()
             ->whereBelongsTo($organization, 'organization')
             ->orderBy('created_at', 'desc')
+            ->orderBy('id')
             ->paginate(config('app.pagination_per_page_default'));
 
         return new TagCollection($tags);

app/Http/Controllers/Api/V1/TaskController.php

@@ -84,6 +84,7 @@ class TaskController extends Controller
 
         $tasks = $query
             ->orderBy('created_at', 'desc')
+            ->orderBy('id')
             ->paginate(config('app.pagination_per_page_default'));
 
         return new TaskCollection($tasks);

app/Http/Controllers/Api/V1/TimeEntryController.php

@@ -6,6 +6,7 @@ namespace App\Http\Controllers\Api\V1;
 
 use App\Enums\ExportFormat;
 use App\Enums\Role;
+use App\Enums\TimeEntryType;
 use App\Exceptions\Api\FeatureIsNotAvailableInFreePlanApiException;
 use App\Exceptions\Api\OverlappingTimeEntryApiException;
 use App\Exceptions\Api\PdfRendererIsNotConfiguredException;
@@ -194,7 +195,8 @@ class TimeEntryController extends Controller
         $timeEntriesQuery = TimeEntry::query()
             ->whereBelongsTo($organization, 'organization')
             ->select($select)
-            ->orderBy('start', 'desc');
+            ->orderBy('time_entries.start', 'desc')
+            ->orderBy('time_entries.id');
 
         $filter = new TimeEntryFilter($timeEntriesQuery);
         $filter->addStartFilter($request->input('start'));
@@ -203,10 +205,11 @@ class TimeEntryController extends Controller
         $filter->addMemberIdFilter($member);
         $filter->addMemberIdsFilter($request->input('member_ids'));
         $filter->addProjectIdsFilter($request->input('project_ids'));
-        $filter->addTagIdsFilter($request->input('tag_ids'));
+        $filter->addTagIdsFilter($request->input('tag_ids'), $request->getTagMatchType());
         $filter->addTaskIdsFilter($request->input('task_ids'));
         $filter->addClientIdsFilter($request->input('client_ids'));
         $filter->addBillableFilter($request->input('billable'));
+        $filter->addTypeFilter($request->input('type'));
 
         return $filter->get();
     }
@@ -559,10 +562,11 @@ class TimeEntryController extends Controller
         $filter->addMemberIdFilter($member);
         $filter->addMemberIdsFilter($request->input('member_ids'));
         $filter->addProjectIdsFilter($request->input('project_ids'));
-        $filter->addTagIdsFilter($request->input('tag_ids'));
+        $filter->addTagIdsFilter($request->input('tag_ids'), $request->getTagMatchType());
         $filter->addTaskIdsFilter($request->input('task_ids'));
         $filter->addClientIdsFilter($request->input('client_ids'));
         $filter->addBillableFilter($request->input('billable'));
+        $filter->addTypeFilter($request->input('type'));
 
         return $filter->get();
     }
@@ -745,6 +749,19 @@ class TimeEntryController extends Controller
                 continue;
 
             }
+            // Changing time entries to Break entries is only allowed when breaks are enabled in the org settings
+            $resultingType = isset($changes['type']) ? TimeEntryType::from($changes['type']) : $timeEntry->type;
+            if ($resultingType === TimeEntryType::Break && $timeEntry->type !== TimeEntryType::Break && ! $organization->breaks_enabled) {
+                $error->push($id);
+
+                continue;
+            }
+            // Break entries can not be billable, have tags or belong to a project/task (see TimeEntry::booted)
+            if ($resultingType === TimeEntryType::Break && ($project !== null || $task !== null || $request->boolean('changes.billable') || count($changes['tags'] ?? []) > 0)) {
+                $error->push($id);
+
+                continue;
+            }
             $oldProject = $timeEntry->project;
             $oldTask = $timeEntry->task;
 

app/Http/Requests/V1/Invitation/InvitationStoreRequest.php

@@ -25,7 +25,7 @@ class InvitationStoreRequest extends BaseFormRequest
         return [
             'email' => [
                 'required',
-                'email',
+                'email:rfc,strict',
             ],
             'role' => [
                 'required',

app/Http/Requests/V1/Organization/OrganizationUpdateRequest.php

@@ -51,6 +51,9 @@ class OrganizationUpdateRequest extends BaseFormRequest
             'prevent_overlapping_time_entries' => [
                 'boolean',
             ],
+            'breaks_enabled' => [
+                'boolean',
+            ],
             'number_format' => [
                 Rule::enum(NumberFormat::class),
             ],
@@ -125,4 +128,9 @@ class OrganizationUpdateRequest extends BaseFormRequest
     {
         return $this->has('prevent_overlapping_time_entries') ? $this->boolean('prevent_overlapping_time_entries') : null;
     }
+
+    public function getBreaksEnabled(): ?bool
+    {
+        return $this->has('breaks_enabled') ? $this->boolean('breaks_enabled') : null;
+    }
 }

app/Http/Requests/V1/Report/ReportStoreRequest.php

@@ -4,9 +4,11 @@ declare(strict_types=1);
 
 namespace App\Http\Requests\V1\Report;
 
+use App\Enums\TagMatchType;
 use App\Enums\TimeEntryAggregationType;
 use App\Enums\TimeEntryAggregationTypeInterval;
 use App\Enums\TimeEntryRoundingType;
+use App\Enums\TimeEntryType;
 use App\Enums\Weekday;
 use App\Http\Requests\V1\BaseFormRequest;
 use App\Models\Organization;
@@ -124,6 +126,11 @@ class ReportStoreRequest extends BaseFormRequest
                     }
                 },
             ],
+            'properties.tag_match_type' => [
+                'nullable',
+                'string',
+                Rule::enum(TagMatchType::class),
+            ],
             'properties.task_ids' => [
                 'nullable',
                 'array',
@@ -171,6 +178,12 @@ class ReportStoreRequest extends BaseFormRequest
                 'numeric',
                 'integer',
             ],
+            // Filter by time entry type
+            'properties.time_entry_type' => [
+                'nullable',
+                'string',
+                Rule::enum(TimeEntryType::class),
+            ],
         ];
     }
 
@@ -234,6 +247,15 @@ class ReportStoreRequest extends BaseFormRequest
         return null;
     }
 
+    public function getPropertyTimeEntryType(): ?TimeEntryType
+    {
+        if (! $this->has('properties.time_entry_type') || $this->input('properties.time_entry_type') === null) {
+            return null;
+        }
+
+        return TimeEntryType::from($this->input('properties.time_entry_type'));
+    }
+
     public function getPropertyGroup(): TimeEntryAggregationType
     {
         return TimeEntryAggregationType::from($this->input('properties.group'));
@@ -249,6 +271,15 @@ class ReportStoreRequest extends BaseFormRequest
         return TimeEntryAggregationTypeInterval::from($this->input('properties.history_group'));
     }
 
+    public function getPropertyTagMatchType(): ?TagMatchType
+    {
+        if (! $this->has('properties.tag_match_type') || $this->input('properties.tag_match_type') === null) {
+            return null;
+        }
+
+        return TagMatchType::from($this->input('properties.tag_match_type'));
+    }
+
     public function getPropertyRoundingType(): ?TimeEntryRoundingType
     {
         if (! $this->has('properties.rounding_type') || $this->input('properties.rounding_type') === null) {

app/Http/Requests/V1/TimeEntry/TimeEntryAggregateExportRequest.php

@@ -5,9 +5,11 @@ declare(strict_types=1);
 namespace App\Http\Requests\V1\TimeEntry;
 
 use App\Enums\ExportFormat;
+use App\Enums\TagMatchType;
 use App\Enums\TimeEntryAggregationType;
 use App\Enums\TimeEntryAggregationTypeInterval;
 use App\Enums\TimeEntryRoundingType;
+use App\Enums\TimeEntryType;
 use App\Http\Requests\V1\BaseFormRequest;
 use App\Models\Client;
 use App\Models\Member;
@@ -139,6 +141,10 @@ class TimeEntryAggregateExportRequest extends BaseFormRequest
                     })->uuid()->validate($attribute, $value, $fail);
                 },
             ],
+            'tag_match_type' => [
+                'string',
+                Rule::enum(TagMatchType::class),
+            ],
             // Filter by task IDs, task IDs are OR combined
             'task_ids' => [
                 'array',
@@ -178,6 +184,11 @@ class TimeEntryAggregateExportRequest extends BaseFormRequest
                 'string',
                 'in:true,false',
             ],
+            // Filter by time entry type
+            'type' => [
+                'string',
+                Rule::enum(TimeEntryType::class),
+            ],
             'fill_gaps_in_time_groups' => [
                 'string',
                 'in:true,false',
@@ -246,6 +257,15 @@ class TimeEntryAggregateExportRequest extends BaseFormRequest
         return ExportFormat::from($this->validated('format'));
     }
 
+    public function getTagMatchType(): ?TagMatchType
+    {
+        if (! $this->has('tag_match_type') || $this->validated('tag_match_type') === null) {
+            return null;
+        }
+
+        return TagMatchType::from($this->validated('tag_match_type'));
+    }
+
     public function getRoundingType(): ?TimeEntryRoundingType
     {
         if (! $this->has('rounding_type') || $this->validated('rounding_type') === null) {

app/Http/Requests/V1/TimeEntry/TimeEntryAggregateRequest.php

@@ -4,8 +4,10 @@ declare(strict_types=1);
 
 namespace App\Http\Requests\V1\TimeEntry;
 
+use App\Enums\TagMatchType;
 use App\Enums\TimeEntryAggregationType;
 use App\Enums\TimeEntryRoundingType;
+use App\Enums\TimeEntryType;
 use App\Http\Requests\V1\BaseFormRequest;
 use App\Models\Client;
 use App\Models\Member;
@@ -125,6 +127,10 @@ class TimeEntryAggregateRequest extends BaseFormRequest
                     })->uuid()->validate($attribute, $value, $fail);
                 },
             ],
+            'tag_match_type' => [
+                'string',
+                Rule::enum(TagMatchType::class),
+            ],
             // Filter by task IDs, task IDs are OR combined
             'task_ids' => [
                 'array',
@@ -164,6 +170,11 @@ class TimeEntryAggregateRequest extends BaseFormRequest
                 'string',
                 'in:true,false',
             ],
+            // Filter by time entry type
+            'type' => [
+                'string',
+                Rule::enum(TimeEntryType::class),
+            ],
             'fill_gaps_in_time_groups' => [
                 'string',
                 'in:true,false',
@@ -208,6 +219,15 @@ class TimeEntryAggregateRequest extends BaseFormRequest
         return $this->input('end') !== null ? Carbon::createFromFormat('Y-m-d\TH:i:s\Z', $this->input('end'), 'UTC') : null;
     }
 
+    public function getTagMatchType(): ?TagMatchType
+    {
+        if (! $this->has('tag_match_type') || $this->validated('tag_match_type') === null) {
+            return null;
+        }
+
+        return TagMatchType::from($this->validated('tag_match_type'));
+    }
+
     public function getRoundingType(): ?TimeEntryRoundingType
     {
         if (! $this->has('rounding_type') || $this->validated('rounding_type') === null) {

app/Http/Requests/V1/TimeEntry/TimeEntryIndexExportRequest.php

@@ -5,7 +5,9 @@ declare(strict_types=1);
 namespace App\Http\Requests\V1\TimeEntry;
 
 use App\Enums\ExportFormat;
+use App\Enums\TagMatchType;
 use App\Enums\TimeEntryRoundingType;
+use App\Enums\TimeEntryType;
 use App\Models\Client;
 use App\Models\Member;
 use App\Models\Organization;
@@ -110,6 +112,10 @@ class TimeEntryIndexExportRequest extends TimeEntryIndexRequest
                     })->uuid()->validate($attribute, $value, $fail);
                 },
             ],
+            'tag_match_type' => [
+                'string',
+                Rule::enum(TagMatchType::class),
+            ],
             // Filter by task IDs, task IDs are OR combined
             'task_ids' => [
                 'array',
@@ -150,6 +156,11 @@ class TimeEntryIndexExportRequest extends TimeEntryIndexRequest
                 'string',
                 'in:true,false',
             ],
+            // Filter by time entry type
+            'type' => [
+                'string',
+                Rule::enum(TimeEntryType::class),
+            ],
             // Limit the number of returned time entries (default: 150)
             'limit' => [
                 'integer',
@@ -215,6 +226,15 @@ class TimeEntryIndexExportRequest extends TimeEntryIndexRequest
         return ExportFormat::from($this->validated('format'));
     }
 
+    public function getTagMatchType(): ?TagMatchType
+    {
+        if (! $this->has('tag_match_type') || $this->validated('tag_match_type') === null) {
+            return null;
+        }
+
+        return TagMatchType::from($this->validated('tag_match_type'));
+    }
+
     public function getRoundingType(): ?TimeEntryRoundingType
     {
         if (! $this->has('rounding_type') || $this->validated('rounding_type') === null) {

app/Http/Requests/V1/TimeEntry/TimeEntryIndexRequest.php

@@ -4,7 +4,9 @@ declare(strict_types=1);
 
 namespace App\Http\Requests\V1\TimeEntry;
 
+use App\Enums\TagMatchType;
 use App\Enums\TimeEntryRoundingType;
+use App\Enums\TimeEntryType;
 use App\Http\Requests\V1\BaseFormRequest;
 use App\Models\Client;
 use App\Models\Member;
@@ -103,6 +105,10 @@ class TimeEntryIndexRequest extends BaseFormRequest
                     })->uuid()->validate($attribute, $value, $fail);
                 },
             ],
+            'tag_match_type' => [
+                'string',
+                Rule::enum(TagMatchType::class),
+            ],
             // Filter by task IDs, task IDs are OR combined
             'task_ids' => [
                 'array',
@@ -143,6 +149,11 @@ class TimeEntryIndexRequest extends BaseFormRequest
                 'string',
                 'in:true,false',
             ],
+            // Filter by time entry type
+            'type' => [
+                'string',
+                Rule::enum(TimeEntryType::class),
+            ],
             // Limit the number of returned time entries (default: 150)
             'limit' => [
                 'integer',
@@ -190,6 +201,15 @@ class TimeEntryIndexRequest extends BaseFormRequest
         return $this->has('offset') ? (int) $this->validated('offset', 0) : 0;
     }
 
+    public function getTagMatchType(): ?TagMatchType
+    {
+        if (! $this->has('tag_match_type') || $this->validated('tag_match_type') === null) {
+            return null;
+        }
+
+        return TagMatchType::from($this->validated('tag_match_type'));
+    }
+
     public function getRoundingType(): ?TimeEntryRoundingType
     {
         if (! $this->has('rounding_type') || $this->validated('rounding_type') === null) {

app/Http/Requests/V1/TimeEntry/TimeEntryStoreRequest.php

@@ -4,6 +4,7 @@ declare(strict_types=1);
 
 namespace App\Http\Requests\V1\TimeEntry;
 
+use App\Enums\TimeEntryType;
 use App\Http\Requests\V1\BaseFormRequest;
 use App\Models\Member;
 use App\Models\Organization;
@@ -14,6 +15,7 @@ use App\Service\PermissionStore;
 use Illuminate\Contracts\Validation\ValidationRule;
 use Illuminate\Database\Eloquent\Builder;
 use Illuminate\Support\Facades\Auth;
+use Illuminate\Validation\Rule;
 use Korridor\LaravelModelValidationRules\Rules\ExistsEloquent;
 
 /**
@@ -24,7 +26,7 @@ class TimeEntryStoreRequest extends BaseFormRequest
     /**
      * Get the validation rules that apply to the request.
      *
-     * @return array<string, array<string|ValidationRule>>
+     * @return array<string, array<string|\Closure|ValidationRule|\Illuminate\Contracts\Validation\Rule>>
      */
     public function rules(): array
     {
@@ -42,6 +44,7 @@ class TimeEntryStoreRequest extends BaseFormRequest
                 'nullable',
                 'string',
                 'required_with:task_id',
+                'prohibited_if:type,break',
                 ExistsEloquent::make(Project::class, null, function (Builder $builder): Builder {
                     /** @var Builder<Project> $builder */
                     $builder = $builder->whereBelongsTo($this->organization, 'organization');
@@ -60,6 +63,7 @@ class TimeEntryStoreRequest extends BaseFormRequest
             'task_id' => [
                 'nullable',
                 'string',
+                'prohibited_if:type,break',
                 ExistsEloquent::make(Task::class, null, function (Builder $builder): Builder {
                     /** @var Builder<Task> $builder */
                     return $builder->whereBelongsTo($this->organization, 'organization');
@@ -85,6 +89,16 @@ class TimeEntryStoreRequest extends BaseFormRequest
             'billable' => [
                 'required',
                 'boolean',
+                'declined_if:type,break',
+            ],
+            // Type of the time entry (work time or a break)
+            'type' => [
+                Rule::enum(TimeEntryType::class),
+                function (string $attribute, mixed $value, \Closure $fail): void {
+                    if ($value === TimeEntryType::Break->value && ! $this->organization->breaks_enabled) {
+                        $fail('Breaks are disabled for this organization.');
+                    }
+                },
             ],
             // Description of time entry
             'description' => [
@@ -96,6 +110,7 @@ class TimeEntryStoreRequest extends BaseFormRequest
             'tags' => [
                 'nullable',
                 'array',
+                'prohibited_if:type,break',
             ],
             'tags.*' => [
                 ExistsEloquent::make(Tag::class, null, function (Builder $builder): Builder {

app/Http/Requests/V1/TimeEntry/TimeEntryUpdateMultipleRequest.php

@@ -4,6 +4,7 @@ declare(strict_types=1);
 
 namespace App\Http\Requests\V1\TimeEntry;
 
+use App\Enums\TimeEntryType;
 use App\Http\Requests\V1\BaseFormRequest;
 use App\Models\Member;
 use App\Models\Organization;
@@ -14,6 +15,7 @@ use App\Service\PermissionStore;
 use Illuminate\Contracts\Validation\ValidationRule;
 use Illuminate\Database\Eloquent\Builder;
 use Illuminate\Support\Facades\Auth;
+use Illuminate\Validation\Rule;
 use Korridor\LaravelModelValidationRules\Rules\ExistsEloquent;
 
 /**
@@ -24,7 +26,7 @@ class TimeEntryUpdateMultipleRequest extends BaseFormRequest
     /**
      * Get the validation rules that apply to the request.
      *
-     * @return array<string, array<string|ValidationRule>>
+     * @return array<string, array<string|ValidationRule|\Illuminate\Contracts\Validation\Rule>>
      */
     public function rules(): array
     {
@@ -54,6 +56,7 @@ class TimeEntryUpdateMultipleRequest extends BaseFormRequest
                 'nullable',
                 'string',
                 'required_with:task_id',
+                'prohibited_if:changes.type,break',
                 ExistsEloquent::make(Project::class, null, function (Builder $builder): Builder {
                     /** @var Builder<Project> $builder */
                     $builder = $builder->whereBelongsTo($this->organization, 'organization');
@@ -72,6 +75,7 @@ class TimeEntryUpdateMultipleRequest extends BaseFormRequest
             'changes.task_id' => [
                 'nullable',
                 'string',
+                'prohibited_if:changes.type,break',
                 ExistsEloquent::make(Task::class, null, function (Builder $builder): Builder {
                     /** @var Builder<Task> $builder */
                     return $builder->whereBelongsTo($this->organization, 'organization');
@@ -84,7 +88,13 @@ class TimeEntryUpdateMultipleRequest extends BaseFormRequest
             ],
             // Whether time entry is billable
             'changes.billable' => [
+                'sometimes',
                 'boolean',
+                'declined_if:changes.type,break',
+            ],
+            // Type of the time entry (work time or a break)
+            'changes.type' => [
+                Rule::enum(TimeEntryType::class),
             ],
             // Description of time entry
             'changes.description' => [
@@ -96,6 +106,7 @@ class TimeEntryUpdateMultipleRequest extends BaseFormRequest
             'changes.tags' => [
                 'nullable',
                 'array',
+                'prohibited_if:changes.type,break',
             ],
             'changes.tags.*' => [
                 'string',

app/Http/Requests/V1/TimeEntry/TimeEntryUpdateRequest.php

@@ -4,16 +4,21 @@ declare(strict_types=1);
 
 namespace App\Http\Requests\V1\TimeEntry;
 
+use App\Enums\TimeEntryType;
 use App\Http\Requests\V1\BaseFormRequest;
 use App\Models\Member;
 use App\Models\Organization;
 use App\Models\Project;
 use App\Models\Tag;
 use App\Models\Task;
+use App\Models\TimeEntry;
 use App\Service\PermissionStore;
 use Illuminate\Contracts\Validation\ValidationRule;
 use Illuminate\Database\Eloquent\Builder;
 use Illuminate\Support\Facades\Auth;
+use Illuminate\Validation\ConditionalRules;
+use Illuminate\Validation\Rule;
+use Illuminate\Validation\Rules\ProhibitedIf;
 use Korridor\LaravelModelValidationRules\Rules\ExistsEloquent;
 
 /**
@@ -24,10 +29,19 @@ class TimeEntryUpdateRequest extends BaseFormRequest
     /**
      * Get the validation rules that apply to the request.
      *
-     * @return array<string, array<string|ValidationRule>>
+     * @return array<string, array<string|\Closure|ValidationRule|\Illuminate\Contracts\Validation\Rule|ProhibitedIf|ConditionalRules>>
      */
     public function rules(): array
     {
+        // Break restrictions need to apply based on the type the entry will have after the
+        // update, not only when the payload itself contains type=break.
+        $timeEntry = $this->route('timeEntry');
+        $timeEntry = $timeEntry instanceof TimeEntry ? $timeEntry : null;
+        $resultingType = $this->has('type')
+            ? TimeEntryType::tryFrom((string) $this->input('type'))
+            : $timeEntry?->type;
+        $isBreak = $resultingType === TimeEntryType::Break;
+
         return [
             // ID of the organization member that the time entry should belong to
             'member_id' => [
@@ -42,6 +56,7 @@ class TimeEntryUpdateRequest extends BaseFormRequest
                 'nullable',
                 'string',
                 'required_with:task_id',
+                Rule::prohibitedIf($isBreak),
                 ExistsEloquent::make(Project::class, null, function (Builder $builder): Builder {
                     /** @var Builder<Project> $builder */
                     $builder = $builder->whereBelongsTo($this->organization, 'organization');
@@ -60,6 +75,7 @@ class TimeEntryUpdateRequest extends BaseFormRequest
             'task_id' => [
                 'nullable',
                 'string',
+                Rule::prohibitedIf($isBreak),
                 ExistsEloquent::make(Task::class, null, function (Builder $builder): Builder {
                     /** @var Builder<Task> $builder */
                     return $builder->whereBelongsTo($this->organization, 'organization');
@@ -82,7 +98,22 @@ class TimeEntryUpdateRequest extends BaseFormRequest
             ],
             // Whether time entry is billable
             'billable' => [
+                'sometimes',
                 'boolean',
+                Rule::when($isBreak, ['declined']),
+            ],
+            // Type of the time entry (work time or a break)
+            'type' => [
+                Rule::enum(TimeEntryType::class),
+                function (string $attribute, mixed $value, \Closure $fail) use ($timeEntry): void {
+                    // While breaks are disabled, entries that already are breaks may stay
+                    // breaks, but converting a work entry to a break is not allowed.
+                    if ($value === TimeEntryType::Break->value
+                        && ! $this->organization->breaks_enabled
+                        && $timeEntry?->type !== TimeEntryType::Break) {
+                        $fail('Breaks are disabled for this organization.');
+                    }
+                },
             ],
             // Description of time entry
             'description' => [
@@ -94,6 +125,7 @@ class TimeEntryUpdateRequest extends BaseFormRequest
             'tags' => [
                 'nullable',
                 'array',
+                Rule::prohibitedIf($isBreak),
             ],
             'tags.*' => [
                 'string',

app/Http/Requests/V1/User/UserUpdateRequest.php

@@ -41,7 +41,7 @@ class UserUpdateRequest extends BaseFormRequest
                 'max:255',
             ],
             'email' => [
-                'email',
+                'email:rfc,strict',
                 'max:255',
                 UniqueEloquent::make(User::class, 'email')->ignore($this->user->id)->query(function (Builder $query) {
                     /** @var Builder<User> $query */

app/Http/Resources/V1/Organization/OrganizationResource.php

@@ -57,6 +57,8 @@ class OrganizationResource extends BaseResource
             'employees_can_manage_tasks' => $this->resource->employees_can_manage_tasks,
             /** @var bool $prevent_overlapping_time_entries Prevent creating overlapping time entries (only new entries) */
             'prevent_overlapping_time_entries' => $this->resource->prevent_overlapping_time_entries,
+            /** @var bool $breaks_enabled Whether members of the organization can track breaks */
+            'breaks_enabled' => $this->resource->breaks_enabled,
             /** @var string $currency Currency code (ISO 4217) */
             'currency' => $this->resource->currency,
             /** @var string $currency_symbol Currency symbol */

app/Http/Resources/V1/Report/DetailedReportResource.php

@@ -50,12 +50,16 @@ class DetailedReportResource extends BaseResource
                 'member_ids' => $this->resource->properties->memberIds?->toArray(),
                 /** @var bool|null $billable Filter by billable status */
                 'billable' => $this->resource->properties->billable,
+                /** @var string|null $time_entry_type Filter by time entry type */
+                'time_entry_type' => $this->resource->properties->timeEntryType?->value,
                 /** @var array<string>|null $client_ids Filter by client IDs, client IDs are OR combined */
                 'client_ids' => $this->resource->properties->clientIds?->toArray(),
                 /** @var array<string>|null $project_ids Filter by project IDs, project IDs are OR combined */
                 'project_ids' => $this->resource->properties->projectIds?->toArray(),
                 /** @var array<string>|null $tags_ids Filter by tag IDs, tag IDs are OR combined */
                 'tag_ids' => $this->resource->properties->tagIds?->toArray(),
+                /** @var string|null $tag_match_type Tag match type */
+                'tag_match_type' => $this->resource->properties->tagMatchType?->value,
                 /** @var array<string>|null $task_ids Filter by task IDs, task IDs are OR combined */
                 'task_ids' => $this->resource->properties->taskIds?->toArray(),
                 /** @var string|null $rounding_type Rounding type for time entries */

app/Http/Resources/V1/TimeEntry/TimeEntryResource.php

@@ -47,6 +47,8 @@ class TimeEntryResource extends BaseResource
             'tags' => $this->resource->tags ?? [],
             /** @var bool $billable Whether time entry is billable */
             'billable' => $this->resource->billable,
+            /** @var string $type Type of the time entry (`work` time or a `break`) */
+            'type' => $this->resource->type->value,
         ];
     }
 }

app/Jobs/RecalculateSpentTimeForProject.php

@@ -20,6 +20,11 @@ class RecalculateSpentTimeForProject implements ShouldDispatchAfterCommit, Shoul
     use Queueable;
     use SerializesModels;
 
+    /**
+     * Delete the job if its models no longer exist.
+     */
+    public bool $deleteWhenMissingModels = true;
+
     public Project $project;
 
     /**

app/Jobs/RecalculateSpentTimeForTask.php

@@ -20,6 +20,11 @@ class RecalculateSpentTimeForTask implements ShouldDispatchAfterCommit, ShouldQu
     use Queueable;
     use SerializesModels;
 
+    /**
+     * Delete the job if its models no longer exist.
+     */
+    public bool $deleteWhenMissingModels = true;
+
     public Task $task;
 
     /**

app/Models/Organization.php

@@ -34,6 +34,7 @@ use OwenIt\Auditing\Contracts\Auditable as AuditableContract;
  * @property bool $employees_can_see_billable_rates
  * @property bool $employees_can_manage_tasks
  * @property bool $prevent_overlapping_time_entries
+ * @property bool $breaks_enabled
  * @property User $owner
  * @property Carbon|null $created_at
  * @property Carbon|null $updated_at
@@ -70,6 +71,7 @@ class Organization extends Model implements AuditableContract
         'employees_can_see_billable_rates' => 'boolean',
         'employees_can_manage_tasks' => 'boolean',
         'prevent_overlapping_time_entries' => 'boolean',
+        'breaks_enabled' => 'boolean',
         'number_format' => NumberFormat::class,
         'currency_format' => CurrencyFormat::class,
         'date_format' => DateFormat::class,

app/Models/TimeEntry.php

@@ -4,6 +4,7 @@ declare(strict_types=1);
 
 namespace App\Models;
 
+use App\Enums\TimeEntryType;
 use App\Models\Concerns\CustomAuditable;
 use App\Models\Concerns\HasUuids;
 use App\Service\BillableRateService;
@@ -28,6 +29,7 @@ use Staudenmeir\EloquentJsonRelations\Relations\BelongsToJson;
  * @property Carbon|null $end
  * @property int|null $billable_rate Billable rate per hour in cents
  * @property bool $billable
+ * @property TimeEntryType $type
  * @property array<string> $tags
  * @property string $user_id
  * @property string $member_id
@@ -71,12 +73,20 @@ class TimeEntry extends Model implements AuditableContract
         'start' => 'datetime',
         'end' => 'datetime',
         'billable' => 'bool',
+        'type' => TimeEntryType::class,
         'tags' => 'array',
         'billable_rate' => 'int',
         'is_imported' => 'bool',
         'still_active_email_sent_at' => 'datetime',
     ];
 
+    /**
+     * @var array<string, string>
+     */
+    protected $attributes = [
+        'type' => 'work',
+    ];
+
     public const array SELECT_COLUMNS = [
         'id',
         'description',
@@ -84,6 +94,7 @@ class TimeEntry extends Model implements AuditableContract
         'end',
         'billable_rate',
         'billable',
+        'type',
         'user_id',
         'organization_id',
         'project_id',
@@ -117,6 +128,21 @@ class TimeEntry extends Model implements AuditableContract
         'billable_rate',
     ];
 
+    protected static function booted(): void
+    {
+        // Break entries can never be billable, have tags or belong to a project/task.
+        static::saving(function (TimeEntry $timeEntry): void {
+            if ($timeEntry->type === TimeEntryType::Break) {
+                $timeEntry->billable = false;
+                $timeEntry->billable_rate = null;
+                $timeEntry->project_id = null;
+                $timeEntry->task_id = null;
+                $timeEntry->client_id = null;
+                $timeEntry->tags = [];
+            }
+        });
+    }
+
     public function getBillableRateComputed(): ?int
     {
         return app(BillableRateService::class)->getBillableRateForTimeEntry($this);
@@ -173,6 +199,16 @@ class TimeEntry extends Model implements AuditableContract
         $builder->whereJsonContains('tags', $tag->getKey());
     }
 
+    /**
+     * Only work entries — breaks do not count toward tracked/billable time.
+     *
+     * @param  Builder<TimeEntry>  $builder
+     */
+    public function scopeWorkTime(Builder $builder): void
+    {
+        $builder->where('type', '=', TimeEntryType::Work);
+    }
+
     /**
      * @return BelongsTo<User, $this>
      */

app/Service/DashboardService.php

@@ -4,6 +4,7 @@ declare(strict_types=1);
 
 namespace App\Service;
 
+use App\Enums\TimeEntryType;
 use App\Enums\Weekday;
 use App\Models\Organization;
 use App\Models\Project;
@@ -154,6 +155,7 @@ class DashboardService
             ->select(DB::raw('DATE('.$dateWithTimeZone.') as date, round(sum(extract(epoch from (coalesce("end", now()) - start)))) as aggregate'))
             ->where('user_id', '=', $user->getKey())
             ->where('organization_id', '=', $organization->getKey())
+            ->workTime()
             ->groupBy(DB::raw('DATE('.$dateWithTimeZone.')'))
             ->orderBy('date');
 
@@ -195,6 +197,7 @@ class DashboardService
             ->select(DB::raw('DATE('.$dateWithTimeZone.') as date, round(sum(extract(epoch from (coalesce("end", now()) - start)))) as aggregate'))
             ->where('user_id', '=', $user->getKey())
             ->where('organization_id', '=', $organization->getKey())
+            ->workTime()
             ->groupBy(DB::raw('DATE('.$dateWithTimeZone.')'))
             ->orderBy('date');
 
@@ -222,7 +225,8 @@ class DashboardService
         $query = TimeEntry::query()
             ->select(DB::raw('round(sum(extract(epoch from (coalesce("end", now()) - start)))) as aggregate'))
             ->where('user_id', '=', $user->getKey())
-            ->where('organization_id', '=', $organization->getKey());
+            ->where('organization_id', '=', $organization->getKey())
+            ->workTime();
 
         $query = $this->constrainDateByPossibleDates($query, $possibleDays, $timezone);
         /** @var Collection<int, object{aggregate: int}> $resultDb */
@@ -290,6 +294,7 @@ class DashboardService
             ->select(DB::raw('project_id, round(sum(extract(epoch from (coalesce("end", now()) - start)))) as aggregate'))
             ->where('user_id', '=', $user->getKey())
             ->where('organization_id', '=', $organization->getKey())
+            ->workTime()
             ->groupBy('project_id');
 
         $query = $this->constrainDateByCurrentWeek($query, $timezone, $user->week_start);
@@ -433,7 +438,8 @@ class DashboardService
             JOIN   time_entries ON time_entries.start < time_ranges."end"
                       AND coalesce(time_entries."end", :now::timestamp) > time_ranges.start
             WHERE time_entries.user_id = :user_id and
-                  time_entries.organization_id = :organization_id
+                  time_entries.organization_id = :organization_id and
+                  time_entries.type = :work_type
             GROUP BY time_ranges.start
             ORDER BY time_ranges.start
         ', [
@@ -442,6 +448,7 @@ class DashboardService
             'user_id' => $user->getKey(),
             'organization_id' => $organization->getKey(),
             'now' => Carbon::now()->toDateTimeString(),
+            'work_type' => TimeEntryType::Work->value,
         ]))->pluck('aggregate', 'start');
 
         $response = [];

app/Service/Dto/ReportPropertiesDto.php

@@ -4,9 +4,11 @@ declare(strict_types=1);
 
 namespace App\Service\Dto;
 
+use App\Enums\TagMatchType;
 use App\Enums\TimeEntryAggregationType;
 use App\Enums\TimeEntryAggregationTypeInterval;
 use App\Enums\TimeEntryRoundingType;
+use App\Enums\TimeEntryType;
 use App\Enums\Weekday;
 use App\Service\TimeEntryFilter;
 use Illuminate\Contracts\Database\Eloquent\Castable;
@@ -56,6 +58,8 @@ class ReportPropertiesDto implements Castable
      */
     public ?Collection $tagIds = null;
 
+    public ?TagMatchType $tagMatchType = null;
+
     /**
      * @var Collection<int, string>|null
      */
@@ -65,6 +69,8 @@ class ReportPropertiesDto implements Castable
 
     public ?int $roundingMinutes = null;
 
+    public ?TimeEntryType $timeEntryType = null;
+
     /**
      * Get the caster class to use when casting from / to this cast target.
      *
@@ -115,6 +121,7 @@ class ReportPropertiesDto implements Castable
                 $dto->clientIds = $data->clientIds !== null ? ReportPropertiesDto::idArrayToCollection($data->clientIds) : null;
                 $dto->projectIds = $data->projectIds !== null ? ReportPropertiesDto::idArrayToCollection($data->projectIds) : null;
                 $dto->tagIds = $data->tagIds !== null ? ReportPropertiesDto::idArrayToCollection($data->tagIds) : null;
+                $dto->tagMatchType = isset($data->tagMatchType) ? TagMatchType::from($data->tagMatchType) : null;
                 $dto->taskIds = $data->taskIds ? ReportPropertiesDto::idArrayToCollection($data->taskIds) : null;
                 $dto->group = TimeEntryAggregationType::from($data->group);
                 $dto->subGroup = TimeEntryAggregationType::from($data->subGroup);
@@ -125,6 +132,12 @@ class ReportPropertiesDto implements Castable
                 $dto->roundingType = isset($data->roundingType) ? TimeEntryRoundingType::from($data->roundingType) : null;
                 // Note: roundingMinutes was added later so it is possible that the value is missing in persisted reports in the DB
                 $dto->roundingMinutes = isset($data->roundingMinutes) ? (int) $data->roundingMinutes : null;
+                // Note: timeEntryType was added later, reports persisted before that are missing the value and default to "work"
+                if (property_exists($data, 'timeEntryType')) {
+                    $dto->timeEntryType = $data->timeEntryType !== null ? TimeEntryType::from($data->timeEntryType) : null;
+                } else {
+                    $dto->timeEntryType = TimeEntryType::Work;
+                }
 
                 return $dto;
             }
@@ -144,6 +157,7 @@ class ReportPropertiesDto implements Castable
                     'clientIds' => $value->clientIds?->toArray(),
                     'projectIds' => $value->projectIds?->toArray(),
                     'tagIds' => $value->tagIds?->toArray(),
+                    'tagMatchType' => $value->tagMatchType?->value,
                     'taskIds' => $value->taskIds?->toArray(),
                     'group' => $value->group->value,
                     'subGroup' => $value->subGroup->value,
@@ -152,6 +166,7 @@ class ReportPropertiesDto implements Castable
                     'timezone' => $value->timezone,
                     'roundingType' => $value->roundingType?->value,
                     'roundingMinutes' => $value->roundingMinutes,
+                    'timeEntryType' => $value->timeEntryType?->value,
                 ];
 
                 $jsonString = json_encode($data);
@@ -216,6 +231,11 @@ class ReportPropertiesDto implements Castable
         $this->tagIds = $tagIds !== null ? ReportPropertiesDto::idArrayToCollection($tagIds) : null;
     }
 
+    public function setTagMatchType(?TagMatchType $tagMatchType): void
+    {
+        $this->tagMatchType = $tagMatchType;
+    }
+
     /**
      * @param  array<mixed>|null  $taskIds
      */

app/Service/Export/ExportService.php

@@ -107,6 +107,7 @@ class ExportService
                 'end',
                 'billable_rate',
                 'billable',
+                'type',
                 'member_id',
                 'user_id',
                 'organization_id',
@@ -131,6 +132,7 @@ class ExportService
                             $timeEntry->end?->toIso8601ZuluString() ?? '',
                             $timeEntry->billable_rate ?? '',
                             $timeEntry->billable ? 'true' : 'false',
+                            $timeEntry->type->value,
                             $timeEntry->member_id,
                             $timeEntry->user_id,
                             $timeEntry->organization_id,

app/Service/Import/Importers/ClockifyProjectsImporter.php

@@ -5,6 +5,7 @@ declare(strict_types=1);
 namespace App\Service\Import\Importers;
 
 use Exception;
+use Illuminate\Support\Carbon;
 use Illuminate\Support\Str;
 use League\Csv\Exception as CsvException;
 use League\Csv\Reader;
@@ -24,10 +25,12 @@ class ClockifyProjectsImporter extends DefaultImporter
             $header = $reader->getHeader();
             $this->validateHeader($header);
             $billableRateKey = $this->getBillableRateKey($header);
+            $tasksKey = $this->getTasksKey($header);
             $records = $reader->getRecords();
             foreach ($records as $record) {
                 $clientId = null;
-                if ($record['Client'] !== '') {
+                // Newer Clockify exports no longer contain a "Client" column.
+                if (($record['Client'] ?? '') !== '') {
                     $clientId = $this->clientImportHelper->getKey([
                         'name' => $record['Client'],
                         'organization_id' => $this->organization->id,
@@ -43,12 +46,13 @@ class ClockifyProjectsImporter extends DefaultImporter
                         'color' => $this->colorService->getRandomColor(),
                         'is_billable' => $record['Billability'] === 'Yes',
                         'billable_rate' => $billableRateKey !== null && $record[$billableRateKey] !== '' ? (int) (((float) $record[$billableRateKey]) * 100) : null,
-                        'estimated_time' => $record['Estimated (h)'] !== '' && is_numeric($record['Estimated (h)']) ? (int) ($record['Estimated (h)'] * 3600) : null,
+                        'estimated_time' => isset($record['Estimated (h)']) && is_numeric($record['Estimated (h)']) ? (int) ($record['Estimated (h)'] * 3600) : null,
+                        'archived_at' => $record['Status'] === 'Archived' ? Carbon::now() : null,
                     ]);
                 }
 
-                if ($record['Task'] !== '') {
+                if ($tasksKey !== null && $record[$tasksKey] !== '') {
-                    $tasks = explode(', ', $record['Task']);
+                    $tasks = explode(', ', $record[$tasksKey]);
                     foreach ($tasks as $task) {
                         $this->taskImportHelper->getKey([
                             'name' => $task,
@@ -77,17 +81,36 @@ class ClockifyProjectsImporter extends DefaultImporter
     {
         $requiredFields = [
             'Project',
-            'Client',
             'Status',
             'Visibility',
             'Billability',
-            'Task',
         ];
         foreach ($requiredFields as $requiredField) {
             if (! in_array($requiredField, $header, true)) {
                 throw new ImportException('Invalid CSV header, missing field: '.$requiredField);
             }
         }
+        // Clockify names the tasks column "Task", "Tasks" or "Activities" depending on the export; accept any.
+        if ($this->getTasksKey($header) === null) {
+            throw new ImportException('Invalid CSV header, missing field: Tasks');
+        }
+    }
+
+    /**
+     * Clockify names the tasks column differently depending on the export
+     * version: "Task" (older), "Tasks" (newer) or "Activities".
+     *
+     * @param  array<string>  $header
+     */
+    private function getTasksKey(array $header): ?string
+    {
+        foreach (['Tasks', 'Task', 'Activities'] as $field) {
+            if (in_array($field, $header, true)) {
+                return $field;
+            }
+        }
+
+        return null;
     }
 
     /**

app/Service/Import/Importers/ClockifyTimeEntriesImporter.php

@@ -5,6 +5,7 @@ declare(strict_types=1);
 namespace App\Service\Import\Importers;
 
 use App\Enums\Role;
+use App\Enums\TimeEntryType;
 use App\Jobs\RecalculateSpentTimeForProject;
 use App\Jobs\RecalculateSpentTimeForTask;
 use App\Models\TimeEntry;
@@ -54,6 +55,7 @@ class ClockifyTimeEntriesImporter extends DefaultImporter
             $reader->setEscape('');
             $header = $reader->getHeader();
             $this->validateHeader($header);
+            $taskKey = $this->getTaskKey($header);
             $records = $reader->getRecords();
             foreach ($records as $record) {
                 $userId = $this->userImportHelper->getKey([
@@ -70,8 +72,12 @@ class ClockifyTimeEntriesImporter extends DefaultImporter
                     'role' => Role::Placeholder->value,
                 ]);
                 $member = $this->memberImportHelper->getModelById($memberId);
+                // Clockify allows a project/task/client/tags/billable on breaks, but those are
+                // meaningless for non-work time. Detect breaks up front and skip creating any of
+                // that so a break can't spawn an orphan project/tag or inflate the import counts.
+                $isBreak = isset($record['Type']) && strtolower($record['Type']) === 'break';
                 $clientId = null;
-                if ($record['Client'] !== '') {
+                if (! $isBreak && ($record['Client'] ?? '') !== '') {
                     $clientId = $this->clientImportHelper->getKey([
                         'name' => $record['Client'],
                         'organization_id' => $this->organization->id,
@@ -80,7 +86,7 @@ class ClockifyTimeEntriesImporter extends DefaultImporter
                 $projectId = null;
                 $project = null;
                 $projectMember = null;
-                if ($record['Project'] !== '') {
+                if (! $isBreak && $record['Project'] !== '') {
                     $projectId = $this->projectImportHelper->getKey([
                         'name' => $record['Project'],
                         'client_id' => $clientId,
@@ -96,9 +102,9 @@ class ClockifyTimeEntriesImporter extends DefaultImporter
                     ]);
                 }
                 $taskId = null;
-                if ($record['Task'] !== '') {
+                if (! $isBreak && $taskKey !== null && $record[$taskKey] !== '') {
                     $taskId = $this->taskImportHelper->getKey([
-                        'name' => $record['Task'],
+                        'name' => $record[$taskKey],
                         'project_id' => $projectId,
                         'organization_id' => $this->organization->id,
                     ]);
@@ -116,11 +122,18 @@ class ClockifyTimeEntriesImporter extends DefaultImporter
                     throw new ImportException('Time entry description is too long');
                 }
                 $timeEntry->description = $record['Description'];
-                if (! in_array($record['Billable'], ['Yes', 'No'], true)) {
+                if (isset($record['Billable'])) {
-                    throw new ImportException('Invalid billable value');
+                    if (! in_array($record['Billable'], ['Yes', 'No'], true)) {
+                        throw new ImportException('Invalid billable value');
+                    }
+                    $timeEntry->billable = $record['Billable'] === 'Yes';
                 }
-                $timeEntry->billable = $record['Billable'] === 'Yes';
+                if ($isBreak) {
-                $timeEntry->tags = $this->getTags($record['Tags']);
+                    // Breaks can not be billable or belong to a project/task (already skipped above)
+                    $timeEntry->type = TimeEntryType::Break;
+                    $timeEntry->billable = false;
+                }
+                $timeEntry->tags = $isBreak ? [] : $this->getTags($record['Tags']);
                 $timeEntry->is_imported = true;
 
                 // Start
@@ -212,14 +225,11 @@ class ClockifyTimeEntriesImporter extends DefaultImporter
     {
         $requiredFields = [
             'Project',
-            'Client',
             'Description',
-            'Task',
             'User',
             'Group',
             'Email',
             'Tags',
-            'Billable',
             'Start Date',
             'Start Time',
             'End Date',
@@ -230,6 +240,26 @@ class ClockifyTimeEntriesImporter extends DefaultImporter
                 throw new ImportException('Invalid CSV header, missing field: '.$requiredField);
             }
         }
+        // Clockify names the task column "Task" or "Activity" depending on the export; accept either.
+        if ($this->getTaskKey($header) === null) {
+            throw new ImportException('Invalid CSV header, missing field: Task');
+        }
+    }
+
+    /**
+     * Clockify names the task column "Task" or "Activity" depending on the export version.
+     *
+     * @param  array<string>  $header
+     */
+    private function getTaskKey(array $header): ?string
+    {
+        foreach (['Task', 'Activity'] as $field) {
+            if (in_array($field, $header, true)) {
+                return $field;
+            }
+        }
+
+        return null;
     }
 
     #[\Override]

app/Service/Import/Importers/DefaultImporter.php

@@ -171,7 +171,7 @@ abstract class DefaultImporter implements ImporterContract
         }, validate: [
             'email' => [
                 'required',
-                'email',
+                'email:rfc,strict',
                 'max:255',
             ],
         ]);

app/Service/Import/Importers/SolidtimeImporter.php

@@ -5,6 +5,7 @@ declare(strict_types=1);
 namespace App\Service\Import\Importers;
 
 use App\Enums\Role;
+use App\Enums\TimeEntryType;
 use App\Jobs\RecalculateSpentTimeForProject;
 use App\Jobs\RecalculateSpentTimeForTask;
 use App\Models\TimeEntry;
@@ -255,6 +256,14 @@ class SolidtimeImporter extends DefaultImporter
                     throw new ImportException('Invalid billable value');
                 }
                 $timeEntry->billable = $timeEntryRow['billable'] === 'true';
+                // The type column does not exist in old exports
+                if (($timeEntryRow['type'] ?? '') !== '') {
+                    $type = TimeEntryType::tryFrom($timeEntryRow['type']);
+                    if ($type === null) {
+                        throw new ImportException('Invalid type value');
+                    }
+                    $timeEntry->type = $type;
+                }
                 $timeEntry->tags = $this->getTags($timeEntryRow['tags']);
                 $timeEntry->is_imported = true;
 

app/Service/Import/Importers/TogglDataImporter.php

@@ -123,6 +123,7 @@ class TogglDataImporter extends DefaultImporter
             }
 
             foreach ($projects as $project) {
+                $projectExternalId = $this->guardExternalIdentifier($project->id);
                 $clientId = null;
                 if ($project->client_id !== null) {
                     $clientId = $this->clientImportHelper->getKeyByExternalIdentifier((string) $project->client_id);
@@ -146,16 +147,16 @@ class TogglDataImporter extends DefaultImporter
                     'billable_rate' => $project->rate !== null ? (int) ($project->rate * 100) : null,
                 ], (string) $project->id);
 
-                if (! file_exists($temporaryDirectory->path('projects_users/'.$project->id.'.json'))) {
+                if (! file_exists($temporaryDirectory->path('projects_users/'.$projectExternalId.'.json'))) {
-                    throw new ImportException('File "projects_users/'.$project->id.'.json" missing in ZIP');
+                    throw new ImportException('File "projects_users/'.$projectExternalId.'.json" missing in ZIP');
                 }
-                $projectMembersFileContent = file_get_contents($temporaryDirectory->path('projects_users/'.$project->id.'.json'));
+                $projectMembersFileContent = file_get_contents($temporaryDirectory->path('projects_users/'.$projectExternalId.'.json'));
                 if ($projectMembersFileContent === false) {
-                    throw new ImportException('File "projects_users/'.$project->id.'.json" can not be opened');
+                    throw new ImportException('File "projects_users/'.$projectExternalId.'.json" can not be opened');
                 }
                 $projectMembers = json_decode($projectMembersFileContent);
                 if ($projectMembers === null) {
-                    throw new ImportException('File "projects_users/'.$project->id.'.json" is empty');
+                    throw new ImportException('File "projects_users/'.$projectExternalId.'.json" is empty');
                 }
                 foreach ($projectMembers as $projectMember) {
                     $userId = $this->userImportHelper->getKeyByExternalIdentifier((string) $projectMember->user_id);
@@ -170,6 +171,7 @@ class TogglDataImporter extends DefaultImporter
             }
             $projectIds = $this->projectImportHelper->getExternalIds();
             foreach ($projectIds as $projectIdExternal) {
+                $projectIdExternal = $this->guardExternalIdentifier($projectIdExternal);
                 if (! file_exists($temporaryDirectory->path('tasks/'.$projectIdExternal.'.json'))) {
                     continue;
                 }
@@ -209,6 +211,30 @@ class TogglDataImporter extends DefaultImporter
         }
     }
 
+    /**
+     * Ensure an externally-sourced identifier can be safely used inside a
+     * filesystem path. The identifiers originate from the untrusted uploaded
+     * ZIP, and Spatie's TemporaryDirectory::path() auto-creates any missing
+     * parent directory of the resolved path, so an unfiltered "../" sequence
+     * would escape the import sandbox and create/probe arbitrary paths on the
+     * host (CWE-22). Toggl identifiers are numeric, so restricting them to a
+     * conservative allow-list rejects traversal without affecting real data.
+     *
+     * @throws ImportException
+     */
+    private function guardExternalIdentifier(mixed $id): string
+    {
+        if (! is_string($id) && ! is_int($id)) {
+            throw new ImportException('Invalid identifier in import data');
+        }
+        $id = (string) $id;
+        if (preg_match('/^[A-Za-z0-9_-]+$/', $id) !== 1) {
+            throw new ImportException('Invalid identifier in import data');
+        }
+
+        return $id;
+    }
+
     #[Override]
     public function getName(): string
     {

app/Service/ReportExport/TimeEntriesDetailedCsvExport.php

@@ -4,6 +4,7 @@ declare(strict_types=1);
 
 namespace App\Service\ReportExport;
 
+use App\Enums\TimeEntryType;
 use App\Models\TimeEntry;
 use App\Service\IntervalService;
 use Illuminate\Database\Eloquent\Builder;
@@ -25,6 +26,7 @@ class TimeEntriesDetailedCsvExport extends CsvExport
         'Duration',
         'Duration (decimal)',
         'Billable',
+        'Break',
         'Tags',
     ];
 
@@ -58,6 +60,7 @@ class TimeEntriesDetailedCsvExport extends CsvExport
             'Duration' => $duration !== null ? $interval->format($model->getDuration()) : null,
             'Duration (decimal)' => $duration?->totalHours,
             'Billable' => $model->billable ? 'Yes' : 'No',
+            'Break' => $model->type === TimeEntryType::Break ? 'Yes' : 'No',
             'Tags' => $model->tagsRelation->pluck('name')->implode(', '),
         ];
     }

app/Service/ReportExport/TimeEntriesDetailedExport.php

@@ -5,6 +5,7 @@ declare(strict_types=1);
 namespace App\Service\ReportExport;
 
 use App\Enums\ExportFormat;
+use App\Enums\TimeEntryType;
 use App\Models\TimeEntry;
 use App\Service\LocalizationService;
 use Illuminate\Database\Eloquent\Builder;
@@ -106,6 +107,7 @@ class TimeEntriesDetailedExport implements FromQuery, ShouldAutoSize, WithColumn
             'Duration',
             'Duration (decimal)',
             'Billable',
+            'Break',
             'Tags',
         ];
     }
@@ -130,6 +132,7 @@ class TimeEntriesDetailedExport implements FromQuery, ShouldAutoSize, WithColumn
                 $duration !== null ? $this->localizationService->formatInterval($duration) : null,
                 $duration?->totalHours,
                 $model->billable ? 'Yes' : 'No',
+                $model->type === TimeEntryType::Break ? 'Yes' : 'No',
                 $model->tagsRelation->pluck('name')->implode(', '),
             ];
         } elseif ($this->exportFormat === ExportFormat::ODS) {
@@ -144,6 +147,7 @@ class TimeEntriesDetailedExport implements FromQuery, ShouldAutoSize, WithColumn
                 $duration !== null ? $this->localizationService->formatInterval($duration) : null,
                 $duration?->totalHours,
                 $model->billable ? 'Yes' : 'No',
+                $model->type === TimeEntryType::Break ? 'Yes' : 'No',
                 $model->tagsRelation->pluck('name')->implode(', '),
             ];
         } else {

app/Service/TimeEntryAggregationService.php

@@ -353,6 +353,13 @@ class TimeEntryAggregationService
                     'color' => null,
                 ];
             }
+        } elseif ($type === TimeEntryAggregationType::Type) {
+            foreach ($keys as $key) {
+                $descriptorMap[$key] = [
+                    'description' => $key === 'break' ? 'Break' : 'Work time',
+                    'color' => null,
+                ];
+            }
         } elseif ($type === TimeEntryAggregationType::Tag) {
             $tags = Tag::query()
                 ->whereIn('id', $keys)
@@ -504,6 +511,8 @@ class TimeEntryAggregationService
             return 'client_id';
         } elseif ($group === TimeEntryAggregationType::Billable) {
             return 'billable';
+        } elseif ($group === TimeEntryAggregationType::Type) {
+            return 'type';
         } elseif ($group === TimeEntryAggregationType::Description) {
             return 'description';
         } elseif ($group === TimeEntryAggregationType::Tag) {

app/Service/TimeEntryFilter.php

@@ -4,6 +4,8 @@ declare(strict_types=1);
 
 namespace App\Service;
 
+use App\Enums\TagMatchType;
+use App\Enums\TimeEntryType;
 use App\Models\Member;
 use App\Models\TimeEntry;
 use Illuminate\Database\Eloquent\Builder;
@@ -143,6 +145,32 @@ class TimeEntryFilter
         return $this;
     }
 
+    public function addTypeFilter(?string $type): self
+    {
+        if ($type === null) {
+            return $this;
+        }
+        $typeEnum = TimeEntryType::tryFrom($type);
+        if ($typeEnum === null) {
+            Log::warning('Invalid type filter value', ['value' => $type]);
+
+            return $this;
+        }
+        $this->addType($typeEnum);
+
+        return $this;
+    }
+
+    public function addType(?TimeEntryType $type): self
+    {
+        if ($type === null) {
+            return $this;
+        }
+        $this->builder->where('type', '=', $type->value);
+
+        return $this;
+    }
+
     /**
      * @param  array<string>|null  $clientIds
      */
@@ -192,15 +220,21 @@ class TimeEntryFilter
     /**
      * @param  array<string>|null  $tagIds
      */
-    public function addTagIdsFilter(?array $tagIds): self
+    public function addTagIdsFilter(?array $tagIds, ?TagMatchType $tagMatchType = TagMatchType::Contains): self
     {
         if ($tagIds === null) {
             return $this;
         }
+        $tagMatchType ??= TagMatchType::Contains;
         $includeNone = in_array(self::NONE_VALUE, $tagIds, true);
         $tagIds = array_values(array_filter($tagIds, fn (string $id): bool => $id !== self::NONE_VALUE));
+        // An empty selection (no tag IDs and not filtering for "none") is no constraint, so apply nothing.
+        // This also prevents the not-contains branch from collapsing into "only entries with null tags".
+        if (count($tagIds) === 0 && ! $includeNone) {
+            return $this;
+        }
 
-        $this->builder->where(function (Builder $builder) use ($tagIds, $includeNone): void {
+        $tagCondition = function (Builder $builder) use ($tagIds, $includeNone): void {
             foreach ($tagIds as $tagId) {
                 $builder->orWhereJsonContains('tags', $tagId);
             }
@@ -209,7 +243,18 @@ class TimeEntryFilter
                     $query->whereJsonLength('tags', 0)->orWhereNull('tags');
                 });
             }
-        });
+        };
+
+        if ($tagMatchType === TagMatchType::NotContains) {
+            $this->builder->where(function (Builder $builder) use ($tagCondition, $includeNone): void {
+                $builder->whereNot($tagCondition);
+                if (! $includeNone) {
+                    $builder->orWhereNull('tags');
+                }
+            });
+        } else {
+            $this->builder->where($tagCondition);
+        }
 
         return $this;
     }

database/factories/OrganizationFactory.php

@@ -33,6 +33,7 @@ class OrganizationFactory extends Factory
             'user_id' => User::factory(),
             'personal_team' => true,
             'employees_can_see_billable_rates' => false,
+            'breaks_enabled' => false,
             'number_format' => $this->faker->randomElement(NumberFormat::values()),
             'currency_format' => $this->faker->randomElement(CurrencyFormat::values()),
             'date_format' => $this->faker->randomElement(DateFormat::values()),
@@ -55,6 +56,13 @@ class OrganizationFactory extends Factory
         ]);
     }
 
+    public function withBreaksEnabled(): self
+    {
+        return $this->state(fn (array $attributes) => [
+            'breaks_enabled' => true,
+        ]);
+    }
+
     public function withOwner(?User $owner = null): self
     {
         return $this->state(fn (array $attributes) => [

database/factories/TimeEntryFactory.php

@@ -4,6 +4,7 @@ declare(strict_types=1);
 
 namespace Database\Factories;
 
+use App\Enums\TimeEntryType;
 use App\Models\Member;
 use App\Models\Organization;
 use App\Models\Project;
@@ -33,6 +34,7 @@ class TimeEntryFactory extends Factory
             'start' => $start,
             'end' => $this->faker->dateTimeBetween($start, 'now'),
             'billable' => $this->faker->boolean(),
+            'type' => TimeEntryType::Work,
             'is_imported' => false,
             'tags' => [],
             'user_id' => User::factory(),
@@ -44,6 +46,18 @@ class TimeEntryFactory extends Factory
         ];
     }
 
+    public function isBreak(): self
+    {
+        return $this->state(function (array $attributes): array {
+            return [
+                'type' => TimeEntryType::Break,
+                'billable' => false,
+                'project_id' => null,
+                'task_id' => null,
+            ];
+        });
+    }
+
     public function notBillable(): self
     {
         return $this->state(function (array $attributes): array {

database/migrations/2026_07_11_000001_add_type_to_time_entries_table.php

@@ -0,0 +1,24 @@
+<?php
+
+declare(strict_types=1);
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::table('time_entries', function (Blueprint $table): void {
+            $table->string('type')->default('work');
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::table('time_entries', function (Blueprint $table): void {
+            $table->dropColumn('type');
+        });
+    }
+};

database/migrations/2026_07_13_000001_add_breaks_enabled_to_organizations_table.php

@@ -0,0 +1,24 @@
+<?php
+
+declare(strict_types=1);
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::table('organizations', function (Blueprint $table): void {
+            $table->boolean('breaks_enabled')->default(false)->after('prevent_overlapping_time_entries');
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::table('organizations', function (Blueprint $table): void {
+            $table->dropColumn('breaks_enabled');
+        });
+    }
+};

e2e/breaks.spec.ts

@@ -0,0 +1,278 @@
+import { expect, test } from '../playwright/fixtures';
+import { PLAYWRIGHT_BASE_URL } from '../playwright/config';
+import type { Page } from '@playwright/test';
+import {
+    assertThatTimerHasStarted,
+    assertThatTimerIsStopped,
+    newTimeEntryResponse,
+    startOrStopTimerWithButton,
+    stoppedTimeEntryResponse,
+} from './utils/currentTimeEntry';
+import { createTimeEntryViaApi, updateOrganizationSettingViaApi } from './utils/api';
+
+async function goToDashboard(page: Page) {
+    await page.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
+}
+
+function visibleBreakButton(page: Page) {
+    return page.getByRole('button', { name: 'Take a break' }).locator('visible=true').first();
+}
+
+// Breaks are disabled by default for new organizations, so enable them for the break flows.
+// The tests that assert the disabled behaviour turn them back off explicitly.
+test.beforeEach(async ({ ctx }) => {
+    await updateOrganizationSettingViaApi(ctx, { breaks_enabled: true });
+});
+
+test('test that switching to a break stops the work timer and starts a break entry', async ({
+    page,
+}) => {
+    await goToDashboard(page);
+    await expect(page.getByTestId('time_entry_description')).toBeEditable();
+    await page.getByTestId('time_entry_description').fill('Work before break');
+    await Promise.all([
+        newTimeEntryResponse(page, { description: 'Work before break', type: 'work' }),
+        page.getByTestId('time_entry_description').press('Enter'),
+    ]);
+    await assertThatTimerHasStarted(page);
+    await page.waitForTimeout(1500);
+
+    // Switch to break: stops the work entry and starts a break entry
+    await Promise.all([
+        newTimeEntryResponse(page, { description: '', type: 'break' }),
+        visibleBreakButton(page).click(),
+    ]);
+    await expect(page.getByText('On break')).toBeVisible();
+
+    // The break bar offers a one-click resume that stops the break and restores
+    // the interrupted work context
+    await page.waitForTimeout(1500);
+    const resumeButton = page.getByRole('button', { name: 'Resume "Work before break"' });
+    await expect(resumeButton).toBeVisible();
+    await Promise.all([
+        stoppedTimeEntryResponse(page, { type: 'break' }),
+        newTimeEntryResponse(page, { description: 'Work before break', type: 'work' }),
+        resumeButton.click(),
+    ]);
+    await assertThatTimerHasStarted(page);
+    await expect(page.getByTestId('time_entry_description')).toHaveValue('Work before break');
+
+    // Cleanup: stop the running entry
+    await Promise.all([
+        stoppedTimeEntryResponse(page, { description: 'Work before break', type: 'work' }),
+        startOrStopTimerWithButton(page),
+    ]);
+    await assertThatTimerIsStopped(page);
+});
+
+test('test that stopping a break returns to an idle tracker where a fresh entry starts normally', async ({
+    page,
+}) => {
+    await goToDashboard(page);
+    await expect(page.getByTestId('time_entry_description')).toBeEditable();
+    await page.getByTestId('time_entry_description').fill('Work before break');
+    await Promise.all([
+        newTimeEntryResponse(page, { description: 'Work before break', type: 'work' }),
+        page.getByTestId('time_entry_description').press('Enter'),
+    ]);
+    await assertThatTimerHasStarted(page);
+    await page.waitForTimeout(1500);
+
+    // Switch to a break
+    await Promise.all([
+        newTimeEntryResponse(page, { description: '', type: 'break' }),
+        visibleBreakButton(page).click(),
+    ]);
+    await expect(page.getByText('On break')).toBeVisible();
+
+    // Stopping the break just ends it — no modal, the tracker returns to the
+    // empty idle input with focus so typing starts a fresh entry
+    await page.waitForTimeout(1500);
+    await Promise.all([
+        stoppedTimeEntryResponse(page, { type: 'break' }),
+        startOrStopTimerWithButton(page),
+    ]);
+    await assertThatTimerIsStopped(page);
+    await expect(page.getByTestId('time_entry_description')).toHaveValue('');
+    await expect(page.getByTestId('time_entry_description')).toBeFocused();
+
+    // A fresh entry is the normal start flow: type + Enter
+    await page.getByTestId('time_entry_description').fill('Fresh after break');
+    await Promise.all([
+        newTimeEntryResponse(page, { description: 'Fresh after break', type: 'work' }),
+        page.getByTestId('time_entry_description').press('Enter'),
+    ]);
+    await assertThatTimerHasStarted(page);
+
+    // Cleanup: stop the running entry
+    await Promise.all([
+        stoppedTimeEntryResponse(page, { description: 'Fresh after break', type: 'work' }),
+        startOrStopTimerWithButton(page),
+    ]);
+    await assertThatTimerIsStopped(page);
+});
+
+test('test that the more options dropdown can start a break directly', async ({ page }) => {
+    await goToDashboard(page);
+    await expect(page.getByTestId('time_entry_description')).toBeEditable();
+
+    // Start a break straight from the more options dropdown (no create modal)
+    await page.getByRole('button', { name: 'Time entry actions' }).click();
+    await Promise.all([
+        newTimeEntryResponse(page, { description: '', type: 'break' }),
+        page.getByRole('menuitem', { name: 'Start Break' }).click(),
+    ]);
+    await expect(page.getByText('On break')).toBeVisible();
+
+    // Without interrupted work there is nothing to resume, so no resume button is offered
+    await expect(page.getByRole('button', { name: /^Resume/ })).toHaveCount(0);
+
+    // Cleanup: stop the break
+    await page.waitForTimeout(1500);
+    await Promise.all([
+        stoppedTimeEntryResponse(page, { type: 'break' }),
+        startOrStopTimerWithButton(page),
+    ]);
+    await assertThatTimerIsStopped(page);
+});
+
+test('test that disabling breaks hides every break-creation entry point', async ({ page, ctx }) => {
+    // Breaks disabled for the organization (delivered to the client via the organization endpoint)
+    await updateOrganizationSettingViaApi(ctx, { breaks_enabled: false });
+    await createTimeEntryViaApi(ctx, { duration: '1h', description: 'Regular work' });
+
+    // Calendar: the empty-slot context menu offers "Create Time Entry" but no "Add Break",
+    // and the edit modal drops the work-time/break type selector
+    await page.goto(PLAYWRIGHT_BASE_URL + '/calendar');
+    await expect(page.locator('.fc')).toBeVisible();
+    const event = page.locator('.fc-event').filter({ hasText: 'Regular work' }).first();
+    await event.scrollIntoViewIfNeeded();
+    await expect(event).toBeVisible();
+
+    const box = await event.boundingBox();
+    expect(box).not.toBeNull();
+    await page.mouse.click(box!.x + box!.width / 2, box!.y + box!.height + 40, { button: 'right' });
+    await expect(page.getByRole('menu')).toBeVisible();
+    await expect(page.getByRole('menuitem', { name: 'Create Time Entry' })).toBeVisible();
+    await expect(page.getByRole('menuitem', { name: 'Add Break' })).toHaveCount(0);
+    await page.keyboard.press('Escape');
+
+    await event.click({ button: 'right' });
+    await expect(page.getByRole('menu')).toBeVisible();
+    await page.getByRole('menuitem', { name: 'Edit' }).click();
+    await expect(page.getByRole('dialog')).toBeVisible();
+    await expect(
+        page.getByRole('dialog').getByRole('combobox').filter({ hasText: 'Work time' })
+    ).toHaveCount(0);
+    await page.keyboard.press('Escape');
+
+    // Timesheet: no break row is shown
+    await page.goto(PLAYWRIGHT_BASE_URL + '/timesheet');
+    await expect(page.getByRole('button', { name: 'Add row' }).first()).toBeVisible();
+    await expect(page.getByText('Break', { exact: true })).toHaveCount(0);
+
+    // Dashboard tracker: no "Start Break" in the more options dropdown
+    await goToDashboard(page);
+    await expect(page.getByTestId('time_entry_description')).toBeEditable();
+    await page.getByRole('button', { name: 'Time entry actions' }).click();
+    await expect(page.getByRole('menuitem', { name: 'Switch to simple mode' })).toBeVisible();
+    await expect(page.getByRole('menuitem', { name: 'Start Break' })).toHaveCount(0);
+});
+
+// The employee fixture registers a second user and accepts an invitation via Mailpit,
+// which does not fit into the default per-test timeout.
+test.describe('Org-level breaks setting', () => {
+    test.describe.configure({ timeout: 60000 });
+
+    test('test that the org-level breaks setting is respected for employees', async ({
+        ctx,
+        employee,
+    }) => {
+        const employeePage = employee.page;
+
+        // Breaks enabled (via beforeEach): the employee sees "Start Break" in the more options dropdown
+        await employeePage.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
+        await expect(employeePage.getByTestId('dashboard_view')).toBeVisible();
+        await employeePage.getByRole('button', { name: 'Time entry actions' }).click();
+        await expect(
+            employeePage.getByRole('menuitem', { name: 'Switch to simple mode' })
+        ).toBeVisible();
+        await expect(employeePage.getByRole('menuitem', { name: 'Start Break' })).toBeVisible();
+        await employeePage.keyboard.press('Escape');
+
+        // The owner disables breaks for the whole organization
+        await updateOrganizationSettingViaApi(ctx, { breaks_enabled: false });
+
+        // The employee reloads: "Start Break" is gone from the dropdown
+        await employeePage.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
+        await expect(employeePage.getByTestId('dashboard_view')).toBeVisible();
+        await employeePage.getByRole('button', { name: 'Time entry actions' }).click();
+        await expect(
+            employeePage.getByRole('menuitem', { name: 'Switch to simple mode' })
+        ).toBeVisible();
+        await expect(employeePage.getByRole('menuitem', { name: 'Start Break' })).toHaveCount(0);
+        await employeePage.keyboard.press('Escape');
+
+        // With an active timer the break (coffee) button is not shown either
+        await employeePage.getByTestId('time_entry_description').fill('Employee work');
+        await Promise.all([
+            newTimeEntryResponse(employeePage, { description: 'Employee work', type: 'work' }),
+            employeePage.getByTestId('time_entry_description').press('Enter'),
+        ]);
+        await assertThatTimerHasStarted(employeePage);
+        await expect(employeePage.getByRole('button', { name: 'Take a break' })).toHaveCount(0);
+
+        // Cleanup: stop the running entry
+        await Promise.all([
+            stoppedTimeEntryResponse(employeePage, { description: 'Employee work', type: 'work' }),
+            startOrStopTimerWithButton(employeePage),
+        ]);
+        await assertThatTimerIsStopped(employeePage);
+    });
+});
+
+test('test that mass update warns about selected breaks and reports skipped entries instead of success', async ({
+    page,
+    ctx,
+}) => {
+    // One work entry and one break: a billable mass update applies to the work
+    // entry but the server skips the break entirely — the UI must say so.
+    await createTimeEntryViaApi(ctx, { duration: '1h', description: 'Mass update work entry' });
+    await createTimeEntryViaApi(ctx, { duration: '30min', type: 'break' });
+
+    await page.goto(PLAYWRIGHT_BASE_URL + '/time');
+    await expect(page.locator('[data-testid="time_entry_row"]')).toHaveCount(2);
+    await page.getByLabel('Select All').click();
+    await expect(page.getByText('2 selected')).toBeVisible();
+    await page.getByRole('button', { name: 'Edit' }).click();
+    await expect(page.getByRole('dialog')).toBeVisible();
+
+    // No warning while the changeset is compatible with breaks
+    await expect(page.getByTestId('mass_update_break_warning')).not.toBeVisible();
+
+    // Making the entries billable is break-incompatible → warning appears
+    await page
+        .getByRole('dialog')
+        .getByRole('combobox')
+        .filter({ hasText: 'Set billable status' })
+        .click();
+    await page.getByRole('option', { name: 'Billable', exact: true }).click();
+    await expect(page.getByTestId('mass_update_break_warning')).toBeVisible();
+    await expect(page.getByTestId('mass_update_break_warning')).toContainText('skipped entirely');
+
+    // Submit: the work entry updates, the break is skipped, and the toast
+    // reports the skip instead of claiming success for all entries
+    const [massUpdateResponse] = await Promise.all([
+        page.waitForResponse(
+            (response) =>
+                response.url().includes('/time-entries') &&
+                response.request().method() === 'PATCH' &&
+                response.status() === 200
+        ),
+        page.getByRole('button', { name: 'Update Time Entries' }).click(),
+    ]);
+    const massUpdateBody = await massUpdateResponse.json();
+    expect(massUpdateBody.success.length).toBe(1);
+    expect(massUpdateBody.error.length).toBe(1);
+    await expect(page.getByText('1 of 2 time entries was skipped')).toBeVisible();
+});

e2e/calendar.spec.ts

@@ -2874,3 +2874,54 @@ test.describe('Daily Total After Create', () => {
         }).toPass({ timeout: 5000 });
     });
 });
+
+test('test that calendar context menu can add a break that fills the gap between two entries', async ({
+    page,
+    ctx,
+}) => {
+    await updateOrganizationSettingViaApi(ctx, { breaks_enabled: true });
+    // Two work entries today (09:00-10:00 and 11:00-12:00 UTC) with a one hour gap
+    const today = new Date().toISOString().slice(0, 10);
+    const gapStart = `${today}T10:00:00Z`;
+    const gapEnd = `${today}T11:00:00Z`;
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${today}T09:00:00Z`,
+        end: gapStart,
+        description: 'Gap work A',
+    });
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: gapEnd,
+        end: `${today}T12:00:00Z`,
+        description: 'Gap work B',
+    });
+
+    await goToCalendar(page);
+    const eventA = page.locator('.fc-event').filter({ hasText: 'Gap work A' }).first();
+    await eventA.scrollIntoViewIfNeeded();
+    await expect(eventA).toBeVisible();
+
+    // Right-click just below entry A (inside the gap, in the same day column)
+    const box = await eventA.boundingBox();
+    expect(box).not.toBeNull();
+    await page.mouse.click(box!.x + box!.width / 2, box!.y + box!.height + 15, {
+        button: 'right',
+    });
+    await expect(page.getByRole('menu')).toBeVisible();
+    await page.getByRole('menuitem', { name: 'Add Break' }).click();
+    await expect(page.getByRole('dialog')).toBeVisible();
+
+    // The break is prefilled to fill the gap exactly
+    const [createResponse] = await Promise.all([
+        page.waitForResponse(
+            async (response) =>
+                response.url().includes('/time-entries') &&
+                response.request().method() === 'POST' &&
+                response.status() === 201 &&
+                (await response.json()).data.type === 'break'
+        ),
+        page.getByRole('button', { name: 'Add Break' }).click(),
+    ]);
+    const body = await createResponse.json();
+    expect(body.data.start).toBe(gapStart);
+    expect(body.data.end).toBe(gapEnd);
+});

e2e/clients.spec.ts

@@ -246,7 +246,7 @@ test('test that sorting clients by name and status works', async ({ page, ctx })
 
 test('test that sorting clients by project count works', async ({ page, ctx }) => {
     const clientWithMany = await createClientViaApi(ctx, { name: 'ManyProjects Client' });
-    const clientWithNone = await createClientViaApi(ctx, { name: 'NoProjects Client' });
+    await createClientViaApi(ctx, { name: 'NoProjects Client' });
 
     // Create projects for the first client
     await createProjectViaApi(ctx, { name: 'Proj1', client_id: clientWithMany.id });
@@ -374,3 +374,119 @@ test.describe('Employee Clients Restrictions', () => {
         await expect(employee.page.getByText(clientName)).toBeVisible({ timeout: 10000 });
     });
 });
+
+// ──────────────────────────────────────────────────
+// Pagination Tests
+// ──────────────────────────────────────────────────
+
+test.describe('Clients Pagination', () => {
+    test.describe.configure({ timeout: 30000 });
+
+    test('test that client table paginates when there are more than 15 clients', async ({
+        page,
+        ctx,
+    }) => {
+        // Create 17 clients with zero-padded names so alphabetical sort is predictable.
+        // Page size is 15 → page 1 shows indices 00–14, page 2 shows 15–16.
+        const seed = Math.floor(Math.random() * 100000);
+        const prefix = `PaginationClient ${seed} `;
+        await Promise.all(
+            Array.from({ length: 17 }, (_, i) =>
+                createClientViaApi(ctx, { name: prefix + String(i).padStart(2, '0') })
+            )
+        );
+
+        await goToClientsOverview(page);
+        await clearClientTableState(page);
+        await page.reload();
+
+        // Default sort is name asc; first 15 clients (00–14) on page 1.
+        await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });
+        await expect(page.getByRole('button', { name: 'Next Page' })).toBeVisible();
+        // Client 15 should be on page 2, not visible on page 1.
+        await expect(page.getByText(prefix + '15')).not.toBeVisible();
+
+        // Exactly 15 data rows mounted on page 1.
+        await expect(page.getByRole('row')).toHaveCount(15);
+
+        // Navigation to page 2.
+        await page.getByRole('button', { name: 'Next Page' }).click();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+        await expect(page.getByText(prefix + '00')).not.toBeVisible();
+        // Page 2 contains the remaining 2 clients.
+        await expect(page.getByRole('row')).toHaveCount(2);
+
+        // Back to page 1 via Previous Page.
+        await page.getByRole('button', { name: 'Previous Page' }).click();
+        await expect(page.getByText(prefix + '00')).toBeVisible();
+        await expect(page.getByText(prefix + '15')).not.toBeVisible();
+
+        // First / Last page jumps.
+        await page.getByRole('button', { name: 'Last Page' }).click();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+        await page.getByRole('button', { name: 'First Page' }).click();
+        await expect(page.getByText(prefix + '00')).toBeVisible();
+        await expect(page.getByText(prefix + '15')).not.toBeVisible();
+
+        // Direct page-number button navigation + selected state.
+        await page.getByRole('button', { name: 'Page 2' }).click();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+        await expect(page.getByRole('button', { name: 'Page 2' })).toHaveAttribute(
+            'aria-current',
+            'page'
+        );
+    });
+
+    test('test that client pagination is not shown when there are 15 or fewer clients', async ({
+        page,
+        ctx,
+    }) => {
+        await Promise.all(
+            Array.from({ length: 10 }, (_, i) =>
+                createClientViaApi(ctx, {
+                    name: `FewClient ${Math.floor(Math.random() * 100000)} ${i}`,
+                })
+            )
+        );
+
+        await goToClientsOverview(page);
+        await clearClientTableState(page);
+        await page.reload();
+
+        await expect(page.getByTestId('client_table')).toBeVisible();
+        await expect(page.getByRole('button', { name: 'Next Page' })).toHaveCount(0);
+    });
+
+    test('test that changing the sort resets client pagination to page 1', async ({
+        page,
+        ctx,
+    }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const prefix = `SortPagClient ${seed} `;
+        await Promise.all(
+            Array.from({ length: 17 }, (_, i) =>
+                createClientViaApi(ctx, { name: prefix + String(i).padStart(2, '0') })
+            )
+        );
+
+        await goToClientsOverview(page);
+        await clearClientTableState(page);
+        await page.reload();
+
+        await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });
+
+        // Go to page 2.
+        await page.getByRole('button', { name: 'Next Page' }).click();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+
+        // Sort by name descending.
+        const table = page.getByTestId('client_table');
+        const nameHeader = table.getByText('Name').first();
+        await nameHeader.click();
+
+        // Pagination reset to page 1; desc order → 16, 15 visible, 00 on page 2.
+        await expect(page.getByText(prefix + '16')).toBeVisible();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+        await expect(page.getByText(prefix + '00')).not.toBeVisible();
+    });
+});

e2e/organization.spec.ts

@@ -4,7 +4,7 @@ import { PLAYWRIGHT_BASE_URL, TEST_USER_PASSWORD } from '../playwright/config';
 async function goToOrganizationSettings(page) {
     await page.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
     await page.locator('[data-testid="organization_switcher"]:visible').click();
-    await page.getByText('Organization Settings').click();
+    await page.getByRole('menuitem', { name: 'Organization Settings' }).click();
 }
 
 async function createTimeEntry(page, duration: string) {

e2e/projects.spec.ts

@@ -117,6 +117,43 @@ test('test that archiving and unarchiving projects works', async ({ page, ctx })
     await expect(page.getByText(newProjectName)).toBeVisible();
 });
 
+test('test that the client can be changed in the edit project modal', async ({ page, ctx }) => {
+    const projectName = 'Edit Client Project ' + Math.floor(1 + Math.random() * 100000);
+    const clientName = 'Assigned Client ' + Math.floor(1 + Math.random() * 100000);
+    await createProjectViaApi(ctx, { name: projectName });
+    const client = await createClientViaApi(ctx, { name: clientName });
+
+    await page.goto(PLAYWRIGHT_BASE_URL + '/projects');
+    await expect(page.getByText(projectName)).toBeVisible({ timeout: 10000 });
+
+    // Open the project's Edit modal.
+    await page.getByRole('row').first().getByRole('button').click();
+    await page.getByRole('menuitem').getByText('Edit').first().click();
+    await expect(page.getByRole('dialog')).toBeVisible();
+
+    // Open the client dropdown (currently "No Client"), confirm it focuses, and pick the client.
+    await page.getByRole('dialog').getByRole('button', { name: 'No Client' }).click();
+    const clientSearch = page.getByPlaceholder('Search for a client...');
+    await expect(clientSearch).toBeFocused();
+    await clientSearch.fill(clientName);
+    await page.getByRole('option', { name: clientName }).click();
+
+    // The trigger updates to the chosen client.
+    await expect(page.getByRole('dialog').getByRole('button', { name: clientName })).toBeVisible();
+
+    // Saving persists the client assignment.
+    await Promise.all([
+        page.getByRole('button', { name: 'Update Project' }).click(),
+        page.waitForResponse(
+            async (response) =>
+                response.url().includes('/projects/') &&
+                response.request().method() === 'PUT' &&
+                response.status() === 200 &&
+                (await response.json()).data.client_id === client.id
+        ),
+    ]);
+});
+
 test('test that updating billable rate works with existing time entries', async ({ page, ctx }) => {
     const newProjectName = 'New Project ' + Math.floor(1 + Math.random() * 10000);
     const newBillableRate = Math.round(Math.random() * 10000);
@@ -1054,3 +1091,119 @@ test.describe('Employee Billable Rate Visibility', () => {
         await expect(projectRow).toContainText('200');
     });
 });
+
+// ──────────────────────────────────────────────────
+// Pagination Tests
+// ──────────────────────────────────────────────────
+
+test.describe('Projects Pagination', () => {
+    test.describe.configure({ timeout: 30000 });
+
+    test('test that project table paginates when there are more than 15 projects', async ({
+        page,
+        ctx,
+    }) => {
+        // Create 17 projects with zero-padded names so alphabetical sort is predictable.
+        // Page size is 15 → page 1 shows indices 00–14, page 2 shows 15–16.
+        const seed = Math.floor(Math.random() * 100000);
+        const prefix = `PaginationProj ${seed} `;
+        await Promise.all(
+            Array.from({ length: 17 }, (_, i) =>
+                createProjectViaApi(ctx, { name: prefix + String(i).padStart(2, '0') })
+            )
+        );
+
+        await goToProjectsOverview(page);
+        await clearProjectTableState(page);
+        await page.reload();
+
+        // Default sort is name asc; first 15 projects (00–14) should be on page 1.
+        await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });
+        await expect(page.getByRole('button', { name: 'Next Page' })).toBeVisible();
+        // Project 15 should be on page 2, not visible on page 1.
+        await expect(page.getByText(prefix + '15')).not.toBeVisible();
+
+        // Exactly 15 data rows should be mounted on page 1.
+        await expect(page.getByRole('row')).toHaveCount(15);
+
+        // Go to page 2.
+        await page.getByRole('button', { name: 'Next Page' }).click();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+        await expect(page.getByText(prefix + '00')).not.toBeVisible();
+        // Page 2 contains the remaining 2 projects (15, 16).
+        await expect(page.getByRole('row')).toHaveCount(2);
+
+        // Return to page 1 via Previous Page.
+        await page.getByRole('button', { name: 'Previous Page' }).click();
+        await expect(page.getByText(prefix + '00')).toBeVisible();
+        await expect(page.getByText(prefix + '15')).not.toBeVisible();
+
+        // Jump to last page then back to first page.
+        await page.getByRole('button', { name: 'Last Page' }).click();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+        await page.getByRole('button', { name: 'First Page' }).click();
+        await expect(page.getByText(prefix + '00')).toBeVisible();
+        await expect(page.getByText(prefix + '15')).not.toBeVisible();
+
+        // Direct page-number button navigation.
+        await page.getByRole('button', { name: 'Page 2' }).click();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+        // Page 2 button should be marked as selected.
+        await expect(page.getByRole('button', { name: 'Page 2' })).toHaveAttribute(
+            'aria-current',
+            'page'
+        );
+    });
+
+    test('test that project pagination is not shown when there are 15 or fewer projects', async ({
+        page,
+        ctx,
+    }) => {
+        await Promise.all(
+            Array.from({ length: 10 }, (_, i) =>
+                createProjectViaApi(ctx, {
+                    name: `FewProj ${Math.floor(Math.random() * 100000)} ${i}`,
+                })
+            )
+        );
+
+        await goToProjectsOverview(page);
+        await clearProjectTableState(page);
+        await page.reload();
+
+        await expect(page.getByTestId('project_table')).toBeVisible();
+        await expect(page.getByRole('button', { name: 'Next Page' })).toHaveCount(0);
+    });
+
+    test('test that changing the sort resets pagination to page 1', async ({ page, ctx }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const prefix = `SortPagProj ${seed} `;
+        await Promise.all(
+            Array.from({ length: 17 }, (_, i) =>
+                createProjectViaApi(ctx, { name: prefix + String(i).padStart(2, '0') })
+            )
+        );
+
+        await goToProjectsOverview(page);
+        await clearProjectTableState(page);
+        await page.reload();
+
+        await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });
+
+        // Go to page 2.
+        await page.getByRole('button', { name: 'Next Page' }).click();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+
+        // Sort by name descending: header click toggles asc → desc.
+        const nameHeader = page
+            .locator('[data-testid="project_table"] .select-none', { hasText: 'Name' })
+            .first();
+        await nameHeader.click();
+
+        // After sorting, pagination resets to page 1; desc order → 16, 15, ... 02 visible.
+        await expect(page.getByText(prefix + '16')).toBeVisible();
+        await expect(page.getByText(prefix + '15')).toBeVisible();
+        // Index 00 should now be on page 2 (last in desc order).
+        await expect(page.getByText(prefix + '00')).not.toBeVisible();
+    });
+});

e2e/reporting-detailed.spec.ts

@@ -717,3 +717,108 @@ test('test that keyboard navigation works in multiselect dropdown', async ({ pag
         page.getByRole('button', { name: 'Projects' }).first().getByText('1')
     ).toBeVisible();
 });
+
+// ──────────────────────────────────────────────────
+// Pagination Tests
+// ──────────────────────────────────────────────────
+
+test.describe('Reporting Detailed Pagination', () => {
+    test('test that detailed reporting paginates when there are more than 15 time entries', async ({
+        page,
+        ctx,
+    }) => {
+        // The detailed report paginates server-side with a page limit of 15.
+        // Create 17 time entries on a single project so we get exactly 2 pages.
+        const seed = Math.floor(Math.random() * 100000);
+        const projectName = `ReportPagProj ${seed}`;
+        const project = await createProjectViaApi(ctx, { name: projectName });
+        const descriptions = Array.from(
+            { length: 17 },
+            (_, i) => `ReportPagEntry ${String(i).padStart(2, '0')} ${seed}`
+        );
+        await Promise.all(
+            descriptions.map((description) =>
+                createTimeEntryViaApi(ctx, {
+                    description,
+                    duration: '30min',
+                    projectId: project.id,
+                })
+            )
+        );
+
+        await goToReportingDetailed(page);
+        await expect(page.getByText(descriptions[0]!).first()).toBeVisible({
+            timeout: 10000,
+        });
+
+        // Pagination nav should be rendered.
+        await expect(page.getByRole('button', { name: 'Next Page' })).toBeVisible();
+
+        // Collect which descriptions are currently visible on page 1.
+        const visiblePage1 = new Set<string>();
+        for (const description of descriptions) {
+            if ((await page.getByText(description).count()) > 0) {
+                visiblePage1.add(description);
+            }
+        }
+        // The page limit is 15 → exactly 15 entries visible on page 1.
+        expect(visiblePage1.size).toBe(15);
+
+        // Go to page 2 and wait for the server fetch.
+        await Promise.all([
+            page.getByRole('button', { name: 'Next Page' }).click(),
+            waitForDetailedReportingUpdate(page),
+        ]);
+
+        const visiblePage2 = new Set<string>();
+        for (const description of descriptions) {
+            if ((await page.getByText(description).count()) > 0) {
+                visiblePage2.add(description);
+            }
+        }
+        // Page 2 should hold the remaining 2 entries, disjoint from page 1.
+        expect(visiblePage2.size).toBe(2);
+        for (const description of visiblePage2) {
+            expect(visiblePage1.has(description)).toBe(false);
+        }
+        // Across both pages, all 17 entries should have been visible.
+        expect(visiblePage1.size + visiblePage2.size).toBe(17);
+
+        // Page 2 button is selected.
+        await expect(page.getByRole('button', { name: 'Page 2' })).toHaveAttribute(
+            'aria-current',
+            'page'
+        );
+
+        // Previous page returns to page 1.
+        await Promise.all([
+            page.getByRole('button', { name: 'Previous Page' }).click(),
+            waitForDetailedReportingUpdate(page),
+        ]);
+        expect((await page.getByText(descriptions[0]!).count()) > 0).toBe(true);
+    });
+
+    test('test that reporting pagination is not shown when there are 15 or fewer time entries', async ({
+        page,
+        ctx,
+    }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const projectName = `FewEntriesProj ${seed}`;
+        const project = await createProjectViaApi(ctx, { name: projectName });
+        await Promise.all(
+            Array.from({ length: 5 }, (_, i) =>
+                createTimeEntryViaApi(ctx, {
+                    description: `FewEntries ${i} ${seed}`,
+                    duration: '30min',
+                    projectId: project.id,
+                })
+            )
+        );
+
+        await goToReportingDetailed(page);
+        await expect(page.getByText(`FewEntries 0 ${seed}`).first()).toBeVisible({
+            timeout: 10000,
+        });
+        await expect(page.getByRole('button', { name: 'Next Page' })).toHaveCount(0);
+    });
+});

e2e/reporting-tag-match.spec.ts

@@ -0,0 +1,69 @@
+import { expect } from '@playwright/test';
+import { test } from '../playwright/fixtures';
+import { goToReportingDetailed, waitForDetailedReportingUpdate } from './utils/reporting';
+import { createTimeEntryWithTagViaApi } from './utils/api';
+
+// Each test registers a new user and creates test data via the API
+test.describe.configure({ timeout: 30000 });
+
+test('detailed reporting: "Does Not Contain" excludes entries with the selected tag', async ({
+    page,
+    ctx,
+}) => {
+    const tagA = 'MatchTagA ' + Math.floor(Math.random() * 10000);
+    const tagB = 'MatchTagB ' + Math.floor(Math.random() * 10000);
+    await createTimeEntryWithTagViaApi(ctx, tagA, '1h');
+    await createTimeEntryWithTagViaApi(ctx, tagB, '2h');
+
+    await goToReportingDetailed(page);
+    await expect(page.getByText(`Entry with tag ${tagA}`).first()).toBeVisible();
+    await expect(page.getByText(`Entry with tag ${tagB}`).first()).toBeVisible();
+
+    // Open the Tags dropdown, select tagA, then switch the match mode to "Does Not Contain"
+    await page.getByRole('button', { name: 'Tags' }).click();
+    await Promise.all([
+        waitForDetailedReportingUpdate(page),
+        page.getByRole('option').filter({ hasText: tagA }).click(),
+    ]);
+    await Promise.all([
+        waitForDetailedReportingUpdate(page),
+        page.getByRole('radio', { name: 'Does Not Contain', exact: true }).click(),
+    ]);
+    await page.keyboard.press('Escape');
+
+    // The entry with tagA is excluded; the entry with tagB remains
+    await expect(page.getByText(`Entry with tag ${tagA}`)).toHaveCount(0);
+    await expect(page.getByText(`Entry with tag ${tagB}`).first()).toBeVisible();
+});
+
+test('detailed reporting: toggling between "Contains" and "Does Not Contain" flips the result', async ({
+    page,
+    ctx,
+}) => {
+    const tagA = 'ToggleTagA ' + Math.floor(Math.random() * 10000);
+    const tagB = 'ToggleTagB ' + Math.floor(Math.random() * 10000);
+    await createTimeEntryWithTagViaApi(ctx, tagA, '1h');
+    await createTimeEntryWithTagViaApi(ctx, tagB, '2h');
+
+    await goToReportingDetailed(page);
+    await page.getByRole('button', { name: 'Tags' }).click();
+    await Promise.all([
+        waitForDetailedReportingUpdate(page),
+        page.getByRole('option').filter({ hasText: tagA }).click(),
+    ]);
+
+    // "Contains" tagA -> only the tagA entry is listed
+    await page.keyboard.press('Escape');
+    await expect(page.getByText(`Entry with tag ${tagA}`).first()).toBeVisible();
+    await expect(page.getByText(`Entry with tag ${tagB}`)).toHaveCount(0);
+
+    // "Does Not Contain" tagA -> flips to the tagB entry
+    await page.getByRole('button', { name: 'Tags' }).click();
+    await Promise.all([
+        waitForDetailedReportingUpdate(page),
+        page.getByRole('radio', { name: 'Does Not Contain', exact: true }).click(),
+    ]);
+    await page.keyboard.press('Escape');
+    await expect(page.getByText(`Entry with tag ${tagB}`).first()).toBeVisible();
+    await expect(page.getByText(`Entry with tag ${tagA}`)).toHaveCount(0);
+});

e2e/reporting.spec.ts

@@ -96,6 +96,37 @@ test('test that project multiselect search filters the option list', async ({ pa
     await page.keyboard.press('Escape');
 });
 
+test('test that the project filter virtualizes a long list (renders only a window)', async ({
+    page,
+    ctx,
+}) => {
+    // Create many projects so the dropdown must virtualize rather than render all of them.
+    const projectNames = Array.from(
+        { length: 80 },
+        (_, i) => `VirtProj ${String(i).padStart(2, '0')}`
+    );
+    await Promise.all(projectNames.map((name) => createProjectViaApi(ctx, { name })));
+
+    await goToReporting(page);
+    await expect(page.getByRole('button', { name: 'Export' })).toBeVisible();
+    await page.getByRole('button', { name: 'Projects' }).first().click();
+
+    // Only a small window of options is mounted, far fewer than the 80+ projects that exist.
+    await expect(page.getByRole('option').first()).toBeVisible();
+    const renderedCount = await page.getByRole('option').count();
+    expect(renderedCount).toBeGreaterThan(0);
+    expect(renderedCount).toBeLessThan(60);
+
+    // Virtualization must not drop options: searching narrows the list to the one deep match.
+    // Wait for the filtered count to settle to 1 before asserting — checking the option while
+    // the virtualizer is still re-rendering can transiently match a stale row (Firefox CI flake).
+    await page.getByPlaceholder('Search for a Project...').fill('VirtProj 79');
+    await expect(page.getByRole('option')).toHaveCount(1);
+    await expect(page.getByRole('option')).toContainText('VirtProj 79');
+
+    await page.keyboard.press('Escape');
+});
+
 test('test that selecting multiple projects shows correct badge count', async ({ page, ctx }) => {
     const project1Name = 'MultiProj1 ' + Math.floor(Math.random() * 10000);
     const project2Name = 'MultiProj2 ' + Math.floor(Math.random() * 10000);
@@ -988,3 +1019,24 @@ test.describe('Employee Reporting Restrictions', () => {
         await expect(employee.page.getByText('100,00 EUR').first()).toBeVisible();
     });
 });
+
+test('test that reporting has a type filter that can show only breaks', async ({ page, ctx }) => {
+    await updateOrganizationSettingViaApi(ctx, { breaks_enabled: true });
+    await createTimeEntryViaApi(ctx, { duration: '1h', description: 'Regular work entry' });
+    await createTimeEntryViaApi(ctx, { duration: '20min', type: 'break' });
+
+    await goToReporting(page);
+    // The type filter defaults to "Work time"; switching it to "Breaks" re-aggregates.
+    const typeFilter = page.getByRole('combobox').filter({ hasText: 'Work time' });
+    await expect(typeFilter).toBeVisible();
+    await typeFilter.click();
+    await Promise.all([
+        page.waitForResponse(
+            (response) =>
+                response.url().includes('/time-entries/aggregate') &&
+                response.url().includes('type=break') &&
+                response.status() === 200
+        ),
+        page.getByRole('option', { name: 'Breaks' }).click(),
+    ]);
+});

e2e/tasks.spec.ts

@@ -152,6 +152,49 @@ test('test that editing a task name works', async ({ page, ctx }) => {
     await expect(page.getByTestId('task_table')).not.toContainText(originalTaskName);
 });
 
+test('test that the project can be searched and changed in the create task modal', async ({
+    page,
+    ctx,
+}) => {
+    const sourceProject = 'Source Project ' + Math.floor(1 + Math.random() * 100000);
+    const targetProject = 'Target Project ' + Math.floor(1 + Math.random() * 100000);
+    await createProjectViaApi(ctx, { name: sourceProject });
+    const target = await createProjectViaApi(ctx, { name: targetProject });
+
+    await goToProjectsOverview(page);
+    await page.getByText(sourceProject).first().click();
+    await page.getByRole('button', { name: 'Create Task' }).click();
+    await expect(page.getByRole('dialog')).toBeVisible();
+
+    // The project dropdown is pre-filled with the source project; open it.
+    await page.getByRole('dialog').getByRole('button', { name: sourceProject }).click();
+
+    // Opening the dropdown focuses the search input; searching narrows it to the target project.
+    const projectSearch = page.getByPlaceholder('Search for a project...');
+    await expect(projectSearch).toBeFocused();
+    await projectSearch.fill('Target Project');
+    await page.getByRole('option', { name: targetProject }).click();
+
+    // Selecting closes the dropdown and updates the trigger to the chosen project.
+    await expect(
+        page.getByRole('dialog').getByRole('button', { name: targetProject })
+    ).toBeVisible();
+
+    // The new selection is what gets used when the task is created.
+    const taskName = 'Switched Task ' + Math.floor(1 + Math.random() * 100000);
+    await page.getByPlaceholder('Task Name').fill(taskName);
+    await Promise.all([
+        page.getByRole('dialog').getByRole('button', { name: 'Create Task' }).click(),
+        page.waitForResponse(
+            async (response) =>
+                response.url().includes('/tasks') &&
+                response.request().method() === 'POST' &&
+                response.status() === 201 &&
+                (await response.json()).data.project_id === target.id
+        ),
+    ]);
+});
+
 test('test that creating a project with an existing client works', async ({ page, ctx }) => {
     const clientName = 'Existing Client ' + Math.floor(1 + Math.random() * 10000);
     const projectName = 'Project With Client ' + Math.floor(1 + Math.random() * 10000);

e2e/time.spec.ts

@@ -50,7 +50,7 @@ async function goToTimeOverview(page: Page) {
 async function goToOrganizationSettings(page: Page) {
     await page.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
     await page.locator('[data-testid="organization_switcher"]:visible').click();
-    await page.getByText('Organization Settings').click();
+    await page.getByRole('menuitem', { name: 'Organization Settings' }).click();
 }
 
 async function createEmptyTimeEntry(page: Page) {
@@ -2303,3 +2303,21 @@ test('test that aggregate row context menu delete removes all grouped entries',
         page.locator('[data-testid="time_entry_row"]').filter({ hasText: description })
     ).not.toBeVisible();
 });
+
+test('test that break entries show a break badge and split day total on the time page', async ({
+    page,
+    ctx,
+}) => {
+    await updateOrganizationSettingViaApi(ctx, { breaks_enabled: true });
+    await createTimeEntryViaApi(ctx, { duration: '2h', description: 'Some work' });
+    await createTimeEntryViaApi(ctx, { duration: '30min', type: 'break', description: '' });
+
+    await page.goto(PLAYWRIGHT_BASE_URL + '/time');
+    await expect(page.getByTestId('break_badge').first()).toBeVisible();
+    await expect(page.getByTestId('break_badge').first()).toContainText('Break');
+    // Day heading shows worked time first, then the break portion
+    await expect(page.getByTestId('day_break_duration').first()).toBeVisible();
+    await expect(page.getByTestId('day_break_duration').first().locator('..')).toContainText(
+        '2h 00min work · 0h 30min break'
+    );
+});

e2e/timesheet.spec.ts

@@ -2,7 +2,15 @@ import { PLAYWRIGHT_BASE_URL } from '../playwright/config';
 import { test } from '../playwright/fixtures';
 import { expect } from '@playwright/test';
 import type { Page } from '@playwright/test';
-import { createProjectViaApi, createTaskViaApi, createTimeEntryOnDateViaApi } from './utils/api';
+import {
+    createProjectViaApi,
+    createTaskViaApi,
+    createTimeEntryOnDateViaApi,
+    createTimeEntryWithTimestampsViaApi,
+    getTimeEntriesViaApi,
+    updateOrganizationSettingViaApi,
+    type TestContext,
+} from './utils/api';
 
 // ──────────────────────────────────────────────────
 // Helpers
@@ -58,6 +66,34 @@ function addRowButton(page: Page) {
     return page.getByRole('button', { name: /Add row/i }).first();
 }
 
+async function fillBreakCell(page: Page, hours: string, dayIndex = 0) {
+    const input = page
+        .locator('[data-testid="timesheet_row"]')
+        .filter({ has: page.getByText('Break', { exact: true }) })
+        .locator('[data-testid="timesheet_cell"]')
+        .nth(dayIndex)
+        .locator('input');
+    await input.click();
+    await input.fill(hours);
+    return input;
+}
+
+function waitForBreakCreated(page: Page) {
+    return page.waitForResponse(
+        async (resp) =>
+            resp.url().includes('/time-entries') &&
+            resp.request().method() === 'POST' &&
+            resp.status() === 201 &&
+            (await resp.json()).data.type === 'break'
+    );
+}
+
+async function getDayEntriesViaApi(ctx: TestContext, day: string) {
+    return (await getTimeEntriesViaApi(ctx))
+        .filter((e) => e.start.startsWith(day))
+        .sort((a, b) => a.start.localeCompare(b.start));
+}
+
 async function chooseRowIdentity(page: Page, optionName: string) {
     await addRowButton(page).click();
 
@@ -639,3 +675,252 @@ test('cell accepts various duration input formats', async ({ page, ctx }) => {
     // 1.5 hours = 1h 30min
     await expect(mondayInput).toHaveValue('1h 30min');
 });
+
+test('test that adding a timesheet break to a full day splits the work entry via the placement modal', async ({
+    page,
+    ctx,
+}) => {
+    // A single work entry filling the day leaves no gap for a break, so the placement
+    // modal must offer to split it (the only entry) and drop the break in the middle.
+    await updateOrganizationSettingViaApi(ctx, { breaks_enabled: true });
+    const day = getCurrentWeekMonday().toISOString().slice(0, 10);
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T09:00:00Z`,
+        end: `${day}T17:00:00Z`,
+        description: 'Split me',
+    });
+
+    await goToTimesheet(page);
+    await expect(page.getByTestId('timesheet_view')).toBeVisible();
+
+    // The break row is always present — enter a 30m break on Monday
+    const breakCell = await fillBreakCell(page, '0.5');
+    await breakCell.press('Enter');
+
+    // The placement modal opens with the split preview, naming the entry that
+    // will be split so the user can recognize it.
+    await expect(page.getByTestId('break_placement_summary')).toBeVisible();
+    await expect(page.getByTestId('break_placement_summary')).toContainText(
+        'No Project · Split me'
+    );
+    await Promise.all([
+        waitForBreakCreated(page),
+        page.getByRole('button', { name: 'Add break' }).click(),
+    ]);
+
+    // The break is inserted without reducing the eight hours of work.
+    const dayEntries = await getDayEntriesViaApi(ctx, day);
+    expect(dayEntries.map((e) => [e.type, e.start, e.end])).toEqual([
+        ['work', `${day}T09:00:00Z`, `${day}T13:00:00Z`],
+        ['break', `${day}T13:00:00Z`, `${day}T13:30:00Z`],
+        ['work', `${day}T13:30:00Z`, `${day}T17:30:00Z`],
+    ]);
+});
+
+test('test that adding a break into an oversized gap places it without moving other entries', async ({
+    page,
+    ctx,
+}) => {
+    // 09-12 and 15-17 leave a 3h gap — wider than the placement tolerance allows,
+    // but easily big enough to hold the break. Such a gap is deliberate (the app
+    // itself never creates one), so the break goes flush after the morning entry
+    // and nothing else moves — no placement modal.
+    await updateOrganizationSettingViaApi(ctx, { breaks_enabled: true });
+    const day = getCurrentWeekMonday().toISOString().slice(0, 10);
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T09:00:00Z`,
+        end: `${day}T12:00:00Z`,
+        description: 'Morning',
+    });
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T15:00:00Z`,
+        end: `${day}T17:00:00Z`,
+        description: 'Afternoon',
+    });
+
+    await goToTimesheet(page);
+    await expect(page.getByTestId('timesheet_view')).toBeVisible();
+
+    const breakCell = await fillBreakCell(page, '0.5');
+    await Promise.all([waitForBreakCreated(page), breakCell.press('Enter')]);
+
+    await expect(page.getByTestId('break_placement_summary')).not.toBeVisible();
+    const dayEntries = await getDayEntriesViaApi(ctx, day);
+    expect(dayEntries.map((e) => [e.type, e.start, e.end])).toEqual([
+        ['work', `${day}T09:00:00Z`, `${day}T12:00:00Z`],
+        ['break', `${day}T12:00:00Z`, `${day}T12:30:00Z`],
+        ['work', `${day}T15:00:00Z`, `${day}T17:00:00Z`],
+    ]);
+});
+
+test('test that the placement modal warns when the chosen time would leave the break misaligned', async ({
+    page,
+    ctx,
+}) => {
+    // Back-to-back 09-12 and 12-17 leave no gap, so the placement modal opens.
+    // The suggested slot (flush at 12:00) is aligned — no warning. Moving the
+    // break to 07:00, before any work, keeps the plan feasible but the result
+    // would immediately carry the misaligned hint, so the modal warns upfront.
+    await updateOrganizationSettingViaApi(ctx, { breaks_enabled: true });
+    const day = getCurrentWeekMonday().toISOString().slice(0, 10);
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T09:00:00Z`,
+        end: `${day}T12:00:00Z`,
+        description: 'Morning',
+    });
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T12:00:00Z`,
+        end: `${day}T17:00:00Z`,
+        description: 'Afternoon',
+    });
+
+    await goToTimesheet(page);
+    await expect(page.getByTestId('timesheet_view')).toBeVisible();
+
+    const breakCell = await fillBreakCell(page, '0.5');
+    await breakCell.press('Enter');
+
+    // Default suggestion sits flush between work → no warning
+    await expect(page.getByTestId('break_placement_summary')).toBeVisible();
+    await expect(page.getByTestId('break_placement_misaligned_warning')).not.toBeVisible();
+
+    // Move the break to 07:00-07:30, before all work
+    const modal = page.getByRole('dialog');
+    const startTimeInput = modal.getByTestId('time_picker_input').first();
+    await startTimeInput.fill('07:00');
+    await startTimeInput.press('Tab');
+    const endTimeInput = modal.getByTestId('time_picker_input').nth(1);
+    await endTimeInput.fill('07:30');
+    await endTimeInput.press('Tab');
+
+    // Feasible (nothing has to move), but flagged as misaligned beforehand
+    await expect(page.getByTestId('break_placement_misaligned_warning')).toBeVisible();
+    await expect(page.getByTestId('break_placement_summary')).toContainText(
+        'No entries need to move.'
+    );
+
+    // The warning is non-blocking: the break can still be added as chosen
+    await Promise.all([
+        waitForBreakCreated(page),
+        page.getByRole('button', { name: 'Add break' }).click(),
+    ]);
+
+    const dayEntries = await getDayEntriesViaApi(ctx, day);
+    expect(dayEntries.map((e) => [e.type, e.start, e.end])).toEqual([
+        ['break', `${day}T07:00:00Z`, `${day}T07:30:00Z`],
+        ['work', `${day}T09:00:00Z`, `${day}T12:00:00Z`],
+        ['work', `${day}T12:00:00Z`, `${day}T17:00:00Z`],
+    ]);
+    // ...and the timesheet now shows the misaligned-break hint for that day
+    const hint = page.getByRole('button', {
+        name: 'does not align with your work entries',
+    });
+    await expect(hint).toBeVisible();
+
+    // The resulting warning links to the calendar on the affected date.
+    await hint.click();
+    await expect(page.getByRole('link', { name: 'Fix in calendar' })).toHaveAttribute(
+        'href',
+        `/calendar?date=${day}`
+    );
+});
+
+test('test that editing a timesheet break re-places it as one entry instead of fragmenting it', async ({
+    page,
+    ctx,
+}) => {
+    // Two work entries with a 1h gap, and a 30m break created directly inside it (12:15–12:45).
+    await updateOrganizationSettingViaApi(ctx, { breaks_enabled: true });
+    const day = getCurrentWeekMonday().toISOString().slice(0, 10);
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T09:00:00Z`,
+        end: `${day}T12:00:00Z`,
+        description: 'Work',
+    });
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T13:00:00Z`,
+        end: `${day}T17:00:00Z`,
+        description: 'Work',
+    });
+    const breakEntry = await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T12:15:00Z`,
+        end: `${day}T12:45:00Z`,
+        type: 'break',
+    });
+
+    await goToTimesheet(page);
+    await expect(page.getByTestId('timesheet_view')).toBeVisible();
+    const breakCell = await fillBreakCell(page, '0.75');
+    await Promise.all([
+        // A break that still fits its gap is re-placed in place (PUT on the same entry),
+        // not deleted and recreated — that's what keeps it a single entry.
+        page.waitForResponse(
+            async (resp) =>
+                resp.url().includes(`/time-entries/${breakEntry.id}`) &&
+                resp.request().method() === 'PUT' &&
+                resp.status() === 200 &&
+                (await resp.json()).data.type === 'break'
+        ),
+        breakCell.press('Enter'),
+    ]);
+
+    // Still exactly one break on the day (not fragmented). It stays anchored at its current
+    // start (12:15) rather than re-centering, growing its end to 13:00 to reach 45 minutes.
+    const breaks = (await getDayEntriesViaApi(ctx, day)).filter((e) => e.type === 'break');
+    expect(breaks).toHaveLength(1);
+    expect(breaks[0].duration).toBe(2700);
+    expect(breaks[0].start).toBe(`${day}T12:15:00Z`);
+    expect(breaks[0].end).toBe(`${day}T13:00:00Z`);
+});
+
+test('test that editing an adjacent break vacates its old slot before extending work', async ({
+    page,
+    ctx,
+}) => {
+    // The existing break must move before work can extend through its old slot.
+    await updateOrganizationSettingViaApi(ctx, {
+        breaks_enabled: true,
+        prevent_overlapping_time_entries: true,
+    });
+    const day = getCurrentWeekMonday().toISOString().slice(0, 10);
+    await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T09:00:00Z`,
+        end: `${day}T17:00:00Z`,
+        description: 'Work before break',
+    });
+    const breakEntry = await createTimeEntryWithTimestampsViaApi(ctx, {
+        start: `${day}T17:00:00Z`,
+        end: `${day}T17:30:00Z`,
+        type: 'break',
+    });
+
+    await goToTimesheet(page);
+    await expect(page.getByTestId('timesheet_view')).toBeVisible();
+    const breakCell = await fillBreakCell(page, '1');
+    await breakCell.press('Enter');
+
+    await expect(page.getByTestId('break_placement_summary')).toBeVisible();
+    await Promise.all([
+        page.waitForResponse(
+            (resp) =>
+                resp.url().includes(`/time-entries/${breakEntry.id}`) &&
+                resp.request().method() === 'PUT' &&
+                resp.status() === 200
+        ),
+        page.waitForResponse(
+            async (resp) =>
+                resp.url().includes('/time-entries') &&
+                resp.request().method() === 'POST' &&
+                resp.status() === 201 &&
+                (await resp.json()).data.type === 'work'
+        ),
+        page.getByRole('button', { name: 'Add break' }).click(),
+    ]);
+
+    const entries = await getDayEntriesViaApi(ctx, day);
+    expect(entries.map((entry) => [entry.id, entry.type, entry.start, entry.end])).toEqual([
+        [expect.any(String), 'work', `${day}T09:00:00Z`, `${day}T13:00:00Z`],
+        [breakEntry.id, 'break', `${day}T13:00:00Z`, `${day}T14:00:00Z`],
+        [expect.any(String), 'work', `${day}T14:00:00Z`, `${day}T18:00:00Z`],
+    ]);
+});

e2e/timetracker.spec.ts

@@ -9,7 +9,15 @@ import {
 } from './utils/currentTimeEntry';
 import type { Page } from '@playwright/test';
 import { newTagResponse } from './utils/tags';
-import { createProjectViaApi, updateOrganizationCurrencyViaWeb } from './utils/api';
+import {
+    createProjectViaApi,
+    createTaskViaApi,
+    createClientViaApi,
+    createTimeEntryViaApi,
+    archiveProjectViaApi,
+    markTaskDoneViaApi,
+    updateOrganizationCurrencyViaWeb,
+} from './utils/api';
 
 // Date picker button name patterns for different date formats
 const DATE_DISPLAY_PATTERN = /^\d{4}-\d{2}-\d{2}$|^\d{2}\/\d{2}\/\d{4}$|^\d{2}\.\d{2}\.\d{4}$/;
@@ -368,6 +376,66 @@ test('test that timer started on dashboard is visible on time page', async ({ pa
     await assertThatTimerIsStopped(page);
 });
 
+test('test that picking a recently tracked entry starts a timer with its fields', async ({
+    page,
+    ctx,
+}) => {
+    const project = await createProjectViaApi(ctx, {
+        name: `RecentProj ${Math.floor(Math.random() * 100000)}`,
+        is_billable: false,
+    });
+    await createTimeEntryViaApi(ctx, {
+        description: 'Recent work item',
+        duration: '1h',
+        projectId: project.id,
+    });
+
+    await goToDashboard(page);
+    const description = page.getByTestId('time_entry_description');
+    await expect(description).toBeEditable();
+
+    // Focusing the description opens the "Recently Tracked" dropdown listing the finished entry.
+    await description.click();
+    const recentEntry = page.getByText('Recent work item').first();
+    await expect(recentEntry).toBeVisible();
+
+    // Clicking it (mousedown) copies its fields — including the project — into a new running entry.
+    await Promise.all([
+        page.waitForResponse(async (response) => {
+            if (
+                !response.url().includes('/time-entries') ||
+                response.request().method() !== 'POST' ||
+                response.status() !== 201
+            ) {
+                return false;
+            }
+            const body = await response.json();
+            return (
+                body.data.description === 'Recent work item' &&
+                body.data.project_id === project.id &&
+                body.data.end === null
+            );
+        }),
+        recentEntry.click(),
+    ]);
+    await assertThatTimerHasStarted(page);
+    await expect(description).toHaveValue('Recent work item');
+    await expect(page.getByRole('button', { name: project.name })).toBeVisible();
+
+    // Cleanup: stop the running (project-bearing) entry
+    await Promise.all([
+        page.waitForResponse(async (response) => {
+            if (response.status() !== 200 || !response.url().includes('/time-entries/')) {
+                return false;
+            }
+            const body = await response.json();
+            return body.data.description === 'Recent work item' && body.data.end !== null;
+        }),
+        startOrStopTimerWithButton(page),
+    ]);
+    await assertThatTimerIsStopped(page);
+});
+
 test('test that creating a new project from the time tracker dropdown prefills the search text', async ({
     page,
     ctx,
@@ -441,3 +509,272 @@ test('test that adding a project and tag before starting timer works', async ({
     ]);
     await assertThatTimerIsStopped(page);
 });
+
+// ──────────────────────────────────────────────────
+// Project / Task selector dropdown
+// Regression coverage for the virtualized + lookup-map refactor of
+// TimeTrackerProjectTaskDropdown. The dropdown only (re)filters on open and on search
+// change, so we wait for the dashboard prefetch to settle before opening it.
+// ──────────────────────────────────────────────────
+
+test.describe('Project Task Dropdown', () => {
+    test.describe.configure({ timeout: 60_000 });
+
+    test('test that a project far down a long list can be found via search and selected', async ({
+        page,
+        ctx,
+    }) => {
+        // Seed enough projects that the target sits outside the initially rendered window.
+        const seed = Math.floor(Math.random() * 100000);
+        const prefix = `VirtProj ${seed} `;
+        await Promise.all(
+            Array.from({ length: 30 }, (_, i) =>
+                createProjectViaApi(ctx, { name: prefix + String(i).padStart(2, '0') })
+            )
+        );
+        const target = prefix + '27';
+
+        await goToDashboard(page);
+        await page.waitForLoadState('networkidle');
+
+        await page.getByRole('button', { name: 'No Project' }).click();
+        await page.getByTestId('client_dropdown_search').fill(target);
+        await page.getByRole('option').filter({ hasText: target }).click();
+
+        // The trigger now reflects the selected project.
+        await expect(page.getByRole('button', { name: target })).toBeVisible();
+    });
+
+    test('test that expanding a project and selecting a task works', async ({ page, ctx }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const projectName = `ExpandProj ${seed}`;
+        const taskName = `ExpandTask ${seed}`;
+        const project = await createProjectViaApi(ctx, { name: projectName });
+        await createTaskViaApi(ctx, { name: taskName, project_id: project.id });
+
+        await goToDashboard(page);
+        await page.waitForLoadState('networkidle');
+
+        await page.getByRole('button', { name: 'No Project' }).click();
+        const projectOption = page.getByRole('option').filter({ hasText: projectName });
+        await expect(projectOption).toBeVisible();
+
+        // Expand the project's tasks via the "N Tasks" button, then select the task.
+        await projectOption.getByText(/Tasks/).click();
+        await page.getByText(taskName, { exact: true }).click();
+
+        // Scoped to the trigger button: the closing dropdown also contains the name while animating out.
+        await expect(
+            page.getByRole('button', { name: `${projectName} ${taskName}` })
+        ).toBeVisible();
+    });
+
+    test('test that keyboard navigation selects a project', async ({ page, ctx }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const projectName = `KbProj ${seed}`;
+        await createProjectViaApi(ctx, { name: projectName });
+
+        await goToDashboard(page);
+        await page.waitForLoadState('networkidle');
+
+        await page.getByRole('button', { name: 'No Project' }).click();
+        const search = page.getByTestId('client_dropdown_search');
+        // On open the search is focused and "No Project" is highlighted.
+        await expect(search).toBeFocused();
+
+        // Arrow down from "No Project" to the project, then select it with Enter.
+        await search.press('ArrowDown');
+        await search.press('Enter');
+
+        await expect(page.getByRole('button', { name: projectName })).toBeVisible();
+    });
+
+    test('test that search filters the dropdown by project and client name', async ({
+        page,
+        ctx,
+    }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const clientName = `FilterClient ${seed}`;
+        const alphaProject = `AlphaProj ${seed}`;
+        const betaProject = `BetaProj ${seed}`;
+        const client = await createClientViaApi(ctx, { name: clientName });
+        await createProjectViaApi(ctx, { name: alphaProject, client_id: client.id });
+        await createProjectViaApi(ctx, { name: betaProject });
+
+        await goToDashboard(page);
+        await page.waitForLoadState('networkidle');
+
+        await page.getByRole('button', { name: 'No Project' }).click();
+        const search = page.getByTestId('client_dropdown_search');
+        const alphaOption = page.getByRole('option').filter({ hasText: alphaProject });
+        const betaOption = page.getByRole('option').filter({ hasText: betaProject });
+
+        // Both projects are visible before filtering.
+        await expect(alphaOption).toBeVisible();
+        await expect(betaOption).toBeVisible();
+
+        // Project-name search shows only the matching project.
+        await search.fill('AlphaProj');
+        await expect(alphaOption).toBeVisible();
+        await expect(betaOption).not.toBeVisible();
+
+        // Client-name search shows the project that belongs to that client.
+        await search.fill(clientName);
+        await expect(alphaOption).toBeVisible();
+        await expect(betaOption).not.toBeVisible();
+    });
+
+    test("test that searching by task name surfaces the task's project", async ({ page, ctx }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const projectWithTask = `TaskSearchProj ${seed}`;
+        const taskName = `Findable Task ${seed}`;
+        const unrelatedProject = `Unrelated Proj ${seed}`;
+        const project = await createProjectViaApi(ctx, { name: projectWithTask });
+        await createTaskViaApi(ctx, { name: taskName, project_id: project.id });
+        await createProjectViaApi(ctx, { name: unrelatedProject });
+
+        await goToDashboard(page);
+        await page.waitForLoadState('networkidle');
+
+        await page.getByRole('button', { name: 'No Project' }).click();
+        await page.getByTestId('client_dropdown_search').fill(taskName);
+
+        // The project owning the task is shown (with the task), the unrelated project is not.
+        await expect(page.getByRole('option').filter({ hasText: projectWithTask })).toBeVisible();
+        await expect(page.getByText(taskName, { exact: true })).toBeVisible();
+        await expect(
+            page.getByRole('option').filter({ hasText: unrelatedProject })
+        ).not.toBeVisible();
+    });
+
+    test('test that archived projects are hidden from the dropdown', async ({ page, ctx }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const activeProject = `ActiveProj ${seed}`;
+        const archivedProject = `ArchivedProj ${seed}`;
+        await createProjectViaApi(ctx, { name: activeProject });
+        const toArchive = await createProjectViaApi(ctx, { name: archivedProject });
+        await archiveProjectViaApi(ctx, toArchive);
+
+        await goToDashboard(page);
+        await page.waitForLoadState('networkidle');
+
+        await page.getByRole('button', { name: 'No Project' }).click();
+
+        // Wait for the list to load, then confirm the archived project is filtered out.
+        await expect(page.getByRole('option').filter({ hasText: activeProject })).toBeVisible();
+        await expect(
+            page.getByRole('option').filter({ hasText: archivedProject })
+        ).not.toBeVisible();
+    });
+
+    test('test that done tasks are hidden when expanding a project', async ({ page, ctx }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const projectName = `DoneTaskProj ${seed}`;
+        const activeTask = `Active Task ${seed}`;
+        const doneTask = `Done Task ${seed}`;
+        const project = await createProjectViaApi(ctx, { name: projectName });
+        await createTaskViaApi(ctx, { name: activeTask, project_id: project.id });
+        const taskToFinish = await createTaskViaApi(ctx, {
+            name: doneTask,
+            project_id: project.id,
+        });
+        await markTaskDoneViaApi(ctx, taskToFinish);
+
+        await goToDashboard(page);
+        await page.waitForLoadState('networkidle');
+
+        await page.getByRole('button', { name: 'No Project' }).click();
+        const projectOption = page.getByRole('option').filter({ hasText: projectName });
+        await expect(projectOption).toBeVisible();
+        await projectOption.getByText(/Tasks/).click();
+
+        // Only the active task shows; the done task is filtered out.
+        await expect(page.getByText(activeTask, { exact: true })).toBeVisible();
+        await expect(page.getByText(doneTask, { exact: true })).not.toBeVisible();
+    });
+
+    test('test that keyboard navigation can expand a project and select a task', async ({
+        page,
+        ctx,
+    }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const projectName = `KbTaskProj ${seed}`;
+        const taskName = `KbTask ${seed}`;
+        const project = await createProjectViaApi(ctx, { name: projectName });
+        await createTaskViaApi(ctx, { name: taskName, project_id: project.id });
+
+        await goToDashboard(page);
+        await page.waitForLoadState('networkidle');
+
+        await page.getByRole('button', { name: 'No Project' }).click();
+        const search = page.getByTestId('client_dropdown_search');
+        await expect(search).toBeFocused();
+
+        // No Project is highlighted on open: down to the project, right to expand its tasks,
+        // down to the task, Enter to select it.
+        await search.press('ArrowDown');
+        await search.press('ArrowRight');
+        await search.press('ArrowDown');
+        await search.press('Enter');
+
+        // Scoped to the trigger button: the closing dropdown also contains the name while animating out.
+        await expect(
+            page.getByRole('button', { name: `${projectName} ${taskName}` })
+        ).toBeVisible();
+    });
+
+    test('test that pressing space selects the highlighted project', async ({ page, ctx }) => {
+        const seed = Math.floor(Math.random() * 100000);
+        const projectName = `SpaceProj ${seed}`;
+        await createProjectViaApi(ctx, { name: projectName });
+
+        await goToDashboard(page);
+        await page.waitForLoadState('networkidle');
+
+        await page.getByRole('button', { name: 'No Project' }).click();
+        const search = page.getByTestId('client_dropdown_search');
+        await expect(search).toBeFocused();
+
+        // Arrow down from "No Project" to the project, then the space shortcut selects it.
+        await search.press('ArrowDown');
+        await search.press('Space');
+
+        await expect(page.getByRole('button', { name: projectName })).toBeVisible();
+    });
+});
+
+test('test that simple mode hides the project, tag and billable controls', async ({ page }) => {
+    await goToDashboard(page);
+    await expect(page.getByTestId('time_entry_description')).toBeEditable();
+    // Project mode shows the project and billable controls
+    await expect(page.getByRole('button', { name: 'No Project' })).toBeVisible();
+    await expect(page.getByRole('button', { name: 'Non Billable' }).first()).toBeVisible();
+
+    // Switch to simple mode via the more options dropdown (client-side preference, no request)
+    await page.getByRole('button', { name: 'Time entry actions' }).click();
+    await page.getByRole('menuitem', { name: 'Switch to simple mode' }).click();
+
+    // Simple mode is the project tracker without the project/tag/billable selectors; the
+    // description input and clock-in/out stay.
+    await expect(page.getByTestId('time_entry_description')).toBeEditable();
+    await expect(page.getByRole('button', { name: 'No Project' })).toHaveCount(0);
+    await expect(page.getByRole('button', { name: 'Non Billable' })).toHaveCount(0);
+
+    // Clock in and out
+    await Promise.all([
+        newTimeEntryResponse(page, { type: 'work' }),
+        startOrStopTimerWithButton(page),
+    ]);
+    await assertThatTimerHasStarted(page);
+    await page.waitForTimeout(1500);
+    await Promise.all([
+        stoppedTimeEntryResponse(page, { type: 'work' }),
+        startOrStopTimerWithButton(page),
+    ]);
+    await assertThatTimerIsStopped(page);
+
+    // Switch back to project mode: the controls return
+    await page.getByRole('button', { name: 'Time entry actions' }).click();
+    await page.getByRole('menuitem', { name: 'Switch to project mode' }).click();
+    await expect(page.getByRole('button', { name: 'No Project' })).toBeVisible();
+});

e2e/utils/api.ts

@@ -373,6 +373,20 @@ export async function createTaskViaApi(
     return body.data as { id: string; name: string; project_id: string };
 }
 
+export async function markTaskDoneViaApi(ctx: TestContext, task: { id: string; name: string }) {
+    const response = await ctx.request.put(
+        `${PLAYWRIGHT_BASE_URL}/api/v1/organizations/${ctx.orgId}/tasks/${task.id}`,
+        {
+            data: {
+                name: task.name,
+                is_done: true,
+            },
+        }
+    );
+    expect(response.status()).toBe(200);
+    return (await response.json()).data;
+}
+
 export async function createTagViaApi(ctx: TestContext, data: { name: string }) {
     const response = await ctx.request.post(
         `${PLAYWRIGHT_BASE_URL}/api/v1/organizations/${ctx.orgId}/tags`,
@@ -392,6 +406,7 @@ export async function createTimeEntryViaApi(
         taskId?: string | null;
         tags?: string[];
         billable?: boolean;
+        type?: 'work' | 'break';
     }
 ) {
     const { start, end } = createTimestamps(data.duration);
@@ -407,6 +422,7 @@ export async function createTimeEntryViaApi(
                 task_id: data.taskId ?? null,
                 tags: data.tags ?? [],
                 billable: data.billable ?? false,
+                type: data.type ?? 'work',
             },
         }
     );
@@ -740,6 +756,7 @@ export async function getTimeEntriesViaApi(
         project_id: string | null;
         task_id: string | null;
         description: string;
+        type: 'work' | 'break';
     }>
 > {
     const params = new URLSearchParams();
@@ -765,6 +782,7 @@ export async function createTimeEntryWithTimestampsViaApi(
         taskId?: string | null;
         tags?: string[];
         billable?: boolean;
+        type?: 'work' | 'break';
     }
 ) {
     const response = await ctx.request.post(
@@ -779,12 +797,19 @@ export async function createTimeEntryWithTimestampsViaApi(
                 task_id: data.taskId ?? null,
                 tags: data.tags ?? [],
                 billable: data.billable ?? false,
+                type: data.type ?? 'work',
             },
         }
     );
     expect(response.status()).toBe(201);
     const body = await response.json();
-    return body.data as { id: string; start: string; end: string; description: string };
+    return body.data as {
+        id: string;
+        start: string;
+        end: string;
+        description: string;
+        type: 'work' | 'break';
+    };
 }
 
 // ──────────────────────────────────────────────────
@@ -889,3 +914,71 @@ export async function createReportViaApi(
         public_until: string | null;
     };
 }
+
+// ──────────────────────────────────────────────────
+// Invoices
+// ──────────────────────────────────────────────────
+
+export async function createInvoiceViaApi(
+    ctx: TestContext,
+    data: {
+        reference: string;
+        buyer_name?: string;
+        seller_name?: string;
+        currency?: string;
+        date?: string;
+        tax_rate?: number;
+    }
+) {
+    const response = await ctx.request.post(
+        `${PLAYWRIGHT_BASE_URL}/api/v1/organizations/${ctx.orgId}/invoices`,
+        {
+            data: {
+                seller_name: data.seller_name ?? 'Test Seller',
+                buyer_name: data.buyer_name ?? 'Test Buyer',
+                reference: data.reference,
+                currency: data.currency ?? 'EUR',
+                date: data.date ?? new Date().toISOString().split('T')[0],
+                // Mirror the UI create form, which always sends a tax rate (default 0).
+                // Invoices with a null tax_rate currently crash PDF rendering.
+                tax_rate: data.tax_rate ?? 0,
+            },
+        }
+    );
+    expect(response.status()).toBe(201);
+    const body = await response.json();
+    return body.data as { id: string; reference: string; buyer_name: string };
+}
+
+export async function updateInvoiceSettingsViaApi(ctx: TestContext, data: Record<string, unknown>) {
+    const response = await ctx.request.put(
+        `${PLAYWRIGHT_BASE_URL}/api/v1/organizations/${ctx.orgId}/invoice-settings`,
+        { data }
+    );
+    expect(response.status()).toBe(200);
+    const body = await response.json();
+    return body.data as Record<string, unknown>;
+}
+
+export async function getInvoiceSettingsViaApi(ctx: TestContext) {
+    const response = await ctx.request.get(
+        `${PLAYWRIGHT_BASE_URL}/api/v1/organizations/${ctx.orgId}/invoice-settings`
+    );
+    expect(response.status()).toBe(200);
+    const body = await response.json();
+    return body.data as Record<string, unknown>;
+}
+
+export async function getInvoicesViaApi(ctx: TestContext) {
+    const response = await ctx.request.get(
+        `${PLAYWRIGHT_BASE_URL}/api/v1/organizations/${ctx.orgId}/invoices`
+    );
+    expect(response.status()).toBe(200);
+    const body = await response.json();
+    return body.data as Array<{
+        id: string;
+        reference: string;
+        buyer_name: string;
+        paid_date: string | null;
+    }>;
+}

e2e/utils/currentTimeEntry.ts

@@ -20,7 +20,17 @@ export async function assertThatTimerHasStarted(page: Page) {
 
 export function newTimeEntryResponse(
     page: Page,
-    { description = '', status = 201, tags = [] } = {}
+    {
+        description = '',
+        status = 201,
+        tags = [],
+        type,
+    }: {
+        description?: string;
+        status?: number;
+        tags?: string[];
+        type?: 'work' | 'break';
+    } = {}
 ) {
     return page.waitForResponse(async (response) => {
         return (
@@ -34,6 +44,7 @@ export function newTimeEntryResponse(
             (await response.json()).data.description === description &&
             (await response.json()).data.task_id === null &&
             (await response.json()).data.user_id !== null &&
+            (type === undefined || (await response.json()).data.type === type) &&
             JSON.stringify((await response.json()).data.tags) === JSON.stringify(tags)
         );
     });
@@ -48,7 +59,18 @@ export async function assertThatTimerIsStopped(page: Page) {
     ).toHaveClass(/bg-accent-300\/70/);
 }
 
-export async function stoppedTimeEntryResponse(page: Page, { description = '', tags = [] } = {}) {
+export async function stoppedTimeEntryResponse(
+    page: Page,
+    {
+        description = '',
+        tags = [],
+        type,
+    }: {
+        description?: string;
+        tags?: string[];
+        type?: 'work' | 'break';
+    } = {}
+) {
     return page.waitForResponse(async (response) => {
         return (
             response.status() === 200 &&
@@ -62,6 +84,7 @@ export async function stoppedTimeEntryResponse(page: Page, { description = '', t
             (await response.json()).data.task_id === null &&
             (await response.json()).data.duration !== null &&
             (await response.json()).data.user_id !== null &&
+            (type === undefined || (await response.json()).data.type === type) &&
             JSON.stringify((await response.json()).data.tags) === JSON.stringify(tags)
         );
     });

extensions/manifest.json

@@ -0,0 +1,14 @@
+{
+    "Billing": {
+        "repository": "solidtime-io/extension-billing",
+        "ref": "v0.0.1"
+    },
+    "Services": {
+        "repository": "solidtime-io/extension-services",
+        "ref": "v0.0.1"
+    },
+    "Invoicing": {
+        "repository": "solidtime-io/extension-invoicing",
+        "ref": "v0.0.1"
+    }
+}

lang/en/importer.php

@@ -5,7 +5,8 @@ declare(strict_types=1);
 return [
     'clockify_time_entries' => [
         'name' => 'Clockify Time Entries',
-        'description' => '1. First make sure that you set the Date format to "MM/DD/YYYY" and the Time format to "12-hour" in the user settings.<br>'.
+        'description' => '<strong>Important:</strong> If you also want to import your projects use the "Clockify Projects" importer before this one, since that export contains more details such as billable status, billable rates and estimated time.<br><br>'.
+            '1. First make sure that you set the Date format to "MM/DD/YYYY" and the Time format to "12-hour" in the user settings.<br>'.
             '2. In the same preferences page change the language of Clockfiy to English.<br>'.
             '3. Go to REPORTS -> TIME -> Detailed in the navigation on the left. <br>'.
             '4. Now select the date range that you want to export in the right top. '.
@@ -61,7 +62,8 @@ return [
     ],
     'harvest_time_entries' => [
         'name' => 'Harvest Time Entries',
-        'description' => '1. Go to Settings (right top corner)<br>2. Click on "Import/Export" in the left navigation'.
+        'description' => '<strong>Important:</strong> If you also want to import your projects use the "Harvest Projects" importer before this one, since that export contains more details such as billable status and estimated time.<br><br>'.
+            '1. Go to Settings (right top corner)<br>2. Click on "Import/Export" in the left navigation'.
             '<br>3. Now click on "Export all time" '.
             '<br><br>Before you import make sure that the Timezone settings in Harvest are the same as in solidtime.',
     ],

package-lock.json

@@ -20,6 +20,7 @@
                 "@tanstack/vue-query": "^5.100.10",
                 "@tanstack/vue-query-devtools": "^5.91.0",
                 "@tanstack/vue-table": "^8.21.3",
+                "@tanstack/vue-virtual": "^3.13.24",
                 "@vue/eslint-config-prettier": "^10.2.0",
                 "@vue/eslint-config-typescript": "^14.7.0",
                 "@vueuse/core": "^14.3.0",
@@ -5464,17 +5465,6 @@
                 "yallist": "^3.0.2"
             }
         },
-        "node_modules/lucide-vue-next": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/lucide-vue-next/-/lucide-vue-next-1.0.0.tgz",
-            "integrity": "sha512-V6SPvx1IHTj/UY+FrIYWV5faISsPSb8BnWSFDxAtezWKvWc9ZZ40PDrdu1/Qb5vg4lHWr1hs1BAMGVGm6V1Xdg==",
-            "deprecated": "Package deprecated. Please use @lucide/vue instead.",
-            "license": "ISC",
-            "peer": true,
-            "peerDependencies": {
-                "vue": ">=3.0.1"
-            }
-        },
         "node_modules/magic-string": {
             "version": "0.30.21",
             "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
@@ -8406,10 +8396,10 @@
         },
         "resources/js/packages/api": {
             "name": "@solidtime/api",
-            "version": "0.0.6",
+            "version": "0.0.7",
             "license": "AGPL-3.0",
             "devDependencies": {
-                "vite-plugin-dts": "^4.0.3"
+                "vite-plugin-dts": "^4.5.4"
             },
             "peerDependencies": {
                 "@zodios/core": "^10.9.6",
@@ -8421,18 +8411,20 @@
         },
         "resources/js/packages/ui": {
             "name": "@solidtime/ui",
-            "version": "0.0.21",
+            "version": "0.0.22",
             "license": "AGPL-3.0",
             "devDependencies": {
-                "@types/chroma-js": "^3.1.0",
+                "@types/chroma-js": "^3.1.2",
                 "@zodios/core": "^10.9.6",
-                "vite-plugin-dts": "^4.0.3",
+                "vite-plugin-dts": "^4.5.4",
-                "zod": "^3.23.8"
+                "zod": "^3.25.76"
             },
             "peerDependencies": {
                 "@floating-ui/vue": "^1.1.4",
                 "@heroicons/vue": "^2.1.5",
                 "@internationalized/date": "^3.0.0",
+                "@lucide/vue": ">=1.0.0",
+                "@tanstack/vue-virtual": "^3.13.24",
                 "@vitejs/plugin-vue": "^5.1.2 || ^6.0.0",
                 "@vueuse/core": "^12.5.0 || ^14.0.0",
                 "@vueuse/integrations": "^12.5.0 || ^14.0.0",
@@ -8441,7 +8433,6 @@
                 "clsx": "^2.1.1",
                 "dayjs": "^1.11.13",
                 "focus-trap": "^7.0.0 || ^8.0.0",
-                "lucide-vue-next": ">=0.453.0",
                 "parse-duration": "^2.0.1",
                 "radix-vue": "^1.9.0",
                 "reka-ui": "^2.2.0",

package.json

@@ -64,6 +64,7 @@
         "@tanstack/vue-query": "^5.100.10",
         "@tanstack/vue-query-devtools": "^5.91.0",
         "@tanstack/vue-table": "^8.21.3",
+        "@tanstack/vue-virtual": "^3.13.24",
         "@vue/eslint-config-prettier": "^10.2.0",
         "@vue/eslint-config-typescript": "^14.7.0",
         "@vueuse/core": "^14.3.0",

resources/js/Components/Common/Client/ClientTable.vue

@@ -2,11 +2,12 @@
 import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
 import { UserCircleIcon } from '@heroicons/vue/24/solid';
 import { PlusIcon } from '@heroicons/vue/16/solid';
-import { type Component, computed, ref } from 'vue';
+import { type Component, computed, ref, watch } from 'vue';
 import { type Client } from '@/packages/api/src';
 import ClientTableRow from '@/Components/Common/Client/ClientTableRow.vue';
 import ClientCreateModal from '@/Components/Common/Client/ClientCreateModal.vue';
 import ClientTableHeading from '@/Components/Common/Client/ClientTableHeading.vue';
+import Pagination from '@/Components/Common/Pagination.vue';
 import { canCreateClients } from '@/utils/permissions';
 import { useProjectsQuery } from '@/utils/useProjectsQuery';
 import {
@@ -43,11 +44,14 @@ const projectCountMap = computed(() => {
     return map;
 });
 
+// Name is always the secondary sort so rows with equal values render
+// alphabetically instead of in API (created_at) order.
 const sorting = computed<SortingState>(() => [
     {
         id: props.sortColumn,
         desc: props.sortDirection === 'desc',
     },
+    ...(props.sortColumn !== 'name' ? [{ id: 'name', desc: false }] : []),
 ]);
 
 const columns = computed(() => [
@@ -100,6 +104,19 @@ const table = useVueTable({
 const sortedClients = computed(() => {
     return table.getRowModel().rows.map((row) => row.original);
 });
+
+// Client-side pagination: the full list is in memory, only one page is mounted at a time.
+const PAGE_SIZE = 15;
+const currentPage = ref(1);
+
+watch([() => props.sortColumn, () => props.sortDirection, () => props.clients], () => {
+    currentPage.value = 1;
+});
+
+const paginatedClients = computed(() => {
+    const start = (currentPage.value - 1) * PAGE_SIZE;
+    return sortedClients.value.slice(start, start + PAGE_SIZE);
+});
 </script>
 
 <template>
@@ -126,10 +143,14 @@ const sortedClients = computed(() => {
                         >Create your First Client
                     </SecondaryButton>
                 </div>
-                <template v-for="client in sortedClients" :key="client.id">
+                <template v-for="client in paginatedClients" :key="client.id">
                     <ClientTableRow :client="client"></ClientTableRow>
                 </template>
             </div>
         </div>
     </div>
+    <Pagination
+        v-model:page="currentPage"
+        :total="sortedClients.length"
+        :items-per-page="PAGE_SIZE"></Pagination>
 </template>

resources/js/Components/Common/Member/MemberCombobox.vue

@@ -89,11 +89,17 @@ function selectMember(member: Member) {
             </Button>
         </template>
         <template #content>
+            <!-- kept open so the list stays visible during the popover close animation -->
             <ComboboxRoot
                 v-model:search-term="searchValue"
-                v-model:open="open"
+                :open="true"
                 class="relative"
-                :filter-function="(val: string[]) => val">
+                :filter-function="(val: string[]) => val"
+                @update:open="
+                    (value: boolean) => {
+                        if (!value) open = false;
+                    }
+                ">
                 <ComboboxAnchor>
                     <ComboboxInput
                         ref="searchInput"

resources/js/Components/Common/Pagination.vue

@@ -0,0 +1,104 @@
+<script setup lang="ts">
+import {
+    PaginationEllipsis,
+    PaginationFirst,
+    PaginationLast,
+    PaginationList,
+    PaginationListItem,
+    PaginationNext,
+    PaginationPrev,
+    PaginationRoot,
+} from 'radix-vue';
+import {
+    ChevronDoubleLeftIcon,
+    ChevronDoubleRightIcon,
+    ChevronLeftIcon,
+    ChevronRightIcon,
+    EllipsisHorizontalIcon,
+} from '@heroicons/vue/20/solid';
+import { buttonVariants } from '@/packages/ui/src';
+import { cn } from '@/lib/utils';
+import { computed, watch } from 'vue';
+
+const page = defineModel<number>('page', { default: 1 });
+
+const props = withDefaults(
+    defineProps<{
+        total: number;
+        itemsPerPage?: number;
+        siblingCount?: number;
+        showEdges?: boolean;
+    }>(),
+    {
+        itemsPerPage: 15,
+        siblingCount: 1,
+        showEdges: true,
+    }
+);
+
+const pageCount = computed(() => Math.max(1, Math.ceil(props.total / props.itemsPerPage)));
+
+watch(page, (value) => {
+    if (value > pageCount.value) {
+        page.value = pageCount.value;
+    }
+});
+
+watch(pageCount, (value) => {
+    if (page.value > value) {
+        page.value = value;
+    }
+});
+
+// The shared buttonVariants ghost/outline hover is `bg-white/5`, which is invisible in light
+// mode. Override it with a theme-aware hover that shows in both light and dark mode.
+const hoverClass = 'hover:bg-black/5 dark:hover:bg-white/5';
+const navButtonClass = cn(buttonVariants({ variant: 'ghost', size: 'icon' }), hoverClass);
+
+function pageButtonClass(isActive: boolean): string {
+    return cn(
+        buttonVariants({ variant: isActive ? 'outline' : 'ghost', size: 'icon' }),
+        hoverClass
+    );
+}
+</script>
+
+<template>
+    <PaginationRoot
+        v-if="pageCount > 1"
+        v-model:page="page"
+        :total="props.total"
+        :items-per-page="props.itemsPerPage"
+        :sibling-count="props.siblingCount"
+        :show-edges="props.showEdges"
+        class="mx-auto flex w-full justify-center py-8">
+        <PaginationList v-slot="{ items }" class="flex items-center gap-1">
+            <PaginationFirst :class="navButtonClass">
+                <ChevronDoubleLeftIcon class="size-4" />
+            </PaginationFirst>
+            <PaginationPrev :class="navButtonClass">
+                <ChevronLeftIcon class="size-4" />
+            </PaginationPrev>
+            <template v-for="(item, index) in items" :key="index">
+                <PaginationListItem
+                    v-if="item.type === 'page'"
+                    :value="item.value"
+                    :class="pageButtonClass(item.value === page)">
+                    {{ item.value }}
+                </PaginationListItem>
+                <PaginationEllipsis
+                    v-else
+                    :index="index"
+                    class="flex size-9 items-center justify-center text-text-tertiary">
+                    <EllipsisHorizontalIcon class="size-4" />
+                </PaginationEllipsis>
+            </template>
+            <PaginationNext :class="navButtonClass">
+                <ChevronRightIcon class="size-4" />
+            </PaginationNext>
+            <PaginationLast :class="navButtonClass">
+                <ChevronDoubleRightIcon class="size-4" />
+            </PaginationLast>
+        </PaginationList>
+    </PaginationRoot>
+</template>

resources/js/Components/Common/Project/ProjectDropdown.vue

@@ -9,10 +9,10 @@ import {
     ComboboxItem,
     ComboboxRoot,
     ComboboxViewport,
-} from 'radix-vue';
+    ComboboxVirtualizer,
+} from 'reka-ui';
 import { Check, Plus } from '@lucide/vue';
 import type { CreateClientBody, CreateProjectBody, Project } from '@/packages/api/src';
-import { UseFocusTrap } from '@vueuse/integrations/useFocusTrap/component';
 import ProjectCreateModal from '@/packages/ui/src/Project/ProjectCreateModal.vue';
 import { useProjectsStore } from '@/utils/useProjects';
 import { useClientsStore } from '@/utils/useClients';
@@ -37,7 +37,16 @@ const emit = defineEmits(['update:modelValue', 'changed']);
 
 const activeClients = computed(() => clients.value.filter((c) => !c.is_archived));
 
-const sortedProjects = ref<Project[]>([]);
+// Pinned on open so rows don't re-sort while interacting; the project list itself stays reactive.
+const pinnedProjectId = ref<string | null>(null);
+
+const sortedProjects = computed(() => {
+    return [...projects.value].sort((a, b) => {
+        const aPinned = pinnedProjectId.value === a.id ? 0 : 1;
+        const bPinned = pinnedProjectId.value === b.id ? 0 : 1;
+        return aPinned - bPinned;
+    });
+});
 
 const shownProjects = computed(() => {
     return sortedProjects.value.filter((project) => {
@@ -65,9 +74,7 @@ watch(open, (isOpen) => {
             searchInput.value?.$el?.focus();
         });
 
-        sortedProjects.value = [...projects.value].sort((iteratingProject) => {
+        pinnedProjectId.value = model.value;
-            return model.value === iteratingProject.id ? -1 : 1;
-        });
     }
 });
 
@@ -103,40 +110,51 @@ function updateValue(project: Project) {
         </template>
 
         <template #content>
-            <UseFocusTrap v-if="open" :options="{ immediate: true, allowOutsideClick: true }">
+            <!-- kept open so the list stays visible during the popover close animation -->
+            <div>
                 <ComboboxRoot
-                    v-model:search-term="searchValue"
+                    :open="true"
-                    v-model:open="open"
                     :model-value="currentProject"
                     class="relative"
-                    @update:model-value="updateValue">
+                    :ignore-filter="true"
+                    @update:model-value="updateValue"
+                    @update:open="
+                        (value: boolean) => {
+                            if (!value) open = false;
+                        }
+                    ">
                     <ComboboxAnchor>
                         <ComboboxInput
                             ref="searchInput"
+                            v-model="searchValue"
                             class="bg-transparent border-0 placeholder-muted-foreground text-sm text-popover-foreground py-2 px-3 focus:ring-0 border-b border-popover-border focus:border-popover-border w-full"
                             placeholder="Search for a project..." />
                     </ComboboxAnchor>
                     <ComboboxContent>
                         <ComboboxViewport
                             class="w-[--reka-popper-anchor-width] max-h-60 overflow-y-scroll p-1">
-                            <ComboboxItem
+                            <ComboboxVirtualizer
-                                v-for="project in shownProjects"
+                                v-slot="{ option: project }"
-                                :key="project.id"
+                                :options="shownProjects"
-                                :value="project"
+                                :estimate-size="32"
-                                class="relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground"
+                                :text-content="(p: Project) => p.name">
-                                :data-project-id="project.id">
+                                <ComboboxItem
-                                <span class="flex items-center gap-2">
+                                    :value="project"
+                                    class="relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground"
+                                    :data-project-id="project.id">
+                                    <span class="flex min-w-0 flex-1 items-center gap-2">
+                                        <span
+                                            :style="{ backgroundColor: project.color }"
+                                            class="w-3 h-3 rounded-full shrink-0"></span>
+                                        <span class="truncate">{{ project.name }}</span>
+                                    </span>
                                     <span
-                                        :style="{ backgroundColor: project.color }"
+                                        v-if="isProjectSelected(project)"
-                                        class="w-3 h-3 rounded-full shrink-0"></span>
+                                        class="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
-                                    <span>{{ project.name }}</span>
+                                        <Check class="h-4 w-4" />
-                                </span>
+                                    </span>
-                                <span
+                                </ComboboxItem>
-                                    v-if="isProjectSelected(project)"
+                            </ComboboxVirtualizer>
-                                    class="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
-                                    <Check class="h-4 w-4" />
-                                </span>
-                            </ComboboxItem>
                         </ComboboxViewport>
                         <div
                             v-if="canCreateProjects()"
@@ -150,7 +168,7 @@ function updateValue(project: Project) {
                         </div>
                     </ComboboxContent>
                 </ComboboxRoot>
-            </UseFocusTrap>
+            </div>
         </template>
     </Dropdown>
     <ProjectCreateModal

resources/js/Components/Common/Project/ProjectTable.vue

@@ -2,10 +2,11 @@
 import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
 import { FolderPlusIcon } from '@heroicons/vue/24/solid';
 import { PlusIcon } from '@heroicons/vue/16/solid';
-import { computed, ref } from 'vue';
+import { computed, ref, watch } from 'vue';
 import ProjectCreateModal from '@/packages/ui/src/Project/ProjectCreateModal.vue';
 import ProjectTableHeading from '@/Components/Common/Project/ProjectTableHeading.vue';
 import ProjectTableRow from '@/Components/Common/Project/ProjectTableRow.vue';
+import Pagination from '@/Components/Common/Pagination.vue';
 
 export type SortColumn =
     | 'name'
@@ -56,12 +57,15 @@ const clientNameMap = computed(() => {
     return map;
 });
 
-// Convert sort props to TanStack Table format
+// Convert sort props to TanStack Table format.
+// Name is always the secondary sort so rows with equal values render
+// alphabetically instead of in API (created_at) order.
 const sorting = computed<SortingState>(() => [
     {
         id: props.sortColumn,
         desc: props.sortDirection === 'desc',
     },
+    ...(props.sortColumn !== 'name' ? [{ id: 'name', desc: false }] : []),
 ]);
 
 // Define column accessors for sorting.
@@ -143,6 +147,19 @@ const sortedProjects = computed(() => {
     return table.getRowModel().rows.map((row) => row.original);
 });
 
+// Client-side pagination: the full list is in memory, only one page is mounted at a time.
+const PAGE_SIZE = 15;
+const currentPage = ref(1);
+
+watch([() => props.sortColumn, () => props.sortDirection, () => props.projects], () => {
+    currentPage.value = 1;
+});
+
+const paginatedProjects = computed(() => {
+    const start = (currentPage.value - 1) * PAGE_SIZE;
+    return sortedProjects.value.slice(start, start + PAGE_SIZE);
+});
+
 const showCreateProjectModal = ref(false);
 
 async function createProject(project: CreateProjectBody): Promise<Project | undefined> {
@@ -199,7 +216,7 @@ const gridTemplate = computed(() => {
                         >Create your First Project
                     </SecondaryButton>
                 </div>
-                <template v-for="project in sortedProjects" :key="project.id">
+                <template v-for="project in paginatedProjects" :key="project.id">
                     <ProjectTableRow
                         :show-billable-rate="props.showBillableRate"
                         :project="project"></ProjectTableRow>
@@ -207,4 +224,8 @@ const gridTemplate = computed(() => {
             </div>
         </div>
     </div>
+    <Pagination
+        v-model:page="currentPage"
+        :total="sortedProjects.length"
+        :items-per-page="PAGE_SIZE"></Pagination>
 </template>

resources/js/Components/Common/Reporting/ReportingFilterBar.vue

@@ -1,6 +1,9 @@
 <script setup lang="ts">
+import { useBreaksEnabled } from '@/packages/ui/src/utils/useBreaksEnabled';
 import { CheckCircleIcon, TagIcon, UserGroupIcon } from '@heroicons/vue/20/solid';
 import { FolderIcon } from '@heroicons/vue/16/solid';
+import { Check, Coffee } from '@lucide/vue';
+import { RadioGroupIndicator, RadioGroupItem, RadioGroupRoot, type AcceptableValue } from 'reka-ui';
 import BillableIcon from '@/packages/ui/src/Icons/BillableIcon.vue';
 import ReportingRoundingControls from '@/Components/Common/Reporting/ReportingRoundingControls.vue';
 import TaskMultiselectDropdown from '@/Components/Common/Task/TaskMultiselectDropdown.vue';
@@ -14,6 +17,7 @@ import DateRangePicker from '@/packages/ui/src/Input/DateRangePicker.vue';
 import TagDropdown from '@/packages/ui/src/Tag/TagDropdown.vue';
 import { useTagsQuery } from '@/utils/useTagsQuery';
 import { useTagsStore } from '@/utils/useTags';
+import type { TagMatchType } from '@/types/reporting';
 
 type TimeEntryRoundingType = 'up' | 'down' | 'nearest';
 
@@ -22,7 +26,9 @@ const selectedProjects = defineModel<string[]>('selectedProjects', { required: t
 const selectedTasks = defineModel<string[]>('selectedTasks', { required: true });
 const selectedClients = defineModel<string[]>('selectedClients', { required: true });
 const selectedTags = defineModel<string[]>('selectedTags', { required: true });
+const tagMatchType = defineModel<TagMatchType>('tagMatchType', { required: true });
 const billable = defineModel<'true' | 'false' | null>('billable', { required: true });
+const entryType = defineModel<'work' | 'break' | null>('entryType', { required: true });
 const roundingEnabled = defineModel<boolean>('roundingEnabled', { required: true });
 const roundingType = defineModel<TimeEntryRoundingType>('roundingType', { required: true });
 const roundingMinutes = defineModel<number>('roundingMinutes', { required: true });
@@ -33,8 +39,20 @@ const emit = defineEmits<{
     submit: [];
 }>();
 
+const breaksEnabled = useBreaksEnabled();
+
 const { tags } = useTagsQuery();
 
+const tagMatchOptions: { value: TagMatchType; label: string }[] = [
+    { value: 'contains', label: 'Contains' },
+    { value: 'not_contains', label: 'Does Not Contain' },
+];
+
+function selectTagMatchType(value: AcceptableValue) {
+    tagMatchType.value = value as TagMatchType;
+    emit('submit');
+}
+
 async function createTag(name: string) {
     return await useTagsStore().createTag(name);
 }
@@ -93,6 +111,34 @@ async function createTag(name: string) {
                             title="Tags"
                             :icon="TagIcon" />
                     </template>
+                    <template #content-before-list>
+                        <div class="mt-2 border-b border-card-background-separator pb-2">
+                            <div
+                                id="tag-match-type-label"
+                                class="mb-1.5 px-2 text-xs font-medium text-text-tertiary uppercase">
+                                Match
+                            </div>
+                            <RadioGroupRoot
+                                :model-value="tagMatchType"
+                                aria-labelledby="tag-match-type-label"
+                                class="space-y-1"
+                                @update:model-value="selectTagMatchType">
+                                <RadioGroupItem
+                                    v-for="option in tagMatchOptions"
+                                    :key="option.value"
+                                    :value="option.value"
+                                    class="relative flex w-full items-center rounded-md py-1.5 pl-2 pr-8 text-left text-sm font-medium text-text-secondary hover:bg-card-background-active data-[state=checked]:text-text-primary">
+                                    {{ option.label }}
+                                    <span
+                                        class="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
+                                        <RadioGroupIndicator>
+                                            <Check class="h-4 w-4" />
+                                        </RadioGroupIndicator>
+                                    </span>
+                                </RadioGroupItem>
+                            </RadioGroupRoot>
+                        </div>
+                    </template>
                 </TagDropdown>
 
                 <Select v-model="billable" @update:model-value="emit('submit')">
@@ -120,6 +166,38 @@ async function createTag(name: string) {
                         <SelectItem value="false">Non Billable</SelectItem>
                     </SelectContent>
                 </Select>
+                <Select
+                    v-if="breaksEnabled"
+                    v-model="entryType"
+                    @update:model-value="emit('submit')">
+                    <SelectTrigger
+                        size="sm"
+                        variant="outline"
+                        :active="entryType !== null"
+                        :show-chevron="false">
+                        <SelectValue class="flex items-center gap-2">
+                            <Coffee
+                                class="h-4 w-4"
+                                :class="
+                                    entryType !== null
+                                        ? 'dark:text-accent-300/80 text-accent-400/80'
+                                        : 'text-text-quaternary'
+                                " />
+                            <span class="text-text-secondary">{{
+                                entryType === null
+                                    ? 'Type'
+                                    : entryType === 'break'
+                                      ? 'Breaks'
+                                      : 'Work time'
+                            }}</span>
+                        </SelectValue>
+                    </SelectTrigger>
+                    <SelectContent>
+                        <SelectItem :value="null">Both</SelectItem>
+                        <SelectItem value="work">Work time</SelectItem>
+                        <SelectItem value="break">Breaks</SelectItem>
+                    </SelectContent>
+                </Select>
                 <ReportingRoundingControls
                     v-model:enabled="roundingEnabled"
                     v-model:type="roundingType"

resources/js/Components/Common/Reporting/ReportingOverview.vue

@@ -49,6 +49,7 @@ import type { ExportFormat } from '@/types/reporting';
 import { getRandomColorWithSeed } from '@/packages/ui/src/utils/color';
 import { useProjectsQuery } from '@/utils/useProjectsQuery';
 import { useAggregatedTimeEntriesQuery } from '@/utils/useAggregatedTimeEntriesQuery';
+import type { TagMatchType } from '@/types/reporting';
 
 type TimeEntryRoundingType = 'up' | 'down' | 'nearest';
 
@@ -67,8 +68,10 @@ const selectedProjects = ref<string[]>([]);
 const selectedMembers = ref<string[]>([]);
 const selectedTasks = ref<string[]>([]);
 const selectedClients = ref<string[]>([]);
+const tagMatchType = ref<TagMatchType>('contains');
 
 const billable = ref<'true' | 'false' | null>(null);
+const entryType = ref<'work' | 'break' | null>('work');
 const roundingEnabled = ref<boolean>(false);
 const roundingType = ref<TimeEntryRoundingType>('nearest');
 const roundingMinutes = ref<number>(15);
@@ -122,7 +125,9 @@ const filterParams = computed<AggregatedTimeEntriesQueryParams>(() => {
         task_ids: selectedTasks.value.length > 0 ? selectedTasks.value : undefined,
         client_ids: selectedClients.value.length > 0 ? selectedClients.value : undefined,
         tag_ids: selectedTags.value.length > 0 ? selectedTags.value : undefined,
+        tag_match_type: selectedTags.value.length > 0 ? tagMatchType.value : undefined,
         billable: billable.value !== null ? billable.value : undefined,
+        type: entryType.value !== null ? entryType.value : undefined,
         member_id: getCurrentRole() === 'employee' ? getCurrentMembershipId() : undefined,
         rounding_type: roundingEnabled.value ? roundingType.value : undefined,
         rounding_minutes: roundingEnabled.value ? roundingMinutes.value : undefined,
@@ -157,7 +162,7 @@ const aggregatedTableTimeEntries = computed<AggregatedTimeEntries | undefined>((
 });
 
 const reportProperties = computed(() => {
-    const { billable: billableFilter, ...rest } = filterParams.value;
+    const { billable: billableFilter, type: typeFilter, ...rest } = filterParams.value;
 
     let billableValue: boolean | null = null;
     if (billableFilter === 'true') {
@@ -169,6 +174,7 @@ const reportProperties = computed(() => {
     return {
         ...rest,
         billable: billableValue,
+        time_entry_type: typeFilter ?? null,
         group: group.value,
         sub_group: subGroup.value,
         history_group: getOptimalGroupingOption(startDate.value, endDate.value),
@@ -366,7 +372,9 @@ const tableData = computed(() => {
         v-model:selected-tasks="selectedTasks"
         v-model:selected-clients="selectedClients"
         v-model:selected-tags="selectedTags"
+        v-model:tag-match-type="tagMatchType"
         v-model:billable="billable"
+        v-model:entry-type="entryType"
         v-model:rounding-enabled="roundingEnabled"
         v-model:rounding-type="roundingType"
         v-model:rounding-minutes="roundingMinutes"

resources/js/Components/Dashboard/RecentlyTrackedTasksCard.vue

@@ -28,6 +28,7 @@ const {
             },
             queries: {
                 member_id: getCurrentMembershipId(),
+                type: 'work',
             },
         });
     },

resources/js/Components/Dashboard/ThisWeekReportingTable.vue

@@ -62,6 +62,8 @@ const queryParams = computed<AggregatedTimeEntriesQueryParams>(() => {
         group: group.value,
         sub_group: subGroup.value,
         member_id: getCurrentRole() === 'employee' ? getCurrentMembershipId() : undefined,
+        // Breaks are excluded from all dashboard stats (see DashboardService workTime())
+        type: 'work',
     };
 });
 

resources/js/Components/TimeTracker.vue

@@ -4,13 +4,13 @@ import CardTitle from '@/packages/ui/src/CardTitle.vue';
 import { usePage } from '@inertiajs/vue3';
 import { type User } from '@/types/models';
 import { computed, onMounted, watch } from 'vue';
-import dayjs from 'dayjs';
+import { getDayJsInstance } from '@/packages/ui/src/utils/time';
-import utc from 'dayjs/plugin/utc';
+import { useBreaksEnabled } from '@/packages/ui/src/utils/useBreaksEnabled';
-import duration from 'dayjs/plugin/duration';
 
-import { useCurrentTimeEntryStore } from '@/utils/useCurrentTimeEntry';
+import { getLastWorkTimeEntry, useCurrentTimeEntryStore } from '@/utils/useCurrentTimeEntry';
 import { storeToRefs } from 'pinia';
 import { getCurrentOrganizationId } from '@/utils/useUser';
+import { useLocalStorage } from '@vueuse/core';
 import { useOrganizationQuery } from '@/utils/useOrganizationQuery';
 import { switchOrganization } from '@/utils/useOrganization';
 import { useProjectsQuery } from '@/utils/useProjectsQuery';
@@ -20,6 +20,7 @@ import { useClientsQuery } from '@/utils/useClientsQuery';
 import { useTagsStore } from '@/utils/useTags';
 import { useProjectsStore } from '@/utils/useProjects';
 import TimeTrackerControls from '@/packages/ui/src/TimeTracker/TimeTrackerControls.vue';
+import type { TimeTrackerMode } from '@/packages/ui/src/TimeTracker/types';
 import type {
     CreateClientBody,
     CreateProjectBody,
@@ -44,15 +45,15 @@ const page = usePage<{
         user: User;
     };
 }>();
-dayjs.extend(duration);
+const dayjs = getDayJsInstance();
-
-dayjs.extend(utc);
 
 const { organization } = useOrganizationQuery(getCurrentOrganizationId()!);
+const breaksEnabled = useBreaksEnabled(organization);
 
 const currentTimeEntryStore = useCurrentTimeEntryStore();
-const { currentTimeEntry, isActive, now } = storeToRefs(currentTimeEntryStore);
+const { currentTimeEntry, isActive, isOnBreak, now } = storeToRefs(currentTimeEntryStore);
-const { startLiveTimer, stopLiveTimer, setActiveState } = currentTimeEntryStore;
+const { startLiveTimer, stopLiveTimer, setActiveState, startBreak, resumeWorkAfterBreak } =
+    currentTimeEntryStore;
 
 const { projects } = useProjectsQuery();
 const { tasks } = useTasksQuery();
@@ -67,6 +68,8 @@ const showManualTimeEntryModal = ref(false);
 const { createTimeEntry: createTimeEntryMutation, deleteTimeEntry } = useTimeEntriesMutations();
 const { data: timeEntriesData } = useTimeEntriesInfiniteQuery();
 const timeEntries = computed(() => timeEntriesData.value?.pages.flatMap((page) => page.data) || []);
+const lastWorkTimeEntry = computed(() => getLastWorkTimeEntry(timeEntries.value));
+const canResumeAfterBreak = computed(() => lastWorkTimeEntry.value !== null);
 
 watch(isActive, () => {
     if (isActive.value) {
@@ -123,6 +126,14 @@ async function createTimeEntry(timeEntry: Omit<CreateTimeEntryBody, 'member_id'>
     showManualTimeEntryModal.value = false;
 }
 
+async function resumePreviousWorkAfterBreak() {
+    const timeEntry = lastWorkTimeEntry.value;
+    if (!timeEntry) {
+        return;
+    }
+    await resumeWorkAfterBreak(timeEntry);
+}
+
 async function createTimeEntryFromCurrentEntry() {
     const { start, end, description, project_id, task_id, billable, tags } = currentTimeEntry.value;
     await createTimeEntry({ start, end, description, project_id, task_id, billable, tags });
@@ -142,6 +153,16 @@ async function discardCurrentTimeEntry() {
     }
 }
 
+// Time tracker UI mode is a per-device UI preference, stored client-side and keyed by organization
+const timeTrackerMode = useLocalStorage<TimeTrackerMode>(
+    `solidtime/time-tracker-mode/${getCurrentOrganizationId()}`,
+    'project'
+);
+
+function toggleTimeTrackerMode() {
+    timeTrackerMode.value = timeTrackerMode.value === 'simple' ? 'project' : 'simple';
+}
+
 const { tags } = useTagsQuery();
 </script>
 
@@ -186,17 +207,29 @@ const { tags } = useTagsQuery();
                         :time-entries
                         :create-tag
                         :is-active
+                        :is-on-break="isOnBreak"
+                        :breaks-enabled="breaksEnabled"
+                        :can-resume-after-break="canResumeAfterBreak"
+                        :resume-description="lastWorkTimeEntry?.description ?? null"
+                        :time-tracker-mode="timeTrackerMode"
                         :currency="getOrganizationCurrencyString()"
                         @start-live-timer="startLiveTimer"
                         @stop-live-timer="stopLiveTimer"
                         @start-timer="setActiveState(true)"
                         @stop-timer="setActiveState(false)"
+                        @start-break="startBreak"
+                        @resume-after-break="resumePreviousWorkAfterBreak"
                         @update-time-entry="updateTimeEntry"
                         @create-time-entry="createTimeEntryFromCurrentEntry"></TimeTrackerControls>
                 </div>
                 <TimeTrackerMoreOptionsDropdown
                     :has-active-timer="isActive"
+                    :time-tracker-mode="timeTrackerMode"
+                    :is-on-break="isOnBreak"
+                    :breaks-enabled="breaksEnabled"
                     @manual-entry="showManualTimeEntryModal = true"
+                    @start-break="startBreak"
+                    @toggle-time-tracker-mode="toggleTimeTrackerMode"
                     @discard="discardCurrentTimeEntry"></TimeTrackerMoreOptionsDropdown>
             </div>
         </div>

resources/js/Components/Timesheet/BreakPlacementModal.vue

@@ -0,0 +1,249 @@
+<script setup lang="ts">
+import DialogModal from '@/packages/ui/src/DialogModal.vue';
+import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
+import PrimaryButton from '@/packages/ui/src/Buttons/PrimaryButton.vue';
+import TimeRangeFields from '@/packages/ui/src/TimeEntry/TimeRangeFields.vue';
+import { formatTime, getDayJsInstance, getLocalizedDayJs } from '@/packages/ui/src/utils/time';
+import { Coffee } from '@lucide/vue';
+import { computed, inject, ref, watch, type ComputedRef } from 'vue';
+import type { Organization } from '@/packages/api/src';
+import {
+    BREAK_GAP_TOLERANCE_SECONDS,
+    placementMode,
+    planMoveInsert,
+    planSplitEntry,
+    type BreakPlacementRequest,
+    type Interval,
+} from '@/utils/timesheet/breakPlacementMath';
+import { BREAK_GAP_TOLERANCE_MINUTES } from '@/packages/ui/src/utils/breakPlacement';
+
+const props = defineProps<{
+    request: BreakPlacementRequest | null;
+    apply: (breakStart: string, durationSeconds: number) => Promise<void>;
+    entryLabel: (id: string) => string;
+}>();
+
+const emit = defineEmits<{ cancel: [] }>();
+
+const organization = inject<ComputedRef<Organization>>('organization');
+
+const show = computed(() => props.request !== null);
+const mode = computed(() => (props.request ? placementMode(props.request) : null));
+const saving = ref(false);
+
+const localStart = ref('');
+const localEnd = ref('');
+
+// Seed the pickers from the suggested placement whenever a new request arrives.
+watch(
+    () => props.request,
+    (request) => {
+        if (!request) return;
+        localStart.value = getLocalizedDayJs(request.defaultBreakStart).format();
+        localEnd.value = getLocalizedDayJs(request.defaultBreakStart)
+            .add(request.durationSeconds, 'second')
+            .format();
+    },
+    { immediate: true }
+);
+
+const utcStart = computed(() => getLocalizedDayJs(localStart.value).utc().format());
+const durationSeconds = computed(() =>
+    getLocalizedDayJs(localEnd.value)
+        .utc()
+        .diff(getLocalizedDayJs(localStart.value).utc(), 'second')
+);
+
+const splitPlan = computed(() => {
+    if (!props.request || mode.value !== 'split' || durationSeconds.value <= 0) return null;
+    return planSplitEntry(props.request.workEntries[0]!, durationSeconds.value, utcStart.value, {
+        dayStart: props.request.dayStart,
+        dayEnd: props.request.dayEnd,
+        otherEntries: props.request.otherEntries,
+    });
+});
+
+const movePlan = computed(() => {
+    if (!props.request || mode.value !== 'move' || durationSeconds.value <= 0) return null;
+    return planMoveInsert(
+        [...props.request.workEntries, ...props.request.otherEntries],
+        props.request.dayStart,
+        props.request.dayEnd,
+        utcStart.value,
+        durationSeconds.value
+    );
+});
+
+// Non-blocking heads-up: the placement is feasible but the break would end up
+// further than the tolerance from work on either side, so it would carry the
+// misaligned warning right after being created. Mirrors getBreakPlacementHint,
+// but computed against the planned (post-shift) layout.
+const resultMisaligned = computed<boolean>(() => {
+    const req = props.request;
+    const plan = movePlan.value;
+    if (!req || mode.value !== 'move' || !plan) return false;
+    const dayjs = getDayJsInstance();
+    const toMs = (iso: string) => dayjs.utc(iso).valueOf();
+    const breakStartMs = toMs(plan.breakSlot.start);
+    const breakEndMs = toMs(plan.breakSlot.end);
+    const shiftedById = new Map(plan.shifted.map((s) => [s.id, s]));
+
+    let prevWorkEndMs: number | null = null;
+    let nextWorkStartMs: number | null = null;
+    for (const entry of req.workEntries) {
+        const planned = shiftedById.get(entry.id) ?? entry;
+        const startMs = toMs(planned.start);
+        const endMs = toMs(planned.end);
+        if (endMs <= breakStartMs && (prevWorkEndMs === null || endMs > prevWorkEndMs)) {
+            prevWorkEndMs = endMs;
+        }
+        if (startMs >= breakEndMs && (nextWorkStartMs === null || startMs < nextWorkStartMs)) {
+            nextWorkStartMs = startMs;
+        }
+    }
+
+    const toleranceMs = BREAK_GAP_TOLERANCE_SECONDS * 1000;
+    return (
+        prevWorkEndMs === null ||
+        breakStartMs - prevWorkEndMs > toleranceMs ||
+        nextWorkStartMs === null ||
+        nextWorkStartMs - breakEndMs > toleranceMs
+    );
+});
+
+const feasible = computed(() =>
+    mode.value === 'split' ? splitPlan.value !== null : movePlan.value !== null
+);
+
+function fmt(iso: string): string {
+    return formatTime(iso, organization?.value?.time_format);
+}
+
+const explanation = computed(() => {
+    if (!props.request) return '';
+    return mode.value === 'split'
+        ? "There's no free gap that fits this break, so the work entry will be split around it. The work moves to make room and keeps its full length."
+        : "There's no free gap that fits this break, so the surrounding entries will be shifted to make room.";
+});
+
+interface PlanLine {
+    times: string;
+    label: string;
+}
+
+const changeSummary = computed<PlanLine[]>(() => {
+    const req = props.request;
+    if (!req) return [];
+    const range = (interval: Interval) => `${fmt(interval.start)}–${fmt(interval.end)}`;
+    const moved = (from: Interval, to: Interval) => `${range(from)} → ${range(to)}`;
+
+    if (mode.value === 'split') {
+        const plan = splitPlan.value;
+        if (!plan) return [];
+        const workLabel = props.entryLabel(req.workEntries[0]!.id);
+        return [
+            { times: range(plan.firstHalf), label: workLabel },
+            { times: range(plan.breakSlot), label: 'Break' },
+            { times: range(plan.secondHalf), label: workLabel },
+            ...plan.shifted.map((shift) => ({
+                times: moved(req.otherEntries.find((e) => e.id === shift.id)!, shift),
+                label: props.entryLabel(shift.id),
+            })),
+        ];
+    }
+    const plan = movePlan.value;
+    if (!plan) return [];
+    if (plan.shifted.length === 0) return [{ times: 'No entries need to move.', label: '' }];
+    return plan.shifted.map((shift) => {
+        const original =
+            req.workEntries.find((e) => e.id === shift.id) ??
+            req.otherEntries.find((e) => e.id === shift.id)!;
+        return { times: moved(original, shift), label: props.entryLabel(shift.id) };
+    });
+});
+
+async function submit() {
+    if (!feasible.value || durationSeconds.value <= 0) return;
+    saving.value = true;
+    try {
+        await props.apply(utcStart.value, durationSeconds.value);
+    } catch {
+        // apply surfaces its own error toast; keep the modal open so the user can retry
+    } finally {
+        saving.value = false;
+    }
+}
+</script>
+
+<template>
+    <DialogModal closeable :show="show" @close="emit('cancel')">
+        <template #title>
+            <div class="flex items-center space-x-2">
+                <Coffee class="w-5 h-5 text-text-secondary" />
+                <span>Add break</span>
+            </div>
+        </template>
+
+        <template #content>
+            <div class="space-y-4">
+                <p class="text-sm text-text-secondary">{{ explanation }}</p>
+
+                <TimeRangeFields
+                    v-model:start="localStart"
+                    v-model:end="localEnd"
+                    date-picker-size="sm"></TimeRangeFields>
+
+                <div
+                    v-if="feasible"
+                    data-testid="break_placement_summary"
+                    class="rounded-lg border border-card-border bg-secondary/40 px-3 py-2 text-sm text-text-secondary space-y-1">
+                    <div class="text-xs uppercase tracking-wide text-text-tertiary">
+                        {{ mode === 'split' ? 'Result' : 'Entries that move' }}
+                    </div>
+                    <div
+                        v-for="(line, index) in changeSummary"
+                        :key="index"
+                        class="flex items-baseline gap-2">
+                        <span class="tabular-nums whitespace-nowrap">{{ line.times }}</span>
+                        <span v-if="line.label" class="text-text-tertiary truncate">
+                            {{ line.label }}
+                        </span>
+                    </div>
+                </div>
+                <div
+                    v-if="feasible && resultMisaligned"
+                    data-testid="break_placement_misaligned_warning"
+                    class="rounded-lg border border-yellow-500/30 bg-yellow-500/10 px-3 py-2 text-sm text-yellow-700 dark:text-yellow-400">
+                    At this time the break would sit more than
+                    {{ BREAK_GAP_TOLERANCE_MINUTES }} minutes away from your work entries and will
+                    be flagged as misaligned.
+                </div>
+                <!-- `request` guard (not just !feasible): when the request is cleared on save,
+                     the dialog fades out with content still mounted — don't flash the error then -->
+                <div
+                    v-if="!feasible && request"
+                    data-testid="break_placement_infeasible"
+                    class="rounded-lg border border-red-500/30 bg-red-500/10 px-3 py-2 text-sm text-red-600 dark:text-red-400">
+                    {{
+                        mode === 'split'
+                            ? "This break doesn't fit there. It has to sit inside the work, leaving at least a minute of work on each side, and the work around it has to stay inside the day."
+                            : "This break doesn't fit at that time without pushing an entry outside the day. Try a shorter break or a different time."
+                    }}
+                </div>
+            </div>
+        </template>
+
+        <template #footer>
+            <SecondaryButton @click="emit('cancel')">Cancel</SecondaryButton>
+            <PrimaryButton
+                class="ms-3"
+                :class="{ 'opacity-25': saving || !feasible }"
+                :disabled="saving || !feasible"
+                @click="submit">
+                Add break
+            </PrimaryButton>
+        </template>
+    </DialogModal>
+</template>
+
+<style scoped></style>

resources/js/Components/Timesheet/TimesheetCell.test.ts

@@ -93,4 +93,26 @@ describe('TimesheetCell', () => {
 
         expect((wrapper.get('input').element as HTMLInputElement).disabled).toBe(true);
     });
+
+    it('renders read-only and emits nothing when the row is read-only', async () => {
+        const wrapper = mount(TimesheetCell, {
+            props: {
+                cell: buildCell(2 * 3600),
+                dayIndex: 0,
+                date: '2026-04-13',
+                isToday: false,
+                hasRunningEntry: false,
+                readonly: true,
+            },
+        });
+
+        const input = wrapper.get('input');
+        expect((input.element as HTMLInputElement).disabled).toBe(true);
+
+        await input.trigger('focus');
+        await input.setValue('4h');
+        await input.trigger('blur');
+
+        expect(wrapper.emitted('update')).toBeUndefined();
+    });
 });

resources/js/Components/Timesheet/TimesheetCell.vue

@@ -18,6 +18,7 @@ const props = defineProps<{
     date: string;
     isToday: boolean;
     hasRunningEntry: boolean;
+    readonly?: boolean;
     saveStatus?: CellSaveStatus;
     pendingSeconds?: number;
 }>();
@@ -30,6 +31,16 @@ const emit = defineEmits<{
 const displaySeconds = computed(() => props.pendingSeconds ?? props.cell?.totalSeconds ?? 0);
 const isSaving = computed(() => props.saveStatus === 'saving');
 
+// A cell is non-editable while its entry is running or when the row itself is
+// read-only (e.g. a leftover break row after breaks were disabled). Both render
+// the same disabled input, differing only in the tooltip explanation.
+const isReadonly = computed(() => props.hasRunningEntry || props.readonly === true);
+const readonlyTooltip = computed(() =>
+    props.hasRunningEntry
+        ? 'Stop the running time entry to edit the timesheet'
+        : 'Breaks are disabled for this organization'
+);
+
 // Swap the border color (don't layer) to avoid same-specificity fights.
 const inputClass = computed(() => {
     const border = props.saveStatus === 'error' ? 'border-red-500/70' : 'border-input-border';
@@ -51,7 +62,7 @@ const inputClass = computed(() => {
         data-testid="timesheet_cell"
         class="flex items-center justify-center border-t border-default-background-separator"
         :class="{ 'bg-default-background': isToday }">
-        <TooltipProvider v-if="hasRunningEntry" :delay-duration="100">
+        <TooltipProvider v-if="isReadonly" :delay-duration="100">
             <Tooltip>
                 <TooltipTrigger as-child>
                     <span class="inline-block cursor-not-allowed">
@@ -68,7 +79,7 @@ const inputClass = computed(() => {
                                 disabled:opacity-50 disabled:cursor-not-allowed" />
                     </span>
                 </TooltipTrigger>
-                <TooltipContent> Stop the running time entry to edit the timesheet </TooltipContent>
+                <TooltipContent>{{ readonlyTooltip }}</TooltipContent>
             </Tooltip>
         </TooltipProvider>
         <template v-else>

resources/js/Components/Timesheet/TimesheetGrid.vue

@@ -2,6 +2,9 @@
 import { inject, type ComputedRef } from 'vue';
 import { Button } from '@/packages/ui/src/Buttons';
 import { PlusIcon } from '@heroicons/vue/20/solid';
+import { ExclamationTriangleIcon, ArrowRightIcon } from '@heroicons/vue/16/solid';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from '@/packages/ui/src';
+import { Link } from '@inertiajs/vue3';
 import TimesheetRow from '@/Components/Timesheet/TimesheetRow.vue';
 import TimeTrackerProjectTaskDropdown from '@/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue';
 import { getDayJsInstance } from '@/packages/ui/src/utils/time';
@@ -26,6 +29,8 @@ defineProps<{
     todayDate: string;
     dayTotals: number[];
     weekTotalFormatted: string;
+    breakDayTotals: number[];
+    breakGrandTotal: number;
     projects: Project[];
     tasks: Task[];
     clients: Client[];
@@ -39,6 +44,7 @@ defineProps<{
     formatDuration: (seconds: number) => string;
     cellStatuses: Record<string, CellSaveStatus>;
     cellPendingSeconds: Record<string, number>;
+    misplacedBreakDates?: Set<string>;
 }>();
 
 const emit = defineEmits<{
@@ -74,9 +80,34 @@ const emit = defineEmits<{
                 <div
                     v-for="day in weekDays"
                     :key="day"
+                    data-testid="timesheet_day_header"
                     class="bg-background dark:bg-secondary px-2 py-1 text-center">
-                    <div class="text-xs font-medium text-text-secondary">
+                    <div
-                        {{ dayjs(day).format('ddd D') }}
+                        class="flex items-center justify-center gap-1 text-xs font-medium text-text-secondary">
+                        <span>{{ dayjs(day).format('ddd D') }}</span>
+                        <DropdownMenu v-if="misplacedBreakDates?.has(day)">
+                            <DropdownMenuTrigger as-child>
+                                <button
+                                    type="button"
+                                    title="A break on this day does not align with your work entries"
+                                    class="flex items-center justify-center shrink-0 rounded-full p-0.5 text-amber-500 hover:bg-amber-500/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring">
+                                    <ExclamationTriangleIcon class="w-3.5 h-3.5" />
+                                </button>
+                            </DropdownMenuTrigger>
+                            <DropdownMenuContent class="min-w-[240px]" align="start">
+                                <div class="px-3 py-2 space-y-1.5">
+                                    <p class="text-xs text-text-secondary">
+                                        A break on this day is not directly between work entries.
+                                    </p>
+                                    <Link
+                                        :href="`/calendar?date=${day}`"
+                                        class="inline-flex items-center gap-1 text-sm font-medium text-accent-400 hover:underline">
+                                        Fix in calendar
+                                        <ArrowRightIcon class="w-3.5 h-3.5" />
+                                    </Link>
+                                </div>
+                            </DropdownMenuContent>
+                        </DropdownMenu>
                     </div>
                 </div>
                 <div
@@ -85,7 +116,7 @@ const emit = defineEmits<{
                 </div>
                 <div class="bg-background dark:bg-secondary"></div>
 
-                <!-- Data rows -->
+                <!-- Data rows (break row is pinned last) -->
                 <TimesheetRow
                     v-for="row in rows"
                     :key="row.key"
@@ -140,9 +171,9 @@ const emit = defineEmits<{
                     </TimeTrackerProjectTaskDropdown>
                 </div>
 
-                <!-- Totals row -->
+                <!-- Totals row: worked time, with break time annotated below (calendar-style) -->
                 <div
-                    class="border-t border-default-background-separator bg-background dark:bg-secondary pl-7 pr-3 py-1 text-xs text-text-tertiary md:sticky md:left-0 md:z-10">
+                    class="flex items-center border-t border-default-background-separator bg-background dark:bg-secondary pl-7 pr-3 py-1 text-xs text-text-tertiary md:sticky md:left-0 md:z-10">
                     Total
                 </div>
                 <div
@@ -150,18 +181,32 @@ const emit = defineEmits<{
                     :key="dayIndex"
                     data-testid="timesheet_day_total"
                     :class="[
-                        'flex items-center justify-center border-t border-default-background-separator bg-background dark:bg-secondary px-2 py-1 text-xs font-medium',
+                        'flex flex-col items-center justify-center border-t border-default-background-separator bg-background dark:bg-secondary px-2 py-1 text-xs font-medium leading-tight',
                         weekDays[dayIndex] === todayDate
                             ? 'text-text-primary'
                             : 'text-text-secondary',
                     ]">
-                    <span class="w-[80px] text-center">
+                    <span
-                        {{ total > 0 ? formatDuration(total) : '-' }}
+                        >{{ formatDuration(total)
-                    </span>
+                        }}<template v-if="total > 0 && (breakDayTotals[dayIndex] ?? 0) > 0">
+                            work</template
+                        ></span
+                    >
+                    <span
+                        v-if="(breakDayTotals[dayIndex] ?? 0) > 0"
+                        class="font-normal text-text-tertiary"
+                        >{{ formatDuration(breakDayTotals[dayIndex] ?? 0) }} break</span
+                    >
                 </div>
                 <div
-                    class="flex items-center justify-end border-t border-default-background-separator bg-background dark:bg-secondary pl-3 pr-3 py-1 text-xs font-semibold text-text-primary">
+                    class="flex flex-col items-end justify-center border-t border-default-background-separator bg-background dark:bg-secondary pl-3 pr-3 py-1 text-xs font-semibold text-text-primary leading-tight">
-                    {{ weekTotalFormatted }}
+                    <span
+                        >{{ weekTotalFormatted
+                        }}<template v-if="breakGrandTotal > 0"> work</template></span
+                    >
+                    <span v-if="breakGrandTotal > 0" class="font-normal text-text-tertiary"
+                        >{{ formatDuration(breakGrandTotal) }} break</span
+                    >
                 </div>
                 <div
                     class="border-t border-default-background-separator bg-background dark:bg-secondary"></div>

resources/js/Components/Timesheet/TimesheetRow.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import { computed, inject, type ComputedRef } from 'vue';
+import { useBreaksEnabled } from '@/packages/ui/src/utils/useBreaksEnabled';
 import { XMarkIcon } from '@heroicons/vue/16/solid';
+import { Coffee } from '@lucide/vue';
 import TimesheetCell from './TimesheetCell.vue';
 import TimeTrackerProjectTaskDropdown from '@/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue';
 import TimeEntryRowTagDropdown from '@/packages/ui/src/TimeEntry/TimeEntryRowTagDropdown.vue';
@@ -22,6 +24,7 @@ import {
 import { Button } from '@/packages/ui/src/Buttons';
 
 const organization = inject<ComputedRef<Organization>>('organization');
+const breaksEnabled = useBreaksEnabled();
 
 const props = defineProps<{
     row: TimesheetRow;
@@ -62,6 +65,11 @@ const selectedTask = computed({
 
 const rowTotalFormatted = computed(() => props.formatDuration(props.row.totalSeconds));
 
+// A break row can survive after breaks are disabled (its entries are
+// grandfathered). Those cells become read-only — creating/editing break time is
+// rejected server-side — leaving the remove button as the only action.
+const cellsReadonly = computed(() => props.row.type === 'break' && !breaksEnabled.value);
+
 function hasRunningEntry(dayIndex: number): boolean {
     const cell = props.row.cells.get(dayIndex);
     if (!cell) return false;
@@ -74,7 +82,13 @@ function hasRunningEntry(dayIndex: number): boolean {
         <!-- Project/Task column -->
         <div
             class="flex items-center gap-1 border-t border-default-background-separator bg-default-background pl-4 pr-3 py-2 md:sticky md:left-0 md:z-10">
-            <div class="flex-1 min-w-0">
+            <div
+                v-if="row.type === 'break'"
+                class="flex flex-1 items-center gap-1.5 min-w-0 px-2 py-1 text-sm text-text-secondary">
+                <Coffee class="w-4 h-4" />
+                <span>Break</span>
+            </div>
+            <div v-else class="flex-1 min-w-0">
                 <TimeTrackerProjectTaskDropdown
                     v-model:project="selectedProject"
                     v-model:task="selectedTask"
@@ -94,11 +108,13 @@ function hasRunningEntry(dayIndex: number): boolean {
             </div>
             <div class="flex items-center gap-1 flex-shrink-0 ml-auto">
                 <TimeEntryRowTagDropdown
+                    v-if="row.type !== 'break'"
                     :create-tag="createTag"
                     :tags="tags"
                     :model-value="row.tags"
                     @changed="emit('tagsChange', $event)" />
                 <BillableToggleButton
+                    v-if="row.type !== 'break'"
                     :model-value="row.billable"
                     size="small"
                     faded
@@ -115,6 +131,7 @@ function hasRunningEntry(dayIndex: number): boolean {
             :date="day"
             :is-today="day === todayDate"
             :has-running-entry="hasRunningEntry(dayIndex)"
+            :readonly="cellsReadonly"
             :save-status="cellStatuses[makeCellStatusKey(row.key, dayIndex)]"
             :pending-seconds="cellPendingSeconds[makeCellStatusKey(row.key, dayIndex)]"
             @update="(seconds) => emit('cellUpdate', dayIndex, seconds)" />
@@ -126,10 +143,11 @@ function hasRunningEntry(dayIndex: number): boolean {
             {{ rowTotalFormatted }}
         </div>
 
-        <!-- Remove action -->
+        <!-- Remove action (the break row is permanent while breaks are enabled) -->
         <div
             class="flex items-center justify-center border-t border-default-background-separator pr-4 py-3">
             <Button
+                v-if="!(row.type === 'break' && breaksEnabled)"
                 variant="ghost"
                 size="icon"
                 aria-label="Remove row"

resources/js/Components/UpdateSidebarNotification.vue

@@ -2,10 +2,17 @@
 import { BellAlertIcon, XMarkIcon } from '@heroicons/vue/20/solid';
 import { SecondaryButton } from '@/packages/ui/src';
 import { useStorage } from '@vueuse/core';
-const showReleaseInfo = useStorage('showReleaseInfo-desktop', true);
+import { router } from '@inertiajs/vue3';
+import { getCurrentOrganizationId } from '@/utils/useUser';
+import { canUpdateOrganization } from '@/utils/permissions';
+const showReleaseInfo = useStorage('showReleaseInfo-breaks', true);
 
-function openDesktopGithubRepo() {
+function openOrganizationSettings() {
-    window.open('https://github.com/solidtime-io/solidtime-desktop', '_blank')?.focus();
+    router.visit(route('organizations.show', getCurrentOrganizationId()));
+}
+
+function openBreaksDocs() {
+    window.open('https://docs.solidtime.io/user-guide/breaks', '_blank')?.focus();
 }
 </script>
 
@@ -16,7 +23,7 @@ function openDesktopGithubRepo() {
                 <div
                     class="text-xs pb-1.5 font-semibold text-text-tertiary flex items-center space-x-1">
                     <BellAlertIcon class="w-3.5"></BellAlertIcon>
-                    <span> New Update </span>
+                    <span> New Feature </span>
                 </div>
                 <button>
                     <XMarkIcon
@@ -26,14 +33,22 @@ function openDesktopGithubRepo() {
             </div>
 
             <p class="text-xs">
-                <span class="font-semibold">Solidtime Desktop Beta</span> is here! Test our brand
+                <span class="font-semibold">Breaks</span> are here! Enable them in the organization
-                new clients for Windows, macOS and Linux now.
+                settings to track break time in the time tracker and timesheet.
             </p>
             <SecondaryButton
+                v-if="canUpdateOrganization()"
                 size="small"
                 class="w-full text-center justify-center mt-1.5"
-                @click="openDesktopGithubRepo"
+                @click="openOrganizationSettings"
-                >Download now</SecondaryButton
+                >Enable now</SecondaryButton
+            >
+            <SecondaryButton
+                v-else
+                size="small"
+                class="w-full text-center justify-center mt-1.5"
+                @click="openBreaksDocs"
+                >Learn more</SecondaryButton
             >
         </div>
     </div>