Remove Group from ClockifyTimeEntriesImporter

add date range navigation, unify picker components
fix e2e submit focus test behaviour
2026-10-07 21:33:18 +01:00 · 2026-09-22 18:08:49 +02:00 · 2026-09-22 15:53:50 +02:00 · 2026-09-22 13:43:42 +02:00 · 2026-09-22 13:43:42 +02:00 · 2026-09-22 13:43:42 +02:00
71 changed files with 1404 additions and 628 deletions
--- a/.github/workflows/build-onpremise.yml
+++ b/.github/workflows/build-onpremise.yml
@@ -141,7 +141,7 @@ jobs:
            ${{ env.DOCKER_REPO }}

      - name: "Login to solidtime OnPremise Registry"
-        uses: docker/login-action@v4.5.2
+        uses: docker/login-action@v4.6.0
        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.5.2
+        uses: docker/login-action@v4.6.0
        with:
          registry: registry.on-premise.solidtime.io
          username: ${{ secrets.ONPREMISE_USERNAME }}
--- a/.github/workflows/build-private.yml
+++ b/.github/workflows/build-private.yml
@@ -97,7 +97,7 @@ jobs:
      - name: "Install dependencies in billing extension"
        uses: php-actions/composer@v6
        env:
-          COMPOSER_AUTH: '{"http-basic": {"spark.laravel.com": {"username": "gregor@vostrak.at", "password": "${{ secrets.LARAVEL_SPARK_API_KEY }}"}}}'
+          COMPOSER_AUTH: '{"http-basic": {"spark.laravel.com": {"username": "${{ secrets.LARAVEL_SPARK_USERNAME }}", "password": "${{ secrets.LARAVEL_SPARK_API_KEY }}"}}}'
        with:
          working_dir: "extensions/Billing"
          command: install
@@ -177,7 +177,7 @@ jobs:
          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}

      - name: "Login to GitHub Container Registry"
-        uses: docker/login-action@v4.5.2
+        uses: docker/login-action@v4.6.0
        with:
          registry: rg.fr-par.scw.cloud/solidtime
          username: nologin
--- a/.github/workflows/build-public.yml
+++ b/.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.5.2
+        uses: docker/login-action@v4.6.0
        with:
          username: ${{ secrets.DOCKERHUB_USERNAME }}
          password: ${{ secrets.DOCKERHUB_TOKEN }}

      - name: "Login to GitHub Container Registry"
-        uses: docker/login-action@v4.5.2
+        uses: docker/login-action@v4.6.0
        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.5.2
+        uses: docker/login-action@v4.6.0
        with:
          username: ${{ secrets.DOCKERHUB_USERNAME }}
          password: ${{ secrets.DOCKERHUB_TOKEN }}

      - name: "Login to GHCR"
-        uses: docker/login-action@v4.5.2
+        uses: docker/login-action@v4.6.0
        with:
          registry: ghcr.io
          username: ${{ github.actor }}
--- a/.github/workflows/phpunit-extensions.yml
+++ b/.github/workflows/phpunit-extensions.yml
@@ -0,0 +1,136 @@
+name: PHPUnit Tests - Extensions
+on: push
+permissions:
+  contents: read
+jobs:
+  phpunit-extensions:
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+    strategy:
+      matrix:
+        postgres_version: [ 15, 16, 17 ]
+
+    services:
+      pgsql_test:
+        image: postgres:${{ matrix.postgres_version }}
+        env:
+          PGPASSWORD: 'root'
+          POSTGRES_DB: 'laravel'
+          POSTGRES_USER: 'root'
+          POSTGRES_PASSWORD: 'root'
+        ports:
+          - 5432:5432
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+      gotenberg:
+        image: gotenberg/gotenberg:8
+        ports:
+          - 3000:3000
+        options: >-
+          --health-cmd "curl --silent --fail http://localhost:3000/health"
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+    steps:
+      - name: "Checkout code"
+        uses: actions/checkout@v7
+
+      - name: "Setup PHP"
+        uses: shivammathur/setup-php@v2
+        with:
+          php-version: '8.3'
+          extensions: dom, curl, libxml, mbstring, zip, pcntl, pdo, sqlite, pdo_sqlite, bcmath, soap, intl, gd, exif, iconv
+          coverage: pcov
+
+      - uses: actions/setup-node@v7
+        with:
+          node-version: '20.x'
+
+      - name: "Read extension manifest"
+        id: extension-manifest
+        run: |
+          {
+            echo "billing_repository=$(jq -r '.Billing.repository' extensions/manifest.json)"
+            echo "billing_ref=$(jq -r '.Billing.ref' extensions/manifest.json)"
+            echo "services_repository=$(jq -r '.Services.repository' extensions/manifest.json)"
+            echo "services_ref=$(jq -r '.Services.ref' extensions/manifest.json)"
+            echo "invoicing_repository=$(jq -r '.Invoicing.repository' extensions/manifest.json)"
+            echo "invoicing_ref=$(jq -r '.Invoicing.ref' extensions/manifest.json)"
+          } >> "$GITHUB_OUTPUT"
+
+      - name: "Checkout billing extension"
+        uses: actions/checkout@v7
+        with:
+          repository: ${{ steps.extension-manifest.outputs.billing_repository }}
+          ref: ${{ steps.extension-manifest.outputs.billing_ref }}
+          path: extensions/Billing
+          ssh-key: ${{ secrets.SSH_PRIVATE_KEY_BILLING_EXTENSION }}
+
+      - name: "Install composer dependencies in billing extension"
+        working-directory: extensions/Billing
+        env:
+          COMPOSER_AUTH: '{"http-basic": {"spark.laravel.com": {"username": "contact@solidtime.io", "password": "${{ secrets.LARAVEL_SPARK_API_KEY }}"}}}'
+        run: composer install -n --prefer-dist --ignore-platform-reqs
+
+      - name: "Install npm dependencies in billing extension"
+        run: cd extensions/Billing && npm ci
+
+      - name: "Checkout services extension"
+        uses: actions/checkout@v7
+        with:
+          repository: ${{ steps.extension-manifest.outputs.services_repository }}
+          ref: ${{ steps.extension-manifest.outputs.services_ref }}
+          path: extensions/Services
+          ssh-key: ${{ secrets.SSH_PRIVATE_KEY_SERVICES_EXTENSION }}
+
+      - name: "Install composer dependencies in services extension"
+        working-directory: extensions/Services
+        run: composer install -n --prefer-dist --ignore-platform-reqs
+
+      - name: "Install npm dependencies in services extension"
+        run: cd extensions/Services && npm ci
+
+      - name: "Checkout invoicing extension"
+        uses: actions/checkout@v7
+        with:
+          repository: ${{ steps.extension-manifest.outputs.invoicing_repository }}
+          ref: ${{ steps.extension-manifest.outputs.invoicing_ref }}
+          path: extensions/Invoicing
+          ssh-key: ${{ secrets.SSH_PRIVATE_KEY_INVOICING_EXTENSION }}
+
+      - name: "Install composer dependencies in invoicing extension"
+        working-directory: extensions/Invoicing
+        run: composer install -n --prefer-dist --ignore-platform-reqs
+
+      - name: "Install npm dependencies in invoicing extension"
+        run: cd extensions/Invoicing && npm ci
+
+      - name: "Run composer install"
+        run: composer install -n --prefer-dist --ignore-platform-reqs
+
+      - name: "Activate billing extension"
+        run: php artisan module:enable Billing
+
+      - name: "Activate services extension"
+        run: php artisan module:enable Services
+
+      - name: "Activate invoicing extension"
+        run: php artisan module:enable Invoicing
+
+      - name: "Install dependencies"
+        run: npm ci
+
+      - name: "Build Frontend"
+        run: npm run build
+
+      - name: "Prepare Laravel Application"
+        run: |
+          cp .env.ci .env
+          php artisan key:generate
+          php artisan passport:keys
+
+      - name: "Run PHPUnit"
+        run: php artisan test extensions/Billing/tests extensions/Services/tests extensions/Invoicing/tests --stop-on-failure
--- a/.github/workflows/phpunit.yml
+++ b/.github/workflows/phpunit.yml
@@ -68,7 +68,7 @@ jobs:
        run: php artisan test --stop-on-failure --coverage-text --coverage-clover=coverage.xml

      - name: "Upload coverage reports to Codecov"
-        uses: codecov/codecov-action@v7.0.0
+        uses: codecov/codecov-action@v7.1.1
        with:
          token: ${{ secrets.CODECOV_TOKEN }}
          slug: solidtime-io/solidtime
