add date range navigation, unify picker components

Support configurable on, invite-only, and off registration modes, including case-insensitive invitation checks and test coverage.

.env.example

@@ -5,7 +5,8 @@ APP_KEY=base64:UNQNf1SXeASNkWux01Rj8EnHYx8FO0kAxWNDwktclkk=
 APP_DEBUG=true
 APP_URL=https://solidtime.test
 APP_FORCE_HTTPS=false
-APP_ENABLE_REGISTRATION=true
+# Supported values: on, off, invite-only (true/false are supported for backwards compatibility)
+APP_ENABLE_REGISTRATION=on
 SUPER_ADMINS=admin@example.com
 PAGINATION_PER_PAGE_DEFAULT=500
 

.github/VOUCHED.td

@@ -0,0 +1,27 @@
+# Vouched contributors for solidtime.
+#
+# One handle per line, without the leading @, sorted alphabetically.
+# Prefix a handle with - to denounce them, optionally followed by a reason.
+# Format reference: https://github.com/mitchellh/vouch
+#
+# Maintainers do not need to edit this file by hand. Comment "vouch @user",
+# "unvouch @user" or "denounce @user <reason>" on any issue, pull request or
+# discussion and the vouch workflows will update this file.
+#
+# Collaborators with write access and bots are always allowed and do not need
+# an entry here.
+#
+# Seeded 2026-07-25 from the authors of every merged pull request.
+
+agross
+akolenda
+bufferhead-code
+candideu
+kasparrosin
+korridor
+nikbucher tasks table sorting
+onatcer
+shrootbuck
+smilebeda
+thespyder
+utlark

.github/workflows/build-onpremise.yml

@@ -141,7 +141,7 @@ jobs:
             ${{ env.DOCKER_REPO }}
 
       - name: "Login to solidtime OnPremise Registry"
-        uses: docker/login-action@v4
+        uses: docker/login-action@v4.5.2
         with:
           registry: registry.on-premise.solidtime.io
           username: ${{ secrets.ONPREMISE_USERNAME }}
@@ -195,7 +195,7 @@ jobs:
           merge-multiple: true
 
       - name: "Login to solidtime OnPremise Registry"
-        uses: docker/login-action@v4
+        uses: docker/login-action@v4.5.2
         with:
           registry: registry.on-premise.solidtime.io
           username: ${{ secrets.ONPREMISE_USERNAME }}

.github/workflows/build-private.yml

@@ -177,7 +177,7 @@ jobs:
           SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
 
       - name: "Login to GitHub Container Registry"
-        uses: docker/login-action@v4
+        uses: docker/login-action@v4.5.2
         with:
           registry: rg.fr-par.scw.cloud/solidtime
           username: nologin

.github/workflows/build-public.yml

@@ -117,13 +117,13 @@ jobs:
             ${{ env.GHCR_REPO }}
 
       - name: "Login to Docker Hub Container Registry"
-        uses: docker/login-action@v4
+        uses: docker/login-action@v4.5.2
         with:
           username: ${{ secrets.DOCKERHUB_USERNAME }}
           password: ${{ secrets.DOCKERHUB_TOKEN }}
 
       - name: "Login to GitHub Container Registry"
-        uses: docker/login-action@v4
+        uses: docker/login-action@v4.5.2
         with:
           registry: ghcr.io
           username: ${{ github.actor }}
@@ -177,13 +177,13 @@ jobs:
           merge-multiple: true
 
       - name: "Login to Docker Hub"
-        uses: docker/login-action@v4
+        uses: docker/login-action@v4.5.2
         with:
           username: ${{ secrets.DOCKERHUB_USERNAME }}
           password: ${{ secrets.DOCKERHUB_TOKEN }}
 
       - name: "Login to GHCR"
-        uses: docker/login-action@v4
+        uses: docker/login-action@v4.5.2
         with:
           registry: ghcr.io
           username: ${{ github.actor }}

.github/workflows/vouch-check-pr.yml