--- a/app/Service/Import/Importers/ClockifyProjectsImporter.php
+++ b/app/Service/Import/Importers/ClockifyProjectsImporter.php
@@ -44,7 +44,7 @@ class ClockifyProjectsImporter extends DefaultImporter
                        'organization_id' => $this->organization->id,
                    ], [
                        'color' => $this->colorService->getRandomColor(),
-                        'is_billable' => $record['Billability'] === 'Yes',
+                        'is_billable' => ($record['Billability'] ?? '') === 'Yes',
                        'billable_rate' => $billableRateKey !== null && $record[$billableRateKey] !== '' ? (int) (((float) $record[$billableRateKey]) * 100) : null,
                        'estimated_time' => isset($record['Estimated (h)']) && is_numeric($record['Estimated (h)']) ? (int) ($record['Estimated (h)'] * 3600) : null,
                        'archived_at' => $record['Status'] === 'Archived' ? Carbon::now() : null,
@@ -54,6 +54,7 @@ class ClockifyProjectsImporter extends DefaultImporter
                if ($tasksKey !== null && $record[$tasksKey] !== '') {
                    $tasks = explode(', ', $record[$tasksKey]);
                    foreach ($tasks as $task) {
+                        $this->checkTaskNameLength($task);
                        $this->taskImportHelper->getKey([
                            'name' => $task,
                            'project_id' => $projectId,
@@ -83,7 +84,6 @@ class ClockifyProjectsImporter extends DefaultImporter
            'Project',
            'Status',
            'Visibility',
-            'Billability',
        ];
        foreach ($requiredFields as $requiredField) {
            if (! in_array($requiredField, $header, true)) {
--- a/app/Service/Import/Importers/ClockifyTimeEntriesImporter.php
+++ b/app/Service/Import/Importers/ClockifyTimeEntriesImporter.php
@@ -103,6 +103,7 @@ class ClockifyTimeEntriesImporter extends DefaultImporter
                }
                $taskId = null;
                if (! $isBreak && $taskKey !== null && $record[$taskKey] !== '') {
+                    $this->checkTaskNameLength($record[$taskKey]);
                    $taskId = $this->taskImportHelper->getKey([
                        'name' => $record[$taskKey],
                        'project_id' => $projectId,
@@ -227,7 +228,6 @@ class ClockifyTimeEntriesImporter extends DefaultImporter
            'Project',
            'Description',
            'User',
-            'Group',
            'Email',
            'Tags',
            'Start Date',
--- a/app/Service/Import/Importers/DefaultImporter.php
+++ b/app/Service/Import/Importers/DefaultImporter.php
@@ -21,6 +21,8 @@ use Illuminate\Database\Eloquent\Builder;

 abstract class DefaultImporter implements ImporterContract
 {
+    protected const TASK_NAME_MAX_LENGTH = 500;
+
    protected Organization $organization;

    /**
@@ -181,6 +183,16 @@ abstract class DefaultImporter implements ImporterContract
        $this->billableRateService = app(BillableRateService::class);
    }

+    /**
+     * @throws ImportException
+     */
+    protected function checkTaskNameLength(string $taskName): void
+    {
+        if (strlen($taskName) > self::TASK_NAME_MAX_LENGTH) {
+            throw new ImportException('Task name ("'.$taskName.'") is too long, maximum length is '.self::TASK_NAME_MAX_LENGTH.' characters');
+        }
+    }
+
    #[\Override]
    public function getReport(): ReportDto
    {
--- a/app/Service/Import/Importers/GenericTimeEntriesImporter.php
+++ b/app/Service/Import/Importers/GenericTimeEntriesImporter.php
@@ -113,6 +113,7 @@ class GenericTimeEntriesImporter extends DefaultImporter
                }
                $taskId = null;
                if ($record['task'] !== '') {
+                    $this->checkTaskNameLength($record['task']);
                    $taskId = $this->taskImportHelper->getKey([
                        'name' => $record['task'],
                        'project_id' => $projectId,
--- a/app/Service/Import/Importers/HarvestTimeEntriesImporter.php
+++ b/app/Service/Import/Importers/HarvestTimeEntriesImporter.php
@@ -92,6 +92,7 @@ class HarvestTimeEntriesImporter extends DefaultImporter
                }
                $taskId = null;
                if ($record['Task'] !== '') {
+                    $this->checkTaskNameLength($record['Task']);
                    $taskId = $this->taskImportHelper->getKey([
                        'name' => $record['Task'],
                        'project_id' => $projectId,
--- a/app/Service/Import/Importers/SolidtimeImporter.php
+++ b/app/Service/Import/Importers/SolidtimeImporter.php
@@ -199,6 +199,7 @@ class SolidtimeImporter extends DefaultImporter
                if ($projectId === null) {
                    throw new Exception('Project does not exist');
                }
+                $this->checkTaskNameLength($task['name']);
                $this->taskImportHelper->getKey([
                    'name' => $task['name'],
                    'project_id' => $projectId,
--- a/app/Service/Import/Importers/TogglDataImporter.php
+++ b/app/Service/Import/Importers/TogglDataImporter.php
@@ -153,9 +153,16 @@ class TogglDataImporter extends DefaultImporter
                }
                foreach ($projectMembers as $projectMember) {
                    $userId = $this->userImportHelper->getKeyByExternalIdentifier((string) $projectMember->user_id);
+                    if ($userId === null) {
+                        throw new Exception('User does not exist');
+                    }
+                    $memberId = $this->memberImportHelper->getKeyByExternalIdentifier($userId);
+                    if ($memberId === null) {
+                        throw new Exception('Member does not exist');
+                    }
                    $this->projectMemberImportHelper->getKey([
                        'project_id' => $projectId,
-                        'member_id' => $this->memberImportHelper->getKeyByExternalIdentifier($userId),
+                        'member_id' => $memberId,
                    ], [
                        'user_id' => $userId,
                        'billable_rate' => $projectMember->rate !== null ? (int) ($projectMember->rate * 100) : null,
@@ -182,6 +189,7 @@ class TogglDataImporter extends DefaultImporter
                    if ($projectId === null) {
                        throw new Exception('Project does not exist');
                    }
+                    $this->checkTaskNameLength($task->name);
                    $this->taskImportHelper->getKey([
                        'name' => $task->name,
                        'project_id' => $projectId,
--- a/app/Service/Import/Importers/TogglTimeEntriesImporter.php
+++ b/app/Service/Import/Importers/TogglTimeEntriesImporter.php
@@ -97,6 +97,7 @@ class TogglTimeEntriesImporter extends DefaultImporter
                }
                $taskId = null;
                if ($record['Task'] !== '') {
+                    $this->checkTaskNameLength($record['Task']);
                    $taskId = $this->taskImportHelper->getKey([
                        'name' => $record['Task'],
                        'project_id' => $projectId,
--- a/docker/prod/Dockerfile
+++ b/docker/prod/Dockerfile
@@ -1,7 +1,6 @@
 ARG PHP_VERSION=8.3
-ARG FRANKENPHP_VERSION=1.8
+ARG FRANKENPHP_VERSION=1.11
 ARG COMPOSER_VERSION=2.8
-ARG BUN_VERSION="latest"
 ARG APP_ENV
 ARG DOCKER_FILES_BASE_PATH="docker/prod/"

@@ -16,13 +15,13 @@ RUN CGO_ENABLED=1 \
    XCADDY_GO_BUILD_FLAGS="-ldflags='-w -s' -tags=nobadger,nomysql,nopgx" \
    CGO_CFLAGS=$(php-config --includes) \
    CGO_LDFLAGS="$(php-config --ldflags) $(php-config --libs)" \
-    xcaddy build v2.10.0 \
+    xcaddy build \
        --output /usr/local/bin/frankenphp \
        --with github.com/dunglas/frankenphp=./ \
        --with github.com/dunglas/frankenphp/caddy=./caddy/ \
        --with github.com/dunglas/caddy-cbrotli

-FROM dunglas/frankenphp:${FRANKENPHP_VERSION}-php${PHP_VERSION} AS base
+FROM dunglas/frankenphp:${FRANKENPHP_VERSION}-php${PHP_VERSION}

 COPY --from=upstream /usr/local/bin/frankenphp /usr/local/bin/frankenphp

@@ -32,26 +31,28 @@ LABEL org.opencontainers.image.description="solidtime is a modern open source ti
 LABEL org.opencontainers.image.source="https://github.com/solidtime-io/solidtime"
 LABEL org.opencontainers.image.licenses="AGPL"

-ARG WWWUSER=1000
-ARG WWWGROUP=1000
+ARG USER_ID=1000
+ARG GROUP_ID=1000
 ARG TZ=UTC
-ARG APP_DIR=/var/www/html
-ARG APP_ENV
-ARG APP_HOST
 ARG DOCKER_FILES_BASE_PATH

 ENV DEBIAN_FRONTEND=noninteractive \
    TERM=xterm-color \
    OCTANE_SERVER=frankenphp \
    TZ=${TZ} \
-    USER=octane \
-    ROOT=${APP_DIR} \
-    APP_ENV=${APP_ENV} \
+    LANG=C.UTF-8 \
+    USER=laravel \
+    ROOT=/var/www/html \
+    APP_ENV=production \
+    COMPOSER_ALLOW_SUPERUSER=1 \
    COMPOSER_FUND=0 \
-    COMPOSER_MAX_PARALLEL_HTTP=24 \
-    XDG_CONFIG_HOME=${APP_DIR}/.config \
-    XDG_DATA_HOME=${APP_DIR}/.data \
-    SERVER_NAME=${APP_HOST}
+    COMPOSER_MAX_PARALLEL_HTTP=48 \
+    WITH_HORIZON=false \
+    WITH_SCHEDULER=false \
+    WITH_REVERB=false \
+    WITH_SSR=false
+
+ENV XDG_CONFIG_HOME=${ROOT}/.config XDG_DATA_HOME=${ROOT}/.data

 WORKDIR ${ROOT}

@@ -60,6 +61,9 @@ SHELL ["/bin/bash", "-eou", "pipefail", "-c"]
 RUN ln -snf /usr/share/zoneinfo/${TZ} /etc/localtime \
    && echo ${TZ} > /etc/timezone

+RUN echo "Acquire::http::No-Cache true;" >> /etc/apt/apt.conf.d/99custom && \
+    echo "Acquire::BrokenProxy    true;" >> /etc/apt/apt.conf.d/99custom
+
 RUN apt-get update; \
    apt-get upgrade -yqq; \
    apt-get install -yqq --no-install-recommends --show-progress \
@@ -68,40 +72,36 @@ RUN apt-get update; \
    wget \
    vim \
    git \
+    unzip \
    ncdu \
    procps \
-    unzip \
    ca-certificates \
    supervisor \
    libsodium-dev \
-    libbrotli-dev \
-    # Install PHP extensions (included with dunglas/frankenphp)
+#    && curl -fsSL https://bun.sh/install | BUN_INSTALL=/usr bash \
    && install-php-extensions \
+    apcu \
    bz2 \
    pcntl \
    mbstring \
    bcmath \
    sockets \
-    pgsql \
    pdo_pgsql \
    opcache \
    exif \
    pdo_mysql \
    zip \
    uv \
-    vips \
    intl \
    gd \
    redis \
    rdkafka \
-    memcached \
-    igbinary \
+    ffi \
    ldap \
    && apt-get -y autoremove \
    && apt-get clean \
    && docker-php-source delete \
-    && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/* \
-    && rm /var/log/lastlog /var/log/faillog
+    && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/* /var/log/lastlog /var/log/faillog

 RUN arch="$(uname -m)" \
    && case "$arch" in \
@@ -111,106 +111,64 @@ RUN arch="$(uname -m)" \
    x86) _cronic_fname='supercronic-linux-386' ;; \
    *) echo >&2 "error: unsupported architecture: $arch"; exit 1 ;; \
    esac \
-    && wget -q "https://github.com/aptible/supercronic/releases/download/v0.2.29/${_cronic_fname}" \
+    && wget -q "https://github.com/aptible/supercronic/releases/download/v0.2.38/${_cronic_fname}" \
    -O /usr/bin/supercronic \
    && chmod +x /usr/bin/supercronic \
    && mkdir -p /etc/supercronic \
    && echo "*/1 * * * * php ${ROOT}/artisan schedule:run --no-interaction" > /etc/supercronic/laravel

 RUN userdel --remove --force www-data \
-    && groupadd --force -g ${WWWGROUP} ${USER} \
-    && useradd -ms /bin/bash --no-log-init --no-user-group -g ${WWWGROUP} -u ${WWWUSER} ${USER} \
-    && setcap -r /usr/local/bin/frankenphp
-
-RUN chown -R ${USER}:${USER} ${ROOT} /var/{log,run} \
-    && chmod -R a+rw ${ROOT} /var/{log,run}
+    && groupadd --force -g ${GROUP_ID} ${USER} \
+    && useradd -ms /bin/bash --no-log-init --no-user-group -g ${GROUP_ID} -u ${USER_ID} ${USER}

 RUN cp ${PHP_INI_DIR}/php.ini-production ${PHP_INI_DIR}/php.ini

-USER ${USER}
+COPY --link --from=vendor /usr/bin/composer /usr/bin/composer
+COPY --link ${DOCKER_FILES_BASE_PATH}deployment/supervisord.conf /etc/
+COPY --link ${DOCKER_FILES_BASE_PATH}deployment/octane/FrankenPHP/supervisord.frankenphp.conf /etc/supervisor/conf.d/
+COPY --link ${DOCKER_FILES_BASE_PATH}deployment/supervisord.*.conf /etc/supervisor/conf.d/
+COPY --link ${DOCKER_FILES_BASE_PATH}deployment/start-container /usr/local/bin/start-container
+COPY --link ${DOCKER_FILES_BASE_PATH}deployment/healthcheck /usr/local/bin/healthcheck
+COPY --link ${DOCKER_FILES_BASE_PATH}deployment/php.ini ${PHP_INI_DIR}/conf.d/99-php.ini
+#COPY --link composer.* ./

-COPY --link --chown=${WWWUSER}:${WWWUSER} --from=vendor /usr/bin/composer /usr/bin/composer
-
-COPY --link --chown=${WWWUSER}:${WWWUSER} ${DOCKER_FILES_BASE_PATH}deployment/supervisord.conf /etc/
-COPY --link --chown=${WWWUSER}:${WWWUSER} ${DOCKER_FILES_BASE_PATH}deployment/octane/FrankenPHP/supervisord.frankenphp.conf /etc/supervisor/conf.d/
-COPY --link --chown=${WWWUSER}:${WWWUSER} ${DOCKER_FILES_BASE_PATH}deployment/supervisord.*.conf /etc/supervisor/conf.d/
-COPY --link --chown=${WWWUSER}:${WWWUSER} ${DOCKER_FILES_BASE_PATH}deployment/start-container /usr/local/bin/start-container
-COPY --link --chown=${WWWUSER}:${WWWUSER} ${DOCKER_FILES_BASE_PATH}deployment/healthcheck /usr/local/bin/healthcheck
-COPY --link --chown=${WWWUSER}:${WWWUSER} ${DOCKER_FILES_BASE_PATH}deployment/php.ini ${PHP_INI_DIR}/conf.d/99-octane.ini
-
-RUN chmod +x /usr/local/bin/start-container /usr/local/bin/healthcheck
-
-###########################################
-
-#FROM base AS common
-#
-#USER ${USER}
-#
-#COPY --link --chown=${WWWUSER}:${WWWUSER} . .
-#
 #RUN composer install \
 #    --no-dev \
 #    --no-interaction \
 #    --no-autoloader \
 #    --no-ansi \
 #    --no-scripts \
+#    --no-progress \
 #    --audit

-###########################################
-# Build frontend assets with Bun
-###########################################
-
-#FROM oven/bun:${BUN_VERSION} AS build
-#
-#ARG APP_ENV
-#
-#ENV ROOT=/var/www/html \
-#    APP_ENV=${APP_ENV} \
-#    NODE_ENV=${APP_ENV:-production}
-#
-#WORKDIR ${ROOT}
-#
 #COPY --link package.json bun.lock* ./
-#
+
 #RUN bun install --frozen-lockfile
-#
-#COPY --link . .
-#COPY --link --from=common ${ROOT}/vendor vendor
-#
-#RUN bun run build

-###########################################
-
-#FROM common AS runner
-
-USER ${USER}
-
-ENV WITH_HORIZON=false \
-    WITH_SCHEDULER=false \
-    WITH_REVERB=false
-
-COPY --link --chown=${WWWUSER}:${WWWUSER} . ./
-
-RUN test -z "$(find . -name .git -print -quit)"
-#COPY --link --chown=${WWWUSER}:${WWWUSER} --from=build ${ROOT}/public public
+COPY --link . .

 RUN mkdir -p \
    storage/framework/{sessions,views,cache,testing} \
    storage/logs \
-    bootstrap/cache && chmod -R a+rw storage
+    bootstrap/cache \
+    && chmod +x /usr/local/bin/start-container /usr/local/bin/healthcheck

-#RUN composer install \
-#    --classmap-authoritative \
-#    --no-interaction \
-#    --no-ansi \
-#    --no-dev \
-#    && composer clear-cache
+RUN composer dump-autoload \
+    --optimize \
+    --apcu \
+    --no-dev

-RUN cat .env
-#RUN php artisan env
+#RUN bun run build
+
+RUN chown -R ${USER_ID}:${GROUP_ID} ${ROOT} \
+    && find / -perm /6000 -type f -exec chmod a-s {} + 2>/dev/null || true
+
+USER ${USER}

 EXPOSE 8000
+#EXPOSE 2019
+#EXPOSE 8080

 ENTRYPOINT ["start-container"]

-#HEALTHCHECK --start-period=5s --interval=2s --timeout=5s --retries=8 CMD healthcheck || exit 1
+#HEALTHCHECK --start-period=30s --interval=10s --timeout=3s --retries=3 CMD healthcheck || exit 1
--- a/docker/prod/deployment/healthcheck
+++ b/docker/prod/deployment/healthcheck
@@ -22,6 +22,13 @@ elif [ "${container_mode}" = "reverb" ]; then
        echo "Healthcheck failed."
        exit 1
    fi
+elif [ "${container_mode}" = "ssr" ]; then
+    if [ "$(supervisorctl status inertia-ssr-server:inertia-ssr-server_0 | awk '{print tolower($2)}')" = "running" ]; then
+        exit 0
+    else
+        echo "Healthcheck failed."
+        exit 1
+    fi
 elif [ "${container_mode}" = "worker" ]; then
    if [ "$(supervisorctl status worker:worker_0 | awk '{print tolower($2)}')" = "running" ]; then
        exit 0
--- a/docker/prod/deployment/octane/FrankenPHP/Caddyfile
+++ b/docker/prod/deployment/octane/FrankenPHP/Caddyfile
@@ -3,6 +3,14 @@

 	admin {$CADDY_SERVER_ADMIN_HOST}:{$CADDY_SERVER_ADMIN_PORT}

+	log {
+		level {$CADDY_SERVER_LOG_LEVEL:WARN}
+	}
+
+	auto_https off
+
+	skip_install_trust
+
 	frankenphp {
 		worker "{$APP_PUBLIC_PATH}/frankenphp-worker.php" {$CADDY_SERVER_WORKER_COUNT}
 	}
@@ -20,7 +28,7 @@

 {$CADDY_SERVER_SERVER_NAME} {
 	log {
-		level WARN
+		level {$CADDY_SERVER_LOG_LEVEL:WARN}

 		format filter {
 			wrap {$CADDY_SERVER_LOGGER}
@@ -60,7 +68,6 @@
 		error @rejected 401

 		php_server {
-			index frankenphp-worker.php
 			try_files {path} frankenphp-worker.php
 			resolve_root_symlink
 		}
--- a/docker/prod/deployment/octane/FrankenPHP/supervisord.frankenphp.conf
+++ b/docker/prod/deployment/octane/FrankenPHP/supervisord.frankenphp.conf
@@ -1,65 +1,18 @@
 [program:octane]
 process_name = %(program_name)s_%(process_num)s
-command = php %(ENV_ROOT)s/artisan octane:frankenphp --host=0.0.0.0 --port=8000 --admin-port=2019 --caddyfile=%(ENV_ROOT)s/docker/prod/deployment/octane/FrankenPHP/Caddyfile
+command = php %(ENV_ROOT)s/artisan octane:frankenphp --host=0.0.0.0 --port=8000 --admin-host=0.0.0.0 --admin-port=2019 --log-level=WARN --caddyfile=%(ENV_ROOT)s/docker/prod/deployment/octane/FrankenPHP/Caddyfile
 user = %(ENV_USER)s
 priority = 1
 autostart = true
 autorestart = true
+stopwaitsecs = 30
+stopasgroup = true
+killasgroup = true
 environment = LARAVEL_OCTANE = "1"
 stdout_logfile = /dev/stdout
 stdout_logfile_maxbytes = 0
 stderr_logfile = /dev/stderr
 stderr_logfile_maxbytes = 0

-[program:horizon]
-process_name = %(program_name)s_%(process_num)s
-command = php %(ENV_ROOT)s/artisan horizon
-user = %(ENV_USER)s
-priority = 3
-autostart = %(ENV_WITH_HORIZON)s
-autorestart = true
-stdout_logfile = %(ENV_ROOT)s/storage/logs/horizon.log
-stdout_logfile_maxbytes = 200MB
-stderr_logfile = %(ENV_ROOT)s/storage/logs/horizon.log
-stderr_logfile_maxbytes = 200MB
-stopwaitsecs = 3600
-
-[program:scheduler]
-process_name = %(program_name)s_%(process_num)s
-command = supercronic -overlapping /etc/supercronic/laravel
-user = %(ENV_USER)s
-autostart = %(ENV_WITH_SCHEDULER)s
-autorestart = true
-stdout_logfile = %(ENV_ROOT)s/storage/logs/scheduler.log
-stdout_logfile_maxbytes = 200MB
-stderr_logfile = %(ENV_ROOT)s/storage/logs/scheduler.log
-stderr_logfile_maxbytes = 200MB
-
-[program:clear-scheduler-cache]
-process_name = %(program_name)s_%(process_num)s
-command = php %(ENV_ROOT)s/artisan schedule:clear-cache
-user = %(ENV_USER)s
-autostart = %(ENV_WITH_SCHEDULER)s
-autorestart = false
-startsecs = 0
-startretries = 1
-stdout_logfile = %(ENV_ROOT)s/storage/logs/scheduler.log
-stdout_logfile_maxbytes = 200MB
-stderr_logfile = %(ENV_ROOT)s/storage/logs/scheduler.log
-stderr_logfile_maxbytes = 200MB
-
-[program:reverb]
-process_name = %(program_name)s_%(process_num)s
-command = php %(ENV_ROOT)s/artisan reverb:start
-user = %(ENV_USER)s
-priority = 2
-autostart = %(ENV_WITH_REVERB)s
-autorestart = true
-stdout_logfile = %(ENV_ROOT)s/storage/logs/reverb.log
-stdout_logfile_maxbytes = 200MB
-stderr_logfile = %(ENV_ROOT)s/storage/logs/reverb.log
-stderr_logfile_maxbytes = 200MB
-minfds = 10000
-
 [include]
-files = /etc/supervisord.conf
+files = /etc/supervisord.conf /etc/supervisor/conf.d/supervisord.services.conf
--- a/docker/prod/deployment/php.ini
+++ b/docker/prod/deployment/php.ini
@@ -2,8 +2,9 @@
 post_max_size = 100M
 upload_max_filesize = 100M
 expose_php = 0
-realpath_cache_size = 16M
-realpath_cache_ttl = 360
+realpath_cache_size = 32M
+realpath_cache_ttl = 720
+memory_limit = 256M
 max_input_time = 5
 register_argc_argv = 0
 date.timezone = ${TZ:-UTC}
@@ -11,18 +12,24 @@ date.timezone = ${TZ:-UTC}
 [Opcache]
 opcache.enable = 1
 opcache.enable_cli = 1
-opcache.memory_consumption = 256M
+opcache.memory_consumption = 256
 opcache.use_cwd = 0
+opcache.save_comments = 1
 opcache.max_file_size = 0
 opcache.max_accelerated_files = 32531
 opcache.validate_timestamps = 0
 opcache.file_update_protection = 0
 opcache.interned_strings_buffer = 16
+opcache.enable_file_override = 1
+opcache.file_cache_consistency_checks = 0
+opcache.file_cache = /tmp/opcache-file-cache

 [JIT]
 opcache.jit_buffer_size = 128M
-opcache.jit = function
-opcache.jit_prof_threshold = 0.001
+opcache.jit = tracing
+opcache.jit_hot_loop = 16
+opcache.jit_hot_func = 32
+opcache.jit_hot_return = 4
 opcache.jit_max_root_traces = 2048
 opcache.jit_max_side_traces = 256

--- a/docker/prod/deployment/supervisord.conf
+++ b/docker/prod/deployment/supervisord.conf
@@ -1,8 +1,6 @@
 [supervisord]
 nodaemon = true
 user = %(ENV_USER)s
-logfile = /var/log/supervisor/supervisord.log
-pidfile = /var/run/supervisord.pid

 [supervisorctl]

@@ -10,4 +8,4 @@ pidfile = /var/run/supervisord.pid
 port = 127.0.0.1:9001

 [rpcinterface:supervisor]
-supervisor.rpcinterface_factory = supervisor.rpcinterface:make_main_rpcinterface
+supervisor.rpcinterface_factory = supervisor.rpcinterface:make_main_rpcinterface
--- a/docker/prod/deployment/supervisord.horizon.conf
+++ b/docker/prod/deployment/supervisord.horizon.conf
@@ -4,6 +4,8 @@ command = php %(ENV_ROOT)s/artisan horizon
 user = %(ENV_USER)s
 autostart = true
 autorestart = true
+stopasgroup = true
+killasgroup = true
 stdout_logfile = /dev/stdout
 stdout_logfile_maxbytes = 0
 stderr_logfile = /dev/stderr
--- a/docker/prod/deployment/supervisord.inertia.conf
+++ b/docker/prod/deployment/supervisord.inertia.conf
@@ -0,0 +1,15 @@
+[program:inertia-ssr-server]
+process_name = %(program_name)s_%(process_num)s
+command = php %(ENV_ROOT)s/artisan inertia:start-ssr --runtime=bun --quiet
+user = %(ENV_USER)s
+autostart = true
+autorestart = true
+stopasgroup = true
+killasgroup = true
+stdout_logfile = /dev/stdout
+stdout_logfile_maxbytes = 0
+stderr_logfile = /dev/stderr
+stderr_logfile_maxbytes = 0
+
+[include]
+files = /etc/supervisord.conf
--- a/docker/prod/deployment/supervisord.reverb.conf
+++ b/docker/prod/deployment/supervisord.reverb.conf
@@ -4,6 +4,8 @@ command = php %(ENV_ROOT)s/artisan reverb:start
 user = %(ENV_USER)s
 autostart = true
 autorestart = true
+stopasgroup = true
+killasgroup = true
 stdout_logfile = /dev/stdout
 stdout_logfile_maxbytes = 0
 stderr_logfile = /dev/stderr
--- a/docker/prod/deployment/supervisord.scheduler.conf
+++ b/docker/prod/deployment/supervisord.scheduler.conf
@@ -4,6 +4,8 @@ command = supercronic -overlapping /etc/supercronic/laravel
 user = %(ENV_USER)s
 autostart = true
 autorestart = true
+stopasgroup = true
+killasgroup = true
 stdout_logfile = /dev/stdout
 stdout_logfile_maxbytes = 0
 stderr_logfile = /dev/stderr
--- a/docker/prod/deployment/supervisord.services.conf
+++ b/docker/prod/deployment/supervisord.services.conf
@@ -0,0 +1,69 @@
+[program:horizon]
+process_name = %(program_name)s_%(process_num)s
+command = php %(ENV_ROOT)s/artisan horizon
+user = %(ENV_USER)s
+priority = 4
+autostart = %(ENV_WITH_HORIZON)s
+autorestart = true
+stopasgroup = true
+killasgroup = true
+stdout_logfile = %(ENV_ROOT)s/storage/logs/horizon.log
+stdout_logfile_maxbytes = 200MB
+stderr_logfile = %(ENV_ROOT)s/storage/logs/horizon.log
+stderr_logfile_maxbytes = 200MB
+stopwaitsecs = 3600
+
+[program:scheduler]
+process_name = %(program_name)s_%(process_num)s
+command = supercronic -overlapping /etc/supercronic/laravel
+user = %(ENV_USER)s
+autostart = %(ENV_WITH_SCHEDULER)s
+autorestart = true
+stopasgroup = true
+killasgroup = true
+stdout_logfile = %(ENV_ROOT)s/storage/logs/scheduler.log
+stdout_logfile_maxbytes = 200MB
+stderr_logfile = %(ENV_ROOT)s/storage/logs/scheduler.log
+stderr_logfile_maxbytes = 200MB
+
+[program:clear-scheduler-cache]
+process_name = %(program_name)s_%(process_num)s
+command = php %(ENV_ROOT)s/artisan schedule:clear-cache
+user = %(ENV_USER)s
+autostart = %(ENV_WITH_SCHEDULER)s
+autorestart = false
+startsecs = 0
+startretries = 1
+stdout_logfile = %(ENV_ROOT)s/storage/logs/scheduler.log
+stdout_logfile_maxbytes = 200MB
+stderr_logfile = %(ENV_ROOT)s/storage/logs/scheduler.log
+stderr_logfile_maxbytes = 200MB
+
+[program:reverb]
+process_name = %(program_name)s_%(process_num)s
+command = php %(ENV_ROOT)s/artisan reverb:start
+user = %(ENV_USER)s
+priority = 3
+autostart = %(ENV_WITH_REVERB)s
+autorestart = true
+stopasgroup = true
+killasgroup = true
+stdout_logfile = %(ENV_ROOT)s/storage/logs/reverb.log
+stdout_logfile_maxbytes = 200MB
+stderr_logfile = %(ENV_ROOT)s/storage/logs/reverb.log
+stderr_logfile_maxbytes = 200MB
+minfds = 10000
+
+[program:inertia-ssr-server]
+process_name = %(program_name)s_%(process_num)s
+command = php %(ENV_ROOT)s/artisan inertia:start-ssr --runtime=bun --quiet
+user = %(ENV_USER)s
+priority = 2
+autostart = %(ENV_WITH_SSR)s
+autorestart = true
+stopasgroup = true
+killasgroup = true
+stdout_logfile = %(ENV_ROOT)s/storage/logs/inertia-ssr-server.log
+stdout_logfile_maxbytes = 200MB
+stderr_logfile = %(ENV_ROOT)s/storage/logs/inertia-ssr-server.log
+stderr_logfile_maxbytes = 200MB
--- a/docker/prod/deployment/supervisord.worker.conf
+++ b/docker/prod/deployment/supervisord.worker.conf
@@ -4,6 +4,8 @@ command = %(ENV_WORKER_COMMAND)s
 user = %(ENV_USER)s
 autostart = true
 autorestart = true
+stopasgroup = true
+killasgroup = true
 stdout_logfile = /dev/stdout
 stdout_logfile_maxbytes = 0
 stderr_logfile = /dev/stderr
--- a/e2e/calendar.spec.ts
+++ b/e2e/calendar.spec.ts
@@ -53,47 +53,6 @@ function todayAt(hour: number, minute: number = 0): string {
    return d.toISOString().replace(/\.\d{3}Z$/, 'Z');
 }

-// Cross-day tests anchor to Wednesday and Thursday of the current week instead of today and
-// tomorrow. E2E users start the week on Monday, so both days are always in the visible week,
-// whichever day the suite runs on.
-function wednesdayAt(hour: number, minute: number = 0): Date {
-    const now = new Date();
-    const daysSinceMonday = (now.getDay() + 6) % 7;
-    return new Date(
-        now.getFullYear(),
-        now.getMonth(),
-        now.getDate() - daysSinceMonday + 2,
-        hour,
-        minute,
-        0,
-        0
-    );
-}
-
-function thursdayAt(hour: number, minute: number = 0): Date {
-    const d = wednesdayAt(hour, minute);
-    d.setDate(d.getDate() + 1);
-    return d;
-}
-
-function toApiTimestamp(date: Date): string {
-    return date.toISOString().replace(/\.\d{3}Z$/, 'Z');
-}
-
-// Local calendar date (YYYY-MM-DD), matching FullCalendar's data-date attributes
-function toDateStr(date: Date): string {
-    const month = String(date.getMonth() + 1).padStart(2, '0');
-    const day = String(date.getDate()).padStart(2, '0');
-    return `${date.getFullYear()}-${month}-${day}`;
-}
-
-async function columnHeaderCenterX(page: Page, date: Date): Promise<number> {
-    const header = page.locator(`.fc-col-header-cell[data-date="${toDateStr(date)}"]`);
-    await expect(header).toBeVisible();
-    const box = await header.boundingBox();
-    return box!.x + box!.width / 2;
-}
-
 /**
 * These tests verify that changing the project on a time entry via the calendar
 * updates the billable status to match the new project's is_billable setting.
@@ -293,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 }) => {
@@ -1003,9 +962,14 @@ test.describe('Drag-to-Move Events', () => {
        page,
        ctx,
    }) => {
-        // Create entry: Thursday 00:30 → Thursday 01:30 (1 hour, near midnight)
-        const start = toApiTimestamp(thursdayAt(0, 30));
-        const end = toApiTimestamp(thursdayAt(1, 30));
+        const now = new Date();
+        const dayOfWeek = now.getDay();
+        // Need today to have a previous day visible in the week view (skip Sunday with Monday week start)
+        test.skip(dayOfWeek === 1, 'Skipping on Monday — previous day not visible in week view');
+
+        // Create entry: today 00:30 → today 01:30 (1 hour, near midnight)
+        const start = todayAt(0, 30);
+        const end = todayAt(1, 30);
        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Drag up past midnight test',
            start,
@@ -1014,10 +978,11 @@ test.describe('Drag-to-Move Events', () => {
        await goToCalendar(page);
        await scrollCalendarToTime(page, '00:00:00');

-        const thursdayCol = page.locator(
-            `.fc-timegrid-col[data-date="${toDateStr(thursdayAt(0))}"]`
-        );
-        const event = thursdayCol
+        const todayStr = new Date(now.getFullYear(), now.getMonth(), now.getDate())
+            .toISOString()
+            .split('T')[0];
+        const todayCol = page.locator(`.fc-timegrid-col[data-date="${todayStr}"]`);
+        const event = todayCol
            .locator('.fc-event')
            .filter({ hasText: 'Drag up past midnight test' });
        await expect(event).toBeVisible({ timeout: 10000 });
@@ -1053,7 +1018,10 @@ test.describe('Drag-to-Move Events', () => {
        expect(newDurationMs).toBe(3600000);

        // The event should have moved to the previous day
-        expect(toDateStr(newStart)).toBe(toDateStr(wednesdayAt(0)));
+        const yesterdayStr = new Date(now.getFullYear(), now.getMonth(), now.getDate() - 1)
+            .toISOString()
+            .split('T')[0];
+        expect(newStart.toISOString().split('T')[0]).toBe(yesterdayStr);
    });
 });

@@ -1293,8 +1261,8 @@ test.describe('Resize Events', () => {
    });

    test('resize bottom edge across day boundary changes end date', async ({ page, ctx }) => {
-        const start = toApiTimestamp(wednesdayAt(10));
-        const end = toApiTimestamp(wednesdayAt(11));
+        const start = todayAt(10);
+        const end = todayAt(11);
        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Cross resize end test',
            start,
@@ -1303,8 +1271,26 @@ test.describe('Resize Events', () => {
        await goToCalendar(page);
        await scrollCalendarToTime(page, '09:00:00');

-        // Resize into Thursday's column (for end resize, end must be > start)
-        const targetX = await columnHeaderCenterX(page, thursdayAt(0));
+        // Find a column AFTER today (for end resize, end must be > start)
+        const headers = page.locator('.fc-col-header-cell');
+        const headerCount = await headers.count();
+        let targetX: number | undefined;
+        let todayIndex = -1;
+        for (let i = 0; i < headerCount; i++) {
+            const header = headers.nth(i);
+            const isToday = await header.evaluate((el) => el.classList.contains('fc-day-today'));
+            if (isToday) {
+                todayIndex = i;
+                break;
+            }
+        }
+        // Pick first column after today, or skip if today is last
+        for (let i = todayIndex + 1; i < headerCount; i++) {
+            const box = await headers.nth(i).boundingBox();
+            targetX = box!.x + box!.width / 2;
+            break;
+        }
+        test.skip(targetX === undefined, 'No column after today to resize to');

        const event = page
            .locator('.fc-event')
@@ -1332,7 +1318,7 @@ test.describe('Resize Events', () => {
                // First drag down vertically to engage resize (like test 3.1)
                await page.mouse.move(centerX, bottomY + slotHeight * 4, { steps: 15 });
                // Then move horizontally to a later day column
-                await page.mouse.move(targetX, bottomY + slotHeight * 4, { steps: 10 });
+                await page.mouse.move(targetX!, bottomY + slotHeight * 4, { steps: 10 });
                await page.mouse.up();
            })(),
        ]);
@@ -1354,8 +1340,8 @@ test.describe('Resize Events', () => {
        page,
        ctx,
    }) => {
-        const start = toApiTimestamp(wednesdayAt(10));
-        const end = toApiTimestamp(wednesdayAt(14));
+        const start = todayAt(10);
+        const end = todayAt(14);
        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Cross resize end test',
            start,
@@ -1364,8 +1350,30 @@ test.describe('Resize Events', () => {
        await goToCalendar(page);
        await scrollCalendarToTime(page, '09:00:00');

-        // Resize into Thursday's column (later day needed for end-edge resize)
-        const targetX = await columnHeaderCenterX(page, thursdayAt(0));
+        // Find a non-today column header that is AFTER today (later day needed for end-edge resize)
+        const headers = page.locator('.fc-col-header-cell');
+        const headerCount = await headers.count();
+        let targetX: number | undefined;
+        let foundToday = false;
+        for (let i = 0; i < headerCount; i++) {
+            const header = headers.nth(i);
+            const isToday = await header.evaluate((el) => el.classList.contains('fc-day-today'));
+            if (isToday) {
+                foundToday = true;
+                continue;
+            }
+            if (foundToday) {
+                const box = await header.boundingBox();
+                targetX = box!.x + box!.width / 2;
+                break;
+            }
+        }
+        // If today is the last column, use the one before today instead won't work for end resize,
+        // so skip this test in that edge case
+        if (targetX === undefined) {
+            test.skip();
+            return;
+        }

        const event = page
            .locator('.fc-event')
@@ -1390,7 +1398,7 @@ test.describe('Resize Events', () => {
                await page.waitForTimeout(100);
                await page.mouse.down();
                // Move to a different day column at same Y position
-                await page.mouse.move(targetX, bottomY - 3, { steps: 15 });
+                await page.mouse.move(targetX!, bottomY - 3, { steps: 15 });
                await page.mouse.up();
            })(),
        ]);
@@ -1456,9 +1464,22 @@ test.describe('Resize Events', () => {
    });

    test('multi-day event end resize on last day works correctly', async ({ page, ctx }) => {
-        // Create entry spanning Wednesday evening → Thursday morning
-        const start = toApiTimestamp(wednesdayAt(20));
-        const end = toApiTimestamp(thursdayAt(10));
+        // Create entry spanning today evening → tomorrow morning
+        const start = todayAt(20);
+        const tomorrow = new Date();
+        tomorrow.setDate(tomorrow.getDate() + 1);
+        const tomorrowStr = `${tomorrow.getFullYear()}-${String(tomorrow.getMonth() + 1).padStart(2, '0')}-${String(tomorrow.getDate()).padStart(2, '0')}`;
+        const end = new Date(
+            tomorrow.getFullYear(),
+            tomorrow.getMonth(),
+            tomorrow.getDate(),
+            10,
+            0,
+            0,
+            0
+        )
+            .toISOString()
+            .replace(/\.\d{3}Z$/, 'Z');

        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Multi-day end resize',
@@ -1467,14 +1488,14 @@ test.describe('Resize Events', () => {
        });
        await goToCalendar(page);

-        const thursdayCol = page.locator(
-            `.fc-timegrid-col[data-date="${toDateStr(thursdayAt(0))}"]`
-        );
+        // Check if tomorrow column is visible
+        const tomorrowCol = page.locator(`.fc-timegrid-col[data-date="${tomorrowStr}"]`);
+        test.skip((await tomorrowCol.count()) === 0, 'Tomorrow not visible in current view');

        await scrollCalendarToTime(page, '09:00:00');

-        // Find the event segment on Thursday's column
-        const event = thursdayCol
+        // Find the event segment on tomorrow's column
+        const event = tomorrowCol
            .locator('.fc-event')
            .filter({ hasText: 'Multi-day end resize' })
            .first();
@@ -1520,9 +1541,22 @@ test.describe('Resize Events', () => {
        page,
        ctx,
    }) => {
-        // Create entry spanning Wednesday → Thursday
-        const start = toApiTimestamp(wednesdayAt(10));
-        const end = toApiTimestamp(thursdayAt(14));
+        // Create entry spanning today → tomorrow
+        const start = todayAt(10);
+        const tomorrow = new Date();
+        tomorrow.setDate(tomorrow.getDate() + 1);
+        const tomorrowStr = `${tomorrow.getFullYear()}-${String(tomorrow.getMonth() + 1).padStart(2, '0')}-${String(tomorrow.getDate()).padStart(2, '0')}`;
+        const end = new Date(
+            tomorrow.getFullYear(),
+            tomorrow.getMonth(),
+            tomorrow.getDate(),
+            14,
+            0,
+            0,
+            0
+        )
+            .toISOString()
+            .replace(/\.\d{3}Z$/, 'Z');

        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Backward end resize multi',
@@ -1531,16 +1565,29 @@ test.describe('Resize Events', () => {
        });
        await goToCalendar(page);

-        const thursdayCol = page.locator(
-            `.fc-timegrid-col[data-date="${toDateStr(thursdayAt(0))}"]`
-        );
+        // Check if tomorrow column is visible
+        const tomorrowCol = page.locator(`.fc-timegrid-col[data-date="${tomorrowStr}"]`);
+        test.skip((await tomorrowCol.count()) === 0, 'Tomorrow not visible in current view');

        await scrollCalendarToTime(page, '12:00:00');

-        const wednesdayX = await columnHeaderCenterX(page, wednesdayAt(0));
+        // Find today's column header to get its X center
+        const headers = page.locator('.fc-col-header-cell');
+        const headerCount = await headers.count();
+        let todayX: number | undefined;
+        for (let i = 0; i < headerCount; i++) {
+            const header = headers.nth(i);
+            const isToday = await header.evaluate((el) => el.classList.contains('fc-day-today'));
+            if (isToday) {
+                const box = await header.boundingBox();
+                todayX = box!.x + box!.width / 2;
+                break;
+            }
+        }
+        test.skip(todayX === undefined, 'Could not find today column header');

-        // Find event segment on Thursday's column and resize end backward to Wednesday
-        const event = thursdayCol
+        // Find event segment on tomorrow's column and resize end backward to today
+        const event = tomorrowCol
            .locator('.fc-event')
            .filter({ hasText: 'Backward end resize multi' })
            .first();
@@ -1562,9 +1609,9 @@ test.describe('Resize Events', () => {
                await page.mouse.move(centerX, bottomY - 3);
                await page.waitForTimeout(100);
                await page.mouse.down();
-                // Drag down a bit first, then move to Wednesday's column at a Y after the start
+                // Drag down a bit first, then move to today's column at a Y after the start
                await page.mouse.move(centerX, bottomY + slotHeight, { steps: 5 });
-                await page.mouse.move(wednesdayX, bottomY + slotHeight, { steps: 10 });
+                await page.mouse.move(todayX!, bottomY + slotHeight, { steps: 10 });
                await page.mouse.up();
            })(),
        ]);
@@ -1580,8 +1627,8 @@ test.describe('Resize Events', () => {
    });

    test('resize end to earlier column prevents end before start', async ({ page, ctx }) => {
-        const start = toApiTimestamp(thursdayAt(10));
-        const end = toApiTimestamp(thursdayAt(14));
+        const start = todayAt(10);
+        const end = todayAt(14);
        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'End before start test',
            start,
@@ -1590,8 +1637,25 @@ test.describe('Resize Events', () => {
        await goToCalendar(page);
        await scrollCalendarToTime(page, '09:00:00');

-        // Target Wednesday's column, the day before the entry
-        const targetX = await columnHeaderCenterX(page, wednesdayAt(0));
+        // Find a column BEFORE today
+        const headers = page.locator('.fc-col-header-cell');
+        const headerCount = await headers.count();
+        let targetX: number | undefined;
+        let todayIndex = -1;
+        for (let i = 0; i < headerCount; i++) {
+            const header = headers.nth(i);
+            const isToday = await header.evaluate((el) => el.classList.contains('fc-day-today'));
+            if (isToday) {
+                todayIndex = i;
+                break;
+            }
+        }
+        for (let i = todayIndex - 1; i >= 0; i--) {
+            const box = await headers.nth(i).boundingBox();
+            targetX = box!.x + box!.width / 2;
+            break;
+        }
+        test.skip(targetX === undefined, 'No column before today to test');

        const event = page
            .locator('.fc-event')
@@ -1619,7 +1683,7 @@ test.describe('Resize Events', () => {
        await page.waitForTimeout(100);
        await page.mouse.down();
        // Move to earlier column at a Y position near the top of the grid (before start time)
-        await page.mouse.move(targetX, eventBox!.y - slotHeight * 4, { steps: 15 });
+        await page.mouse.move(targetX!, eventBox!.y - slotHeight * 4, { steps: 15 });
        await page.mouse.up();

        // Wait for any potential API call
@@ -1668,21 +1732,30 @@ test.describe('Click-Drag Selection to Create', () => {
    test('drag-to-create spanning two days opens create modal with correct cross-day times', async ({
        page,
    }) => {
+        const now = new Date();
+        const dayOfWeek = now.getDay();
+        // Need today and tomorrow both visible (skip Saturday with Monday week start)
+        test.skip(dayOfWeek === 6, 'Skipping on Saturday — tomorrow not visible in week view');
+
        await goToCalendar(page);
        await expect(page.locator('.fc')).toBeVisible();
        // Use mid-day times so both start and end slots are visible in the viewport
        await scrollCalendarToTime(page, '10:00:00');

-        // Find Wednesday's and Thursday's columns
-        const wednesdayStr = toDateStr(wednesdayAt(0));
-        const thursdayStr = toDateStr(thursdayAt(0));
+        // Find today's and tomorrow's columns
+        const todayStr = new Date(now.getFullYear(), now.getMonth(), now.getDate())
+            .toISOString()
+            .split('T')[0];
+        const tomorrowStr = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1)
+            .toISOString()
+            .split('T')[0];

-        const wednesdayCol = page.locator(`.fc-timegrid-col[data-date="${wednesdayStr}"]`);
-        const thursdayCol = page.locator(`.fc-timegrid-col[data-date="${thursdayStr}"]`);
-        await expect(wednesdayCol).toBeVisible();
-        await expect(thursdayCol).toBeVisible();
+        const todayCol = page.locator(`.fc-timegrid-col[data-date="${todayStr}"]`);
+        const tomorrowCol = page.locator(`.fc-timegrid-col[data-date="${tomorrowStr}"]`);
+        await expect(todayCol).toBeVisible();
+        await expect(tomorrowCol).toBeVisible();

-        // Find the 11:00 slot (start) and 13:00 slot (end on Thursday)
+        // Find the 11:00 slot (start) and 13:00 slot (end on tomorrow)
        const startSlot = page.locator('.fc-timegrid-slot-lane[data-time="11:00:00"]').first();
        const endSlot = page.locator('.fc-timegrid-slot-lane[data-time="13:00:00"]').first();
        await expect(startSlot).toBeVisible();
@@ -1690,18 +1763,18 @@ test.describe('Click-Drag Selection to Create', () => {

        const startSlotBox = await startSlot.boundingBox();
        const endSlotBox = await endSlot.boundingBox();
-        const wednesdayColBox = await wednesdayCol.boundingBox();
-        const thursdayColBox = await thursdayCol.boundingBox();
+        const todayColBox = await todayCol.boundingBox();
+        const tomorrowColBox = await tomorrowCol.boundingBox();

-        // Start drag at 11:00 on Wednesday's column
-        const startX = wednesdayColBox!.x + wednesdayColBox!.width / 2;
+        // Start drag at 11:00 on today's column
+        const startX = todayColBox!.x + todayColBox!.width / 2;
        const startY = startSlotBox!.y + 2;

-        // End drag at 13:00 on Thursday's column
-        const endX = thursdayColBox!.x + thursdayColBox!.width / 2;
+        // End drag at 13:00 on tomorrow's column
+        const endX = tomorrowColBox!.x + tomorrowColBox!.width / 2;
        const endY = endSlotBox!.y + 2;

-        // Drag from Wednesday to Thursday, moving down first, then across
+        // Drag from today to tomorrow — move down first, then across
        const slotHeight = await getSlotHeight(page);
        await page.mouse.move(startX, startY);
        await page.mouse.down();
@@ -1719,9 +1792,9 @@ test.describe('Click-Drag Selection to Create', () => {
        await expect(dialog.getByText('Start')).toBeVisible();
        await expect(dialog.getByText('End')).toBeVisible();

-        // Start date should be Wednesday, end date should be Thursday
-        await expect(dialog.getByText(wednesdayStr)).toBeVisible();
-        await expect(dialog.getByText(thursdayStr)).toBeVisible();
+        // Start date should be today, end date should be tomorrow
+        await expect(dialog.getByText(todayStr)).toBeVisible();
+        await expect(dialog.getByText(tomorrowStr)).toBeVisible();
    });
 });

@@ -1803,9 +1876,17 @@ test.describe('Timezone & Localization', () => {

 test.describe('Multi-Day Events', () => {
    test('event spanning 2 days renders and is visible', async ({ page, ctx }) => {
-        // Create entry that spans from Wednesday 22:00 to Thursday 02:00
-        const start = toApiTimestamp(wednesdayAt(22));
-        const end = toApiTimestamp(thursdayAt(2));
+        // Create entry that spans from today 22:00 to tomorrow 02:00
+        const now = new Date();
+        const dayOfWeek = now.getDay();
+        // If today is Saturday (6), the entry would span to next week and may not be visible
+        test.skip(dayOfWeek === 6, 'Skipping on Saturday — multi-day would span to next week');
+
+        const startDate = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 22, 0, 0);
+        const endDate = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1, 2, 0, 0);
+
+        const start = startDate.toISOString().replace(/\.\d{3}Z$/, 'Z');
+        const end = endDate.toISOString().replace(/\.\d{3}Z$/, 'Z');

        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Multi day entry',
@@ -1820,8 +1901,14 @@ test.describe('Multi-Day Events', () => {
    });

    test('multi-day event can be edited via click', async ({ page, ctx }) => {
-        const start = toApiTimestamp(wednesdayAt(22));
-        const end = toApiTimestamp(thursdayAt(2));
+        const now = new Date();
+        test.skip(now.getDay() === 6, 'Skip on Saturday');
+
+        const startDate = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 22, 0, 0);
+        const endDate = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1, 2, 0, 0);
+
+        const start = startDate.toISOString().replace(/\.\d{3}Z$/, 'Z');
+        const end = endDate.toISOString().replace(/\.\d{3}Z$/, 'Z');

        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Multi day edit test',
@@ -1840,8 +1927,14 @@ test.describe('Multi-Day Events', () => {
    });

    test('multi-day event context menu works', async ({ page, ctx }) => {
-        const start = toApiTimestamp(wednesdayAt(22));
-        const end = toApiTimestamp(thursdayAt(2));
+        const now = new Date();
+        test.skip(now.getDay() === 6, 'Skip on Saturday');
+
+        const startDate = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 22, 0, 0);
+        const endDate = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1, 2, 0, 0);
+
+        const start = startDate.toISOString().replace(/\.\d{3}Z$/, 'Z');
+        const end = endDate.toISOString().replace(/\.\d{3}Z$/, 'Z');

        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Multi day ctx test',
@@ -1861,11 +1954,16 @@ test.describe('Multi-Day Events', () => {
        page,
        ctx,
    }) => {
-        // Create entry: Wednesday 22:00 → Thursday 02:00 (4 hours, spanning 2 days)
-        const startDate = wednesdayAt(22);
-        const endDate = thursdayAt(2);
-        const start = toApiTimestamp(startDate);
-        const end = toApiTimestamp(endDate);
+        const now = new Date();
+        const dayOfWeek = now.getDay();
+        // Need today and tomorrow both visible (skip Saturday)
+        test.skip(dayOfWeek === 6, 'Skipping on Saturday — multi-day would span to next week');
+
+        // Create entry: today 22:00 → tomorrow 02:00 (4 hours, spanning 2 days)
+        const startDate = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 22, 0, 0);
+        const endDate = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1, 2, 0, 0);
+        const start = startDate.toISOString().replace(/\.\d{3}Z$/, 'Z');
+        const end = endDate.toISOString().replace(/\.\d{3}Z$/, 'Z');

        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Multi day drag test',
@@ -1875,9 +1973,12 @@ test.describe('Multi-Day Events', () => {
        await goToCalendar(page);
        await scrollCalendarToTime(page, '00:00:00');

-        // Find the clipped segment on Thursday's column (00:00-02:00)
-        const thursdayCol = page.locator(`.fc-timegrid-col[data-date="${toDateStr(endDate)}"]`);
-        const event = thursdayCol.locator('.fc-event').filter({ hasText: 'Multi day drag test' });
+        // Find the clipped segment on tomorrow's column (00:00-02:00)
+        const tomorrowStr = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1)
+            .toISOString()
+            .split('T')[0];
+        const tomorrowCol = page.locator(`.fc-timegrid-col[data-date="${tomorrowStr}"]`);
+        const event = tomorrowCol.locator('.fc-event').filter({ hasText: 'Multi day drag test' });
        await expect(event).toBeVisible({ timeout: 10000 });

        const eventBox = await event.boundingBox();
@@ -1912,19 +2013,27 @@ test.describe('Multi-Day Events', () => {
        // Duration must be preserved (4 hours)
        expect(Math.abs(newDurationMs - origDurationMs)).toBeLessThan(60000);

-        // The start should still be on Wednesday (not jumped to Thursday)
-        expect(toDateStr(newStart)).toBe(toDateStr(startDate));
+        // The start should still be on today (not jumped to tomorrow)
+        const todayStr = new Date(now.getFullYear(), now.getMonth(), now.getDate())
+            .toISOString()
+            .split('T')[0];
+        expect(newStart.toISOString().split('T')[0]).toBe(todayStr);
    });

    test('dragging clipped segment of multi-day event upward shifts event earlier', async ({
        page,
        ctx,
    }) => {
-        // Create entry: Wednesday 22:00 → Thursday 02:00 (4 hours, spanning 2 days)
-        const startDate = wednesdayAt(22);
-        const endDate = thursdayAt(2);
-        const start = toApiTimestamp(startDate);
-        const end = toApiTimestamp(endDate);
+        const now = new Date();
+        const dayOfWeek = now.getDay();
+        // Need today and tomorrow both visible (skip Saturday)
+        test.skip(dayOfWeek === 6, 'Skipping on Saturday — multi-day would span to next week');
+
+        // Create entry: today 22:00 → tomorrow 02:00 (4 hours, spanning 2 days)
+        const startDate = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 22, 0, 0);
+        const endDate = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1, 2, 0, 0);
+        const start = startDate.toISOString().replace(/\.\d{3}Z$/, 'Z');
+        const end = endDate.toISOString().replace(/\.\d{3}Z$/, 'Z');

        await createTimeEntryWithTimestampsViaApi(ctx, {
            description: 'Multi day drag up test',
@@ -1934,9 +2043,12 @@ test.describe('Multi-Day Events', () => {
        await goToCalendar(page);
        await scrollCalendarToTime(page, '00:00:00');

-        // Find the clipped segment on Thursday's column (00:00-02:00)
-        const thursdayCol = page.locator(`.fc-timegrid-col[data-date="${toDateStr(endDate)}"]`);
-        const event = thursdayCol
+        // Find the clipped segment on tomorrow's column (00:00-02:00)
+        const tomorrowStr = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1)
+            .toISOString()
+            .split('T')[0];
+        const tomorrowCol = page.locator(`.fc-timegrid-col[data-date="${tomorrowStr}"]`);
+        const event = tomorrowCol
            .locator('.fc-event')
            .filter({ hasText: 'Multi day drag up test' });
        await expect(event).toBeVisible({ timeout: 10000 });
--- a/e2e/reporting.spec.ts
+++ b/e2e/reporting.spec.ts
@@ -18,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
 // ──────────────────────────────────────────────────
--- a/e2e/time.spec.ts
+++ b/e2e/time.spec.ts
@@ -1579,6 +1579,57 @@ test('test that project selection works in create modal', async ({ page, ctx })
    expect(createBody.data.project_id).not.toBeNull();
 });

+test('test that ctrl+enter submits the create modal after selecting a project via keyboard', async ({
+    page,
+    ctx,
+}) => {
+    // Regression test for https://github.com/solidtime-io/solidtime/issues/1238
+    const projectName = 'Keyboard Submit Project ' + Math.floor(1 + Math.random() * 10000);
+    await createProjectViaApi(ctx, { name: projectName });
+
+    await goToTimeOverview(page);
+
+    await page.getByRole('button', { name: 'Time entry actions' }).click();
+    await page.getByRole('menuitem', { name: 'Manual time entry' }).click();
+    await expect(page.getByRole('dialog')).toBeVisible();
+    // The menu that opened the modal animates out and only then hands focus back to its
+    // own trigger.
+    await expect(page.locator('[role="menu"]')).toHaveCount(0);
+
+    // Fill the description, then move to the project dropdown and select a project purely via keyboard
+    const description = page.getByRole('dialog').getByRole('textbox', { name: 'Description' });
+    await description.fill('Keyboard submit test');
+    await description.press('Tab');
+    await expect(
+        page.getByRole('dialog').getByRole('button', { name: 'No Project' })
+    ).toBeFocused();
+    await page.keyboard.press('Enter');
+    await page.getByTestId('client_dropdown_search').fill(projectName);
+    await expect(page.getByRole('option', { name: projectName })).toBeVisible();
+    await page.keyboard.press('Enter');
+    const projectTrigger = page.getByRole('dialog').getByRole('button', { name: projectName });
+    await expect(projectTrigger).toBeVisible();
+    // The trigger label updates on the next tick, but the dropdown keeps focus until its
+    // exit animation has finished and reka-ui hands focus back to the trigger.
+    await expect(projectTrigger).toBeFocused();
+
+    // Ctrl+Enter must submit even though focus is no longer on the description input
+    const [createResponse] = await Promise.all([
+        page.waitForResponse(
+            (response) => response.url().includes('/time-entries') && response.status() === 201
+        ),
+        page.keyboard.press('Control+Enter'),
+    ]);
+    const createBody = await createResponse.json();
+    expect(createBody.data.description).toBe('Keyboard submit test');
+    expect(createBody.data.project_id).not.toBeNull();
+    await expect(page.getByRole('dialog')).toBeHidden();
+    const newTimeEntry = page.locator('[data-testid="time_entry_row"]').first();
+    await expect(newTimeEntry.getByTestId('time_entry_description').first()).toHaveValue(
+        'Keyboard submit test'
+    );
+});
+
 test('test that tag selection works in create modal', async ({ page }) => {
    await goToTimeOverview(page);

--- a/e2e/timesheet.spec.ts
+++ b/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');
 });

 // ──────────────────────────────────────────────────
--- a/extensions/manifest.json
+++ b/extensions/manifest.json
@@ -1,7 +1,7 @@
 {
    "Billing": {
        "repository": "solidtime-io/extension-billing",
-        "ref": "v0.0.6"
+        "ref": "main"
    },
    "Services": {
        "repository": "solidtime-io/extension-services",
--- a/phpunit.xml
+++ b/phpunit.xml
@@ -43,5 +43,7 @@
        <env name="NEWSLETTER_URL" value="null"/>
        <env name="PASSPORT_PERSONAL_ACCESS_CLIENT_ID" value="null"/>
        <env name="PASSPORT_PERSONAL_ACCESS_CLIENT_SECRET" value="null"/>
+        <env name="PADDLE_API_KEY" value="test_phpunit_paddle_api_key"/>
+        <env name="PADDLE_SANDBOX" value="true"/>
    </php>
 </phpunit>
--- a/resources/js/Components/Common/Client/ClientCreateModal.vue
+++ b/resources/js/Components/Common/Client/ClientCreateModal.vue
@@ -28,7 +28,7 @@ useFocus(clientNameInput, { initialValue: true });
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Create Client </span>
--- a/resources/js/Components/Common/Client/ClientEditModal.vue
+++ b/resources/js/Components/Common/Client/ClientEditModal.vue
@@ -30,7 +30,7 @@ useFocus(clientNameInput, { initialValue: true });
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Update Client </span>
--- a/resources/js/Components/Common/Member/MemberEditModal.vue
+++ b/resources/js/Components/Common/Member/MemberEditModal.vue
@@ -136,7 +136,7 @@ const roleDescription = computed(() => {
        v-model:show="showOwnershipTransferConfirmModal"
        :member-name="member.name"
        @submit="submit"></MemberOwnershipTransferConfirmModal>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="saveWithChecks()">
        <template #title>
            <div class="flex space-x-2">
                <span> Update Member </span>
--- a/resources/js/Components/Common/Member/MemberInviteModal.vue
+++ b/resources/js/Components/Common/Member/MemberInviteModal.vue
@@ -78,7 +78,7 @@ useFocus(clientNameInput, { initialValue: true });
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Invite Member </span>
--- a/resources/js/Components/Common/Project/ProjectEditModal.vue
+++ b/resources/js/Components/Common/Project/ProjectEditModal.vue
@@ -79,7 +79,7 @@ async function submitBillableRate() {
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Edit Project {{ props.originalProject.name }} </span>
--- a/resources/js/Components/Common/Project/ProjectTable.vue
+++ b/resources/js/Components/Common/Project/ProjectTable.vue
@@ -10,21 +10,13 @@ import Pagination from '@/packages/ui/src/Pagination.vue';
 import LoadingSpinner from '@/packages/ui/src/LoadingSpinner.vue';

 export type SortColumn =
-    | 'name'
-    | 'tasks'
-    | 'client_name'
-    | 'spent_time'
-    | 'progress'
-    | 'billable_rate'
-    | 'status'
-    | 'visibility';
+    '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';
 import { useClientsStore } from '@/utils/useClients';
 import { useClientsQuery } from '@/utils/useClientsQuery';
-import { useTasksQuery } from '@/utils/useTasksQuery';
 import { getOrganizationCurrencyString } from '@/utils/money';
 import { isAllowedToPerformPremiumAction } from '@/utils/billing';
 import { useOrganizationQuery } from '@/utils/useOrganizationQuery';
@@ -64,16 +56,6 @@ const clientNameMap = computed(() => {
    return map;
 });

-const { tasks } = useTasksQuery();
-
-const taskCountMap = computed(() => {
-    const map = new Map<string, number>();
-    tasks.value.forEach((task) => {
-        map.set(task.project_id, (map.get(task.project_id) ?? 0) + 1);
-    });
-    return map;
-});
-
 // 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).
@@ -82,11 +64,6 @@ const columns = computed<SortableColumnDef<Project, SortColumn>[]>(() => [
        id: 'name',
        accessorFn: (row: Project) => row.name.toLowerCase(),
    },
-    {
-        id: 'tasks',
-        sortDescFirst: true,
-        accessorFn: (row: Project) => taskCountMap.value.get(row.id) ?? 0,
-    },
    {
        id: 'client_name',
        accessorFn: (row: Project) => {
@@ -184,7 +161,7 @@ async function createClient(client: CreateClientBody): Promise<Client | undefine
 }

 const gridTemplate = computed(() => {
-    return `grid-template-columns: minmax(300px, 1fr) minmax(100px, auto) minmax(150px, auto) minmax(140px, auto) minmax(130px, auto) ${props.showBillableRate ? 'minmax(130px, auto)' : ''} minmax(120px, auto) minmax(120px, auto) 80px;`;
+    return `grid-template-columns: minmax(300px, 1fr) minmax(150px, auto) minmax(140px, auto) minmax(130px, auto) ${props.showBillableRate ? 'minmax(130px, auto)' : ''} minmax(120px, auto) minmax(120px, auto) 80px;`;
 });
 </script>

--- a/resources/js/Components/Common/Project/ProjectTableHeading.vue
+++ b/resources/js/Components/Common/Project/ProjectTableHeading.vue
@@ -36,9 +36,6 @@ function handleSort(column: SortColumn) {
            @sort="handleSort">
            Name
        </SortableTableHeaderCell>
-        <SortableTableHeaderCell column="tasks" v-bind="sortState" @sort="handleSort">
-            Tasks
-        </SortableTableHeaderCell>
        <SortableTableHeaderCell column="client_name" v-bind="sortState" @sort="handleSort">
            Client
        </SortableTableHeaderCell>
--- a/resources/js/Components/Common/Project/ProjectTableRow.vue
+++ b/resources/js/Components/Common/Project/ProjectTableRow.vue
@@ -88,19 +88,17 @@ 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-3 py-4 pr-3 text-sm font-medium text-text-primary pl-2 sm:pl-4 lg:pl-6">
+                    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 }"
-                        class="w-2.5 h-2.5 ml-1 rounded-full"></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 ml-1 rounded-full"></div>
                    <span class="overflow-ellipsis overflow-hidden">
                        {{ project.name }}
                    </span>
-                </div>
-                <div class="whitespace-nowrap px-3 py-4 text-sm text-text-primary">
-                    <span v-if="projectTasksCount">
-                        {{ projectTasksCount }} {{ projectTasksCount === 1 ? 'Task' : 'Tasks' }}
-                    </span>
-                    <span v-else class="text-text-tertiary">--</span>
+                    <span class="text-text-secondary"> {{ projectTasksCount }} Tasks </span>
                </div>
                <div class="whitespace-nowrap min-w-0 px-3 py-4 text-sm text-text-primary">
                    <div v-if="project.client_id" class="overflow-ellipsis overflow-hidden">
--- a/resources/js/Components/Common/ProjectMember/ProjectMemberCreateModal.vue
+++ b/resources/js/Components/Common/ProjectMember/ProjectMemberCreateModal.vue
@@ -38,7 +38,7 @@ useFocus(projectNameInput, { initialValue: true });
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span>Add Project Member</span>
--- a/resources/js/Components/Common/ProjectMember/ProjectMemberEditModal.vue
+++ b/resources/js/Components/Common/ProjectMember/ProjectMemberEditModal.vue
@@ -63,7 +63,7 @@ useFocus(projectNameInput, { initialValue: true });
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span>Edit Project Member</span>
--- a/resources/js/Components/Common/Report/ReportCreateModal.vue
+++ b/resources/js/Components/Common/Report/ReportCreateModal.vue
@@ -79,7 +79,7 @@ async function submit() {
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Create Report </span>
--- a/resources/js/Components/Common/Report/ReportEditModal.vue
+++ b/resources/js/Components/Common/Report/ReportEditModal.vue
@@ -96,7 +96,7 @@ async function submit() {
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Create Report </span>
--- a/resources/js/Components/Common/Reporting/ReportingOverview.vue
+++ b/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',
--- a/resources/js/Components/Common/Tag/TagEditModal.vue
+++ b/resources/js/Components/Common/Tag/TagEditModal.vue
@@ -36,7 +36,7 @@ useFocus(tagNameInput, { initialValue: true });
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Update Tag </span>
--- a/resources/js/Components/Common/Task/TaskCreateModal.vue
+++ b/resources/js/Components/Common/Task/TaskCreateModal.vue
@@ -50,7 +50,7 @@ useFocus(taskNameInput, { initialValue: true });
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Create Task </span>
--- a/resources/js/Components/Common/Task/TaskEditModal.vue
+++ b/resources/js/Components/Common/Task/TaskEditModal.vue
@@ -35,7 +35,7 @@ useFocus(taskNameInput, { initialValue: true });
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Update Task </span>
--- a/resources/js/Components/Timesheet/BreakPlacementModal.vue
+++ b/resources/js/Components/Timesheet/BreakPlacementModal.vue
@@ -179,7 +179,7 @@ async function submit() {
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="emit('cancel')">
+    <DialogModal closeable :show="show" @close="emit('cancel')" @submit="submit">
        <template #title>
            <div class="flex items-center space-x-2">
                <Coffee class="w-5 h-5 text-text-secondary" />
--- a/resources/js/Components/Timesheet/TimesheetHeader.vue
+++ b/resources/js/Components/Timesheet/TimesheetHeader.vue
@@ -1,11 +1,9 @@
 <script setup lang="ts">
-import { Button } from '@/packages/ui/src/Buttons';
-import { ChevronLeftIcon, ChevronRightIcon, CalendarIcon } from '@heroicons/vue/20/solid';
+import DateRangeNavigator from '@/packages/ui/src/Input/DateRangeNavigator.vue';

 defineProps<{
-    isCurrentWeek: boolean;
    weekNumber: number;
-    weekRangeDisplay: string;
+    rangeLabel: string;
    weekTotalFormatted: string;
 }>();

@@ -19,33 +17,16 @@ defineEmits<{
 <template>
    <div class="flex flex-wrap items-center justify-between gap-4 mb-4 px-2 sm:px-4 lg:px-6">
        <!-- Left: Week navigation -->
-        <div class="flex items-center gap-2">
-            <Button
-                variant="outline"
-                size="icon"
-                class="h-8 w-8"
-                data-testid="timesheet_prev_week"
-                @click="$emit('previous')">
-                <ChevronLeftIcon class="h-4 w-4" />
-            </Button>
-            <button
-                data-testid="timesheet_week_display"
-                class="flex items-center gap-2 px-3 py-1.5 text-sm font-medium text-text-primary hover:bg-card-background rounded-md transition"
-                @click="$emit('current')">
-                <CalendarIcon class="h-4 w-4 text-icon-default" />
-                <span v-if="isCurrentWeek">This week</span>
-                <span v-else>{{ weekRangeDisplay }}</span>
-                <span class="text-text-tertiary">&middot; W{{ weekNumber }}</span>
-            </button>
-            <Button
-                variant="outline"
-                size="icon"
-                class="h-8 w-8"
-                data-testid="timesheet_next_week"
-                @click="$emit('next')">
-                <ChevronRightIcon class="h-4 w-4" />
-            </Button>
-        </div>
+        <DateRangeNavigator
+            :label="rangeLabel"
+            :secondary-label="`W${weekNumber}`"
+            previous-test-id="timesheet_prev_week"
+            trigger-test-id="timesheet_week_display"
+            next-test-id="timesheet_next_week"
+            trigger-aria-label="Return to current week"
+            @previous="$emit('previous')"
+            @next="$emit('next')"
+            @select="$emit('current')" />

        <!-- Right: Week total -->
        <div class="flex items-center gap-2.5">
--- a/resources/js/Pages/ReportingDetailed.vue
+++ b/resources/js/Pages/ReportingDetailed.vue
@@ -61,7 +61,7 @@ type TimeEntryRoundingType = 'up' | 'down' | 'nearest';

 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',
--- a/resources/js/Pages/Timesheet.vue
+++ b/resources/js/Pages/Timesheet.vue
@@ -30,6 +30,7 @@ import {
    getLocalizedDayJs,
 } from '@/packages/ui/src/utils/time';
 import { getBreakPlacementHint } from '@/packages/ui/src/utils/breakPlacement';
+import { getDateRangeLabel } from '@/packages/ui/src/utils/dateRange';
 import { useTimesheetWeek } from '@/utils/timesheet/useTimesheetWeek';
 import { useTimesheetCellMutations } from '@/utils/timesheet/useTimesheetCellMutations';
 import { useTimesheetRowMutations } from '@/utils/timesheet/useTimesheetRowMutations';
@@ -44,7 +45,6 @@ const {
    weekEnd,
    weekDays,
    weekNumber,
-    isCurrentWeek,
    todayDate,
    goToPreviousWeek,
    goToNextWeek,
@@ -109,13 +109,9 @@ const weekTotalFormatted = computed(() =>
    formatHumanReadableDuration(grandTotal.value, intervalFormat.value, numberFormat.value)
 );

-const weekRangeDisplay = computed(() => {
-    const start = weekStart.value;
-    const end = start.add(6, 'day');
-    return start.month() === end.month()
-        ? `${start.format('MMM D')} - ${end.format('D')}`
-        : `${start.format('MMM D')} - ${end.format('MMM D')}`;
-});
+const weekRangeLabel = computed(() =>
+    getDateRangeLabel(weekStart.value, weekStart.value.add(6, 'day'))
+);

 // ── Cell / row mutation handlers ──────────────────────────────────
 const {
@@ -208,9 +204,8 @@ async function createTag(name: string): Promise<Tag | undefined> {
    <AppLayout title="Timesheet" data-testid="timesheet_view">
        <div class="pt-5 lg:pt-8 pb-4 lg:pb-6">
            <TimesheetHeader
-                :is-current-week="isCurrentWeek"
                :week-number="weekNumber"
-                :week-range-display="weekRangeDisplay"
+                :range-label="weekRangeLabel"
                :week-total-formatted="weekTotalFormatted"
                @previous="goToPreviousWeek"
                @next="goToNextWeek"
--- a/resources/js/packages/ui/src/DialogModal.vue
+++ b/resources/js/packages/ui/src/DialogModal.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import Modal from './Modal.vue';

-const emit = defineEmits(['close']);
+const emit = defineEmits(['close', 'submit']);

 defineProps({
    show: {
@@ -24,7 +24,12 @@ const close = () => {
 </script>

 <template>
-    <Modal :show="show" :max-width="maxWidth" :closeable="closeable" @close="close">
+    <Modal
+        :show="show"
+        :max-width="maxWidth"
+        :closeable="closeable"
+        @close="close"
+        @submit="emit('submit')">
        <div class="px-4 lg:px-6 py-4">
            <div class="text-lg font-medium text-text-primary" role="heading">
                <slot name="title" />
--- a/resources/js/packages/ui/src/FullCalendar/CalendarToolbar.vue
+++ b/resources/js/packages/ui/src/FullCalendar/CalendarToolbar.vue
@@ -1,13 +1,12 @@
 <script setup lang="ts">
-import { Button } from '..';
-import { ChevronLeft, ChevronRight } from '@lucide/vue';
 import { Tabs, TabsList } from '../tabs';
 import TabBarItem from '../TabBar/TabBarItem.vue';
+import DateRangeNavigator from '../Input/DateRangeNavigator.vue';
 import CalendarSettingsPopover from './CalendarSettingsPopover.vue';
 import type { CalendarSettings } from './calendarSettings';

 defineProps<{
-    viewTitle: string;
+    rangeLabel: string;
    activeView: string;
    settings: CalendarSettings;
 }>();
@@ -23,31 +22,13 @@ const emit = defineEmits<{

 <template>
    <div class="flex items-center justify-between bg-default-background px-2 py-1.5">
-        <!-- Left: Navigation -->
-        <div class="flex items-center gap-1">
-            <Button
-                variant="outline"
-                size="sm"
-                class="h-8 w-8 p-0"
-                aria-label="Previous"
-                @click="emit('prev')">
-                <ChevronLeft class="h-4 w-4" />
-            </Button>
-            <Button
-                variant="outline"
-                size="sm"
-                class="h-8 w-8 p-0"
-                aria-label="Next"
-                @click="emit('next')">
-                <ChevronRight class="h-4 w-4" />
-            </Button>
-            <Button variant="outline" size="sm" @click="emit('today')"> today </Button>
-        </div>
-
-        <!-- Center: Title -->
-        <span data-testid="calendar-title" class="text-base font-semibold text-foreground">{{
-            viewTitle
-        }}</span>
+        <DateRangeNavigator
+            :label="rangeLabel"
+            trigger-test-id="calendar-title"
+            trigger-aria-label="today"
+            @previous="emit('prev')"
+            @next="emit('next')"
+            @select="emit('today')" />

        <!-- Right: View switcher + Settings -->
        <div class="flex items-center gap-1">
--- a/resources/js/packages/ui/src/FullCalendar/TimeEntryCalendar.vue
+++ b/resources/js/packages/ui/src/FullCalendar/TimeEntryCalendar.vue
@@ -138,7 +138,7 @@ const {
 const {
    activeView,
    viewDays,
-    viewTitle,
+    rangeLabel,
    emitDatesChange,
    handlePrev,
    handleNext,
@@ -514,7 +514,7 @@ function getEventDurationSeconds(dayEvent: DayEvent, dayStr: string): number {

        <template v-if="!loading">
            <CalendarToolbar
-                :view-title="viewTitle"
+                :range-label="rangeLabel"
                :active-view="activeView"
                :settings="calendarSettings"
                @prev="handlePrev"
--- a/resources/js/packages/ui/src/FullCalendar/useCalendarNavigation.ts
+++ b/resources/js/packages/ui/src/FullCalendar/useCalendarNavigation.ts
@@ -2,6 +2,7 @@ import { computed, ref } from 'vue';
 import type { Dayjs } from 'dayjs';
 import { getLocalizedDayJs } from '../utils/time';
 import { getWeekStartDayNumber } from '../utils/settings';
+import { getDateRangeLabel } from '../utils/dateRange';

 export function useCalendarNavigation(callbacks: {
    onDatesChange: (payload: { start: Dayjs; end: Dayjs }) => void;
@@ -34,24 +35,10 @@ export function useCalendarNavigation(callbacks: {
        return days;
    });

-    const viewTitle = computed(() => {
-        if (activeView.value === 'timeGridDay') {
-            return currentDate.value.format('MMMM YYYY');
-        }
-
+    const rangeLabel = computed(() => {
        const days = viewDays.value;
        if (days.length === 0) return '';
-
-        const first = days[0]!;
-        const last = days[days.length - 1]!;
-
-        if (first.year() !== last.year()) {
-            return `${first.format('MMM YYYY')} \u2013 ${last.format('MMM YYYY')}`;
-        }
-        if (first.month() !== last.month()) {
-            return `${first.format('MMM')} \u2013 ${last.format('MMM YYYY')}`;
-        }
-        return first.format('MMMM YYYY');
+        return getDateRangeLabel(days[0]!, days[days.length - 1]!);
    });

    function emitDatesChange() {
@@ -99,7 +86,7 @@ export function useCalendarNavigation(callbacks: {
        activeView,
        currentDate,
        viewDays,
-        viewTitle,
+        rangeLabel,
        emitDatesChange,
        handlePrev,
        handleNext,
--- a/resources/js/packages/ui/src/Input/DateRangeNavigator.vue
+++ b/resources/js/packages/ui/src/Input/DateRangeNavigator.vue
@@ -0,0 +1,81 @@
+<script setup lang="ts">
+import { ChevronLeft, ChevronRight, CalendarIcon } from '@lucide/vue';
+import { Button } from '../Buttons';
+
+withDefaults(
+    defineProps<{
+        label: string;
+        secondaryLabel?: string;
+        previousDisabled?: boolean;
+        nextDisabled?: boolean;
+        previousTestId?: string;
+        triggerTestId?: string;
+        nextTestId?: string;
+        triggerAriaLabel?: string;
+    }>(),
+    {
+        secondaryLabel: undefined,
+        previousTestId: undefined,
+        triggerTestId: undefined,
+        nextTestId: undefined,
+        triggerAriaLabel: undefined,
+    }
+);
+
+const emit = defineEmits<{
+    previous: [];
+    next: [];
+    select: [];
+}>();
+
+const triggerClass =
+    'h-8 w-[13.5rem] justify-center rounded-none border-l border-r border-border-secondary px-2.5 text-text-primary tabular-nums hover:bg-card-background-active';
+</script>
+
+<template>
+    <div
+        class="tabular-nums inline-flex items-stretch overflow-hidden rounded-md border border-input bg-card-background shadow-xs dark:bg-transparent"
+        role="group"
+        aria-label="Date range navigation">
+        <Button
+            type="button"
+            variant="ghost"
+            size="icon"
+            class="h-8 w-8 shrink-0 rounded-none hover:bg-card-background-active"
+            aria-label="Previous"
+            :disabled="previousDisabled"
+            :data-testid="previousTestId"
+            @click="emit('previous')">
+            <ChevronLeft class="h-4 w-4" />
+        </Button>
+
+        <slot name="trigger" :trigger-class="triggerClass">
+            <Button
+                type="button"
+                variant="ghost"
+                size="sm"
+                :class="triggerClass"
+                :aria-label="triggerAriaLabel"
+                :data-testid="triggerTestId"
+                @click="emit('select')">
+                <CalendarIcon class="h-4 w-4 shrink-0 text-icon-default" />
+                <span class="min-w-0 truncate">{{ label }}</span>
+                <span v-if="secondaryLabel" class="shrink-0 text-text-tertiary">
+                    &middot; {{ secondaryLabel }}
+                </span>
+            </Button>
+        </slot>
+
+        <Button
+            type="button"
+            variant="ghost"
+            size="icon"
+            class="h-8 w-8 shrink-0 rounded-none hover:bg-card-background-active"
+            aria-label="Next"
+            :disabled="nextDisabled"
+            :data-testid="nextTestId"
+            @click="emit('next')">
+            <ChevronRight class="h-4 w-4" />
+        </Button>
+    </div>
+</template>
--- a/resources/js/packages/ui/src/Input/DateRangePicker.vue
+++ b/resources/js/packages/ui/src/Input/DateRangePicker.vue
@@ -6,22 +6,22 @@ import { CalendarDate } from '@internationalized/date';
 import { CalendarIcon } from '@lucide/vue';
 import { computed, ref, inject, type ComputedRef, watch } from 'vue';
 import { twMerge } from 'tailwind-merge';
-import {
-    getDayJsInstance,
-    getLocalizedDayJs,
-    firstDayIndex,
-    type WeekStartDay,
-} from '@/packages/ui/src/utils/time';
+import DateRangeNavigator from './DateRangeNavigator.vue';
+import { getLocalizedDayJs, firstDayIndex, type WeekStartDay } from '@/packages/ui/src/utils/time';
+import { getDateRangeLabel, shiftDateRange, type DateRangeDirection } from '../utils/dateRange';
 import { type Organization } from '@/packages/api/src';
 import { getUserTimezone } from '@/packages/ui/src/utils/settings';
-import { formatDate } from '@/packages/ui/src/utils/time';

 const weekStartsOn = computed((): WeekStartDay => firstDayIndex.value as WeekStartDay);

-const props = defineProps<{
-    start: string;
-    end: string;
-}>();
+const props = withDefaults(
+    defineProps<{
+        start: string;
+        end: string;
+        allowFuture?: boolean;
+    }>(),
+    { allowFuture: false }
+);

 const emit = defineEmits<{
    (e: 'update:start', value: string): void;
@@ -35,10 +35,13 @@ interface CalendarDateRange {
 }

 const today = computed(() => {
-    const now = getDayJsInstance()();
+    const now = getLocalizedDayJs();
    return new CalendarDate(now.year(), now.month() + 1, now.date());
 });

+const startDay = computed(() => (props.start ? getLocalizedDayJs(props.start) : undefined));
+const endDay = computed(() => (props.end ? getLocalizedDayJs(props.end) : undefined));
+
 const modelValue = computed<CalendarDateRange>({
    get: () => ({
        start: props.start
@@ -91,7 +94,7 @@ function setLastWeek() {
 }

 function setLast14Days() {
-    emit('update:start', getLocalizedDayJs().subtract(14, 'days').format());
+    emit('update:start', getLocalizedDayJs().subtract(13, 'days').startOf('day').format());
    emit('update:end', getLocalizedDayJs().format());
    open.value = false;
 }
@@ -109,14 +112,14 @@ function setLastMonth() {
 }

 function setLast30Days() {
-    emit('update:start', getLocalizedDayJs().subtract(30, 'days').format());
+    emit('update:start', getLocalizedDayJs().subtract(29, 'days').startOf('day').format());
    emit('update:end', getLocalizedDayJs().format());
    open.value = false;
 }

 function setLast90Days() {
-    emit('update:start', getDayJsInstance()().subtract(90, 'days').format());
-    emit('update:end', getDayJsInstance()().format());
+    emit('update:start', getLocalizedDayJs().subtract(89, 'days').startOf('day').format());
+    emit('update:end', getLocalizedDayJs().format());
    open.value = false;
 }

@@ -140,6 +143,38 @@ function setLastYear() {

 const organization = inject<ComputedRef<Organization>>('organization');

+const displayLabel = computed(() => {
+    if (!startDay.value) return 'Pick a date';
+    if (!endDay.value) {
+        return getDateRangeLabel(startDay.value, startDay.value, {
+            dateFormat: organization?.value?.date_format,
+        });
+    }
+    return getDateRangeLabel(startDay.value, endDay.value, {
+        dateFormat: organization?.value?.date_format,
+    });
+});
+
+const nextRange = computed(() => {
+    if (!startDay.value || !endDay.value) return undefined;
+    return shiftDateRange(startDay.value, endDay.value, 1);
+});
+
+const nextDisabled = computed(
+    () =>
+        !props.allowFuture &&
+        !!nextRange.value &&
+        nextRange.value.start.isAfter(getLocalizedDayJs().endOf('day'))
+);
+
+function navigate(direction: DateRangeDirection) {
+    if (!startDay.value || !endDay.value) return;
+    const shifted = shiftDateRange(startDay.value, endDay.value, direction);
+    emit('update:start', shifted.start.format());
+    emit('update:end', shifted.end.format());
+    emit('submit');
+}
+
 watch(open, (value) => {
    if (value === false) {
        emit('submit');
@@ -148,77 +183,120 @@ watch(open, (value) => {
 </script>

 <template>
-    <Popover v-model:open="open">
-        <PopoverTrigger as-child>
-            <Button
-                variant="outline"
-                :class="
-                    twMerge(
-                        'flex w-full items-center justify-between whitespace-nowrap h-[34px] text-start',
-                        !modelValue && 'text-muted-foreground'
-                    )
-                ">
-                <CalendarIcon class="-ml-0.5 text-text-quaternary h-4 w-4" />
-                <template v-if="modelValue.start">
-                    <template v-if="modelValue.end">
-                        {{ formatDate(modelValue.start.toString(), organization?.date_format) }}
-                        -
-                        {{ formatDate(modelValue.end.toString(), organization?.date_format) }}
-                    </template>
-                    <template v-else>
-                        {{ formatDate(modelValue.start.toString(), organization?.date_format) }}
-                    </template>
-                </template>
-                <template v-else> Pick a date </template>
-            </Button>
-        </PopoverTrigger>
-        <PopoverContent class="w-auto p-0">
-            <div class="flex divide-x divide-border-secondary">
-                <div
-                    class="text-text-primary text-sm flex flex-col space-y-0.5 items-start py-2 px-2">
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setToday"
-                        >Today</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setThisWeek"
-                        >This Week</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setLastWeek"
-                        >Last Week</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setLast14Days"
-                        >Last 14 days</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setThisMonth"
-                        >This Month</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setLastMonth"
-                        >Last Month</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setLast30Days"
-                        >Last 30 days</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setLast90Days"
-                        >Last 90 days</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setLast12Months"
-                        >Last 12 months</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setThisYear"
-                        >This year</Button
-                    >
-                    <Button variant="ghost" size="sm" class="justify-start" @click="setLastYear"
-                        >Last year</Button
-                    >
-                </div>
-                <div class="pl-2">
-                    <RangeCalendar
-                        v-model="modelValue"
-                        initial-focus
-                        :number-of-months="2"
-                        :max-value="today"
-                        :week-starts-on="weekStartsOn" />
-                </div>
-            </div>
-        </PopoverContent>
-    </Popover>
+    <DateRangeNavigator
+        :label="displayLabel"
+        :next-disabled="nextDisabled"
+        previous-test-id="date_range_picker_previous"
+        trigger-test-id="date_range_picker_display"
+        next-test-id="date_range_picker_next"
+        @previous="navigate(-1)"
+        @next="navigate(1)">
+        <template #trigger="{ triggerClass }">
+            <Popover v-model:open="open">
+                <PopoverTrigger as-child>
+                    <Button
+                        type="button"
+                        variant="ghost"
+                        size="sm"
+                        :class="twMerge(triggerClass, !modelValue.start && 'text-muted-foreground')"
+                        data-testid="date_range_picker_display">
+                        <CalendarIcon class="text-text-quaternary h-4 w-4 shrink-0" />
+                        <span class="min-w-0 truncate">{{ displayLabel }}</span>
+                    </Button>
+                </PopoverTrigger>
+                <PopoverContent class="w-auto p-0">
+                    <div class="flex divide-x divide-border-secondary">
+                        <div
+                            class="text-text-primary text-sm flex flex-col space-y-0.5 items-start py-2 px-2">
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setToday"
+                                >Today</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setThisWeek"
+                                >This Week</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setLastWeek"
+                                >Last Week</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setLast14Days"
+                                >Last 14 Days</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setThisMonth"
+                                >This Month</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setLastMonth"
+                                >Last Month</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setLast30Days"
+                                >Last 30 Days</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setLast90Days"
+                                >Last 90 Days</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setLast12Months"
+                                >Last 12 Months</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setThisYear"
+                                >This Year</Button
+                            >
+                            <Button
+                                variant="ghost"
+                                size="sm"
+                                class="justify-start"
+                                @click="setLastYear"
+                                >Last Year</Button
+                            >
+                        </div>
+                        <div class="pl-2">
+                            <RangeCalendar
+                                v-model="modelValue"
+                                initial-focus
+                                :number-of-months="2"
+                                :max-value="allowFuture ? undefined : today"
+                                :week-starts-on="weekStartsOn" />
+                        </div>
+                    </div>
+                </PopoverContent>
+            </Popover>
+        </template>
+    </DateRangeNavigator>
 </template>
--- a/resources/js/packages/ui/src/Modal.vue
+++ b/resources/js/packages/ui/src/Modal.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { Dialog, DialogContent, DialogFooter } from './dialog/index';
-import { computed } from 'vue';
+import { computed, nextTick } from 'vue';

 const props = defineProps({
    show: {
@@ -17,7 +17,7 @@ const props = defineProps({
    },
 });

-const emit = defineEmits(['close']);
+const emit = defineEmits(['close', 'submit']);

 const close = () => {
    if (props.closeable) {
@@ -25,6 +25,25 @@ const close = () => {
    }
 };

+// Ctrl+Enter (Cmd+Enter on macOS) submits the modal from any focused element inside it.
+// Handled in the capture phase so child elements (buttons, dropdown triggers, inputs with
+// their own Enter handlers) never see the keystroke and cannot open or double-submit.
+async function onKeydownCapture(event: KeyboardEvent) {
+    if (event.key !== 'Enter' || !(event.ctrlKey || event.metaKey) || event.isComposing) {
+        return;
+    }
+    event.preventDefault();
+    event.stopPropagation();
+    // Inputs like the time and duration fields commit their value on blur, so blur first
+    // and let the resulting model updates settle before submitting.
+    const active = document.activeElement;
+    if (active instanceof HTMLElement) {
+        active.blur();
+    }
+    await nextTick();
+    emit('submit');
+}
+
 const maxWidthClass = computed(() => {
    return {
        sm: 'sm:max-w-sm',
@@ -39,7 +58,7 @@ const maxWidthClass = computed(() => {
 <template>
    <Dialog :open="show" @update:open="close">
        <DialogContent :class="maxWidthClass">
-            <div class="min-w-0">
+            <div class="min-w-0" @keydown.capture="onKeydownCapture">
                <slot />
            </div>

--- a/resources/js/packages/ui/src/Project/ProjectCreateModal.vue
+++ b/resources/js/packages/ui/src/Project/ProjectCreateModal.vue
@@ -72,7 +72,7 @@ const currentClientName = computed(() => {
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Create Project </span>
--- a/resources/js/packages/ui/src/Tag/TagCreateModal.vue
+++ b/resources/js/packages/ui/src/Tag/TagCreateModal.vue
@@ -30,7 +30,7 @@ useFocus(tagNameInput, { initialValue: true });
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Create Tags </span>
--- a/resources/js/packages/ui/src/TimeEntry/BreakCreateModal.vue
+++ b/resources/js/packages/ui/src/TimeEntry/BreakCreateModal.vue
@@ -78,7 +78,7 @@ async function submit() {
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex items-center space-x-2 text-amber-600 dark:text-amber-400">
                <Coffee class="w-5 h-5" />
--- a/resources/js/packages/ui/src/TimeEntry/TimeEntryCreateModal.vue
+++ b/resources/js/packages/ui/src/TimeEntry/TimeEntryCreateModal.vue
@@ -126,7 +126,7 @@ const billableProxy = computed({
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Create manual time entry </span>
--- a/resources/js/packages/ui/src/TimeEntry/TimeEntryEditModal.vue
+++ b/resources/js/packages/ui/src/TimeEntry/TimeEntryEditModal.vue
@@ -164,7 +164,7 @@ const typeProxy = computed({
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Edit time entry </span>
--- a/resources/js/packages/ui/src/TimeEntry/TimeEntryMassUpdateModal.vue
+++ b/resources/js/packages/ui/src/TimeEntry/TimeEntryMassUpdateModal.vue
@@ -16,6 +16,7 @@ import {
 } from '@/packages/api/src';
 import { Checkbox } from '@/packages/ui/src';
 import { TagIcon, ExclamationTriangleIcon } from '@heroicons/vue/20/solid';
+import { XMarkIcon } from '@heroicons/vue/16/solid';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '..';
 import { Button } from '@/packages/ui/src/Buttons';
 import TagDropdown from '@/packages/ui/src/Tag/TagDropdown.vue';
@@ -60,6 +61,13 @@ const projectId = ref<string | null>(null);
 const billable = ref<boolean | undefined>(undefined);
 const selectedTags = ref<string[]>([]);

+// Clearing the project puts both fields back to "leave unchanged", the same state the form
+// returns to after a successful submit.
+function resetProject() {
+    projectId.value = null;
+    taskId.value = undefined;
+}
+
 const timeEntryBillable = computed({
    get: () => {
        if (billable.value === undefined) {
@@ -147,7 +155,7 @@ const showBreakWarning = computed(
 </script>

 <template>
-    <DialogModal closeable :show="show" @close="show = false">
+    <DialogModal closeable :show="show" @close="show = false" @submit="submit">
        <template #title>
            <div class="flex space-x-2">
                <span> Update {{ timeEntries.length }} time entries </span>
@@ -182,42 +190,59 @@ const showBreakWarning = computed(
                </Field>
                <Field>
                    <FieldLabel for="project">Project</FieldLabel>
-                    <TimeTrackerProjectTaskDropdown
-                        v-model:project="projectId"
-                        v-model:task="taskId"
-                        variant="input"
-                        align="start"
-                        size="default"
-                        :clients
-                        :create-project
-                        :create-client
-                        :currency="currency"
-                        :organization-billable-rate="organizationBillableRate"
-                        :can-create-project
-                        empty-placeholder="Select project..."
-                        allow-reset
-                        :enable-estimated-time
-                        :projects="projects"
-                        :tasks="tasks"></TimeTrackerProjectTaskDropdown>
+                    <div class="flex items-center gap-1 min-w-0">
+                        <!-- the dropdown declares its own `class` prop, which goes to the
+                             trigger button, so the growing has to happen on a wrapper -->
+                        <div class="flex-1 min-w-0">
+                            <TimeTrackerProjectTaskDropdown
+                                v-model:project="projectId"
+                                v-model:task="taskId"
+                                variant="input"
+                                align="start"
+                                size="default"
+                                :clients
+                                :create-project
+                                :create-client
+                                :currency="currency"
+                                :organization-billable-rate="organizationBillableRate"
+                                :can-create-project
+                                empty-placeholder="Select project..."
+                                :enable-estimated-time
+                                :projects="projects"
+                                :tasks="tasks"></TimeTrackerProjectTaskDropdown>
+                        </div>
+                        <button
+                            v-if="projectId !== null"
+                            type="button"
+                            data-testid="project_reset_button"
+                            class="p-1 rounded hover:bg-quaternary text-text-tertiary hover:text-text-primary"
+                            @click="resetProject">
+                            <XMarkIcon class="w-4 h-4" />
+                        </button>
+                    </div>
                </Field>
                <Field>
                    <FieldLabel>Tag</FieldLabel>
-                    <div class="flex space-x-5">
-                        <TagDropdown
-                            v-model="selectedTags"
-                            :create-tag
-                            :tags="tags"
-                            :show-no-tag-option="false">
-                            <template #trigger>
-                                <Button variant="input" :disabled="removeAllTags">
-                                    <TagIcon class="h-4 text-icon-default" />
-                                    <span v-if="selectedTags.length > 0">
-                                        Set {{ selectedTags.length }} tags
-                                    </span>
-                                    <span v-else>Select Tags...</span>
-                                </Button>
-                            </template>
-                        </TagDropdown>
+                    <div class="flex items-center space-x-5">
+                        <!-- the dropdown root is `min-w-0`, so as a flex item it would shrink
+                             below its trigger and let the button overflow into the checkbox -->
+                        <div class="shrink-0">
+                            <TagDropdown
+                                v-model="selectedTags"
+                                :create-tag
+                                :tags="tags"
+                                :show-no-tag-option="false">
+                                <template #trigger>
+                                    <Button variant="input" :disabled="removeAllTags">
+                                        <TagIcon class="h-4 text-icon-default" />
+                                        <span v-if="selectedTags.length > 0">
+                                            Set {{ selectedTags.length }} tags
+                                        </span>
+                                        <span v-else>Select Tags...</span>
+                                    </Button>
+                                </template>
+                            </TagDropdown>
+                        </div>
                        <Field orientation="horizontal">
                            <Checkbox id="no_tags" v-model:checked="removeAllTags"></Checkbox>
                            <FieldLabel for="no_tags">Remove all tags</FieldLabel>
--- a/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue
+++ b/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue
@@ -12,7 +12,7 @@ import type {
    Client,
 } from '@/packages/api/src';

-import { PlusCircleIcon, MinusIcon, XMarkIcon } from '@heroicons/vue/16/solid';
+import { PlusCircleIcon, MinusIcon } from '@heroicons/vue/16/solid';
 import ProjectCreateModal from '@/packages/ui/src/Project/ProjectCreateModal.vue';
 import { twMerge } from 'tailwind-merge';
 import { Button } from '@/packages/ui/src/Buttons';
@@ -58,7 +58,6 @@ const props = withDefaults(
        createClient: (client: CreateClientBody) => Promise<Client | undefined>;
        currency: string;
        emptyPlaceholder?: string;
-        allowReset?: boolean;
        noProjectValue?: string | null;
        enableEstimatedTime: boolean;
        organizationBillableRate: number | null;
@@ -70,7 +69,6 @@ const props = withDefaults(
    }>(),
    {
        emptyPlaceholder: 'No Project',
-        allowReset: false,
        noProjectValue: NO_PROJECT_ID,
        variant: 'ghost',
        align: 'center',
@@ -558,12 +556,6 @@ function selectProject(projectId: string) {
    emit('changed', project.value, task.value);
 }

-function resetProject() {
-    project.value = null;
-    task.value = null;
-    emit('changed', project.value, task.value);
-}
-
 const showCreateProject = ref(false);
 </script>

@@ -571,40 +563,28 @@ const showCreateProject = ref(false);
    <Dropdown v-model="open" :close-on-content-click="false" :align="props.align">
        <template #trigger>
            <slot name="trigger">
-                <div class="flex items-center gap-1">
-                    <Button
-                        :variant="props.variant"
-                        :size="props.size"
-                        :class="twMerge('w-full justify-start overflow-hidden', props.class)">
-                        <div
-                            class="w-2.5 h-2.5 rounded-full shrink-0"
-                            :style="{ backgroundColor: selectedProjectColor }"></div>
-                        <span class="truncate shrink-[1] text-text-primary">{{
-                            selectedProjectName
-                        }}</span>
-                        <template v-if="currentTask">
-                            <ChevronRightIcon class="!size-3 text-text-primary shrink-0 -mx-1" />
-                            <span class="truncate shrink-[100]">{{ currentTask.name }}</span>
-                        </template>
-                        <template v-if="selectedClientName">
-                            <span class="dark:text-text-tertiary text-text-quaternary shrink-0"
-                                >•</span
-                            >
-                            <span
-                                class="truncate shrink-[200] dark:text-text-tertiary text-text-quaternary"
-                                >{{ selectedClientName }}</span
-                            >
-                        </template>
-                    </Button>
-                    <button
-                        v-if="allowReset && project !== null"
-                        type="button"
-                        data-testid="project_reset_button"
-                        class="p-1 rounded hover:bg-quaternary text-text-tertiary hover:text-text-primary"
-                        @click.stop="resetProject">
-                        <XMarkIcon class="w-4 h-4" />
-                    </button>
-                </div>
+                <Button
+                    :variant="props.variant"
+                    :size="props.size"
+                    :class="twMerge('w-full justify-start overflow-hidden', props.class)">
+                    <div
+                        class="w-2.5 h-2.5 rounded-full shrink-0"
+                        :style="{ backgroundColor: selectedProjectColor }"></div>
+                    <span class="truncate shrink-[1] text-text-primary">{{
+                        selectedProjectName
+                    }}</span>
+                    <template v-if="currentTask">
+                        <ChevronRightIcon class="!size-3 text-text-primary shrink-0 -mx-1" />
+                        <span class="truncate shrink-[100]">{{ currentTask.name }}</span>
+                    </template>
+                    <template v-if="selectedClientName">
+                        <span class="dark:text-text-tertiary text-text-quaternary shrink-0">•</span>
+                        <span
+                            class="truncate shrink-[200] dark:text-text-tertiary text-text-quaternary"
+                            >{{ selectedClientName }}</span
+                        >
+                    </template>
+                </Button>
            </slot>
        </template>
        <template #content>
--- a/resources/js/packages/ui/src/index.ts
+++ b/resources/js/packages/ui/src/index.ts
@@ -132,6 +132,7 @@ import FullCalendarDayHeader from './FullCalendar/FullCalendarDayHeader.vue';
 import FullCalendarEventContent from './FullCalendar/FullCalendarEventContent.vue';
 import TimeEntryCalendar from './FullCalendar/TimeEntryCalendar.vue';
 import DateRangePicker from './Input/DateRangePicker.vue';
+import DateRangeNavigator from './Input/DateRangeNavigator.vue';
 import { Label } from './label/index';
 import {
    NumberField,
@@ -211,6 +212,7 @@ export {
    ContextMenuSubTrigger,
    ContextMenuTrigger,
    DateRangePicker,
+    DateRangeNavigator,
    Dialog,
    DialogClose,
    DialogContent,
--- a/resources/js/packages/ui/src/utils/dateRange.test.ts
+++ b/resources/js/packages/ui/src/utils/dateRange.test.ts
@@ -0,0 +1,124 @@
+import dayjs from 'dayjs';
+import { afterEach, describe, expect, test, vi } from 'vitest';
+import { getDayJsInstance, getLocalizedDayJs } from './time';
+import { getDateRangeLabel, shiftDateRange } from './dateRange';
+
+const reference = dayjs('2026-09-21');
+
+afterEach(() => {
+    vi.mocked(window.getTimezoneSetting).mockReturnValue('UTC');
+});
+
+describe('getDateRangeLabel', () => {
+    test('labels relative weeks', () => {
+        getDayJsInstance();
+        expect(
+            getDateRangeLabel(reference.startOf('week'), reference.endOf('week'), {
+                referenceDate: reference,
+            })
+        ).toBe('This Week');
+        expect(
+            getDateRangeLabel(
+                reference.subtract(1, 'week').startOf('week'),
+                reference.subtract(1, 'week').endOf('week'),
+                { referenceDate: reference }
+            )
+        ).toBe('Last Week');
+    });
+
+    test('labels common rolling ranges', () => {
+        expect(
+            getDateRangeLabel(reference.subtract(13, 'day'), reference.endOf('day'), {
+                referenceDate: reference,
+            })
+        ).toBe('Last 14 Days');
+    });
+
+    test('labels full calendar months and years', () => {
+        expect(
+            getDateRangeLabel(dayjs('2025-09-01'), dayjs('2025-09-30'), {
+                referenceDate: reference,
+            })
+        ).toBe('September 2025');
+        expect(
+            getDateRangeLabel(dayjs('2024-01-01'), dayjs('2024-12-31'), {
+                referenceDate: reference,
+            })
+        ).toBe('2024');
+    });
+
+    test('keeps relative labels for the current periods', () => {
+        expect(
+            getDateRangeLabel(reference.startOf('month'), reference.endOf('month'), {
+                referenceDate: reference,
+            })
+        ).toBe('This Month');
+        expect(
+            getDateRangeLabel(reference.startOf('year'), reference.endOf('year'), {
+                referenceDate: reference,
+            })
+        ).toBe('This Year');
+    });
+
+    test('uses the organization date format for custom ranges', () => {
+        expect(
+            getDateRangeLabel(dayjs('2026-08-03'), dayjs('2026-08-12'), {
+                dateFormat: 'slash-separated-dd-mm-yyyy',
+                referenceDate: reference,
+            })
+        ).toBe('03/08/2026 – 12/08/2026');
+    });
+
+    test('renders a single historical day without duplicating it', () => {
+        expect(
+            getDateRangeLabel(dayjs('2026-08-03'), dayjs('2026-08-03'), {
+                referenceDate: reference,
+            })
+        ).toBe('Aug 3, 2026');
+    });
+});
+
+describe('shiftDateRange', () => {
+    test('moves full weeks as calendar periods', () => {
+        getDayJsInstance();
+        const shifted = shiftDateRange(reference.startOf('week'), reference.endOf('week'), -1);
+        expect(shifted.start.format('YYYY-MM-DD')).toBe('2026-09-14');
+        expect(shifted.end.format('YYYY-MM-DD')).toBe('2026-09-20');
+    });
+
+    test('moves full months without truncating longer months', () => {
+        const shifted = shiftDateRange(dayjs('2026-02-01'), dayjs('2026-02-28'), 1);
+        expect(shifted.start.format('YYYY-MM-DD')).toBe('2026-03-01');
+        expect(shifted.end.format('YYYY-MM-DD')).toBe('2026-03-31');
+    });
+
+    test('moves custom ranges by their inclusive duration', () => {
+        const shifted = shiftDateRange(dayjs('2026-09-01'), dayjs('2026-09-14'), -1);
+        expect(shifted.start.format('YYYY-MM-DD')).toBe('2026-08-18');
+        expect(shifted.end.format('YYYY-MM-DD')).toBe('2026-08-31');
+    });
+
+    test('normalizes custom range offsets across the spring DST transition', () => {
+        vi.mocked(window.getTimezoneSetting).mockReturnValue('Europe/Vienna');
+        const shifted = shiftDateRange(
+            getLocalizedDayJs('2026-03-14T23:00:00Z'),
+            getLocalizedDayJs('2026-03-27T23:00:00Z'),
+            1
+        );
+
+        expect(shifted.start.format()).toBe('2026-03-29T00:00:00+01:00');
+        expect(shifted.end.format()).toBe('2026-04-11T23:59:59+02:00');
+    });
+
+    test('normalizes custom range offsets across the autumn DST transition', () => {
+        vi.mocked(window.getTimezoneSetting).mockReturnValue('Europe/Vienna');
+        const shifted = shiftDateRange(
+            getLocalizedDayJs('2026-10-17T22:00:00Z'),
+            getLocalizedDayJs('2026-10-30T23:00:00Z'),
+            1
+        );
+
+        expect(shifted.start.format()).toBe('2026-11-01T00:00:00+01:00');
+        expect(shifted.end.format()).toBe('2026-11-14T23:59:59+01:00');
+    });
+});
--- a/resources/js/packages/ui/src/utils/dateRange.ts
+++ b/resources/js/packages/ui/src/utils/dateRange.ts
@@ -0,0 +1,135 @@
+import type { Dayjs } from 'dayjs';
+import { formatDate, getDayJsInstance, getLocalizedDayJs, type DateFormat } from './time';
+
+export type DateRangeDirection = -1 | 1;
+
+function isSameDay(left: Dayjs, right: Dayjs): boolean {
+    return left.isSame(right, 'day');
+}
+
+function isRange(start: Dayjs, end: Dayjs, expectedStart: Dayjs, expectedEnd: Dayjs): boolean {
+    return isSameDay(start, expectedStart) && isSameDay(end, expectedEnd);
+}
+
+function formatCompactRange(start: Dayjs, end: Dayjs): string {
+    if (start.year() !== end.year()) {
+        return `${start.format('MMM D, YYYY')} – ${end.format('MMM D, YYYY')}`;
+    }
+    if (start.month() !== end.month()) {
+        return `${start.format('MMM D')} – ${end.format('MMM D, YYYY')}`;
+    }
+    return `${start.format('MMM D')} – ${end.format('D, YYYY')}`;
+}
+
+/**
+ * Returns a human-friendly label for an inclusive date range. Relative labels
+ * are intentionally shared by reporting, the timesheet, and the calendar.
+ */
+export function getDateRangeLabel(
+    start: Dayjs,
+    end: Dayjs,
+    options: { dateFormat?: DateFormat; referenceDate?: Dayjs } = {}
+): string {
+    // Ensure the configured first day of the week is applied before using startOf('week').
+    getDayJsInstance();
+
+    const reference = (options.referenceDate ?? getLocalizedDayJs()).startOf('day');
+    const rangeStart = start.startOf('day');
+    const rangeEnd = end.startOf('day');
+
+    const relativeDays: Array<[number, string]> = [
+        [0, 'Today'],
+        [-1, 'Yesterday'],
+        [1, 'Tomorrow'],
+    ];
+    for (const [offset, label] of relativeDays) {
+        const day = reference.add(offset, 'day');
+        if (isRange(rangeStart, rangeEnd, day, day)) return label;
+    }
+
+    const relativePeriods: Array<['week' | 'month' | 'year', number, string]> = [
+        ['week', 0, 'This Week'],
+        ['week', -1, 'Last Week'],
+        ['week', 1, 'Next Week'],
+        ['month', 0, 'This Month'],
+        ['month', -1, 'Last Month'],
+        ['month', 1, 'Next Month'],
+        ['year', 0, 'This Year'],
+        ['year', -1, 'Last Year'],
+        ['year', 1, 'Next Year'],
+    ];
+    for (const [unit, offset, label] of relativePeriods) {
+        const period = reference.add(offset, unit);
+        if (isRange(rangeStart, rangeEnd, period.startOf(unit), period.endOf(unit))) return label;
+    }
+
+    // Named calendar periods outside the relative windows above, e.g. "May 2025"
+    // for a full month and "2025" for a full year.
+    const monthStart = rangeStart.startOf('month');
+    if (isRange(rangeStart, rangeEnd, monthStart, monthStart.endOf('month'))) {
+        return rangeStart.format('MMMM YYYY');
+    }
+    const yearStart = rangeStart.startOf('year');
+    if (isRange(rangeStart, rangeEnd, yearStart, yearStart.endOf('year'))) {
+        return rangeStart.format('YYYY');
+    }
+
+    const rollingRanges: Array<[number, string]> = [
+        [14, 'Last 14 Days'],
+        [30, 'Last 30 Days'],
+        [90, 'Last 90 Days'],
+    ];
+    for (const [days, label] of rollingRanges) {
+        if (isRange(rangeStart, rangeEnd, reference.subtract(days - 1, 'day'), reference)) {
+            return label;
+        }
+    }
+    if (isRange(rangeStart, rangeEnd, reference.subtract(12, 'month'), reference)) {
+        return 'Last 12 Months';
+    }
+
+    if (isSameDay(rangeStart, rangeEnd)) {
+        return options.dateFormat
+            ? formatDate(rangeStart.format('YYYY-MM-DD'), options.dateFormat)
+            : rangeStart.format('MMM D, YYYY');
+    }
+
+    if (options.dateFormat) {
+        return `${formatDate(rangeStart.format('YYYY-MM-DD'), options.dateFormat)} – ${formatDate(
+            rangeEnd.format('YYYY-MM-DD'),
+            options.dateFormat
+        )}`;
+    }
+    return formatCompactRange(rangeStart, rangeEnd);
+}
+
+/** Shift an inclusive range by one period, preserving full calendar periods. */
+export function shiftDateRange(
+    start: Dayjs,
+    end: Dayjs,
+    direction: DateRangeDirection
+): { start: Dayjs; end: Dayjs } {
+    getDayJsInstance();
+
+    const rangeStart = start.startOf('day');
+    const rangeEnd = end.endOf('day');
+
+    if (isRange(rangeStart, rangeEnd, rangeStart.startOf('year'), rangeStart.endOf('year'))) {
+        const shiftedStart = rangeStart.add(direction, 'year').startOf('year');
+        return { start: shiftedStart, end: shiftedStart.endOf('year') };
+    }
+    if (isRange(rangeStart, rangeEnd, rangeStart.startOf('month'), rangeStart.endOf('month'))) {
+        const shiftedStart = rangeStart.add(direction, 'month').startOf('month');
+        return { start: shiftedStart, end: shiftedStart.endOf('month') };
+    }
+    if (isRange(rangeStart, rangeEnd, rangeStart.startOf('week'), rangeStart.endOf('week'))) {
+        const shiftedStart = rangeStart.add(direction, 'week').startOf('week');
+        return { start: shiftedStart, end: shiftedStart.endOf('week') };
+    }
+
+    const days = rangeEnd.startOf('day').diff(rangeStart, 'day') + 1;
+    return {
+        start: rangeStart.add(days * direction, 'day').startOf('day'),
+        end: rangeEnd.add(days * direction, 'day').endOf('day'),
+    };
+}
--- a/resources/testfiles/clockify_projects_import_test_5.csv
+++ b/resources/testfiles/clockify_projects_import_test_5.csv
@@ -0,0 +1,4 @@
+"Project","Client","Status","Visibility","Tasks","Tracked (h)","Estimated (h)","Remaining (h)","Overage (h)","Progress(%)","Project members","Project manager","Note"
+"Project for Big Company","Big Company","Active","Public","Task 1, Task 2, Task 3","1.38","","","","","Constantin Graf","",""
+"Project without Client","","Active","Public","","0.00","","","","","Constantin Graf","",""
+"TEST","Big Company","Active","Public","","0.00","","","","","Constantin Graf","",""
--- a/tests/Unit/Service/Import/Importers/ClockifyProjectsImporterTest.php
+++ b/tests/Unit/Service/Import/Importers/ClockifyProjectsImporterTest.php
@@ -119,6 +119,24 @@ class ClockifyProjectsImporterTest extends ImporterTestAbstract
        );
    }

+    public function test_import_of_test_file_without_billability_column_defaults_to_not_billable(): void
+    {
+        // Arrange
+        $organization = Organization::factory()->create();
+        $timezone = 'Europe/Vienna';
+        $importer = new ClockifyProjectsImporter;
+        $importer->init($organization);
+        // Some Clockify exports don't contain a "Billability" column.
+        $data = Storage::disk('testfiles')->get('clockify_projects_import_test_5.csv');
+
+        // Act
+        $importer->importData($data, $timezone);
+
+        // Assert
+        $project = Project::query()->where('organization_id', $organization->id)->where('name', 'Project for Big Company')->firstOrFail();
+        $this->assertFalse($project->is_billable);
+    }
+
    public function test_import_supports_activities_column_alias_for_tasks(): void
    {
        // Arrange
--- a/tests/Unit/Service/Import/Importers/GenericTimeEntriesImporterTest.php
+++ b/tests/Unit/Service/Import/Importers/GenericTimeEntriesImporterTest.php
@@ -66,4 +66,27 @@ class GenericTimeEntriesImporterTest extends ImporterTestAbstract
        $this->assertSame(0, $report->projectsCreated);
        $this->assertSame(0, $report->clientsCreated);
    }
+
+    public function test_import_fails_if_task_name_is_too_long(): void
+    {
+        // Arrange
+        $organization = Organization::factory()->create();
+        $timezone = 'Europe/Vienna';
+        $importer = new GenericTimeEntriesImporter;
+        $importer->init($organization);
+        $taskName = str_repeat('a', 501);
+        $data = "description,billable,client,project,tags,start,end,task,user_name,user_email\n".
+            '"Working hard","true","Big Company","Project for Big Company","","2024-03-04T09:23:00Z","2024-03-04T10:23:01Z","'.$taskName.'","Peter Tester","peter.test@email.test"';
+
+        // Act
+        try {
+            $importer->importData($data, $timezone);
+        } catch (ImportException $e) {
+            // Assert
+            $this->assertSame('Task name ("'.$taskName.'") is too long, maximum length is 500 characters', $e->getMessage());
+
+            return;
+        }
+        $this->fail();
+    }
 }
Author	SHA1	Message	Date
Constantin Graf	b33cf00788	Remove Group from ClockifyTimeEntriesImporter	2026-09-22 18:08:49 +02:00
Gregor Vostrak	c23f09fb2d	add date range navigation, unify picker components	2026-09-22 15:53:50 +02:00
Gregor Vostrak	a0262addb7	fix e2e submit focus test behaviour	2026-09-22 13:43:42 +02:00
Gregor Vostrak	b4911ebddd	move project reset button into mass update modal and fix TimeTrackerProjectTaskDropdown trigger focus	2026-09-22 13:43:42 +02:00
Gregor Vostrak	3ade20887b	fix cmd+enter submit shortcut on modals #1238	2026-09-22 13:43:42 +02:00
dependabot[bot]	4943a38ffe	Bump docker/login-action from 4.5.2 to 4.6.0 Bumps [docker/login-action](https://github.com/docker/login-action) from 4.5.2 to 4.6.0. - [Release notes](https://github.com/docker/login-action/releases) - [Commits](https://github.com/docker/login-action/compare/v4.5.2...v4.6.0) --- updated-dependencies: - dependency-name: docker/login-action dependency-version: 4.6.0 dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com>	2026-09-22 12:02:12 +02:00
dependabot[bot]	12e355ff26	Bump codecov/codecov-action from 7.0.0 to 7.1.1 Bumps [codecov/codecov-action](https://github.com/codecov/codecov-action) from 7.0.0 to 7.1.1. - [Release notes](https://github.com/codecov/codecov-action/releases) - [Changelog](https://github.com/codecov/codecov-action/blob/main/CHANGELOG.md) - [Commits](https://github.com/codecov/codecov-action/compare/v7.0.0...v7.1.1) --- updated-dependencies: - dependency-name: codecov/codecov-action dependency-version: 7.1.1 dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com>	2026-09-22 12:01:59 +02:00
Constantin Graf	01b60c0f6a	Add validation for task name length	2026-09-22 12:01:48 +02:00
Constantin Graf	927da7dce9	Fixed type check	2026-09-22 12:01:48 +02:00
Constantin Graf	c89fa87b0f	Fix clockfiy importer, allow project imports without Billability	2026-09-22 12:01:48 +02:00
Constantin Graf	02cf600f43	Add placeholder paddle api key	2026-09-21 22:07:14 +02:00
Constantin Graf	98a460725f	Add GitHub action for phpunit tests with extensions	2026-09-21 22:07:14 +02:00
Constantin Graf	95645ddd91	Fixed composer auth username	2026-09-21 18:28:02 +02:00
Constantin Graf	1de985b577	Update docker image	2026-09-21 16:08:13 +02:00