@@ -0,0 +1,75 @@
+name: Vouch (check PR)
+
+on:
+  pull_request_target:
+    types: [opened, reopened, synchronize]
+  issue_comment:
+    types: [created]
+
+permissions:
+  contents: read
+  pull-requests: write
+
+jobs:
+  check:
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    if: >-
+      github.event_name == 'pull_request_target' ||
+      (github.event_name == 'issue_comment' &&
+       github.event.issue.pull_request &&
+       contains(github.event.comment.body, '/recheck'))
+
+    steps:
+      # Pull requests of 50 changed lines or fewer skip the vouch requirement.
+      - name: "Measure diff size"
+        id: size
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          REPO: ${{ github.repository }}
+          PR: ${{ github.event.pull_request.number || github.event.issue.number }}
+
+          # Changes to these files do not count towards the 50-line limit.
+          # One extended regex per line, matched against the whole repo-relative
+          # path, so use a leading .* to match a file in any directory.
+          IGNORED: |
+            package-lock\.json
+            composer\.lock
+            tests/.*
+            e2e/.*
+            .*\.(test|spec)\.(ts|js|vue)
+
+        run: |
+          set -euo pipefail
+          # An empty list yields "^()$", which matches no filename. grep exits
+          # 1 on an empty list, so swallow that rather than fail the step.
+          join() { { grep -vE '^[[:space:]]*$' || true; } | paste -sd'|' -; }
+          ignored="^($(join <<<"$IGNORED"))$"
+
+          total=$(gh api --paginate "repos/$REPO/pulls/$PR/files" \
+            --jq '.[] | [.filename, .additions + .deletions] | @tsv' |
+            awk -F'\t' -v ignored="$ignored" '
+              $1 ~ ignored { next }
+                           { n += $2 }
+              END { print n+0 }')
+          echo "total=$total" >> "$GITHUB_OUTPUT"
+          echo "Countable diff size: $total line(s)"
+
+      - name: "Small patch (denounced users still blocked)"
+        if: fromJSON(steps.size.outputs.total) <= 50
+        uses: mitchellh/vouch/action/check-pr@v1.5.0
+        with:
+          pr-number: ${{ github.event.pull_request.number || github.event.issue.number }}
+          auto-close: true
+          require-vouch: false
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: "Full vouch required"
+        if: fromJSON(steps.size.outputs.total) > 50
+        uses: mitchellh/vouch/action/check-pr@v1.5.0
+        with:
+          pr-number: ${{ github.event.pull_request.number || github.event.issue.number }}
+          auto-close: true
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/vouch-manage-by-discussion.yml

@@ -0,0 +1,33 @@
+name: Vouch (manage by discussion)
+
+# Same commands as vouch-manage-by-issue.yml, but for discussion comments.
+
+on:
+  discussion_comment:
+    types: [created]
+
+concurrency:
+  group: vouch-manage
+  cancel-in-progress: false
+
+permissions:
+  contents: write
+  discussions: write
+
+jobs:
+  manage:
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+
+    steps:
+      - name: "Checkout code"
+        uses: actions/checkout@v7
+
+      - name: "Apply vouch command"
+        uses: mitchellh/vouch/action/manage-by-discussion@v1.5.0
+        with:
+          discussion-number: ${{ github.event.discussion.number }}
+          comment-node-id: ${{ github.event.comment.node_id }}
+          roles: admin,maintain,write
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/vouch-manage-by-issue.yml

@@ -0,0 +1,35 @@
+name: Vouch (manage by issue)
+
+# Maintainers comment "vouch @user", "unvouch @user" or "denounce @user <reason>"
+# on any issue or pull request, and this workflow updates .github/VOUCHED.td.
+
+on:
+  issue_comment:
+    types: [created]
+
+concurrency:
+  group: vouch-manage
+  cancel-in-progress: false
+
+permissions:
+  contents: write
+  issues: write
+  pull-requests: write
+
+jobs:
+  manage:
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+
+    steps:
+      - name: "Checkout code"
+        uses: actions/checkout@v7
+
+      - name: "Apply vouch command"
+        uses: mitchellh/vouch/action/manage-by-issue@v1.5.0
+        with:
+          issue-id: ${{ github.event.issue.number }}
+          comment-id: ${{ github.event.comment.id }}
+          roles: admin,maintain,write
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

CONTRIBUTING.md

@@ -12,6 +12,22 @@ In order to keep the issues of the repository clean we decided to only use them
 
 To respect your time and help us manage contributions effectively, please open an issue or start a discussion and wait for approval before submitting a pull request (PR). This does not apply to tiny fixes or changes however, please keep in mind that we might not merge PRs for various reasons. 
 
+### Vouched contributors
+
+Pull requests from authors who are not vouched are closed automatically. This lets us keep up with the volume of AI slop pull requests without a maintainer having to triage every one of them by hand.
+
+Your pull request is not affected if any of the following applies:
+
+- You have write access to this repository.
+- Someone with write access has vouched for you. The list lives in [.github/VOUCHED.td](.github/VOUCHED.td).
+- Your pull request changes 50 lines or fewer. Test files and lockfiles do not count towards that number, so a small fix that comes with tests still qualifies.
+
+To get vouched, open an issue or discussion before you start and explain how you intend to implement the change. We will discuss the approach with you, and only once we have agreed on the implementation does a maintainer comment `vouch @your-handle`, which puts you on the list from then on.
+
+Being vouched only stops your pull requests from being closed automatically. [Only work on approved issues](#only-work-on-approved-issues) still applies to every pull request you send.
+
+Contributors who abuse this are denounced, and their pull requests are closed regardless of size. 
+
 ### Contributor License Agreement
 
 You'll also notice that we’ve set up a [Contributor License Agreement (CLA)](https://cla-assistant.io/solidtime-io/solidtime), which must be signed before any PR can be merged. Don’t worry - the process is quick and only takes a few clicks.

README.md

@@ -39,6 +39,8 @@ Please open an issue or start a discussion and wait for approval before submitti
 
 **If you submit an AI slop pull request (especially without following the proper procedure), you will be banned from future contributions to solidtime.**
 
+To keep that manageable, pull requests from authors who are not vouched are closed automatically, unless they change 50 lines or fewer. To get vouched, open an issue or discussion first and explain how you intend to implement the change. Once we have agreed on the approach, we vouch for you. See [Vouched contributors](./CONTRIBUTING.md#vouched-contributors).
+
 Please read the [CONTRIBUTING.md](./CONTRIBUTING.md) before sumbitting a Pull Request.
 
 We do accept contributions in the [documentation repository](https://github.com/solidtime-io/docs) f.e. to add new self-hosting guides.

app/Actions/Fortify/CreateNewUser.php

@@ -4,9 +4,11 @@ declare(strict_types=1);
 
 namespace App\Actions\Fortify;
 
+use App\Enums\RegistrationMode;
 use App\Enums\Weekday;
 use App\Events\NewsletterRegistered;
 use App\Models\User;
+use App\Service\InvitationService;
 use App\Service\IpLookup\IpLookupServiceContract;
 use App\Service\TimezoneService;
 use App\Service\UserService;
@@ -31,13 +33,14 @@ class CreateNewUser implements CreatesNewUsers
      */
     public function create(array $input): User
     {
-        if (! config('app.enable_registration')) {
+        $registrationMode = RegistrationMode::fromConfig(config('app.enable_registration'));
+        if ($registrationMode === RegistrationMode::Off) {
             throw ValidationException::withMessages([
                 'email' => [__('Registration is disabled.')],
             ]);
         }
 
-        Validator::make($input, [
+        $validated = Validator::make($input, [
             'name' => [
                 'required',
                 'string',
@@ -60,6 +63,20 @@ class CreateNewUser implements CreatesNewUsers
             ],
         ])->validate();
 
+        if ($registrationMode === RegistrationMode::InviteOnly) {
+            $invitationService = app(InvitationService::class);
+            $email = (string) $validated['email'];
+            if (! $invitationService->hasAcceptedInvitationForEmail($email)) {
+                $message = $invitationService->hasPendingInvitationForEmail($email)
+                    ? __('Please accept the organization invitation sent to your email address before registering.')
+                    : __('Registration is only available to invited users.');
+
+                throw ValidationException::withMessages([
+                    'email' => [$message],
+                ]);
+            }
+        }
+
         $timezone = null;
         if (array_key_exists('timezone', $input) && is_string($input['timezone'])) {
             if (app(TimezoneService::class)->isValid($input['timezone'])) {

app/Auth/ActiveUserProvider.php

@@ -0,0 +1,37 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Auth;
+
+use Illuminate\Auth\EloquentUserProvider;
+use Illuminate\Database\Eloquent\Builder;
+use Illuminate\Database\Eloquent\Model;
+
+/**
+ * User provider that only resolves non-placeholder users.
+ *
+ * Placeholder users are created by imports and when members are removed from an
+ * organization. They can share an email address with a real user, so resolving a user by
+ * email can return a placeholder instead of the real account. The login flow filters them
+ * out explicitly, but the password broker and the guard credential checks (for example the
+ * password confirmation) resolve users through the configured user provider.
+ *
+ * Registered as the "eloquent" provider driver in the AuthServiceProvider, so it replaces the
+ * built-in one for every provider in config/auth.php.
+ */
+class ActiveUserProvider extends EloquentUserProvider
+{
+    /**
+     * @param  Model|null  $model
+     * @return Builder<Model>
+     */
+    #[\Override]
+    protected function newModelQuery($model = null): Builder
+    {
+        $query = parent::newModelQuery($model);
+        $query->getQuery()->where('is_placeholder', '=', false);
+
+        return $query;
+    }
+}

app/Console/Commands/TimeEntry/TimeEntrySendStillRunningMailsCommand.php

@@ -51,7 +51,8 @@ class TimeEntrySendStillRunningMailsCommand extends Command
             ])
             ->whereHas('user', function (Builder $query): void {
                 /** @var Builder<User> $query */
-                $query->where('is_placeholder', '=', false);
+                $query->where('is_placeholder', '=', false)
+                    ->where('send_time_entry_still_running_email', '=', true);
             })
             ->orderBy('created_at', 'asc')
             ->chunk(500, function (Collection $timeEntries) use ($dryRun, &$sentMails): void {

app/Enums/RegistrationMode.php

@@ -0,0 +1,29 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Enums;
+
+enum RegistrationMode: string
+{
+    case On = 'on';
+    case InviteOnly = 'invite-only';
+    case Off = 'off';
+
+    public static function fromConfig(mixed $value): self
+    {
+        if ($value === true) {
+            return self::On;
+        }
+
+        if ($value === false || $value === null) {
+            return self::Off;
+        }
+
+        return match (strtolower(trim((string) $value))) {
+            '1', 'on', 'true' => self::On,
+            'invite-only' => self::InviteOnly,
+            default => self::Off,
+        };
+    }
+}

app/Exceptions/Api/ApiException.php

@@ -60,7 +60,6 @@ abstract class ApiException extends Exception
      */
     public function report(): bool
     {
-        // TODO: temporary activated
         return false;
     }
 }

app/Exceptions/Api/CanNotDeleteUserWhoIsOwnerOfOrganizationWithMultipleMembers.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class CanNotDeleteUserWhoIsOwnerOfOrganizationWithMultipleMembers extends ApiException
 {
     public const string KEY = 'can_not_delete_user_who_is_owner_of_organization_with_multiple_members';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/CanNotRemoveOwnerFromOrganization.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class CanNotRemoveOwnerFromOrganization extends ApiException
 {
     public const string KEY = 'can_not_remove_owner_from_organization';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/ChangingRoleOfPlaceholderIsNotAllowed.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class ChangingRoleOfPlaceholderIsNotAllowed extends ApiException
 {
     public const string KEY = 'changing_role_of_placeholder_is_not_allowed';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/ChangingRoleToPlaceholderIsNotAllowed.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class ChangingRoleToPlaceholderIsNotAllowed extends ApiException
 {
     public const string KEY = 'changing_role_to_placeholder_is_not_allowed';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/EntityStillInUseApiException.php

@@ -19,6 +19,16 @@ class EntityStillInUseApiException extends ApiException
 
     public const string KEY = 'entity_still_in_use';
 
+    /**
+     * Report the exception.
+     *
+     * @return bool true means the exception handler will not report it again
+     */
+    public function report(): bool
+    {
+        return true;
+    }
+
     /**
      * Get the translated message for the exception.
      */

app/Exceptions/Api/FeatureIsNotAvailableInFreePlanApiException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class FeatureIsNotAvailableInFreePlanApiException extends ApiException
 {
     public const string KEY = 'feature_is_not_available_in_free_plan';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/InactiveUserCanNotBeUsedApiException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class InactiveUserCanNotBeUsedApiException extends ApiException
 {
     public const string KEY = 'inactive_user_can_not_be_used';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/InvitationForTheEmailAlreadyExistsApiException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class InvitationForTheEmailAlreadyExistsApiException extends ApiException
 {
     public const string KEY = 'invitation_for_the_email_already_exists';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/OnlyOwnerCanChangeOwnership.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class OnlyOwnerCanChangeOwnership extends ApiException
 {
     public const string KEY = 'only_owner_can_change_ownership';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/OnlyPlaceholdersCanBeMergedIntoAnotherMember.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class OnlyPlaceholdersCanBeMergedIntoAnotherMember extends ApiException
 {
     public const string KEY = 'only_placeholders_can_be_merged_into_another_member';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/OrganizationHasNoSubscriptionButMultipleMembersException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class OrganizationHasNoSubscriptionButMultipleMembersException extends ApiException
 {
     public const string KEY = 'organization_has_no_subscription_but_multiple_members';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/OrganizationNeedsAtLeastOneOwner.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class OrganizationNeedsAtLeastOneOwner extends ApiException
 {
     public const string KEY = 'organization_needs_at_least_one_owner';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/OverlappingTimeEntryApiException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class OverlappingTimeEntryApiException extends ApiException
 {
     public const string KEY = 'overlapping_time_entry';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/ThisPlaceholderCanNotBeInvitedUseTheMergeToolInsteadException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class ThisPlaceholderCanNotBeInvitedUseTheMergeToolInsteadException extends ApiException
 {
     public const string KEY = 'this_placeholder_can_not_be_invited_use_the_merge_tool_instead_api_exception';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/TimeEntryCanNotBeRestartedApiException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class TimeEntryCanNotBeRestartedApiException extends ApiException
 {
     public const string KEY = 'time_entry_can_not_be_restarted';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/TimeEntryStillRunningApiException.php

@@ -7,4 +7,14 @@ namespace App\Exceptions\Api;
 class TimeEntryStillRunningApiException extends ApiException
 {
     public const string KEY = 'time_entry_still_running';
+
+    /**
+     * Report the exception.
+     *
+     * @return bool true means the exception handler will not report it again
+     */
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/UserIsAlreadyMemberOfOrganizationApiException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class UserIsAlreadyMemberOfOrganizationApiException extends ApiException
 {
     public const string KEY = 'user_is_already_member_of_organization';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/UserIsAlreadyMemberOfProjectApiException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class UserIsAlreadyMemberOfProjectApiException extends ApiException
 {
     public const string KEY = 'user_is_already_member_of_project';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/UserNotPlaceholderApiException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class UserNotPlaceholderApiException extends ApiException
 {
     public const string KEY = 'user_not_placeholder';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Api/UserResendEmailVerificationNoPendingEmailApiException.php

@@ -7,4 +7,9 @@ namespace App\Exceptions\Api;
 class UserResendEmailVerificationNoPendingEmailApiException extends ApiException
 {
     public const string KEY = 'user_resend_email_verification_no_pending_email';
+
+    public function report(): bool
+    {
+        return true;
+    }
 }

app/Exceptions/Handler.php

@@ -6,7 +6,11 @@ namespace App\Exceptions;
 
 use Illuminate\Foundation\Exceptions\Handler as ExceptionHandler;
 use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
+use League\OAuth2\Server\Exception\OAuthServerException;
+use Symfony\Component\HttpFoundation\Exception\SuspiciousOperationException;
 use Symfony\Component\HttpFoundation\Response;
+use Symfony\Component\HttpKernel\Exception\BadRequestHttpException;
 use Throwable;
 
 class Handler extends ExceptionHandler
@@ -30,6 +34,33 @@ class Handler extends ExceptionHandler
         $this->reportable(function (Throwable $e): void {
             //
         });
+
+        $this->dontReportWhen(fn (Throwable $e): bool => $e instanceof OAuthServerException
+            && $e->getErrorType() === 'access_denied'
+            && $e->getHttpStatusCode() === 401);
+
+        // A request on an untrusted host (see App\Http\Middleware\TrustHosts)
+        // otherwise renders as a bare "Bad request." 400. Show a message that
+        // says how to fix it instead. The framework has already converted the
+        // SuspiciousOperationException into a BadRequestHttpException by the time
+        // renderables run, so we match that and inspect the original.
+        $this->renderable(function (BadRequestHttpException $e, Request $request): ?Response {
+            $previous = $e->getPrevious();
+
+            if (! $previous instanceof SuspiciousOperationException
+                || ! str_starts_with($previous->getMessage(), 'Untrusted Host')) {
+                return null; // any other bad request keeps the default response
+            }
+
+            $message = 'This hostname is not configured for this instance. '
+                .'Set APP_URL, or add the host to TRUSTED_HOSTS.';
+
+            if ($request->expectsJson()) {
+                return response()->json(['message' => $message], 400);
+            }
+
+            return response()->view('errors.untrusted-host', ['message' => $message], 400);
+        });
     }
 
     public function render($request, Throwable $e): Response|RedirectResponse

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

@@ -28,7 +28,9 @@ class ExportController extends Controller
 
         $filepath = $exportService->export($organization);
         $downloadUrl = Storage::disk(config('filesystems.private'))
-            ->temporaryUrl($filepath, Carbon::now()->addMinutes(10));
+            ->temporaryUrl($filepath, Carbon::now()->addMinutes(10), [
+                'ResponseContentDisposition' => 'attachment; filename="'.basename($filepath).'"',
+            ]);
 
         return new JsonResponse([
             'success' => true,

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

@@ -336,7 +336,9 @@ class TimeEntryController extends Controller
 
         return response()->json([
             'download_url' => Storage::disk(config('filesystems.private'))
-                ->temporaryUrl($path, now()->addMinutes(5)),
+                ->temporaryUrl($path, now()->addMinutes(5), [
+                    'ResponseContentDisposition' => 'attachment; filename="'.$filename.'"',
+                ]),
         ]);
     }
 
@@ -535,7 +537,7 @@ class TimeEntryController extends Controller
                 ->putFileAs($folderPath, new File($tempFolder->path($filenameTemp)), $filename);
         } else {
             Excel::store(
-                new TimeEntriesReportExport($aggregatedData, $format, $currency, $group, $subGroup, $showBillableRate),
+                new TimeEntriesReportExport($aggregatedData, $format, $currency, $group, $subGroup, $showBillableRate, $localizationService),
                 $path,
                 config('filesystems.private'),
                 $format->getExportPackageType(),
@@ -547,7 +549,9 @@ class TimeEntryController extends Controller
 
         return response()->json([
             'download_url' => Storage::disk(config('filesystems.private'))
-                ->temporaryUrl($path, now()->addMinutes(5)),
+                ->temporaryUrl($path, now()->addMinutes(5), [
+                    'ResponseContentDisposition' => 'attachment; filename="'.$filename.'"',
+                ]),
         ]);
     }
 

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

@@ -124,6 +124,10 @@ class UserController extends Controller
             $user->week_start = $request->getWeekStart();
         }
 
+        if ($request->getSendTimeEntryStillRunningEmail() !== null) {
+            $user->send_time_entry_still_running_email = $request->getSendTimeEntryStillRunningEmail();
+        }
+
         $user->save();
 
         if ($emailToVerify !== null) {

app/Http/Controllers/Web/OrganizationInvitationController.php

@@ -36,6 +36,7 @@ class OrganizationInvitationController extends Controller
             }
 
             return redirect(route('register'))
+                ->with('registration_email', $email)
                 ->with('bannerText', __('Please create an account to finish joining the :organization organization.', [
                     'organization' => $organization->name,
                 ]))

app/Http/Kernel.php

@@ -15,6 +15,7 @@ use App\Http\Middleware\PreventRequestsDuringMaintenance;
 use App\Http\Middleware\RedirectIfAuthenticated;
 use App\Http\Middleware\ShareInertiaData;
 use App\Http\Middleware\TrimStrings;
+use App\Http\Middleware\TrustHosts;
 use App\Http\Middleware\TrustProxies;
 use App\Http\Middleware\ValidateSignature;
 use App\Http\Middleware\VerifyCsrfToken;
@@ -47,6 +48,7 @@ class Kernel extends HttpKernel
      */
     protected $middleware = [
         ForceHttps::class,
+        TrustHosts::class,
         TrustProxies::class,
         HandleCors::class,
         PreventRequestsDuringMaintenance::class,

app/Http/Middleware/TrustHosts.php

@@ -0,0 +1,56 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Http\Middleware;
+
+use Illuminate\Http\Middleware\TrustHosts as BaseTrustHosts;
+use Illuminate\Http\Request;
+use Illuminate\Http\Response;
+
+/**
+ * Rejects requests whose Host is not trusted, preventing Host-header poisoning of
+ * generated URLs (password reset, SSO callback, invitations). Trusted = the
+ * APP_URL host and its subdomains, plus TRUSTED_HOSTS (for multi-host access such
+ * as a Tailscale name). Health-check endpoints are exempt (probed by IP).
+ */
+class TrustHosts extends BaseTrustHosts
+{
+    /**
+     * @return array<int, string|null>
+     */
+    public function hosts(): array
+    {
+        /** @var array<int, string> $configured */
+        $configured = config('app.trusted_hosts', []);
+
+        $extra = array_map(function (string $host): string {
+            $host = trim($host);
+
+            // "*.example.com" matches any subdomain, not the apex.
+            if (str_starts_with($host, '*.')) {
+                return '^.+\.'.preg_quote(substr($host, 2), '#').'$';
+            }
+
+            return '^'.preg_quote($host, '#').'$';
+        }, $configured);
+
+        return array_merge([$this->allSubdomainsOfApplicationUrl()], $extra);
+    }
+
+    /**
+     * @param  \Closure(Request): Response  $next
+     */
+    public function handle(Request $request, $next)
+    {
+        // Exempt health checks (probed by IP). Also reset the trusted hosts,
+        // since Octane leaks the static state across requests.
+        if ($request->is('health-check/*')) {
+            Request::setTrustedHosts([]);
+
+            return $next($request);
+        }
+
+        return parent::handle($request, $next);
+    }
+}

app/Http/Requests/V1/Import/ImportRequest.php

@@ -24,6 +24,7 @@ class ImportRequest extends BaseFormRequest
             'data' => [
                 'required',
                 'string',
+                'max:'.config('import.max_data_size'),
             ],
         ];
     }

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

@@ -58,6 +58,9 @@ class UserUpdateRequest extends BaseFormRequest
             'week_start' => [
                 Rule::enum(Weekday::class),
             ],
+            'send_time_entry_still_running_email' => [
+                'boolean',
+            ],
         ];
     }
 
@@ -81,6 +84,13 @@ class UserUpdateRequest extends BaseFormRequest
         return $this->has('week_start') ? Weekday::from($this->input('week_start')) : null;
     }
 
+    public function getSendTimeEntryStillRunningEmail(): ?bool
+    {
+        return $this->has('send_time_entry_still_running_email')
+            ? $this->boolean('send_time_entry_still_running_email')
+            : null;
+    }
+
     public function hasPhotoKey(): bool
     {
         return $this->has('photo');

app/Http/Resources/V1/User/UserResource.php

@@ -36,6 +36,8 @@ class UserResource extends BaseResource
             'timezone' => $this->resource->timezone,
             /** @var Weekday $week_start Starting day of the week */
             'week_start' => $this->resource->week_start->value,
+            /** @var bool $send_time_entry_still_running_email Whether to email the user when a time entry has been running for more than 8 hours */
+            'send_time_entry_still_running_email' => $this->resource->send_time_entry_still_running_email,
         ];
     }
 }

app/Models/User.php

@@ -38,10 +38,14 @@ use OwenIt\Auditing\Contracts\Auditable as AuditableContract;
  * @property string|null $pending_email
  * @property Carbon|null $email_verified_at
  * @property string|null $password
+ * @property string|null $remember_token
  * @property string|null $two_factor_secret
+ * @property string|null $two_factor_recovery_codes
+ * @property Carbon|null $two_factor_confirmed_at
  * @property string $timezone
  * @property bool $is_placeholder
  * @property Weekday $week_start
+ * @property bool $send_time_entry_still_running_email
  * @property string|null $profile_photo_path
  * @property-read Organization|null $currentOrganization
  * @property-read string $profile_photo_url
@@ -108,6 +112,7 @@ class User extends Authenticatable implements AuditableContract, FilamentUser, M
         'is_admin' => 'boolean',
         'is_placeholder' => 'boolean',
         'week_start' => Weekday::class,
+        'send_time_entry_still_running_email' => 'boolean',
     ];
 
     /**
@@ -117,6 +122,7 @@ class User extends Authenticatable implements AuditableContract, FilamentUser, M
      */
     protected $attributes = [
         'week_start' => Weekday::Monday,
+        'send_time_entry_still_running_email' => true,
     ];
 
     /**
@@ -147,7 +153,9 @@ class User extends Authenticatable implements AuditableContract, FilamentUser, M
 
     public function canAccessPanel(Panel $panel): bool
     {
-        return in_array($this->email, config('auth.super_admins', []), true) && $this->hasVerifiedEmail();
+        return $this->is_placeholder === false
+            && in_array($this->email, config('auth.super_admins', []), true)
+            && $this->hasVerifiedEmail();
     }
 
     public function isMemberOfOrganization(Organization $organization): bool

app/Providers/AppServiceProvider.php

@@ -20,6 +20,7 @@ use App\Service\BillingContract;
 use App\Service\IpLookup\IpLookupServiceContract;
 use App\Service\IpLookup\NoIpLookupService;
 use App\Service\PermissionStore;
+use DateTimeInterface;
 use Dedoc\Scramble\Scramble;
 use Dedoc\Scramble\Support\Generator\OpenApi;
 use Dedoc\Scramble\Support\Generator\SecurityScheme;
@@ -29,8 +30,13 @@ use Filament\Tables\Table;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\Relation;
 use Illuminate\Foundation\Application;
+use Illuminate\Http\Request;
 use Illuminate\Support\Facades\Route;
+use Illuminate\Support\Facades\Storage;
+use Illuminate\Support\Facades\URL;
 use Illuminate\Support\ServiceProvider;
+use Illuminate\Support\Str;
+use Symfony\Component\HttpFoundation\StreamedResponse;
 
 class AppServiceProvider extends ServiceProvider
 {
@@ -98,6 +104,27 @@ class AppServiceProvider extends ServiceProvider
         $this->app->bind(IpLookupServiceContract::class, NoIpLookupService::class);
         $this->app->bind(BillingContract::class);
 
+        // Storage
+        // The local driver ignores the ResponseContentDisposition option of temporaryUrl,
+        // so mirror it through the signed query parameters of the storage route.
+        $privateDisk = config('filesystems.private');
+        if (config('filesystems.disks.'.$privateDisk.'.driver') === 'local') {
+            $disk = Storage::disk($privateDisk);
+            $disk->serveUsing(function (Request $request, string $path, array $headers) use ($disk): StreamedResponse {
+                return $disk->response($path, null, $headers, $request->query('disposition', 'inline'));
+            });
+            $disk->buildTemporaryUrlsUsing(function (string $path, DateTimeInterface $expiration, array $options) use ($privateDisk): string {
+                $parameters = array_filter([
+                    'path' => $path,
+                    'disposition' => isset($options['ResponseContentDisposition'])
+                        ? Str::before($options['ResponseContentDisposition'], ';')
+                        : null,
+                ]);
+
+                return url(URL::temporarySignedRoute('storage.'.$privateDisk, $expiration, $parameters, absolute: false));
+            });
+        }
+
         // Routing
         Route::model('member', Member::class);
         Route::model('invitation', OrganizationInvitation::class);

app/Providers/AuthServiceProvider.php

@@ -4,11 +4,14 @@ declare(strict_types=1);
 
 namespace App\Providers;
 
+use App\Auth\ActiveUserProvider;
 use App\Models\Passport\AuthCode;
 use App\Models\Passport\Client;
 use App\Models\Passport\RefreshToken;
 use App\Models\Passport\Token;
+use Illuminate\Contracts\Foundation\Application;
 use Illuminate\Foundation\Support\Providers\AuthServiceProvider as ServiceProvider;
+use Illuminate\Support\Facades\Auth;
 use Laravel\Passport\Passport;
 
 class AuthServiceProvider extends ServiceProvider
@@ -26,6 +29,13 @@ class AuthServiceProvider extends ServiceProvider
      */
     public function boot(): void
     {
+        // Replaces the built-in eloquent user provider, so that no authentication flow can
+        // resolve a placeholder user. The driver name is kept, because Passport recognizes
+        // only providers that are configured with the driver "eloquent".
+        Auth::provider('eloquent', function (Application $app, array $config): ActiveUserProvider {
+            return new ActiveUserProvider($app->make('hash'), $config['model']);
+        });
+
         // define scopes for passport tokens
         Passport::tokensCan([
             'create' => 'Create resources',

app/Providers/FortifyServiceProvider.php

@@ -45,6 +45,7 @@ class FortifyServiceProvider extends ServiceProvider
 
         Fortify::registerView(function () {
             return Inertia::render('Auth/Register', [
+                'email' => session('registration_email', ''),
                 'terms_url' => config('auth.terms_url'),
                 'privacy_policy_url' => config('auth.privacy_policy_url'),
                 'newsletter_consent' => config('auth.newsletter_consent'),

app/Providers/RouteServiceProvider.php

@@ -33,8 +33,8 @@ class RouteServiceProvider extends ServiceProvider
             }
 
             return $request->user()
-                ? Limit::perMinute(200)->by($request->user()->id)
-                : Limit::perMinute(60)->by($request->ip());
+                ? Limit::perMinute(config('app.api_rate_limit_authenticated_per_minute'))->by($request->user()->id)
+                : Limit::perMinute(config('app.api_rate_limit_guest_per_minute'))->by($request->ip());
         });
 
         $this->routes(function (): void {

app/Service/Import/ImportService.php

@@ -9,11 +9,8 @@ use App\Service\Import\Importers\ImporterContract;
 use App\Service\Import\Importers\ImporterProvider;
 use App\Service\Import\Importers\ImportException;
 use App\Service\Import\Importers\ReportDto;
-use Illuminate\Support\Carbon;
 use Illuminate\Support\Facades\Cache;
 use Illuminate\Support\Facades\DB;
-use Illuminate\Support\Facades\Storage;
-use Illuminate\Support\Str;
 
 class ImportService
 {
@@ -25,8 +22,6 @@ class ImportService
         /** @var ImporterContract $importer */
         $importer = app(ImporterProvider::class)->getImporter($importerType);
         $importer->init($organization);
-        Storage::disk(config('filesystems.default'))
-            ->put('import/'.Carbon::now()->toDateString().'-'.$organization->getKey().'-'.Str::uuid(), $data);
 
         $lock = Cache::lock('import:'.$organization->getKey(), config('octane.max_execution_time', 60) + 1);
 

app/Service/Import/Importers/SolidtimeImporter.php

@@ -16,7 +16,6 @@ use Illuminate\Support\Str;
 use League\Csv\Reader;
 use Override;
 use Spatie\TemporaryDirectory\TemporaryDirectory;
-use ZipArchive;
 
 class SolidtimeImporter extends DefaultImporter
 {
@@ -34,16 +33,10 @@ class SolidtimeImporter extends DefaultImporter
         $temporaryDirectoryZip = null;
         $temporaryDirectory = null;
         try {
-            $zip = new ZipArchive;
             $temporaryDirectoryZip = TemporaryDirectory::make();
             file_put_contents($temporaryDirectoryZip->path('import.zip'), $data);
-            $res = $zip->open($temporaryDirectoryZip->path('import.zip'), ZipArchive::RDONLY);
-            if ($res !== true) {
-                throw new ImportException('Invalid ZIP, error code: '.$res);
-            }
             $temporaryDirectory = TemporaryDirectory::make();
-            $zip->extractTo($temporaryDirectory->path());
-            $zip->close();
+            app(ZipImportHelper::class)->extract($temporaryDirectoryZip->path('import.zip'), $temporaryDirectory->path());
 
             if (! file_exists($temporaryDirectory->path('meta.json'))) {
                 throw new ImportException('File "meta.json" missing in ZIP');

app/Service/Import/Importers/TogglDataImporter.php

@@ -13,7 +13,6 @@ use Illuminate\Support\Str;
 use Override;
 use Spatie\TemporaryDirectory\TemporaryDirectory;
 use ValueError;
-use ZipArchive;
 
 class TogglDataImporter extends DefaultImporter
 {
@@ -26,16 +25,10 @@ class TogglDataImporter extends DefaultImporter
         $temporaryDirectoryZip = null;
         $temporaryDirectory = null;
         try {
-            $zip = new ZipArchive;
             $temporaryDirectoryZip = TemporaryDirectory::make();
             file_put_contents($temporaryDirectoryZip->path('import.zip'), $data);
-            $res = $zip->open($temporaryDirectoryZip->path('import.zip'), ZipArchive::RDONLY);
-            if ($res !== true) {
-                throw new ImportException('Invalid ZIP, error code: '.$res);
-            }
             $temporaryDirectory = TemporaryDirectory::make();
-            $zip->extractTo($temporaryDirectory->path());
-            $zip->close();
+            app(ZipImportHelper::class)->extract($temporaryDirectoryZip->path('import.zip'), $temporaryDirectory->path());
             if (! file_exists($temporaryDirectory->path('clients.json'))) {
                 throw new ImportException('File "clients.json" missing in ZIP');
             }

app/Service/Import/Importers/ZipImportHelper.php

@@ -0,0 +1,129 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Service\Import\Importers;
+
+use ZipArchive;
+
+/**
+ * Extracts uploaded ZIP archives with limits on file count, total uncompressed
+ * size and entry paths, so a small malicious archive can not fill the disk
+ * (decompression bomb) or write outside the target directory (zip slip).
+ */
+class ZipImportHelper
+{
+    private const int CHUNK_SIZE = 1024 * 1024;
+
+    /**
+     * @throws ImportException
+     */
+    public function extract(string $zipPath, string $targetPath): void
+    {
+        $zip = new ZipArchive;
+        $res = $zip->open($zipPath, ZipArchive::RDONLY);
+        if ($res !== true) {
+            throw new ImportException('Invalid ZIP, error code: '.$res);
+        }
+
+        try {
+            $maxFiles = (int) config('import.zip_max_files');
+            $maxUncompressedSize = (int) config('import.zip_max_uncompressed_size');
+
+            if ($zip->numFiles > $maxFiles) {
+                throw new ImportException('ZIP contains too many files, maximum is '.$maxFiles);
+            }
+
+            // Check the sizes declared in the archive before writing anything to disk
+            $declaredSize = 0;
+            for ($index = 0; $index < $zip->numFiles; $index++) {
+                $stat = $zip->statIndex($index);
+                if ($stat === false) {
+                    throw new ImportException('Invalid ZIP entry');
+                }
+                $this->validateEntryName($stat['name']);
+                $declaredSize += $stat['size'];
+                if ($declaredSize > $maxUncompressedSize) {
+                    throw new ImportException('ZIP uncompressed size exceeds the maximum of '.$maxUncompressedSize.' bytes');
+                }
+            }
+
+            // The declared sizes can be forged, so the written bytes are counted as well
+            $writtenSize = 0;
+            for ($index = 0; $index < $zip->numFiles; $index++) {
+                $stat = $zip->statIndex($index);
+                if ($stat === false) {
+                    throw new ImportException('Invalid ZIP entry');
+                }
+                $name = $stat['name'];
+                $entryPath = $targetPath.DIRECTORY_SEPARATOR.$name;
+
+                if (str_ends_with($name, '/')) {
+                    $this->ensureDirectoryExists($entryPath);
+
+                    continue;
+                }
+                $this->ensureDirectoryExists(dirname($entryPath));
+
+                $stream = $zip->getStreamIndex($index);
+                if ($stream === false) {
+                    throw new ImportException('ZIP entry "'.$name.'" can not be read');
+                }
+                $target = fopen($entryPath, 'wb');
+                if ($target === false) {
+                    fclose($stream);
+                    throw new ImportException('ZIP entry "'.$name.'" can not be extracted');
+                }
+                try {
+                    while (! feof($stream)) {
+                        $chunk = fread($stream, self::CHUNK_SIZE);
+                        if ($chunk === false) {
+                            throw new ImportException('ZIP entry "'.$name.'" can not be read');
+                        }
+                        $writtenSize += strlen($chunk);
+                        if ($writtenSize > $maxUncompressedSize) {
+                            throw new ImportException('ZIP uncompressed size exceeds the maximum of '.$maxUncompressedSize.' bytes');
+                        }
+                        fwrite($target, $chunk);
+                    }
+                } finally {
+                    fclose($target);
+                    fclose($stream);
+                }
+            }
+        } finally {
+            $zip->close();
+        }
+    }
+
+    /**
+     * @throws ImportException
+     */
+    private function validateEntryName(string $name): void
+    {
+        if ($name === '' || str_contains($name, "\0") || str_contains($name, '\\') || str_starts_with($name, '/')) {
+            throw new ImportException('ZIP contains an invalid file path: "'.$name.'"');
+        }
+        if (preg_match('/^[a-zA-Z]:/', $name) === 1) {
+            throw new ImportException('ZIP contains an invalid file path: "'.$name.'"');
+        }
+        foreach (explode('/', rtrim($name, '/')) as $segment) {
+            if ($segment === '' || $segment === '..') {
+                throw new ImportException('ZIP contains an invalid file path: "'.$name.'"');
+            }
+        }
+    }
+
+    /**
+     * @throws ImportException
+     */
+    private function ensureDirectoryExists(string $path): void
+    {
+        if (is_dir($path)) {
+            return;
+        }
+        if (! mkdir($path, 0700, true) && ! is_dir($path)) {
+            throw new ImportException('Directory "'.$path.'" can not be created');
+        }
+    }
+}

app/Service/InvitationService.php

@@ -18,6 +18,22 @@ use Illuminate\Support\Facades\Mail;
 
 class InvitationService
 {
+    public function hasAcceptedInvitationForEmail(string $email): bool
+    {
+        return OrganizationInvitation::query()
+            ->whereRaw('lower(email) = ?', [strtolower($email)])
+            ->whereNotNull('accepted_at')
+            ->exists();
+    }
+
+    public function hasPendingInvitationForEmail(string $email): bool
+    {
+        return OrganizationInvitation::query()
+            ->whereRaw('lower(email) = ?', [strtolower($email)])
+            ->whereNull('accepted_at')
+            ->exists();
+    }
+
     /**
      * @throws UserIsAlreadyMemberOfOrganizationApiException|InvitationForTheEmailAlreadyExistsApiException
      */

app/Service/LocalizationService.php

@@ -8,12 +8,14 @@ use App\Enums\CurrencyFormat;
 use App\Enums\DateFormat;
 use App\Enums\IntervalFormat;
 use App\Enums\NumberFormat;
+use App\Enums\TimeEntryAggregationType;
 use App\Enums\TimeFormat;
 use App\Models\Organization;
 use Brick\Math\BigDecimal;
 use Brick\Money\Money;
 use Carbon\CarbonInterface;
 use Carbon\CarbonInterval;
+use Illuminate\Support\Carbon;
 
 class LocalizationService
 {
@@ -152,6 +154,38 @@ class LocalizationService
         return $date->format($this->dateFormat->toCarbonFormat());
     }
 
+    /**
+     * Time group types have no server-side descriptor; their keys are ISO dates and are
+     * formatted here instead. A Week key is the first day of that week, so it renders as the
+     * range it covers. A Year key is already a bare year, so it is returned unchanged - it must
+     * not be parsed, Carbon reads a four digit string as a time of day.
+     */
+    public function formatTimeGroupKey(?string $key, TimeEntryAggregationType $groupType): ?string
+    {
+        if ($key === null) {
+            return null;
+        }
+
+        if ($groupType === TimeEntryAggregationType::Day) {
+            return $this->formatDate(Carbon::parse($key));
+        }
+
+        if ($groupType === TimeEntryAggregationType::Week) {
+            $weekStart = Carbon::parse($key);
+
+            return $this->formatDate($weekStart).' - '.$this->formatDate($weekStart->copy()->addDays(6));
+        }
+
+        if ($groupType === TimeEntryAggregationType::Month) {
+            // Note: the leading "!" resets all fields the format does not name. Without it the
+            // day of the month is taken from today, and a day that the parsed month does not
+            // have overflows the date into the next month.
+            return Carbon::createFromFormat('!Y-m', $key)->format('F Y');
+        }
+
+        return $key;
+    }
+
     public function setDateFormat(DateFormat $dateFormat): void
     {
         $this->dateFormat = $dateFormat;

app/Service/MemberService.php

@@ -218,7 +218,16 @@ class MemberService
 
         $placeholderUser = $user->replicate();
         $placeholderUser->is_placeholder = true;
-        $placeholderUser->current_team_id = $member->organization_id;
+        // Reset authentication relevant properties on the placeholder user
+        $placeholderUser->password = null;
+        $placeholderUser->remember_token = null;
+        $placeholderUser->two_factor_secret = null;
+        $placeholderUser->two_factor_recovery_codes = null;
+        $placeholderUser->two_factor_confirmed_at = null;
+        $placeholderUser->email_verified_at = null;
+        $placeholderUser->pending_email = null;
+        $placeholderUser->current_team_id = null;
+        $placeholderUser->profile_photo_path = null;
         $placeholderUser->save();
 
         $member->user()->associate($placeholderUser);

app/Service/PermissionStore.php

@@ -80,6 +80,10 @@ class PermissionStore
                 'invoices:update',
                 'invoices:download',
                 'invoices:delete',
+                'invoice-recipients:view',
+                'invoice-recipients:create',
+                'invoice-recipients:update',
+                'invoice-recipients:delete',
                 'invoice-settings:view',
                 'invoice-settings:update',
             ],
@@ -147,6 +151,10 @@ class PermissionStore
                 'invoices:update',
                 'invoices:download',
                 'invoices:delete',
+                'invoice-recipients:view',
+                'invoice-recipients:create',
+                'invoice-recipients:update',
+                'invoice-recipients:delete',
                 'invoice-settings:view',
                 'invoice-settings:update',
             ],
@@ -203,6 +211,10 @@ class PermissionStore
                 'invoices:update',
                 'invoices:download',
                 'invoices:delete',
+                'invoice-recipients:view',
+                'invoice-recipients:create',
+                'invoice-recipients:update',
+                'invoice-recipients:delete',
                 'invoice-settings:view',
                 'invoice-settings:update',
             ],

app/Service/ReportExport/TimeEntriesReportExport.php

@@ -6,6 +6,7 @@ namespace App\Service\ReportExport;
 
 use App\Enums\ExportFormat;
 use App\Enums\TimeEntryAggregationType;
+use App\Service\LocalizationService;
 use Illuminate\View\View;
 use Maatwebsite\Excel\Concerns\Exportable;
 use Maatwebsite\Excel\Concerns\FromView;
@@ -48,6 +49,8 @@ class TimeEntriesReportExport implements FromView, ShouldAutoSize, WithCustomCsv
 
     private bool $showBillableRate;
 
+    private LocalizationService $localization;
+
     /**
      * @param array{
      *         grouped_type: string|null,
@@ -68,7 +71,7 @@ class TimeEntriesReportExport implements FromView, ShouldAutoSize, WithCustomCsv
      *         cost: int|null
      *   } $data
      */
-    public function __construct(array $data, ExportFormat $exportFormat, string $currency, TimeEntryAggregationType $group, TimeEntryAggregationType $subGroup, bool $showBillableRate)
+    public function __construct(array $data, ExportFormat $exportFormat, string $currency, TimeEntryAggregationType $group, TimeEntryAggregationType $subGroup, bool $showBillableRate, LocalizationService $localization)
     {
         $this->data = $data;
         $this->exportFormat = $exportFormat;
@@ -76,6 +79,7 @@ class TimeEntriesReportExport implements FromView, ShouldAutoSize, WithCustomCsv
         $this->group = $group;
         $this->subGroup = $subGroup;
         $this->showBillableRate = $showBillableRate;
+        $this->localization = $localization;
     }
 
     public function view(): View
@@ -87,6 +91,7 @@ class TimeEntriesReportExport implements FromView, ShouldAutoSize, WithCustomCsv
             'subGroup' => $this->subGroup,
             'exportFormat' => $this->exportFormat,
             'showBillableRate' => $this->showBillableRate,
+            'localization' => $this->localization,
         ]);
     }
 

config/app.php

@@ -75,11 +75,32 @@ return [
 
     'url' => env('APP_URL', 'http://localhost'),
 
+    /*
+    |--------------------------------------------------------------------------
+    | Trusted Hosts
+    |--------------------------------------------------------------------------
+    |
+    | Additional hostnames (besides the APP_URL host and its subdomains) that
+    | the application is allowed to respond on. This is needed for multi-host
+    | setups, e.g. reaching the instance over both a public domain and a
+    | Tailscale name. A request arriving on any host that is neither APP_URL
+    | (nor a subdomain of it) nor listed here is rejected, which prevents
+    | Host-header poisoning of password reset and other out-of-band links.
+    |
+    | See App\Http\Middleware\TrustHosts.
+    |
+    */
+
+    'trusted_hosts' => array_values(array_filter(array_map(
+        'trim',
+        explode(',', (string) env('TRUSTED_HOSTS', ''))
+    ))),
+
     'asset_url' => env('ASSET_URL'),
 
     'force_https' => (bool) env('APP_FORCE_HTTPS', false),
 
-    'enable_registration' => (bool) env('APP_ENABLE_REGISTRATION', false),
+    'enable_registration' => env('APP_ENABLE_REGISTRATION', 'off'),
 
     'local_email_verification' => (bool) env('APP_LOCAL_EMAIL_VERIFICATION', false),
 
@@ -137,6 +158,21 @@ return [
 
     'pagination_per_page_default' => (int) env('PAGINATION_PER_PAGE_DEFAULT', 15),
 
+    /*
+    |--------------------------------------------------------------------------
+    | API Rate Limiting
+    |--------------------------------------------------------------------------
+    |
+    | The number of API requests allowed per minute, counted per user for
+    | authenticated requests and per IP address for guest requests. These
+    | limits are only enforced when the application runs in production.
+    |
+    */
+
+    'api_rate_limit_authenticated_per_minute' => (int) (env('API_RATE_LIMIT_AUTH_PER_MINUTE') ?: 200),
+
+    'api_rate_limit_guest_per_minute' => (int) (env('API_RATE_LIMIT_GUEST_PER_MINUTE') ?: 60),
+
     /*
     |--------------------------------------------------------------------------
     | Encryption Key

config/import.php

@@ -0,0 +1,34 @@
+<?php
+
+declare(strict_types=1);
+
+return [
+
+    /*
+    |--------------------------------------------------------------------------
+    | Import payload limit
+    |--------------------------------------------------------------------------
+    |
+    | Maximum length of the base64 encoded "data" field of an import request in
+    | bytes. Requests with a larger payload are rejected with a validation error.
+    |
+    */
+
+    'max_data_size' => (int) (env('IMPORT_MAX_DATA_SIZE') ?: 50 * 1024 * 1024),
+
+    /*
+    |--------------------------------------------------------------------------
+    | ZIP extraction limits
+    |--------------------------------------------------------------------------
+    |
+    | Limits applied to ZIP based importers before and during extraction to
+    | protect the instance against decompression bombs. The uncompressed size
+    | is the sum of all files in the archive in bytes.
+    |
+    */
+
+    'zip_max_files' => (int) (env('IMPORT_ZIP_MAX_FILES') ?: 100),
+
+    'zip_max_uncompressed_size' => (int) (env('IMPORT_ZIP_MAX_UNCOMPRESSED_SIZE') ?: 500 * 1024 * 1024),
+
+];

database/migrations/2026_08_24_000001_add_application_query_indexes.php

@@ -0,0 +1,230 @@
+<?php
+
+declare(strict_types=1);
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Support\Facades\DB;
+use Illuminate\Support\Facades\Log;
+
+use function Laravel\Prompts\info as consoleInfo;
+
+return new class extends Migration
+{
+    /**
+     * PostgreSQL cannot build or drop an index concurrently inside a transaction.
+     * Keeping this migration non-transactional prevents long write locks in production.
+     *
+     * @var bool
+     */
+    public $withinTransaction = false;
+
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        // Tenant-scoped client pagination ordered by newest first; also covers the organization FK.
+        $this->runIndexOperation('create', 'clients_organization_created_id_index', 'CREATE INDEX CONCURRENTLY clients_organization_created_id_index ON clients (organization_id, created_at DESC, id)');
+
+        // Tenant-scoped project pagination ordered by newest first; also covers the organization FK.
+        $this->runIndexOperation('create', 'projects_organization_created_id_index', 'CREATE INDEX CONCURRENTLY projects_organization_created_id_index ON projects (organization_id, created_at DESC, id)');
+        // Speeds client relationship loads and the FK check when a client is deleted or its ID changes.
+        $this->runIndexOperation('create', 'projects_client_id_index', 'CREATE INDEX CONCURRENTLY projects_client_id_index ON projects (client_id)');
+
+        // Tenant-scoped task pagination ordered by newest first; also covers the organization FK.
+        $this->runIndexOperation('create', 'tasks_organization_created_id_index', 'CREATE INDEX CONCURRENTLY tasks_organization_created_id_index ON tasks (organization_id, created_at DESC, id)');
+        // Speeds project task lists and the FK check when a project is deleted or its ID changes.
+        $this->runIndexOperation('create', 'tasks_project_id_index', 'CREATE INDEX CONCURRENTLY tasks_project_id_index ON tasks (project_id)');
+
+        // Tenant-scoped tag pagination ordered by newest first; also covers the organization FK.
+        $this->runIndexOperation('create', 'tags_organization_created_id_index', 'CREATE INDEX CONCURRENTLY tags_organization_created_id_index ON tags (organization_id, created_at DESC, id)');
+
+        // Tenant-scoped report pagination ordered by newest first; also covers the organization FK.
+        $this->runIndexOperation('create', 'reports_organization_created_id_index', 'CREATE INDEX CONCURRENTLY reports_organization_created_id_index ON reports (organization_id, created_at DESC, id)');
+
+        // Tenant-scoped member pagination; the existing (organization_id, user_id) unique index remains for membership lookup.
+        $this->runIndexOperation('create', 'members_organization_created_id_index', 'CREATE INDEX CONCURRENTLY members_organization_created_id_index ON members (organization_id, created_at DESC, id)');
+        // Supports reverse user-to-membership lookups and the FK check when a user is deleted or its ID changes.
+        $this->runIndexOperation('create', 'members_user_id_index', 'CREATE INDEX CONCURRENTLY members_user_id_index ON members (user_id)');
+
+        // The existing (project_id, user_id) unique index covers project_id, but member_id and legacy user_id need reverse indexes.
+        $this->runIndexOperation('create', 'project_members_member_id_index', 'CREATE INDEX CONCURRENTLY project_members_member_id_index ON project_members (member_id)');
+        $this->runIndexOperation('create', 'project_members_user_id_index', 'CREATE INDEX CONCURRENTLY project_members_user_id_index ON project_members (user_id)');
+
+        // Supports organization deletion/current-team cleanup and the FK check on users.current_team_id.
+        $this->runIndexOperation('create', 'users_current_team_id_index', 'CREATE INDEX CONCURRENTLY users_current_team_id_index ON users (current_team_id)');
+
+        // Filament loads the newest audits first; this avoids scanning and sorting the large append-only audit table.
+        $this->runIndexOperation('create', 'audits_created_at_index', 'CREATE INDEX CONCURRENTLY audits_created_at_index ON audits (created_at DESC)');
+
+        // Main tenant time-entry range/pagination path, including its start DESC, id ordering; also covers the organization FK.
+        $this->runIndexOperation('create', 'time_entries_organization_start_id_index', 'CREATE INDEX CONCURRENTLY time_entries_organization_start_id_index ON time_entries (organization_id, start DESC, id)');
+        // Filament lists time entries globally by creation time, so the tenant-prefixed index cannot provide this ordering.
+        $this->runIndexOperation('create', 'time_entries_created_at_index', 'CREATE INDEX CONCURRENTLY time_entries_created_at_index ON time_entries (created_at DESC)');
+        // Dashboard history is consistently filtered by user and organization, then bounded by start; user first also covers its FK.
+        $this->runIndexOperation('create', 'time_entries_user_organization_start_index', 'CREATE INDEX CONCURRENTLY time_entries_user_organization_start_index ON time_entries (user_id, organization_id, start)');
+        // Member timelines, overlap checks, and billable-rate updates start with member_id; also covers its FK.
+        $this->runIndexOperation('create', 'time_entries_member_start_index', 'CREATE INDEX CONCURRENTLY time_entries_member_start_index ON time_entries (member_id, start)');
+        // These relationship/filter indexes also prevent full scans for FK checks when parent rows change or are deleted.
+        $this->runIndexOperation('create', 'time_entries_project_id_index', 'CREATE INDEX CONCURRENTLY time_entries_project_id_index ON time_entries (project_id)');
+        $this->runIndexOperation('create', 'time_entries_task_id_index', 'CREATE INDEX CONCURRENTLY time_entries_task_id_index ON time_entries (task_id)');
+        $this->runIndexOperation('create', 'time_entries_client_id_index', 'CREATE INDEX CONCURRENTLY time_entries_client_id_index ON time_entries (client_id)');
+        // Active-timer checks touch only open entries, so a partial index stays small while serving the hot member_id lookup.
+        $this->runIndexOperation('create', 'time_entries_active_member_index', 'CREATE INDEX CONCURRENTLY time_entries_active_member_index ON time_entries (member_id) WHERE "end" IS NULL');
+        // whereJsonContains(tags, tag_id) compiles to JSONB containment, which is supported by a GIN index.
+        $this->runIndexOperation('create', 'time_entries_tags_gin_index', 'CREATE INDEX CONCURRENTLY time_entries_tags_gin_index ON time_entries USING GIN (tags)');
+
+        // Passport already indexes user_id; these indexes cover the other FK used during OAuth client deletion/update.
+        $this->runIndexOperation('create', 'oauth_access_tokens_client_id_index', 'CREATE INDEX CONCURRENTLY oauth_access_tokens_client_id_index ON oauth_access_tokens (client_id)');
+        $this->runIndexOperation('create', 'oauth_auth_codes_client_id_index', 'CREATE INDEX CONCURRENTLY oauth_auth_codes_client_id_index ON oauth_auth_codes (client_id)');
+
+        // owner_id is already the leading column of oauth_clients_owner_id_owner_type_index.
+        $this->runIndexOperation('drop', 'oauth_clients_user_id_index', 'DROP INDEX CONCURRENTLY oauth_clients_user_id_index');
+        // Public report lookup starts with the unique share_secret index; no query filters only by this boolean.
+        $this->runIndexOperation('drop', 'reports_is_public_index', 'DROP INDEX CONCURRENTLY reports_is_public_index');
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        $indexes = [
+            'clients_organization_created_id_index',
+            'projects_organization_created_id_index',
+            'projects_client_id_index',
+            'tasks_organization_created_id_index',
+            'tasks_project_id_index',
+            'tags_organization_created_id_index',
+            'reports_organization_created_id_index',
+            'members_organization_created_id_index',
+            'members_user_id_index',
+            'project_members_member_id_index',
+            'project_members_user_id_index',
+            'users_current_team_id_index',
+            'audits_created_at_index',
+            'time_entries_organization_start_id_index',
+            'time_entries_created_at_index',
+            'time_entries_user_organization_start_index',
+            'time_entries_member_start_index',
+            'time_entries_project_id_index',
+            'time_entries_task_id_index',
+            'time_entries_client_id_index',
+            'time_entries_active_member_index',
+            'time_entries_tags_gin_index',
+            'oauth_access_tokens_client_id_index',
+            'oauth_auth_codes_client_id_index',
+        ];
+
+        $concurrently = DB::transactionLevel() === 0 ? ' CONCURRENTLY' : '';
+        foreach ($indexes as $index) {
+            $this->runIndexOperation('drop', $index, 'DROP INDEX'.$concurrently.' IF EXISTS '.$index);
+        }
+
+        $this->runIndexOperation('create', 'oauth_clients_user_id_index', 'CREATE INDEX'.$concurrently.' oauth_clients_user_id_index ON oauth_clients (owner_id)');
+        $this->runIndexOperation('create', 'reports_is_public_index', 'CREATE INDEX'.$concurrently.' reports_is_public_index ON reports (is_public)');
+    }
+
+    private function runIndexOperation(string $operation, string $index, string $statement): void
+    {
+        $indexState = $this->indexState($index);
+
+        if ($operation === 'create' && $indexState === ['valid' => true, 'ready' => true]) {
+            $this->writeProgress(sprintf('Skipping index [%s] because it already exists and is valid', $index));
+
+            return;
+        }
+
+        if ($operation === 'drop' && $indexState === null) {
+            $this->writeProgress(sprintf('Skipping index [%s] because it does not exist', $index));
+
+            return;
+        }
+
+        if ($operation === 'create' && $indexState !== null) {
+            $this->writeProgress(sprintf(
+                'Index [%s] exists but is incomplete (valid=%s, ready=%s); dropping it before rebuilding',
+                $index,
+                $indexState['valid'] ? 'true' : 'false',
+                $indexState['ready'] ? 'true' : 'false',
+            ));
+            $this->executeIndexStatement(
+                'drop incomplete',
+                $index,
+                (DB::transactionLevel() === 0 ? 'DROP INDEX CONCURRENTLY ' : 'DROP INDEX ').$this->quoteIdentifier($index),
+            );
+        }
+
+        $this->executeIndexStatement($operation, $index, $statement);
+    }
+
+    private function executeIndexStatement(string $operation, string $index, string $statement): void
+    {
+        $startedAt = microtime(true);
+        $this->writeProgress(sprintf('Starting to %s index [%s]', $operation, $index));
+
+        try {
+            DB::statement($statement);
+        } catch (Throwable $exception) {
+            $this->writeProgress(sprintf(
+                'Failed to %s index [%s] after %.2f seconds: %s',
+                $operation,
+                $index,
+                microtime(true) - $startedAt,
+                $exception->getMessage(),
+            ));
+
+            throw $exception;
+        }
+
+        $this->writeProgress(sprintf(
+            'Finished %s index [%s] in %.2f seconds',
+            $operation === 'create' ? 'creating' : 'dropping',
+            $index,
+            microtime(true) - $startedAt,
+        ));
+    }
+
+    /**
+     * @return array{valid: bool, ready: bool}|null
+     */
+    private function indexState(string $index): ?array
+    {
+        $state = DB::selectOne(
+            <<<'SQL'
+                SELECT pg_index.indisvalid::int AS valid, pg_index.indisready::int AS ready
+                FROM pg_index
+                JOIN pg_class ON pg_class.oid = pg_index.indexrelid
+                JOIN pg_namespace ON pg_namespace.oid = pg_class.relnamespace
+                WHERE pg_namespace.nspname = current_schema()
+                  AND pg_class.relname = ?
+                SQL,
+            [$index],
+        );
+
+        if ($state === null) {
+            return null;
+        }
+
+        return [
+            'valid' => (bool) $state->valid,
+            'ready' => (bool) $state->ready,
+        ];
+    }
+
+    private function quoteIdentifier(string $identifier): string
+    {
+        return DB::connection()->getQueryGrammar()->wrap($identifier);
+    }
+
+    private function writeProgress(string $message): void
+    {
+        if (app()->runningUnitTests()) {
+            return;
+        }
+
+        $message = sprintf('[%s] %s', date(DATE_ATOM), $message);
+        Log::info($message);
+        consoleInfo($message);
+    }
+};

database/migrations/2026_08_31_000001_add_send_time_entry_still_running_email_to_users_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('users', function (Blueprint $table): void {
+            $table->boolean('send_time_entry_still_running_email')->default(true)->after('week_start');
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::table('users', function (Blueprint $table): void {
+            $table->dropColumn('send_time_entry_still_running_email');
+        });
+    }
+};

database/migrations/2026_09_16_000001_remove_credentials_from_placeholder_users.php

@@ -0,0 +1,53 @@
+<?php
+
+declare(strict_types=1);
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Query\Builder;
+use Illuminate\Support\Facades\DB;
+
+return new class extends Migration
+{
+    /**
+     * Placeholder users used to be created as a full copy of the user they were made from,
+     * which included the credentials and the account state of that user. A placeholder is a
+     * stand-in for a person in one organization, not an account, and the row shares the email
+     * address with the real account, so these values are removed from the placeholders that
+     * already exist. The organization a placeholder belongs to is recorded on its member row.
+     */
+    public function up(): void
+    {
+        DB::table('users')
+            ->where('is_placeholder', '=', true)
+            ->where(function (Builder $builder): void {
+                $builder->whereNotNull('password')
+                    ->orWhereNotNull('remember_token')
+                    ->orWhereNotNull('two_factor_secret')
+                    ->orWhereNotNull('two_factor_recovery_codes')
+                    ->orWhereNotNull('two_factor_confirmed_at')
+                    ->orWhereNotNull('email_verified_at')
+                    ->orWhereNotNull('pending_email')
+                    ->orWhereNotNull('current_team_id')
+                    ->orWhereNotNull('profile_photo_path');
+            })
+            ->update([
+                'password' => null,
+                'remember_token' => null,
+                'two_factor_secret' => null,
+                'two_factor_recovery_codes' => null,
+                'two_factor_confirmed_at' => null,
+                'email_verified_at' => null,
+                'pending_email' => null,
+                'current_team_id' => null,
+                'profile_photo_path' => null,
+            ]);
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        //
+    }
+};

e2e/calendar.spec.ts

@@ -252,19 +252,19 @@ test('test that calendar page loads and displays time entries', async ({ page, c
 test('test that calendar navigation buttons work', async ({ page }) => {
     await goToCalendar(page);
     await expect(page.locator('.fc')).toBeVisible();
+    await expect(page.getByTestId('calendar-title')).toContainText('This Week');
 
-    // Click the "next" button to navigate forward
-    await page.getByRole('button', { name: 'Next' }).click();
-    await expect(page.locator('.fc')).toBeVisible();
-
-    // Click the "prev" button to navigate back
+    // Navigate between named periods.
     await page.getByRole('button', { name: 'Previous' }).click();
-    await expect(page.locator('.fc')).toBeVisible();
-
-    // Navigate forward first, then click today
+    await expect(page.getByTestId('calendar-title')).toContainText('Last Week');
     await page.getByRole('button', { name: 'Next' }).click();
+    await expect(page.getByTestId('calendar-title')).toContainText('This Week');
+
+    // Navigate forward first, then use the range button to return to today.
+    await page.getByRole('button', { name: 'Next' }).click();
+    await expect(page.getByTestId('calendar-title')).toContainText('Next Week');
     await page.getByRole('button', { name: 'today' }).click();
-    await expect(page.locator('.fc')).toBeVisible();
+    await expect(page.getByTestId('calendar-title')).toContainText('This Week');
 });
 
 test('test that editing time entry description via calendar modal works', async ({ page, ctx }) => {

e2e/clients.spec.ts

@@ -8,7 +8,7 @@ import {
     createProjectViaApi,
     createPublicProjectViaApi,
 } from './utils/api';
-import { getTableRowNames } from './utils/table';
+import { clearTableState, getTableRowNames } from './utils/table';
 
 async function goToClientsOverview(page: Page) {
     await page.goto(PLAYWRIGHT_BASE_URL + '/clients');
@@ -210,18 +210,12 @@ test('test that client context menu delete deletes the client', async ({ page, c
 // Sorting Tests
 // =============================================
 
-async function clearClientTableState(page: Page) {
-    await page.evaluate(() => {
-        localStorage.removeItem('client-table-state');
-    });
-}
-
 test('test that sorting clients by name and status works', async ({ page, ctx }) => {
     await createClientViaApi(ctx, { name: 'AAA SortClient' });
     await createClientViaApi(ctx, { name: 'ZZZ SortClient' });
 
     await goToClientsOverview(page);
-    await clearClientTableState(page);
+    await clearTableState(page, 'client-table-state');
     await page.reload();
 
     const table = page.getByTestId('client_table');
@@ -253,7 +247,7 @@ test('test that sorting clients by project count works', async ({ page, ctx }) =
     await createProjectViaApi(ctx, { name: 'Proj2', client_id: clientWithMany.id });
 
     await goToClientsOverview(page);
-    await clearClientTableState(page);
+    await clearTableState(page, 'client-table-state');
     await page.reload();
 
     const table = page.getByTestId('client_table');
@@ -274,7 +268,7 @@ test('test that sorting clients by project count works', async ({ page, ctx }) =
 
 test('test that client sort state persists after page reload', async ({ page }) => {
     await goToClientsOverview(page);
-    await clearClientTableState(page);
+    await clearTableState(page, 'client-table-state');
     await page.reload();
 
     const table = page.getByTestId('client_table');
@@ -397,7 +391,7 @@ test.describe('Clients Pagination', () => {
         );
 
         await goToClientsOverview(page);
-        await clearClientTableState(page);
+        await clearTableState(page, 'client-table-state');
         await page.reload();
 
         // Default sort is name asc; first 15 clients (00–14) on page 1.
@@ -450,7 +444,7 @@ test.describe('Clients Pagination', () => {
         );
 
         await goToClientsOverview(page);
-        await clearClientTableState(page);
+        await clearTableState(page, 'client-table-state');
         await page.reload();
 
         await expect(page.getByTestId('client_table')).toBeVisible();
@@ -470,7 +464,7 @@ test.describe('Clients Pagination', () => {
         );
 
         await goToClientsOverview(page);
-        await clearClientTableState(page);
+        await clearTableState(page, 'client-table-state');
         await page.reload();
 
         await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });

e2e/invitation-registration-prefill.spec.ts

@@ -0,0 +1,32 @@
+import { expect, test } from '../playwright/fixtures';
+import { PLAYWRIGHT_BASE_URL } from '../playwright/config';
+import { getInvitationAcceptUrl } from './utils/mailpit';
+
+test('prefills the registration email after accepting an invitation', async ({ page, browser }) => {
+    const memberId = `${Date.now()}-${Math.floor(Math.random() * 100000)}`;
+    const memberEmail = `prefill-${memberId}@invitation.test`;
+
+    await page.goto(PLAYWRIGHT_BASE_URL + '/members');
+    await page.getByRole('button', { name: 'Invite Member' }).click();
+    await page.getByPlaceholder('Member Email').fill(memberEmail);
+    await page.getByRole('button', { name: 'Employee' }).click();
+    await Promise.all([
+        page.waitForResponse(
+            (response) =>
+                response.url().includes('/invitations') &&
+                response.request().method() === 'POST' &&
+                response.status() === 204
+        ),
+        page.getByRole('button', { name: 'Invite Member', exact: true }).click(),
+    ]);
+
+    const inviteeContext = await browser.newContext();
+    const inviteePage = await inviteeContext.newPage();
+    const acceptUrl = await getInvitationAcceptUrl(inviteePage.request, memberEmail);
+    await inviteePage.goto(acceptUrl);
+    await inviteePage.waitForURL(/\/register$/);
+
+    await expect(inviteePage.getByLabel('Email')).toHaveValue(memberEmail);
+
+    await inviteeContext.close();
+});

e2e/members.spec.ts

@@ -11,7 +11,7 @@ import {
     updateMemberBillableRateViaApi,
     updateOrganizationSettingViaApi,
 } from './utils/api';
-import { getTableRowNames } from './utils/table';
+import { clearTableState, getTableRowNames } from './utils/table';
 
 // Tests that invite + accept members need more time
 test.describe.configure({ timeout: 45000 });
@@ -779,20 +779,18 @@ test('test that accepted invitation disappears from invitations tab', async ({ p
 // Sorting Tests
 // =============================================
 
-// Helper to clear localStorage before tests that check sorting
-async function clearMemberTableState(page: Page) {
-    await page.evaluate(() => {
-        localStorage.removeItem('member-table-state');
-    });
-}
-
 test('test that sorting members by name, role, and status works', async ({ page, ctx }) => {
-    // Create two placeholder members with names that sort predictably around "John Doe"
+    // Create two placeholder members with names that sort predictably around "John Doe".
+    // Seeded alphabetically a second apart: created_at only has second precision and
+    // same-second rows fall back to a random UUID order. The spacing is what makes the
+    // API order (created_at desc: ZZZ, AAA, John) deterministic, so the tie-break
+    // assertions below are testing the tie-break rather than a coin flip.
     await createPlaceholderMemberViaImportApi(ctx, 'AAA SortFirst');
+    await page.waitForTimeout(1100);
     await createPlaceholderMemberViaImportApi(ctx, 'ZZZ SortLast');
 
     await goToMembersPage(page);
-    await clearMemberTableState(page);
+    await clearTableState(page, 'member-table-state');
     await page.reload();
 
     const table = page.getByTestId('member_table');
@@ -814,20 +812,24 @@ test('test that sorting members by name, role, and status works', async ({ page,
     const ownerIdx = names.indexOf('John Doe');
     const placeholderIdx = names.indexOf('AAA SortFirst');
     expect(ownerIdx).toBeLessThan(placeholderIdx);
+    expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('ZZZ SortLast'));
 
     await roleHeader.click(); // desc: Placeholder first
     names = await getTableRowNames(table);
     expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('John Doe'));
+    expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('ZZZ SortLast'));
 
     // -- Status sorting --
     const statusHeader = table.getByText('Status').first();
     await statusHeader.click(); // asc: Active(0) < Inactive(1)
     names = await getTableRowNames(table);
     expect(names.indexOf('John Doe')).toBeLessThan(names.indexOf('AAA SortFirst'));
+    expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('ZZZ SortLast'));
 
     await statusHeader.click(); // desc: Inactive first
     names = await getTableRowNames(table);
     expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('John Doe'));
+    expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('ZZZ SortLast'));
 
     // -- Email: just verify sort indicator appears --
     const emailHeader = table.getByText('Email').first();
@@ -837,7 +839,7 @@ test('test that sorting members by name, role, and status works', async ({ page,
 
 test('test that member sort state persists after page reload', async ({ page }) => {
     await goToMembersPage(page);
-    await clearMemberTableState(page);
+    await clearTableState(page, 'member-table-state');
     await page.reload();
 
     const table = page.getByTestId('member_table');
@@ -875,7 +877,7 @@ test('test that sorting members by billable rate works', async ({ page, ctx }) =
     await updateMemberBillableRateViaApi(ctx, lowRateMember!.id, 5000);
 
     await goToMembersPage(page);
-    await clearMemberTableState(page);
+    await clearTableState(page, 'member-table-state');
     await page.reload();
 
     const table = page.getByTestId('member_table');

e2e/profile.spec.ts

@@ -20,6 +20,12 @@ function profileInformationForm(page: Page) {
         .locator('xpath=ancestor::*[descendant::form][1]');
 }
 
+function notificationSettingsForm(page: Page) {
+    return page
+        .getByRole('heading', { name: 'Notifications', exact: true })
+        .locator('xpath=ancestor::*[descendant::form][1]');
+}
+
 async function saveProfileForm(page: Page): Promise<void> {
     const form = profileInformationForm(page);
     await form.getByRole('button', { name: 'Save' }).click();
@@ -50,6 +56,22 @@ test('week-start change persists across reload', async ({ page }) => {
     await expect(page.getByLabel('Start of the week')).toHaveValue('sunday');
 });
 
+test('still-running email notification setting persists across reload', async ({ page }) => {
+    await goToProfilePage(page);
+    const form = notificationSettingsForm(page);
+    const checkbox = form.getByLabel('Still-running time entry reminders');
+
+    await expect(checkbox).toBeChecked();
+    await checkbox.uncheck();
+    await form.getByRole('button', { name: 'Save' }).click();
+    await expect(form.getByText('Saved.', { exact: true })).toBeVisible();
+
+    await page.reload();
+    await expect(
+        notificationSettingsForm(page).getByLabel('Still-running time entry reminders')
+    ).not.toBeChecked();
+});
+
 test('profile photo can be uploaded, persists across reload, and can be removed', async ({
     page,
 }) => {

e2e/projects.spec.ts

@@ -13,18 +13,12 @@ import {
     archiveProjectViaApi,
     updateOrganizationSettingViaApi,
 } from './utils/api';
+import { clearTableState, getSeededRowOrder } from './utils/table';
 
 async function goToProjectsOverview(page: Page) {
     await page.goto(PLAYWRIGHT_BASE_URL + '/projects');
 }
 
-// Helper to clear localStorage before tests that check persistence
-async function clearProjectTableState(page: Page) {
-    await page.evaluate(() => {
-        localStorage.removeItem('project-table-state');
-    });
-}
-
 // Create new project via modal
 test('test that creating and deleting a new project via the modal works', async ({ page }) => {
     const newProjectName = 'New Project ' + Math.floor(1 + Math.random() * 10000);
@@ -84,7 +78,7 @@ test('test that archiving and unarchiving projects works', async ({ page, ctx })
     await createProjectViaApi(ctx, { name: newProjectName });
 
     await goToProjectsOverview(page);
-    await clearProjectTableState(page);
+    await clearTableState(page, 'project-table-state');
     await page.reload();
     await expect(page.getByText(newProjectName)).toBeVisible({ timeout: 10000 });
 
@@ -480,7 +474,7 @@ test('test that sorting projects by all columns works', async ({ page, ctx }) =>
     });
 
     await goToProjectsOverview(page);
-    await clearProjectTableState(page);
+    await clearTableState(page, 'project-table-state');
     await page.reload();
     await expect(page.getByTestId('project_table')).toBeVisible();
     await expect(page.getByText('AAA Project')).toBeVisible();
@@ -609,7 +603,7 @@ test('test that filtering projects by status works', async ({ page, ctx }) => {
     await createProjectViaApi(ctx, { name: newProjectName });
 
     await goToProjectsOverview(page);
-    await clearProjectTableState(page);
+    await clearTableState(page, 'project-table-state');
     await page.reload();
     await expect(page.getByText(newProjectName)).toBeVisible({ timeout: 10000 });
 
@@ -640,7 +634,7 @@ test('test that filtering projects by status works', async ({ page, ctx }) => {
 
 test('test that filter state persists after page reload', async ({ page }) => {
     await goToProjectsOverview(page);
-    await clearProjectTableState(page);
+    await clearTableState(page, 'project-table-state');
     await page.reload();
 
     // Apply Active status filter
@@ -656,9 +650,96 @@ test('test that filter state persists after page reload', async ({ page }) => {
     await expect(page.getByTestId('status-filter-badge')).toBeVisible();
 });
 
+test('test that projects without a client or estimate are ordered by name at the bottom', async ({
+    page,
+    ctx,
+}) => {
+    // Seeded a second apart: created_at only has second precision and same-second rows
+    // fall back to a random UUID order. The spacing makes the API order of the clientless
+    // rows (created_at desc: ZZZ, AAA) deterministic and different from the alphabetical
+    // order the name tie-break should produce.
+    await createProjectViaApi(ctx, { name: 'AAA Tiebreak Project' });
+    await page.waitForTimeout(1100);
+    await createProjectViaApi(ctx, { name: 'ZZZ Tiebreak Project' });
+
+    const clientAardvark = await createClientViaApi(ctx, { name: 'Aardvark Co' });
+    const clientZulu = await createClientViaApi(ctx, { name: 'Zulu Co' });
+    const projectM = await createProjectViaApi(ctx, {
+        name: 'MMM Tiebreak Project',
+        client_id: clientAardvark.id,
+        estimated_time: 36000, // 10h, 1h tracked below = 10%
+    });
+    await createTimeEntryViaApi(ctx, { duration: '1h', projectId: projectM.id });
+    const projectN = await createProjectViaApi(ctx, {
+        name: 'NNN Tiebreak Project',
+        client_id: clientZulu.id,
+        estimated_time: 14400, // 4h, 2h tracked below = 50%
+    });
+    await createTimeEntryViaApi(ctx, { duration: '2h', projectId: projectN.id });
+
+    await goToProjectsOverview(page);
+    await clearTableState(page, 'project-table-state');
+    await page.reload();
+
+    const table = page.getByTestId('project_table');
+    await expect(table).toBeVisible();
+
+    const seeded = [
+        'AAA Tiebreak Project',
+        'MMM Tiebreak Project',
+        'NNN Tiebreak Project',
+        'ZZZ Tiebreak Project',
+    ];
+    const getOrder = () => getSeededRowOrder(table, seeded);
+
+    // -- Client: empty rows last in both directions, alphabetical among themselves --
+    const clientHeader = table.locator('.select-none', { hasText: 'Client' }).first();
+    await clientHeader.click();
+    await expect
+        .poll(getOrder)
+        .toEqual([
+            'MMM Tiebreak Project',
+            'NNN Tiebreak Project',
+            'AAA Tiebreak Project',
+            'ZZZ Tiebreak Project',
+        ]);
+
+    await clientHeader.click();
+    await expect
+        .poll(getOrder)
+        .toEqual([
+            'NNN Tiebreak Project',
+            'MMM Tiebreak Project',
+            'AAA Tiebreak Project',
+            'ZZZ Tiebreak Project',
+        ]);
+
+    // -- Progress: same, and the first click sorts highest first --
+    const progressHeader = table.locator('.select-none', { hasText: 'Progress' }).first();
+    await progressHeader.click();
+    await expect
+        .poll(getOrder)
+        .toEqual([
+            'NNN Tiebreak Project',
+            'MMM Tiebreak Project',
+            'AAA Tiebreak Project',
+            'ZZZ Tiebreak Project',
+        ]);
+
+    await progressHeader.click();
+    await expect
+        .poll(getOrder)
+        .toEqual([
+            'MMM Tiebreak Project',
+            'NNN Tiebreak Project',
+            'AAA Tiebreak Project',
+            'ZZZ Tiebreak Project',
+        ]);
+});
+
 test('test that sort state persists after page reload', async ({ page }) => {
     await goToProjectsOverview(page);
-    await clearProjectTableState(page);
+    await clearTableState(page, 'project-table-state');
     await page.reload();
 
     // Click on Name header twice to sort descending
@@ -1114,7 +1195,7 @@ test.describe('Projects Pagination', () => {
         );
 
         await goToProjectsOverview(page);
-        await clearProjectTableState(page);
+        await clearTableState(page, 'project-table-state');
         await page.reload();
 
         // Default sort is name asc; first 15 projects (00–14) should be on page 1.
@@ -1168,7 +1249,7 @@ test.describe('Projects Pagination', () => {
         );
 
         await goToProjectsOverview(page);
-        await clearProjectTableState(page);
+        await clearTableState(page, 'project-table-state');
         await page.reload();
 
         await expect(page.getByTestId('project_table')).toBeVisible();
@@ -1185,7 +1266,7 @@ test.describe('Projects Pagination', () => {
         );
 
         await goToProjectsOverview(page);
-        await clearProjectTableState(page);
+        await clearTableState(page, 'project-table-state');
         await page.reload();
 
         await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });
@@ -1207,3 +1288,36 @@ test.describe('Projects Pagination', () => {
         await expect(page.getByText(prefix + '00')).not.toBeVisible();
     });
 });
+
+test('test that searching projects by name works', async ({ page, ctx }) => {
+    const suffix = Math.floor(1 + Math.random() * 10000);
+    const matchingProjectName = 'Searchable Project ' + suffix;
+    const otherProjectName = 'Unrelated Work ' + suffix;
+    await createProjectViaApi(ctx, { name: matchingProjectName });
+    await createProjectViaApi(ctx, { name: otherProjectName });
+
+    await goToProjectsOverview(page);
+    await clearTableState(page, 'project-table-state');
+    await page.reload();
+    await expect(page.getByText(matchingProjectName)).toBeVisible({ timeout: 10000 });
+    await expect(page.getByText(otherProjectName)).toBeVisible();
+
+    const searchInput = page.getByRole('searchbox', { name: 'Search projects' });
+
+    // Searching is case insensitive and matches part of the name
+    await searchInput.fill('SEARCHABLE');
+    await expect(page.getByText(matchingProjectName)).toBeVisible();
+    await expect(page.getByText(otherProjectName)).not.toBeVisible();
+
+    // A term that matches nothing empties the table
+    await searchInput.fill('no project has this name');
+    await expect(page.getByText(matchingProjectName)).not.toBeVisible();
+    await expect(page.getByText(otherProjectName)).not.toBeVisible();
+    await expect(page.getByText('No matching projects')).toBeVisible();
+    await expect(page.getByRole('button', { name: 'Create your First Project' })).not.toBeVisible();
+
+    // Clearing the search restores both projects
+    await searchInput.fill('');
+    await expect(page.getByText(matchingProjectName)).toBeVisible();
+    await expect(page.getByText(otherProjectName)).toBeVisible();
+});

e2e/reporting.spec.ts

@@ -10,6 +10,7 @@ import {
     createTimeEntryWithTagViaApi,
     createTimeEntryWithBillableStatusViaApi,
     createBareTimeEntryViaApi,
+    createTimeEntryOnDateViaApi,
     createPublicProjectViaApi,
     updateOrganizationSettingViaApi,
 } from './utils/api';
@@ -17,6 +18,25 @@ import {
 // Each test registers a new user and creates test data via API
 test.describe.configure({ timeout: 30000 });
 
+test('date range picker labels and navigates reporting periods', async ({ page }) => {
+    await goToReporting(page);
+
+    const range = page.getByTestId('date_range_picker_display');
+    const previous = page.getByTestId('date_range_picker_previous');
+    const next = page.getByTestId('date_range_picker_next');
+
+    await expect(range).toContainText('Last 14 Days');
+    await expect(next).toBeDisabled();
+
+    await Promise.all([waitForReportingUpdate(page), previous.click()]);
+    await expect(range).not.toContainText('Last 14 Days');
+
+    // The initial reporting range is still fresh in Vue Query's cache, so returning to it
+    // does not necessarily trigger another aggregate request.
+    await next.click();
+    await expect(range).toContainText('Last 14 Days');
+});
+
 // ──────────────────────────────────────────────────
 // Project Multiselect Dropdown Tests
 // ──────────────────────────────────────────────────
@@ -841,6 +861,127 @@ test('test that setting group by to current sub group triggers sub group fallbac
     await expect(groupBySelects.filter({ hasText: 'Members' }).first()).toBeVisible();
 });
 
+test('test that group by date groups the report by day and formats the date labels with organization settings', async ({
+    page,
+    ctx,
+}) => {
+    await updateOrganizationSettingViaApi(ctx, { date_format: 'point-separated-d-m-yyyy' });
+
+    await createTimeEntryViaApi(ctx, {
+        description: 'Entry for group by date',
+        duration: '1h',
+    });
+
+    // Go to reporting page
+    await goToReporting(page);
+    await expect(page.getByRole('button', { name: 'Export' })).toBeVisible();
+
+    // Find the "Group by" selects within the reporting table
+    const groupBySelects = page.locator('[data-testid="reporting_view"]').getByRole('combobox');
+
+    // Default state: group=Project
+    await groupBySelects.filter({ hasText: 'Project' }).first().click();
+
+    const [aggregateResponse] = await Promise.all([
+        page.waitForResponse(
+            (response) =>
+                response.url().includes('/time-entries/aggregate') &&
+                response.url().includes('group=day') &&
+                response.status() === 200
+        ),
+        page.getByRole('option', { name: 'Date', exact: true }).click(),
+    ]);
+
+    // Verify the API request contains the correct group parameter
+    const requestUrl = new URL(aggregateResponse.url());
+    expect(requestUrl.searchParams.get('group')).toBe('day');
+
+    // The row label is rendered in the organization date format (D.M.YYYY)
+    await expect(
+        page.getByTestId('reporting_view').getByText(/^\d{1,2}\.\d{1,2}\.\d{4}$/)
+    ).toBeVisible();
+    await expect(page.getByTestId('reporting_view').getByText(/^\d{4}-\d{2}-\d{2}$/)).toHaveCount(
+        0
+    );
+});
+
+test('test that group by week requests week grouping and does not leak the raw group key', async ({
+    page,
+    ctx,
+}) => {
+    await createTimeEntryViaApi(ctx, {
+        description: 'Entry for group by week',
+        duration: '1h',
+    });
+
+    await goToReporting(page);
+    await expect(page.getByRole('button', { name: 'Export' })).toBeVisible();
+
+    const groupBySelects = page.locator('[data-testid="reporting_view"]').getByRole('combobox');
+    await groupBySelects.filter({ hasText: 'Project' }).first().click();
+
+    const [aggregateResponse] = await Promise.all([
+        page.waitForResponse(
+            (response) =>
+                response.url().includes('/time-entries/aggregate') &&
+                response.url().includes('group=week') &&
+                response.status() === 200
+        ),
+        page.getByRole('option', { name: 'Week', exact: true }).click(),
+    ]);
+
+    const requestUrl = new URL(aggregateResponse.url());
+    expect(requestUrl.searchParams.get('group')).toBe('week');
+
+    // The raw group key is the first day of the week and must not leak through.
+    await expect(page.getByTestId('reporting_view').getByText(/^\d{4}-\d{2}-\d{2}$/)).toHaveCount(
+        0
+    );
+});
+
+test('test that group by week labels a week spanning new year with a range crossing the year', async ({
+    page,
+    ctx,
+}) => {
+    await updateOrganizationSettingViaApi(ctx, { date_format: 'slash-separated-dd-mm-yyyy' });
+
+    for (const day of ['2025-12-22', '2025-12-29', '2026-01-05']) {
+        await createTimeEntryOnDateViaApi(ctx, {
+            date: new Date(`${day}T09:00:00Z`),
+            duration: '1h',
+            description: `Entry for ${day}`,
+        });
+    }
+
+    // The reporting page keeps its range in session storage, so seed a range spanning new year
+    // rather than driving the date picker.
+    await page.addInitScript(() => {
+        window.sessionStorage.setItem('reporting-start-date', '2025-12-15');
+        window.sessionStorage.setItem('reporting-end-date', '2026-01-15');
+    });
+
+    await goToReporting(page);
+    await expect(page.getByRole('button', { name: 'Export' })).toBeVisible();
+
+    const groupBySelects = page.locator('[data-testid="reporting_view"]').getByRole('combobox');
+    await groupBySelects.filter({ hasText: 'Project' }).first().click();
+    await Promise.all([
+        page.waitForResponse(
+            (response) =>
+                response.url().includes('/time-entries/aggregate') &&
+                response.url().includes('group=week') &&
+                response.status() === 200
+        ),
+        page.getByRole('option', { name: 'Week', exact: true }).click(),
+    ]);
+
+    const reportingView = page.getByTestId('reporting_view');
+    await expect(reportingView.getByText('22/12/2025 - 28/12/2025', { exact: true })).toBeVisible();
+    await expect(reportingView.getByText('29/12/2025 - 04/01/2026', { exact: true })).toBeVisible();
+    await expect(reportingView.getByText('05/01/2026 - 11/01/2026', { exact: true })).toBeVisible();
+    await expect(reportingView.getByText(/^\d{4}-\d{2}-\d{2}$/)).toHaveCount(0);
+});
+
 // ──────────────────────────────────────────────────
 // Export Tests
 // ──────────────────────────────────────────────────

e2e/shared-reports.spec.ts

@@ -16,6 +16,7 @@ import {
     createTimeEntryWithBillableStatusViaApi,
     createTagViaApi,
     createReportViaApi,
+    updateOrganizationSettingViaApi,
 } from './utils/api';
 import {
     goToReporting,
@@ -68,6 +69,42 @@ test('test that saving a report creates a shared report and its shareable link s
     await expect(page.getByText('Total')).toBeVisible();
 });
 
+test('test that a shared report grouped by date shows date labels formatted by the organization setting', async ({
+    page,
+    ctx,
+}) => {
+    const reportName = 'DateGroupReport ' + Math.floor(Math.random() * 10000);
+
+    await updateOrganizationSettingViaApi(ctx, { date_format: 'point-separated-d-m-yyyy' });
+    await createTimeEntryViaApi(ctx, {
+        description: 'Entry for date grouping',
+        duration: '1h',
+    });
+
+    await goToReporting(page);
+
+    // Switch the grouping to "Date"
+    const groupBySelects = page.locator('[data-testid="reporting_view"]').getByRole('combobox');
+    await groupBySelects.filter({ hasText: 'Project' }).first().click();
+    await Promise.all([
+        page.waitForResponse(
+            (response) =>
+                response.url().includes('/time-entries/aggregate') &&
+                response.url().includes('group=day') &&
+                response.status() === 200
+        ),
+        page.getByRole('option', { name: 'Date', exact: true }).click(),
+    ]);
+
+    const { shareableLink } = await saveAsSharedReport(page, reportName);
+
+    // Verify row labels are formatted correctly
+    await page.goto(shareableLink);
+    await expect(page.getByText('Total')).toBeVisible();
+    await expect(page.getByText(/^\d{1,2}\.\d{1,2}\.\d{4}$/)).toBeVisible();
+    await expect(page.getByText(/^\d{4}-\d{2}-\d{2}$/)).toHaveCount(0);
+});
+
 test('test that shared report with invalid secret shows no data', async ({ page }) => {
     await page.goto(PLAYWRIGHT_BASE_URL + '/shared-report#invalid-secret-value');
     await expect(page.getByText('No time entries found').first()).toBeVisible();

e2e/tags.spec.ts

@@ -3,7 +3,7 @@ import type { Page } from '@playwright/test';
 import { PLAYWRIGHT_BASE_URL } from '../playwright/config';
 import { test } from '../playwright/fixtures';
 import { createTagViaApi } from './utils/api';
-import { getTableRowNames } from './utils/table';
+import { clearTableState, getTableRowNames } from './utils/table';
 
 async function goToTagsOverview(page: Page) {
     await page.goto(PLAYWRIGHT_BASE_URL + '/tags');
@@ -147,18 +147,12 @@ test('test that tag context menu delete deletes the tag', async ({ page, ctx })
 // Sorting Tests
 // =============================================
 
-async function clearTagTableState(page: Page) {
-    await page.evaluate(() => {
-        localStorage.removeItem('tag-table-state');
-    });
-}
-
 test('test that sorting tags by name works', async ({ page, ctx }) => {
     await createTagViaApi(ctx, { name: 'AAA SortTag' });
     await createTagViaApi(ctx, { name: 'ZZZ SortTag' });
 
     await goToTagsOverview(page);
-    await clearTagTableState(page);
+    await clearTableState(page, 'tag-table-state');
     await page.reload();
 
     const table = page.getByTestId('tag_table');
@@ -176,7 +170,7 @@ test('test that sorting tags by name works', async ({ page, ctx }) => {
 
 test('test that tag sort state persists after page reload', async ({ page }) => {
     await goToTagsOverview(page);
-    await clearTagTableState(page);
+    await clearTableState(page, 'tag-table-state');
     await page.reload();
 
     const table = page.getByTestId('tag_table');

e2e/tasks.spec.ts

@@ -7,13 +7,56 @@ import {
     createPublicProjectViaApi,
     createTaskViaApi,
     createClientViaApi,
+    createTimeEntryViaApi,
     updateOrganizationSettingViaApi,
+    type TestContext,
 } from './utils/api';
+import { clearTableState, getTableRowNames } from './utils/table';
 
 async function goToProjectsOverview(page: Page) {
     await page.goto(PLAYWRIGHT_BASE_URL + '/projects');
 }
 
+async function createSortableTasks(ctx: TestContext) {
+    const project = await createProjectViaApi(ctx, { name: 'Task Sorting Project' });
+    const taskA = await createTaskViaApi(ctx, {
+        name: 'AAA Sorting Task',
+        project_id: project.id,
+        estimated_time: 36000,
+    });
+    const taskB = await createTaskViaApi(ctx, {
+        name: 'BBB Sorting Task',
+        project_id: project.id,
+        estimated_time: 14400,
+    });
+    const taskC = await createTaskViaApi(ctx, {
+        name: 'CCC Sorting Task',
+        project_id: project.id,
+    });
+
+    expect(taskA.estimated_time).toBe(36000);
+    expect(taskB.estimated_time).toBe(14400);
+    expect(taskC.estimated_time).toBeNull();
+
+    await createTimeEntryViaApi(ctx, {
+        duration: '1h',
+        projectId: project.id,
+        taskId: taskA.id,
+    });
+    await createTimeEntryViaApi(ctx, {
+        duration: '2h',
+        projectId: project.id,
+        taskId: taskB.id,
+    });
+    await createTimeEntryViaApi(ctx, {
+        duration: '3h',
+        projectId: project.id,
+        taskId: taskC.id,
+    });
+
+    return { project, taskA, taskB, taskC };
+}
+
 test('test that creating and deleting a new task in a new project works', async ({ page }) => {
     const newProjectName = 'New Project ' + Math.floor(1 + Math.random() * 10000);
     await goToProjectsOverview(page);
@@ -301,6 +344,59 @@ test('test that creating a new project from the task create modal project dropdo
     await expect(page.getByTestId('task_table')).toContainText(newTaskName);
 });
 
+// =============================================
+// Sorting Tests
+// =============================================
+
+test('test that sorting tasks by name, total time and progress works', async ({ page, ctx }) => {
+    const { project, taskA, taskB, taskC } = await createSortableTasks(ctx);
+    await goToProjectsOverview(page);
+    await clearTableState(page, 'task-table-state');
+    await page.goto(PLAYWRIGHT_BASE_URL + '/projects/' + project.id);
+    const table = page.getByTestId('task_table');
+    await expect(table).toBeVisible();
+
+    // This project contains only the seeded tasks, so assert the complete order.
+    const expectOrder = async (expected: string[]) => {
+        await expect.poll(() => getTableRowNames(table)).toEqual(expected);
+    };
+    const clickHeader = async (headerText: string) => {
+        await table.getByText(headerText).first().click();
+    };
+
+    await expectOrder([taskA.name, taskB.name, taskC.name]);
+    await clickHeader('Task Name');
+    await expectOrder([taskC.name, taskB.name, taskA.name]);
+    await clickHeader('Task Name');
+    await expectOrder([taskA.name, taskB.name, taskC.name]);
+
+    await clickHeader('Total Time');
+    await expectOrder([taskC.name, taskB.name, taskA.name]);
+    await clickHeader('Total Time');
+    await expectOrder([taskA.name, taskB.name, taskC.name]);
+
+    await clickHeader('Progress');
+    await expectOrder([taskB.name, taskA.name, taskC.name]);
+    await clickHeader('Progress');
+    await expectOrder([taskA.name, taskB.name, taskC.name]);
+});
+
+test('test that task sort state persists after page reload', async ({ page, ctx }) => {
+    const { project, taskA, taskB, taskC } = await createSortableTasks(ctx);
+    await goToProjectsOverview(page);
+    await clearTableState(page, 'task-table-state');
+    await page.goto(PLAYWRIGHT_BASE_URL + '/projects/' + project.id);
+    const table = page.getByTestId('task_table');
+    await expect(table).toBeVisible();
+
+    await table.getByText('Progress').first().click();
+    await expect.poll(() => getTableRowNames(table)).toEqual([taskB.name, taskA.name, taskC.name]);
+    await page.reload();
+
+    // Verify the persisted row order, not just the sort indicator.
+    await expect.poll(() => getTableRowNames(table)).toEqual([taskB.name, taskA.name, taskC.name]);
+});
+
 // =============================================
 // Employee Permission Tests
 // =============================================

e2e/timesheet.spec.ts

@@ -409,20 +409,20 @@ test('navigating to previous week shows entries from that week', async ({ page,
 test('can navigate forward and return to current week', async ({ page }) => {
     await Promise.all([goToTimesheet(page), waitForTimesheetLoad(page)]);
 
-    // Should show "This week"
-    await expect(page.getByTestId('timesheet_week_display')).toContainText('This week');
+    // Should show "This Week"
+    await expect(page.getByTestId('timesheet_week_display')).toContainText('This Week');
 
     // Go to next week — the text assertions below auto-retry until the
     // header label flips.
     await page.getByTestId('timesheet_next_week').click();
 
-    // Should no longer show "This week"
-    await expect(page.getByTestId('timesheet_week_display')).not.toContainText('This week');
+    // Should no longer show "This Week"
+    await expect(page.getByTestId('timesheet_week_display')).not.toContainText('This Week');
 
     // Go back to this week
     await page.getByTestId('timesheet_week_display').click();
 
-    await expect(page.getByTestId('timesheet_week_display')).toContainText('This week');
+    await expect(page.getByTestId('timesheet_week_display')).toContainText('This Week');
 });
 
 // ──────────────────────────────────────────────────

e2e/timezone-mismatch.spec.ts

@@ -0,0 +1,89 @@
+import { test, expect } from '../playwright/fixtures';
+import { PLAYWRIGHT_BASE_URL } from '../playwright/config';
+import type { Page, TestContext } from '../playwright/fixtures';
+import { getCurrentUserViaApi, updateUserProfileViaApi } from './utils/api';
+
+const BROWSER_TIMEZONE = 'Europe/Vienna';
+const MISMATCHED_TIMEZONE = 'America/New_York';
+
+test.use({ timezoneId: BROWSER_TIMEZONE });
+
+function mismatchModal(page: Page) {
+    return page.getByRole('dialog').filter({ hasText: 'Timezone mismatch detected' });
+}
+
+async function openPageWithTimezoneMismatch(page: Page, ctx: TestContext) {
+    await updateUserProfileViaApi(ctx, { timezone: MISMATCHED_TIMEZONE });
+    await page.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
+    await expect(mismatchModal(page)).toBeVisible();
+}
+
+test('timezone mismatch modal saves the device timezone through the users API', async ({
+    page,
+    ctx,
+}) => {
+    await openPageWithTimezoneMismatch(page, ctx);
+
+    await Promise.all([
+        page.waitForResponse(
+            (response) =>
+                response.url().includes('/api/v1/users/') &&
+                response.request().method() === 'PUT' &&
+                response.status() === 200
+        ),
+        mismatchModal(page).getByRole('button', { name: 'Update timezone' }).click(),
+    ]);
+    await expect(mismatchModal(page)).toBeHidden();
+
+    const user = await getCurrentUserViaApi(ctx);
+    expect(user.timezone).toBe(BROWSER_TIMEZONE);
+
+    // After the automatic reload the timezones match again, so the modal stays gone.
+    await page.waitForLoadState('load');
+    await page.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
+    await expect(mismatchModal(page)).toBeHidden();
+});
+
+test('timezone mismatch modal does not open for a different timezone with the same time', async ({
+    page,
+    ctx,
+}) => {
+    // Berlin and Vienna share the same offset and DST rules, so the times match.
+    await updateUserProfileViaApi(ctx, { timezone: 'Europe/Berlin' });
+    await page.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
+
+    // Wait until the dashboard is rendered so the modal had its chance to mount.
+    await expect(page.getByTestId('dashboard_view')).toBeVisible();
+    await expect(mismatchModal(page)).toBeHidden();
+});
+
+test('timezone mismatch modal stays open when the update fails', async ({ page, ctx }) => {
+    await openPageWithTimezoneMismatch(page, ctx);
+
+    await page.route('**/api/v1/users/*', (route) => {
+        if (route.request().method() === 'PUT') {
+            return route.fulfill({
+                status: 500,
+                contentType: 'application/json',
+                body: JSON.stringify({ message: 'Server error' }),
+            });
+        }
+        return route.fallback();
+    });
+
+    await Promise.all([
+        page.waitForResponse(
+            (response) =>
+                response.url().includes('/api/v1/users/') &&
+                response.request().method() === 'PUT' &&
+                response.status() === 500
+        ),
+        mismatchModal(page).getByRole('button', { name: 'Update timezone' }).click(),
+    ]);
+
+    await expect(mismatchModal(page)).toBeVisible();
+    await expect(page.getByText('Failed to update profile')).toBeVisible();
+
+    const user = await getCurrentUserViaApi(ctx);
+    expect(user.timezone).toBe(MISMATCHED_TIMEZONE);
+});

e2e/utils/api.ts

@@ -357,7 +357,7 @@ export async function createProjectWithClientViaApi(
 
 export async function createTaskViaApi(
     ctx: TestContext,
-    data: { name: string; project_id: string }
+    data: { name: string; project_id: string; estimated_time?: number }
 ) {
     const response = await ctx.request.post(
         `${PLAYWRIGHT_BASE_URL}/api/v1/organizations/${ctx.orgId}/tasks`,
@@ -365,12 +365,20 @@ export async function createTaskViaApi(
             data: {
                 name: data.name,
                 project_id: data.project_id,
+                ...(data.estimated_time !== undefined
+                    ? { estimated_time: data.estimated_time }
+                    : {}),
             },
         }
     );
     expect(response.status()).toBe(201);
     const body = await response.json();
-    return body.data as { id: string; name: string; project_id: string };
+    return body.data as {
+        id: string;
+        name: string;
+        project_id: string;
+        estimated_time: number | null;
+    };
 }
 
 export async function markTaskDoneViaApi(ctx: TestContext, task: { id: string; name: string }) {

e2e/utils/table.ts

@@ -1,4 +1,4 @@
-import type { Locator } from '@playwright/test';
+import type { Locator, Page } from '@playwright/test';
 
 /**
  * Extract the first cell's text content from each row in a table.
@@ -14,3 +14,22 @@ export async function getTableRowNames(table: Locator): Promise<string[]> {
     }
     return names;
 }
+
+/**
+ * The visual order of the given seeded names within the table, ignoring any other rows.
+ */
+export async function getSeededRowOrder(table: Locator, seeded: string[]): Promise<string[]> {
+    const rowNames = await getTableRowNames(table);
+    return rowNames
+        .map((rowName) => seeded.find((name) => rowName.includes(name)))
+        .filter((name): name is string => Boolean(name));
+}
+
+/**
+ * Drop a table's persisted sort/filter state so a test starts from the defaults.
+ */
+export async function clearTableState(page: Page, key: string) {
+    await page.evaluate((storageKey) => {
+        localStorage.removeItem(storageKey);
+    }, key);
+}

extensions/manifest.json

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

package.json

@@ -57,7 +57,7 @@
         "@floating-ui/core": "^1.7.5",
         "@floating-ui/vue": "^1.1.11",
         "@heroicons/vue": "^2.2.0",
-        "@lucide/vue": "^1.14.0",
+        "@lucide/vue": "^1.28.0",
         "@rushstack/eslint-patch": "^1.16.1",
         "@tailwindcss/container-queries": "^0.1.1",
         "@tanstack/vue-form": "^1.32.0",
@@ -67,7 +67,7 @@
         "@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",
+        "@vueuse/core": "^14.4.0",
         "@vueuse/integrations": "^14.3.0",
         "@zodios/core": "^10.9.6",
         "chroma-js": "^3.2.0",
@@ -79,7 +79,7 @@
         "parse-duration": "^2.1.6",
         "pinia": "^3.0.4",
         "radix-vue": "^1.9.17",
-        "reka-ui": "^2.9.7",
+        "reka-ui": "^2.10.1",
         "tailwind-merge": "^2.6.1",
         "tailwindcss-animate": "^1.0.7",
         "vue-draggable-plus": "^0.6.1",

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

@@ -7,18 +7,17 @@ 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 Pagination from '@/packages/ui/src/Pagination.vue';
 import { canCreateClients } from '@/utils/permissions';
 import { useProjectsQuery } from '@/utils/useProjectsQuery';
 import {
-    useVueTable,
-    getCoreRowModel,
-    getSortedRowModel,
-    type SortingState,
-} from '@tanstack/vue-table';
+    useSortableTable,
+    type SortableColumnDef,
+    type SortDirection,
+} from '@/utils/useSortableTable';
 
 export type SortColumn = 'name' | 'projects_count' | 'status';
-export type SortDirection = 'asc' | 'desc';
+export type { SortDirection } from '@/utils/useSortableTable';
 
 const props = defineProps<{
     clients: Client[];
@@ -44,17 +43,7 @@ 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(() => [
+const columns = computed<SortableColumnDef<Client, SortColumn>[]>(() => [
     {
         id: 'name',
         accessorFn: (row: Client) => row.name.toLowerCase(),
@@ -70,41 +59,22 @@ const columns = computed(() => [
     },
 ]);
 
-const descFirstColumns = new Set<SortColumn>(
-    columns.value
-        .filter((c) => 'sortDescFirst' in c && c.sortDescFirst)
-        .map((c) => c.id as SortColumn)
-);
+const {
+    sortedRows: sortedClients,
+    descFirstColumns,
+    nextDirection,
+} = useSortableTable({
+    data: () => props.clients,
+    columns: () => columns.value,
+    sortColumn: () => props.sortColumn,
+    sortDirection: () => props.sortDirection,
+    tieBreakColumn: 'name',
+});
 
 function handleSort(column: SortColumn) {
-    if (props.sortColumn === column) {
-        emit('sort', column, props.sortDirection === 'asc' ? 'desc' : 'asc');
-    } else {
-        emit('sort', column, descFirstColumns.has(column) ? 'desc' : 'asc');
-    }
+    emit('sort', column, nextDirection(column));
 }
 
-const table = useVueTable({
-    get data() {
-        return props.clients;
-    },
-    get columns() {
-        return columns.value;
-    },
-    getCoreRowModel: getCoreRowModel(),
-    getSortedRowModel: getSortedRowModel(),
-    state: {
-        get sorting() {
-            return sorting.value;
-        },
-    },
-    manualSorting: false,
-});
-
-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);

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

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import TableHeading from '@/Components/Common/TableHeading.vue';
-import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
+import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
 import type { SortColumn, SortDirection } from '@/Components/Common/Client/ClientTable.vue';
 
 const props = defineProps<{
@@ -9,57 +9,29 @@ const props = defineProps<{
     descFirstColumns: ReadonlySet<SortColumn>;
 }>();
 
-const emit = defineEmits<{
+defineEmits<{
     sort: [column: SortColumn];
 }>();
-
-function handleSort(column: SortColumn) {
-    emit('sort', column);
-}
-
-function isSorted(column: SortColumn): boolean {
-    return props.sortColumn === column;
-}
-
-function isChevronDown(column: SortColumn): boolean {
-    if (!isSorted(column)) return false;
-    return props.descFirstColumns.has(column)
-        ? props.sortDirection === 'desc'
-        : props.sortDirection === 'asc';
-}
-
-function isChevronUp(column: SortColumn): boolean {
-    if (!isSorted(column)) return false;
-    return !isChevronDown(column);
-}
 </script>
 
 <template>
     <TableHeading>
-        <div
-            class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12 cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('name')">
+        <SortableTableHeaderCell
+            class="pr-3 pl-4 sm:pl-6 lg:pl-8 3xl:pl-12"
+            column="name"
+            v-bind="props"
+            @sort="$emit('sort', $event)">
             Name
-            <ChevronDownIcon v-if="isChevronDown('name')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('name')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('projects_count')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell
+            column="projects_count"
+            v-bind="props"
+            @sort="$emit('sort', $event)">
             Projects
-            <ChevronDownIcon v-if="isChevronDown('projects_count')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('projects_count')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('status')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="status" v-bind="props" @sort="$emit('sort', $event)">
             Status
-            <ChevronDownIcon v-if="isChevronDown('status')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('status')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
+        </SortableTableHeaderCell>
         <div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
             <span class="sr-only">Edit</span>
         </div>

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

@@ -3,16 +3,14 @@ import MemberTableHeading from '@/Components/Common/Member/MemberTableHeading.vu
 import MemberTableRow from '@/Components/Common/Member/MemberTableRow.vue';
 import { useMembersQuery } from '@/utils/useMembersQuery';
 import type { Member } from '@/packages/api/src';
-import { computed } from 'vue';
 import {
-    useVueTable,
-    getCoreRowModel,
-    getSortedRowModel,
-    type SortingState,
-} from '@tanstack/vue-table';
+    useSortableTable,
+    type SortableColumnDef,
+    type SortDirection,
+} from '@/utils/useSortableTable';
 
 export type SortColumn = 'name' | 'email' | 'role' | 'billable_rate' | 'status';
-export type SortDirection = 'asc' | 'desc';
+export type { SortDirection } from '@/utils/useSortableTable';
 
 const props = defineProps<{
     sortColumn: SortColumn;
@@ -33,14 +31,7 @@ const roleOrder: Record<string, number> = {
     placeholder: 4,
 };
 
-const sorting = computed<SortingState>(() => [
-    {
-        id: props.sortColumn,
-        desc: props.sortDirection === 'desc',
-    },
-]);
-
-const columns = [
+const columns: SortableColumnDef<Member, SortColumn>[] = [
     {
         id: 'name',
         accessorFn: (row: Member) => row.name.toLowerCase(),
@@ -56,7 +47,6 @@ const columns = [
     {
         id: 'billable_rate',
         sortDescFirst: true,
-        sortUndefined: 'last' as const,
         accessorFn: (row: Member) => {
             if (row.billable_rate === null) return undefined;
             return row.billable_rate;
@@ -68,36 +58,21 @@ const columns = [
     },
 ];
 
-const descFirstColumns = new Set<SortColumn>(
-    columns.filter((c) => c.sortDescFirst).map((c) => c.id as SortColumn)
-);
+const {
+    sortedRows: sortedMembers,
+    descFirstColumns,
+    nextDirection,
+} = useSortableTable({
+    data: () => members.value,
+    columns: () => columns,
+    sortColumn: () => props.sortColumn,
+    sortDirection: () => props.sortDirection,
+    tieBreakColumn: 'name',
+});
 
 function handleSort(column: SortColumn) {
-    if (props.sortColumn === column) {
-        emit('sort', column, props.sortDirection === 'asc' ? 'desc' : 'asc');
-    } else {
-        emit('sort', column, descFirstColumns.has(column) ? 'desc' : 'asc');
-    }
+    emit('sort', column, nextDirection(column));
 }
-
-const table = useVueTable({
-    get data() {
-        return members.value;
-    },
-    columns,
-    getCoreRowModel: getCoreRowModel(),
-    getSortedRowModel: getSortedRowModel(),
-    state: {
-        get sorting() {
-            return sorting.value;
-        },
-    },
-    manualSorting: false,
-});
-
-const sortedMembers = computed(() => {
-    return table.getRowModel().rows.map((row) => row.original);
-});
 </script>
 
 <template>

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

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import TableHeading from '@/Components/Common/TableHeading.vue';
-import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
+import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
 import type { SortColumn, SortDirection } from '@/Components/Common/Member/MemberTable.vue';
 
 const props = defineProps<{
@@ -9,73 +9,35 @@ const props = defineProps<{
     descFirstColumns: ReadonlySet<SortColumn>;
 }>();
 
-const emit = defineEmits<{
+defineEmits<{
     sort: [column: SortColumn];
 }>();
-
-function handleSort(column: SortColumn) {
-    emit('sort', column);
-}
-
-function isSorted(column: SortColumn): boolean {
-    return props.sortColumn === column;
-}
-
-function isChevronDown(column: SortColumn): boolean {
-    if (!isSorted(column)) return false;
-    return props.descFirstColumns.has(column)
-        ? props.sortDirection === 'desc'
-        : props.sortDirection === 'asc';
-}
-
-function isChevronUp(column: SortColumn): boolean {
-    if (!isSorted(column)) return false;
-    return !isChevronDown(column);
-}
 </script>
 
 <template>
     <TableHeading>
-        <div
-            class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12 cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('name')">
+        <SortableTableHeaderCell
+            class="pr-3 pl-4 sm:pl-6 lg:pl-8 3xl:pl-12"
+            column="name"
+            v-bind="props"
+            @sort="$emit('sort', $event)">
             Name
-            <ChevronDownIcon v-if="isChevronDown('name')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('name')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('email')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="email" v-bind="props" @sort="$emit('sort', $event)">
             Email
-            <ChevronDownIcon v-if="isChevronDown('email')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('email')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('role')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="role" v-bind="props" @sort="$emit('sort', $event)">
             Role
-            <ChevronDownIcon v-if="isChevronDown('role')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('role')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('billable_rate')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell
+            column="billable_rate"
+            v-bind="props"
+            @sort="$emit('sort', $event)">
             Billable Rate
-            <ChevronDownIcon v-if="isChevronDown('billable_rate')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('billable_rate')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('status')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="status" v-bind="props" @sort="$emit('sort', $event)">
             Status
-            <ChevronDownIcon v-if="isChevronDown('status')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('status')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
+        </SortableTableHeaderCell>
         <div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12 bg-row-heading-background">
             <span class="sr-only">Edit</span>
         </div>

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

@@ -6,17 +6,12 @@ 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';
+import Pagination from '@/packages/ui/src/Pagination.vue';
+import LoadingSpinner from '@/packages/ui/src/LoadingSpinner.vue';
 
 export type SortColumn =
-    | 'name'
-    | 'client_name'
-    | 'spent_time'
-    | 'progress'
-    | 'billable_rate'
-    | 'status'
-    | 'visibility';
-export type SortDirection = 'asc' | 'desc';
+    'name' | 'client_name' | 'spent_time' | 'progress' | 'billable_rate' | 'status' | 'visibility';
+export type { SortDirection } from '@/utils/useSortableTable';
 import { canCreateProjects } from '@/utils/permissions';
 import type { CreateProjectBody, Project, Client, CreateClientBody } from '@/packages/api/src';
 import { useProjectsStore } from '@/utils/useProjects';
@@ -27,20 +22,24 @@ import { isAllowedToPerformPremiumAction } from '@/utils/billing';
 import { useOrganizationQuery } from '@/utils/useOrganizationQuery';
 import { getCurrentOrganizationId } from '@/utils/useUser';
 import {
-    useVueTable,
-    getCoreRowModel,
-    getSortedRowModel,
-    type SortingState,
-} from '@tanstack/vue-table';
+    useSortableTable,
+    type SortableColumnDef,
+    type SortDirection,
+} from '@/utils/useSortableTable';
 
 const { organization } = useOrganizationQuery(getCurrentOrganizationId()!);
 
-const props = defineProps<{
-    projects: Project[];
-    showBillableRate: boolean;
-    sortColumn: SortColumn;
-    sortDirection: SortDirection;
-}>();
+const props = withDefaults(
+    defineProps<{
+        projects: Project[];
+        showBillableRate: boolean;
+        sortColumn: SortColumn;
+        sortDirection: SortDirection;
+        isFiltered?: boolean;
+        isLoading?: boolean;
+    }>(),
+    { isFiltered: false, isLoading: false }
+);
 
 const emit = defineEmits<{
     sort: [column: SortColumn, direction: SortDirection];
@@ -57,28 +56,16 @@ const clientNameMap = computed(() => {
     return map;
 });
 
-// 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.
 // Numeric columns use sortDescFirst so that the first click (chevron down) sorts highest-first,
 // while text columns default to ascending (A-Z) on first click (chevron down).
-const columns = computed(() => [
+const columns = computed<SortableColumnDef<Project, SortColumn>[]>(() => [
     {
         id: 'name',
         accessorFn: (row: Project) => row.name.toLowerCase(),
     },
     {
         id: 'client_name',
-        sortUndefined: 'last' as const,
         accessorFn: (row: Project) => {
             if (!row.client_id) return undefined;
             return (clientNameMap.value.get(row.client_id) ?? '').toLowerCase();
@@ -87,12 +74,11 @@ const columns = computed(() => [
     {
         id: 'spent_time',
         sortDescFirst: true,
-        accessorFn: (row: Project) => row.spent_time ?? 0,
+        accessorFn: (row: Project) => row.spent_time,
     },
     {
         id: 'progress',
         sortDescFirst: true,
-        sortUndefined: 'last' as const,
         accessorFn: (row: Project) => {
             if (!row.estimated_time) return undefined;
             return (row.spent_time / row.estimated_time) * 100;
@@ -101,7 +87,7 @@ const columns = computed(() => [
     {
         id: 'billable_rate',
         sortDescFirst: true,
-        accessorFn: (row: Project) => row.billable_rate ?? 0,
+        accessorFn: (row: Project) => row.billable_rate,
     },
     {
         id: 'status',
@@ -113,40 +99,22 @@ const columns = computed(() => [
     },
 ]);
 
-// Columns with sortDescFirst get desc as default direction on first click.
-const descFirstColumns = new Set<SortColumn>(
-    columns.value.filter((c) => c.sortDescFirst).map((c) => c.id as SortColumn)
-);
+const {
+    sortedRows: sortedProjects,
+    descFirstColumns,
+    nextDirection,
+} = useSortableTable({
+    data: () => props.projects,
+    columns: () => columns.value,
+    sortColumn: () => props.sortColumn,
+    sortDirection: () => props.sortDirection,
+    tieBreakColumn: 'name',
+});
 
 function handleSort(column: SortColumn) {
-    if (props.sortColumn === column) {
-        emit('sort', column, props.sortDirection === 'asc' ? 'desc' : 'asc');
-    } else {
-        emit('sort', column, descFirstColumns.has(column) ? 'desc' : 'asc');
-    }
+    emit('sort', column, nextDirection(column));
 }
 
-const table = useVueTable({
-    get data() {
-        return props.projects;
-    },
-    get columns() {
-        return columns.value;
-    },
-    getCoreRowModel: getCoreRowModel(),
-    getSortedRowModel: getSortedRowModel(),
-    state: {
-        get sorting() {
-            return sorting.value;
-        },
-    },
-    manualSorting: false,
-});
-
-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);
@@ -160,6 +128,28 @@ const paginatedProjects = computed(() => {
     return sortedProjects.value.slice(start, start + PAGE_SIZE);
 });
 
+const emptyState = computed(() => {
+    if (props.isFiltered) {
+        return {
+            title: 'No matching projects',
+            description: 'Try a different search term or adjust your filters.',
+            showCreateButton: false,
+        };
+    }
+    if (!canCreateProjects()) {
+        return {
+            title: 'You are not a member of any projects',
+            description: 'Ask your manager to add you to a project as a team member.',
+            showCreateButton: false,
+        };
+    }
+    return {
+        title: 'No projects found',
+        description: 'Create your first project now!',
+        showCreateButton: true,
+    };
+});
+
 const showCreateProjectModal = ref(false);
 
 async function createProject(project: CreateProjectBody): Promise<Project | undefined> {
@@ -193,24 +183,21 @@ const gridTemplate = computed(() => {
                     :sort-direction="props.sortDirection"
                     :desc-first-columns="descFirstColumns"
                     @sort="handleSort"></ProjectTableHeading>
-                <div v-if="sortedProjects.length === 0" class="col-span-full py-24 text-center">
+                <div
+                    v-if="props.isLoading"
+                    class="col-span-full flex justify-center items-center py-24">
+                    <LoadingSpinner></LoadingSpinner>
+                </div>
+                <div
+                    v-else-if="sortedProjects.length === 0"
+                    class="col-span-full py-24 text-center">
                     <FolderPlusIcon class="w-8 text-icon-default inline pb-2"></FolderPlusIcon>
-                    <h3 class="text-text-primary font-semibold">
-                        {{
-                            canCreateProjects()
-                                ? 'No projects found'
-                                : 'You are not a member of any projects'
-                        }}
-                    </h3>
+                    <h3 class="text-text-primary font-semibold">{{ emptyState.title }}</h3>
                     <p class="pb-5 max-w-md mx-auto text-sm pt-1">
-                        {{
-                            canCreateProjects()
-                                ? 'Create your first project now!'
-                                : 'Ask your manager to add you to a project as a team member.'
-                        }}
+                        {{ emptyState.description }}
                     </p>
                     <SecondaryButton
-                        v-if="canCreateProjects()"
+                        v-if="emptyState.showCreateButton"
                         :icon="PlusIcon"
                         @click="showCreateProjectModal = true"
                         >Create your First Project

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

@@ -1,6 +1,7 @@
 <script setup lang="ts">
+import { computed } from 'vue';
 import TableHeading from '@/Components/Common/TableHeading.vue';
-import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
+import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
 import type { SortColumn, SortDirection } from '@/Components/Common/Project/ProjectTable.vue';
 
 const props = defineProps<{
@@ -14,90 +15,51 @@ const emit = defineEmits<{
     sort: [column: SortColumn];
 }>();
 
+// Bound once per cell instead of repeating the three sort props on every column.
+const sortState = computed(() => ({
+    sortColumn: props.sortColumn,
+    sortDirection: props.sortDirection,
+    descFirstColumns: props.descFirstColumns,
+}));
+
 function handleSort(column: SortColumn) {
     emit('sort', column);
 }
-
-function isSorted(column: SortColumn): boolean {
-    return props.sortColumn === column;
-}
-
-function isChevronDown(column: SortColumn): boolean {
-    if (!isSorted(column)) return false;
-    return props.descFirstColumns.has(column)
-        ? props.sortDirection === 'desc'
-        : props.sortDirection === 'asc';
-}
-
-function isChevronUp(column: SortColumn): boolean {
-    if (!isSorted(column)) return false;
-    return !isChevronDown(column);
-}
 </script>
 
 <template>
     <TableHeading>
-        <div
-            class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12 cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('name')">
+        <SortableTableHeaderCell
+            class="pr-3 pl-2 sm:pl-4 lg:pl-6"
+            column="name"
+            v-bind="sortState"
+            @sort="handleSort">
             Name
-            <ChevronDownIcon v-if="isChevronDown('name')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('name')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('client_name')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="client_name" v-bind="sortState" @sort="handleSort">
             Client
-            <ChevronDownIcon v-if="isChevronDown('client_name')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('client_name')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('spent_time')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="spent_time" v-bind="sortState" @sort="handleSort">
             Total Time
-            <ChevronDownIcon v-if="isChevronDown('spent_time')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('spent_time')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('progress')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="progress" v-bind="sortState" @sort="handleSort">
             Progress
-            <ChevronDownIcon v-if="isChevronDown('progress')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('progress')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell
             v-if="showBillableRate"
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('billable_rate')">
+            column="billable_rate"
+            v-bind="sortState"
+            @sort="handleSort">
             Billable Rate
-            <ChevronDownIcon v-if="isChevronDown('billable_rate')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('billable_rate')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('status')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="status" v-bind="sortState" @sort="handleSort">
             Status
-            <ChevronDownIcon v-if="isChevronDown('status')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('status')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div
-            class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('visibility')">
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="visibility" v-bind="sortState" @sort="handleSort">
             Visibility
-            <ChevronDownIcon v-if="isChevronDown('visibility')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('visibility')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
-        <div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
+        </SortableTableHeaderCell>
+        <div class="relative py-1.5 pl-3 pr-2 sm:pr-4 lg:pr-6">
             <span class="sr-only">Edit</span>
         </div>
     </TableHeading>
 </template>
-
-<style scoped></style>

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

@@ -88,13 +88,13 @@ const showEditProjectModal = ref(false);
         <ContextMenuTrigger as-child>
             <TableRow :href="route('projects.show', { project: project.id })">
                 <div
-                    class="whitespace-nowrap min-w-0 flex items-center space-x-5 3xl:pl-12 py-4 pr-3 text-sm font-medium text-text-primary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12">
+                    class="whitespace-nowrap min-w-0 flex items-center space-x-5 py-4 pr-3 text-sm font-medium text-text-primary pl-2 sm:pl-4 lg:pl-6">
                     <div
                         :style="{
                             backgroundColor: project.color,
                             boxShadow: `var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) ${project.color}30`,
                         }"
-                        class="w-3 h-3 rounded-full"></div>
+                        class="w-3 h-3 ml-1 rounded-full"></div>
                     <span class="overflow-ellipsis overflow-hidden">
                         {{ project.name }}
                     </span>
@@ -155,7 +155,7 @@ const showEditProjectModal = ref(false);
                     </template>
                 </div>
                 <div
-                    class="relative whitespace-nowrap flex items-center pl-3 text-right text-sm font-medium pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
+                    class="relative whitespace-nowrap flex items-center pl-3 text-right text-sm font-medium pr-2 sm:pr-4 lg:pr-6">
                     <ProjectMoreOptionsDropdown
                         :project="project"
                         @edit="showEditProjectModal = true"

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

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, ref } from 'vue';
+import { ref } from 'vue';
 import { UserGroupIcon, CheckCircleIcon, GlobeAltIcon } from '@heroicons/vue/16/solid';
 import ListFilterIcon from '@/packages/ui/src/Icons/ListFilterIcon.vue';
 import {
@@ -81,23 +81,18 @@ function toggleNoClient() {
         clientIds,
     });
 }
-
-const hasActiveFilters = computed(() => {
-    return (
-        props.filters.status !== 'all' ||
-        props.filters.visibility !== 'all' ||
-        props.filters.clientIds.length > 0
-    );
-});
 </script>
 
 <template>
     <DropdownMenu v-model:open="open">
         <DropdownMenuTrigger as-child>
-            <Button variant="ghost" size="xs" aria-label="Filter projects">
-                <ListFilterIcon
-                    :class="[hasActiveFilters ? '' : '-ml-0.5', 'h-4 w-4 text-icon-default']" />
-                <span v-if="!hasActiveFilters" class="text-nowrap">Filter</span>
+            <!-- -ml-1.5 cancels the icon's inset inside the button so it sits flush with the toolbar's left padding -->
+            <Button
+                variant="ghost"
+                size="icon"
+                class="-ml-1.5 h-7 w-7 flex-shrink-0"
+                aria-label="Filter projects">
+                <ListFilterIcon class="h-4 w-4 text-icon-default" />
             </Button>
         </DropdownMenuTrigger>
         <DropdownMenuContent align="start" class="w-56">

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

@@ -9,7 +9,7 @@ const showExportModal = defineModel('show', { default: false });
 
 function downloadCurrentExport() {
     if (props.exportUrl) {
-        window.open(props.exportUrl, '_blank')?.focus();
+        window.open(props.exportUrl, '_self');
     }
 }
 </script>

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

@@ -57,7 +57,7 @@ const { handleApiRequestNotifications } = useNotificationsStore();
 
 const startDate = useSessionStorage<string>(
     'reporting-start-date',
-    getLocalizedDayJs(getDayJsInstance()().format()).subtract(14, 'd').format()
+    getLocalizedDayJs(getDayJsInstance()().format()).subtract(13, 'd').format()
 );
 const endDate = useSessionStorage<string>(
     'reporting-end-date',
@@ -240,7 +240,8 @@ const groupedPieChartData = computed(() => {
         aggregatedTableTimeEntries.value?.grouped_data?.map((entry) => {
             const name = getNameForReportingRowEntry(
                 entry.key,
-                aggregatedTableTimeEntries.value?.grouped_type ?? null
+                aggregatedTableTimeEntries.value?.grouped_type ?? null,
+                organization?.value?.date_format
             );
             let color = getRandomColorWithSeed(entry.key ?? 'none');
             if (
@@ -255,11 +256,7 @@ const groupedPieChartData = computed(() => {
             }
             return {
                 value: entry.seconds,
-                name:
-                    getNameForReportingRowEntry(
-                        entry.key,
-                        aggregatedTableTimeEntries.value?.grouped_type ?? null
-                    ) ?? '',
+                name: name ?? '',
                 color: color,
             };
         }) ?? []
@@ -269,18 +266,25 @@ const groupedPieChartData = computed(() => {
 const tableData = computed(() => {
     return aggregatedTableTimeEntries.value?.grouped_data?.map((entry) => {
         return {
+            key: entry.key,
             seconds: entry.seconds,
             cost: entry.cost,
             description: getNameForReportingRowEntry(
                 entry.key,
-                aggregatedTableTimeEntries.value?.grouped_type ?? null
+                aggregatedTableTimeEntries.value?.grouped_type ?? null,
+                organization?.value?.date_format
             ),
             grouped_data:
                 entry.grouped_data?.map((el) => {
                     return {
+                        key: el.key,
                         seconds: el.seconds,
                         cost: el.cost,
-                        description: getNameForReportingRowEntry(el.key, entry.grouped_type),
+                        description: getNameForReportingRowEntry(
+                            el.key,
+                            entry.grouped_type,
+                            organization?.value?.date_format
+                        ),
                     };
                 }) ?? [],
         };
@@ -421,9 +425,8 @@ const tableData = computed(() => {
                         ">
                         <ReportingRow
                             v-for="entry in tableData"
-                            :key="entry.description ?? 'none'"
+                            :key="entry.key ?? 'none'"
                             :currency="getOrganizationCurrencyString()"
-                            :type="aggregatedTableTimeEntries.grouped_type"
                             :show-cost="showBillableRate"
                             :entry="entry"></ReportingRow>
                         <div class="contents [&>*]:transition text-text-tertiary [&>*]:h-[50px]">

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

@@ -11,6 +11,7 @@ type AggregatedGroupedData = GroupedData & {
 };
 
 type GroupedData = {
+    key: string | null;
     seconds: number;
     cost: number | null;
     description: string | null | undefined;
@@ -72,7 +73,7 @@ const organization = inject<ComputedRef<Organization>>('organization');
         :style="`grid-template-columns: 1fr 150px ${showCost ? '150px' : ''}`">
         <ReportingRow
             v-for="subEntry in entry.grouped_data"
-            :key="subEntry.description ?? 'none'"
+            :key="subEntry.key ?? 'none'"
             :currency="props.currency"
             :show-cost="showCost"
             indent

resources/js/Components/Common/SortableTableHeaderCell.vue

@@ -0,0 +1,54 @@
+<script setup lang="ts" generic="TColumn extends string">
+import { computed, useAttrs } from 'vue';
+import type { ClassValue } from 'clsx';
+import { cn } from '@/lib/utils';
+import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
+import type { SortDirection } from '@/utils/useSortableTable';
+
+defineOptions({ inheritAttrs: false });
+
+const props = defineProps<{
+    column: TColumn;
+    sortColumn: TColumn;
+    sortDirection: SortDirection;
+    descFirstColumns: ReadonlySet<TColumn>;
+}>();
+
+const emit = defineEmits<{
+    sort: [column: TColumn];
+}>();
+
+const attrs = useAttrs();
+
+const isSorted = computed(() => props.sortColumn === props.column);
+
+const isChevronDown = computed(() => {
+    if (!isSorted.value) return false;
+    return props.descFirstColumns.has(props.column)
+        ? props.sortDirection === 'desc'
+        : props.sortDirection === 'asc';
+});
+
+const cellClass = computed(() =>
+    cn(
+        'px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1',
+        attrs.class as ClassValue
+    )
+);
+</script>
+
+<template>
+    <button type="button" :class="cellClass" @click="emit('sort', column)">
+        <slot></slot>
+        <span class="sr-only">
+            {{
+                isSorted
+                    ? `sorted ${sortDirection === 'asc' ? 'ascending' : 'descending'}`
+                    : 'not sorted'
+            }}
+        </span>
+        <ChevronDownIcon v-if="isChevronDown" aria-hidden="true" class="w-4 h-4" />
+        <ChevronUpIcon v-else-if="isSorted" aria-hidden="true" class="w-4 h-4" />
+        <span v-else aria-hidden="true" class="w-4 h-4"></span>
+    </button>
+</template>

resources/js/Components/Common/Tag/TagTable.vue

@@ -2,7 +2,7 @@
 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 { ref } from 'vue';
 import { useTagsQuery } from '@/utils/useTagsQuery';
 import TagTableRow from '@/Components/Common/Tag/TagTableRow.vue';
 import TagCreateModal from '@/packages/ui/src/Tag/TagCreateModal.vue';
@@ -10,14 +10,13 @@ import TagTableHeading from '@/Components/Common/Tag/TagTableHeading.vue';
 import { canCreateTags } from '@/utils/permissions';
 import type { Tag } from '@/packages/api/src';
 import {
-    useVueTable,
-    getCoreRowModel,
-    getSortedRowModel,
-    type SortingState,
-} from '@tanstack/vue-table';
+    useSortableTable,
+    type SortableColumnDef,
+    type SortDirection,
+} from '@/utils/useSortableTable';
 
 export type SortColumn = 'name';
-export type SortDirection = 'asc' | 'desc';
+export type { SortDirection } from '@/utils/useSortableTable';
 
 const props = defineProps<{
     createTag: (name: string) => Promise<Tag | undefined>;
@@ -32,50 +31,27 @@ const emit = defineEmits<{
 const { tags } = useTagsQuery();
 const showCreateTagModal = ref(false);
 
-const sorting = computed<SortingState>(() => [
-    {
-        id: props.sortColumn,
-        desc: props.sortDirection === 'desc',
-    },
-]);
-
-const columns = [
+const columns: SortableColumnDef<Tag, SortColumn>[] = [
     {
         id: 'name',
         accessorFn: (row: Tag) => row.name.toLowerCase(),
     },
 ];
 
-const descFirstColumns = new Set<SortColumn>(
-    columns.filter((c) => 'sortDescFirst' in c && c.sortDescFirst).map((c) => c.id as SortColumn)
-);
+const {
+    sortedRows: sortedTags,
+    descFirstColumns,
+    nextDirection,
+} = useSortableTable({
+    data: () => tags.value,
+    columns: () => columns,
+    sortColumn: () => props.sortColumn,
+    sortDirection: () => props.sortDirection,
+});
 
 function handleSort(column: SortColumn) {
-    if (props.sortColumn === column) {
-        emit('sort', column, props.sortDirection === 'asc' ? 'desc' : 'asc');
-    } else {
-        emit('sort', column, descFirstColumns.has(column) ? 'desc' : 'asc');
-    }
+    emit('sort', column, nextDirection(column));
 }
-
-const table = useVueTable({
-    get data() {
-        return tags.value;
-    },
-    columns,
-    getCoreRowModel: getCoreRowModel(),
-    getSortedRowModel: getSortedRowModel(),
-    state: {
-        get sorting() {
-            return sorting.value;
-        },
-    },
-    manualSorting: false,
-});
-
-const sortedTags = computed(() => {
-    return table.getRowModel().rows.map((row) => row.original);
-});
 </script>
 
 <template>

resources/js/Components/Common/Tag/TagTableHeading.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import TableHeading from '@/Components/Common/TableHeading.vue';
-import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
+import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
 import type { SortColumn, SortDirection } from '@/Components/Common/Tag/TagTable.vue';
 
 const props = defineProps<{
@@ -9,41 +9,20 @@ const props = defineProps<{
     descFirstColumns: ReadonlySet<SortColumn>;
 }>();
 
-const emit = defineEmits<{
+defineEmits<{
     sort: [column: SortColumn];
 }>();
-
-function handleSort(column: SortColumn) {
-    emit('sort', column);
-}
-
-function isSorted(column: SortColumn): boolean {
-    return props.sortColumn === column;
-}
-
-function isChevronDown(column: SortColumn): boolean {
-    if (!isSorted(column)) return false;
-    return props.descFirstColumns.has(column)
-        ? props.sortDirection === 'desc'
-        : props.sortDirection === 'asc';
-}
-
-function isChevronUp(column: SortColumn): boolean {
-    if (!isSorted(column)) return false;
-    return !isChevronDown(column);
-}
 </script>
 
 <template>
     <TableHeading>
-        <div
-            class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12 cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
-            @click="handleSort('name')">
+        <SortableTableHeaderCell
+            class="pr-3 pl-4 sm:pl-6 lg:pl-8 3xl:pl-12"
+            column="name"
+            v-bind="props"
+            @sort="$emit('sort', $event)">
             Name
-            <ChevronDownIcon v-if="isChevronDown('name')" class="w-4 h-4" />
-            <ChevronUpIcon v-else-if="isChevronUp('name')" class="w-4 h-4" />
-            <span v-else class="w-4 h-4"></span>
-        </div>
+        </SortableTableHeaderCell>
         <div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
             <span class="sr-only">Edit</span>
         </div>

resources/js/Components/Common/Task/TaskTable.vue

@@ -8,12 +8,62 @@ import TaskTableHeading from '@/Components/Common/Task/TaskTableHeading.vue';
 import TaskCreateModal from '@/Components/Common/Task/TaskCreateModal.vue';
 import { canCreateTasks } from '@/utils/permissions';
 import type { Task } from '@/packages/api/src';
+import {
+    useSortableTable,
+    type SortableColumnDef,
+    type SortDirection,
+} from '@/utils/useSortableTable';
+
+export type SortColumn = 'name' | 'spent_time' | 'progress';
+export type { SortDirection } from '@/utils/useSortableTable';
 
 const props = defineProps<{
     projectId: string;
     tasks: Task[];
+    sortColumn: SortColumn;
+    sortDirection: SortDirection;
 }>();
 
+const emit = defineEmits<{
+    sort: [column: SortColumn, direction: SortDirection];
+}>();
+
+const columns: SortableColumnDef<Task, SortColumn>[] = [
+    {
+        id: 'name',
+        accessorFn: (row: Task) => row.name.toLowerCase(),
+    },
+    {
+        id: 'spent_time',
+        sortDescFirst: true,
+        accessorFn: (row: Task) => row.spent_time,
+    },
+    {
+        id: 'progress',
+        sortDescFirst: true,
+        accessorFn: (row: Task) => {
+            if (!row.estimated_time) return undefined;
+            return (row.spent_time / row.estimated_time) * 100;
+        },
+    },
+];
+
+const {
+    sortedRows: sortedTasks,
+    descFirstColumns,
+    nextDirection,
+} = useSortableTable({
+    data: () => props.tasks,
+    columns: () => columns,
+    sortColumn: () => props.sortColumn,
+    sortDirection: () => props.sortDirection,
+    tieBreakColumn: 'name',
+});
+
+function handleSort(column: SortColumn) {
+    emit('sort', column, nextDirection(column));
+}
+
 const createTask = ref(false);
 </script>
 
@@ -30,8 +80,12 @@ const createTask = ref(false);
                         1fr minmax(80px, auto) minmax(120px, auto) minmax(50px, auto)
                         80px;
                 ">
-                <TaskTableHeading></TaskTableHeading>
-                <div v-if="tasks.length === 0" class="col-span-5 py-24 text-center">
+                <TaskTableHeading
+                    :sort-column="sortColumn"
+                    :sort-direction="sortDirection"
+                    :desc-first-columns="descFirstColumns"
+                    @sort="handleSort"></TaskTableHeading>
+                <div v-if="sortedTasks.length === 0" class="col-span-5 py-24 text-center">
                     <PlusCircleIcon class="w-8 text-icon-default inline pb-2"></PlusCircleIcon>
                     <h3 class="text-text-primary font-semibold">No tasks found</h3>
                     <p v-if="canCreateTasks()" class="pb-5">Create your first task now!</p>
@@ -42,7 +96,7 @@ const createTask = ref(false);
                         >Create your First Task
                     </SecondaryButton>
                 </div>
-                <template v-for="task in tasks" :key="task.id">
+                <template v-for="task in sortedTasks" :key="task.id">
                     <TaskTableRow :task="task"></TaskTableRow>
                 </template>
             </div>

resources/js/Components/Common/Task/TaskTableHeading.vue

@@ -1,19 +1,37 @@
 <script setup lang="ts">
 import TableHeading from '@/Components/Common/TableHeading.vue';
+import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
+import type { SortColumn, SortDirection } from '@/Components/Common/Task/TaskTable.vue';
+
+const props = defineProps<{
+    sortColumn: SortColumn;
+    sortDirection: SortDirection;
+    descFirstColumns: ReadonlySet<SortColumn>;
+}>();
+
+defineEmits<{
+    sort: [column: SortColumn];
+}>();
 </script>
 
 <template>
     <TableHeading>
-        <div class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12">
+        <SortableTableHeaderCell
+            class="pr-3 pl-4 sm:pl-6 lg:pl-8 3xl:pl-12"
+            column="name"
+            v-bind="props"
+            @sort="$emit('sort', $event)">
             Task Name
-        </div>
-        <div class="px-3 py-1.5 text-left text-text-tertiary">Total Time</div>
-        <div class="px-3 py-1.5 text-left text-text-tertiary">Progress</div>
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="spent_time" v-bind="props" @sort="$emit('sort', $event)">
+            Total Time
+        </SortableTableHeaderCell>
+        <SortableTableHeaderCell column="progress" v-bind="props" @sort="$emit('sort', $event)">
+            Progress
+        </SortableTableHeaderCell>
         <div class="px-3 py-1.5 text-left text-text-tertiary">Status</div>
         <div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
             <span class="sr-only">Edit</span>
         </div>
     </TableHeading>
 </template>
-
-<style scoped></style>

resources/js/Components/Common/User/UserTimezoneMismatchModal.vue

@@ -1,11 +1,10 @@
 <script setup lang="ts">
-import { ref } from 'vue';
-import { useForm, usePage } from '@inertiajs/vue3';
+import { usePage } from '@inertiajs/vue3';
 import type { User } from '@/types/models';
 import TimezoneMismatchModal from '@/packages/ui/src/TimezoneMismatchModal.vue';
+import { useUpdateUserMutation } from '@/utils/useUserQuery';
 
 const show = defineModel('show', { default: false });
-const saving = ref(false);
 
 const page = usePage<{
     auth: {
@@ -13,33 +12,28 @@ const page = usePage<{
     };
 }>();
 
-function handleUpdate(timezone: string) {
-    saving.value = true;
-    const form = useForm({
-        _method: 'PUT',
-        timezone: timezone,
-        name: page.props.auth.user.name,
-        email: page.props.auth.user.email,
-        week_start: page.props.auth.user.week_start,
-    });
+const updateUser = useUpdateUserMutation();
 
-    form.post(route('user-profile-information.update'), {
-        errorBag: 'updateProfileInformation',
-        preserveScroll: true,
-        onSuccess: () => {
-            saving.value = false;
-            show.value = false;
-            location.reload();
-        },
-        onError: () => {
-            saving.value = false;
-        },
-    });
+async function handleUpdate(timezone: string) {
+    try {
+        await updateUser.mutateAsync({
+            userId: page.props.auth.user.id,
+            body: { timezone },
+        });
+        show.value = false;
+        // reload the whole page to re-read the timezone update
+        location.reload();
+    } catch {
+        // notification handled by mutation
+    }
 }
 </script>
 
 <template>
-    <TimezoneMismatchModal v-model:show="show" :saving="saving" @update="handleUpdate" />
+    <TimezoneMismatchModal
+        v-model:show="show"
+        :saving="updateUser.isPending.value"
+        @update="handleUpdate" />
 </template>
 
 <style scoped></style>

resources/js/Components/Dashboard/ActivityGraphCard.vue

@@ -63,7 +63,7 @@ const max = computed(() => {
 });
 
 const backgroundColor = useCssVariable('--theme-color-card-background');
-const borderColor = useCssVariable('--color-border');
+const borderColor = useCssVariable('--color-border-secondary');
 const labelColor = useCssVariable('--color-text-secondary');
 const chartColorRaw = useCssVariable('--theme-color-chart');
 

resources/js/Components/Dashboard/ThisWeekReportingTable.vue

@@ -95,20 +95,24 @@ const tableData = computed(() => {
     return (
         aggregatedTableTimeEntries.value?.grouped_data?.map((entry) => {
             return {
+                key: entry.key,
                 seconds: entry.seconds,
                 cost: entry.cost,
                 description: getNameForReportingRowEntry(
                     entry.key,
-                    aggregatedTableTimeEntries.value?.grouped_type ?? null
+                    aggregatedTableTimeEntries.value?.grouped_type ?? null,
+                    organization?.value?.date_format
                 ),
                 grouped_data:
                     entry.grouped_data?.map((el) => {
                         return {
+                            key: el.key,
                             seconds: el.seconds,
                             cost: el.cost,
                             description: getNameForReportingRowEntry(
                                 el.key,
-                                entry.grouped_type ?? null
+                                entry.grouped_type ?? null,
+                                organization?.value?.date_format
                             ),
                         };
                     }) ?? [],
@@ -164,7 +168,7 @@ const showBillableRate = computed(() => {
                 ">
                 <ReportingRow
                     v-for="entry in tableData"
-                    :key="entry.description ?? 'none'"
+                    :key="entry.key ?? 'none'"
                     :currency="getOrganizationCurrencyString()"
                     :show-cost="showBillableRate"
                     :entry="entry"></ReportingRow>