mirror of
https://github.com/solidtime-io/solidtime.git
synced 2026-10-08 05:43:18 +01:00
Compare commits
3 Commits
v0.20.1
...
feature/er
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
9f8f19e170 | ||
|
|
d40e6a0d52 | ||
|
|
1cee7581f8 |
@@ -5,8 +5,7 @@ APP_KEY=base64:UNQNf1SXeASNkWux01Rj8EnHYx8FO0kAxWNDwktclkk=
|
|||||||
APP_DEBUG=true
|
APP_DEBUG=true
|
||||||
APP_URL=https://solidtime.test
|
APP_URL=https://solidtime.test
|
||||||
APP_FORCE_HTTPS=false
|
APP_FORCE_HTTPS=false
|
||||||
# Supported values: on, off, invite-only (true/false are supported for backwards compatibility)
|
APP_ENABLE_REGISTRATION=true
|
||||||
APP_ENABLE_REGISTRATION=on
|
|
||||||
SUPER_ADMINS=admin@example.com
|
SUPER_ADMINS=admin@example.com
|
||||||
PAGINATION_PER_PAGE_DEFAULT=500
|
PAGINATION_PER_PAGE_DEFAULT=500
|
||||||
|
|
||||||
|
|||||||
1
.github/VOUCHED.td
vendored
1
.github/VOUCHED.td
vendored
@@ -14,7 +14,6 @@
|
|||||||
# Seeded 2026-07-25 from the authors of every merged pull request.
|
# Seeded 2026-07-25 from the authors of every merged pull request.
|
||||||
|
|
||||||
agross
|
agross
|
||||||
akolenda
|
|
||||||
bufferhead-code
|
bufferhead-code
|
||||||
candideu
|
candideu
|
||||||
kasparrosin
|
kasparrosin
|
||||||
|
|||||||
4
.github/workflows/build-onpremise.yml
vendored
4
.github/workflows/build-onpremise.yml
vendored
@@ -141,7 +141,7 @@ jobs:
|
|||||||
${{ env.DOCKER_REPO }}
|
${{ env.DOCKER_REPO }}
|
||||||
|
|
||||||
- name: "Login to solidtime OnPremise Registry"
|
- name: "Login to solidtime OnPremise Registry"
|
||||||
uses: docker/login-action@v4.5.2
|
uses: docker/login-action@v4
|
||||||
with:
|
with:
|
||||||
registry: registry.on-premise.solidtime.io
|
registry: registry.on-premise.solidtime.io
|
||||||
username: ${{ secrets.ONPREMISE_USERNAME }}
|
username: ${{ secrets.ONPREMISE_USERNAME }}
|
||||||
@@ -195,7 +195,7 @@ jobs:
|
|||||||
merge-multiple: true
|
merge-multiple: true
|
||||||
|
|
||||||
- name: "Login to solidtime OnPremise Registry"
|
- name: "Login to solidtime OnPremise Registry"
|
||||||
uses: docker/login-action@v4.5.2
|
uses: docker/login-action@v4
|
||||||
with:
|
with:
|
||||||
registry: registry.on-premise.solidtime.io
|
registry: registry.on-premise.solidtime.io
|
||||||
username: ${{ secrets.ONPREMISE_USERNAME }}
|
username: ${{ secrets.ONPREMISE_USERNAME }}
|
||||||
|
|||||||
2
.github/workflows/build-private.yml
vendored
2
.github/workflows/build-private.yml
vendored
@@ -177,7 +177,7 @@ jobs:
|
|||||||
SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
|
SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
|
||||||
|
|
||||||
- name: "Login to GitHub Container Registry"
|
- name: "Login to GitHub Container Registry"
|
||||||
uses: docker/login-action@v4.5.2
|
uses: docker/login-action@v4
|
||||||
with:
|
with:
|
||||||
registry: rg.fr-par.scw.cloud/solidtime
|
registry: rg.fr-par.scw.cloud/solidtime
|
||||||
username: nologin
|
username: nologin
|
||||||
|
|||||||
8
.github/workflows/build-public.yml
vendored
8
.github/workflows/build-public.yml
vendored
@@ -117,13 +117,13 @@ jobs:
|
|||||||
${{ env.GHCR_REPO }}
|
${{ env.GHCR_REPO }}
|
||||||
|
|
||||||
- name: "Login to Docker Hub Container Registry"
|
- name: "Login to Docker Hub Container Registry"
|
||||||
uses: docker/login-action@v4.5.2
|
uses: docker/login-action@v4
|
||||||
with:
|
with:
|
||||||
username: ${{ secrets.DOCKERHUB_USERNAME }}
|
username: ${{ secrets.DOCKERHUB_USERNAME }}
|
||||||
password: ${{ secrets.DOCKERHUB_TOKEN }}
|
password: ${{ secrets.DOCKERHUB_TOKEN }}
|
||||||
|
|
||||||
- name: "Login to GitHub Container Registry"
|
- name: "Login to GitHub Container Registry"
|
||||||
uses: docker/login-action@v4.5.2
|
uses: docker/login-action@v4
|
||||||
with:
|
with:
|
||||||
registry: ghcr.io
|
registry: ghcr.io
|
||||||
username: ${{ github.actor }}
|
username: ${{ github.actor }}
|
||||||
@@ -177,13 +177,13 @@ jobs:
|
|||||||
merge-multiple: true
|
merge-multiple: true
|
||||||
|
|
||||||
- name: "Login to Docker Hub"
|
- name: "Login to Docker Hub"
|
||||||
uses: docker/login-action@v4.5.2
|
uses: docker/login-action@v4
|
||||||
with:
|
with:
|
||||||
username: ${{ secrets.DOCKERHUB_USERNAME }}
|
username: ${{ secrets.DOCKERHUB_USERNAME }}
|
||||||
password: ${{ secrets.DOCKERHUB_TOKEN }}
|
password: ${{ secrets.DOCKERHUB_TOKEN }}
|
||||||
|
|
||||||
- name: "Login to GHCR"
|
- name: "Login to GHCR"
|
||||||
uses: docker/login-action@v4.5.2
|
uses: docker/login-action@v4
|
||||||
with:
|
with:
|
||||||
registry: ghcr.io
|
registry: ghcr.io
|
||||||
username: ${{ github.actor }}
|
username: ${{ github.actor }}
|
||||||
|
|||||||
@@ -4,11 +4,9 @@ declare(strict_types=1);
|
|||||||
|
|
||||||
namespace App\Actions\Fortify;
|
namespace App\Actions\Fortify;
|
||||||
|
|
||||||
use App\Enums\RegistrationMode;
|
|
||||||
use App\Enums\Weekday;
|
use App\Enums\Weekday;
|
||||||
use App\Events\NewsletterRegistered;
|
use App\Events\NewsletterRegistered;
|
||||||
use App\Models\User;
|
use App\Models\User;
|
||||||
use App\Service\InvitationService;
|
|
||||||
use App\Service\IpLookup\IpLookupServiceContract;
|
use App\Service\IpLookup\IpLookupServiceContract;
|
||||||
use App\Service\TimezoneService;
|
use App\Service\TimezoneService;
|
||||||
use App\Service\UserService;
|
use App\Service\UserService;
|
||||||
@@ -33,14 +31,13 @@ class CreateNewUser implements CreatesNewUsers
|
|||||||
*/
|
*/
|
||||||
public function create(array $input): User
|
public function create(array $input): User
|
||||||
{
|
{
|
||||||
$registrationMode = RegistrationMode::fromConfig(config('app.enable_registration'));
|
if (! config('app.enable_registration')) {
|
||||||
if ($registrationMode === RegistrationMode::Off) {
|
|
||||||
throw ValidationException::withMessages([
|
throw ValidationException::withMessages([
|
||||||
'email' => [__('Registration is disabled.')],
|
'email' => [__('Registration is disabled.')],
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
$validated = Validator::make($input, [
|
Validator::make($input, [
|
||||||
'name' => [
|
'name' => [
|
||||||
'required',
|
'required',
|
||||||
'string',
|
'string',
|
||||||
@@ -63,20 +60,6 @@ class CreateNewUser implements CreatesNewUsers
|
|||||||
],
|
],
|
||||||
])->validate();
|
])->validate();
|
||||||
|
|
||||||
if ($registrationMode === RegistrationMode::InviteOnly) {
|
|
||||||
$invitationService = app(InvitationService::class);
|
|
||||||
$email = (string) $validated['email'];
|
|
||||||
if (! $invitationService->hasAcceptedInvitationForEmail($email)) {
|
|
||||||
$message = $invitationService->hasPendingInvitationForEmail($email)
|
|
||||||
? __('Please accept the organization invitation sent to your email address before registering.')
|
|
||||||
: __('Registration is only available to invited users.');
|
|
||||||
|
|
||||||
throw ValidationException::withMessages([
|
|
||||||
'email' => [$message],
|
|
||||||
]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
$timezone = null;
|
$timezone = null;
|
||||||
if (array_key_exists('timezone', $input) && is_string($input['timezone'])) {
|
if (array_key_exists('timezone', $input) && is_string($input['timezone'])) {
|
||||||
if (app(TimezoneService::class)->isValid($input['timezone'])) {
|
if (app(TimezoneService::class)->isValid($input['timezone'])) {
|
||||||
|
|||||||
@@ -1,37 +0,0 @@
|
|||||||
<?php
|
|
||||||
|
|
||||||
declare(strict_types=1);
|
|
||||||
|
|
||||||
namespace App\Auth;
|
|
||||||
|
|
||||||
use Illuminate\Auth\EloquentUserProvider;
|
|
||||||
use Illuminate\Database\Eloquent\Builder;
|
|
||||||
use Illuminate\Database\Eloquent\Model;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* User provider that only resolves non-placeholder users.
|
|
||||||
*
|
|
||||||
* Placeholder users are created by imports and when members are removed from an
|
|
||||||
* organization. They can share an email address with a real user, so resolving a user by
|
|
||||||
* email can return a placeholder instead of the real account. The login flow filters them
|
|
||||||
* out explicitly, but the password broker and the guard credential checks (for example the
|
|
||||||
* password confirmation) resolve users through the configured user provider.
|
|
||||||
*
|
|
||||||
* Registered as the "eloquent" provider driver in the AuthServiceProvider, so it replaces the
|
|
||||||
* built-in one for every provider in config/auth.php.
|
|
||||||
*/
|
|
||||||
class ActiveUserProvider extends EloquentUserProvider
|
|
||||||
{
|
|
||||||
/**
|
|
||||||
* @param Model|null $model
|
|
||||||
* @return Builder<Model>
|
|
||||||
*/
|
|
||||||
#[\Override]
|
|
||||||
protected function newModelQuery($model = null): Builder
|
|
||||||
{
|
|
||||||
$query = parent::newModelQuery($model);
|
|
||||||
$query->getQuery()->where('is_placeholder', '=', false);
|
|
||||||
|
|
||||||
return $query;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -51,8 +51,7 @@ class TimeEntrySendStillRunningMailsCommand extends Command
|
|||||||
])
|
])
|
||||||
->whereHas('user', function (Builder $query): void {
|
->whereHas('user', function (Builder $query): void {
|
||||||
/** @var Builder<User> $query */
|
/** @var Builder<User> $query */
|
||||||
$query->where('is_placeholder', '=', false)
|
$query->where('is_placeholder', '=', false);
|
||||||
->where('send_time_entry_still_running_email', '=', true);
|
|
||||||
})
|
})
|
||||||
->orderBy('created_at', 'asc')
|
->orderBy('created_at', 'asc')
|
||||||
->chunk(500, function (Collection $timeEntries) use ($dryRun, &$sentMails): void {
|
->chunk(500, function (Collection $timeEntries) use ($dryRun, &$sentMails): void {
|
||||||
|
|||||||
@@ -1,29 +0,0 @@
|
|||||||
<?php
|
|
||||||
|
|
||||||
declare(strict_types=1);
|
|
||||||
|
|
||||||
namespace App\Enums;
|
|
||||||
|
|
||||||
enum RegistrationMode: string
|
|
||||||
{
|
|
||||||
case On = 'on';
|
|
||||||
case InviteOnly = 'invite-only';
|
|
||||||
case Off = 'off';
|
|
||||||
|
|
||||||
public static function fromConfig(mixed $value): self
|
|
||||||
{
|
|
||||||
if ($value === true) {
|
|
||||||
return self::On;
|
|
||||||
}
|
|
||||||
|
|
||||||
if ($value === false || $value === null) {
|
|
||||||
return self::Off;
|
|
||||||
}
|
|
||||||
|
|
||||||
return match (strtolower(trim((string) $value))) {
|
|
||||||
'1', 'on', 'true' => self::On,
|
|
||||||
'invite-only' => self::InviteOnly,
|
|
||||||
default => self::Off,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -60,6 +60,7 @@ abstract class ApiException extends Exception
|
|||||||
*/
|
*/
|
||||||
public function report(): bool
|
public function report(): bool
|
||||||
{
|
{
|
||||||
|
// TODO: temporary activated
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class CanNotDeleteUserWhoIsOwnerOfOrganizationWithMultipleMembers extends ApiException
|
class CanNotDeleteUserWhoIsOwnerOfOrganizationWithMultipleMembers extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'can_not_delete_user_who_is_owner_of_organization_with_multiple_members';
|
public const string KEY = 'can_not_delete_user_who_is_owner_of_organization_with_multiple_members';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class CanNotRemoveOwnerFromOrganization extends ApiException
|
class CanNotRemoveOwnerFromOrganization extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'can_not_remove_owner_from_organization';
|
public const string KEY = 'can_not_remove_owner_from_organization';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class ChangingRoleOfPlaceholderIsNotAllowed extends ApiException
|
class ChangingRoleOfPlaceholderIsNotAllowed extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'changing_role_of_placeholder_is_not_allowed';
|
public const string KEY = 'changing_role_of_placeholder_is_not_allowed';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class ChangingRoleToPlaceholderIsNotAllowed extends ApiException
|
class ChangingRoleToPlaceholderIsNotAllowed extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'changing_role_to_placeholder_is_not_allowed';
|
public const string KEY = 'changing_role_to_placeholder_is_not_allowed';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -19,16 +19,6 @@ class EntityStillInUseApiException extends ApiException
|
|||||||
|
|
||||||
public const string KEY = 'entity_still_in_use';
|
public const string KEY = 'entity_still_in_use';
|
||||||
|
|
||||||
/**
|
|
||||||
* Report the exception.
|
|
||||||
*
|
|
||||||
* @return bool true means the exception handler will not report it again
|
|
||||||
*/
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get the translated message for the exception.
|
* Get the translated message for the exception.
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class FeatureIsNotAvailableInFreePlanApiException extends ApiException
|
class FeatureIsNotAvailableInFreePlanApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'feature_is_not_available_in_free_plan';
|
public const string KEY = 'feature_is_not_available_in_free_plan';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class InactiveUserCanNotBeUsedApiException extends ApiException
|
class InactiveUserCanNotBeUsedApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'inactive_user_can_not_be_used';
|
public const string KEY = 'inactive_user_can_not_be_used';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class InvitationForTheEmailAlreadyExistsApiException extends ApiException
|
class InvitationForTheEmailAlreadyExistsApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'invitation_for_the_email_already_exists';
|
public const string KEY = 'invitation_for_the_email_already_exists';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class OnlyOwnerCanChangeOwnership extends ApiException
|
class OnlyOwnerCanChangeOwnership extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'only_owner_can_change_ownership';
|
public const string KEY = 'only_owner_can_change_ownership';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class OnlyPlaceholdersCanBeMergedIntoAnotherMember extends ApiException
|
class OnlyPlaceholdersCanBeMergedIntoAnotherMember extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'only_placeholders_can_be_merged_into_another_member';
|
public const string KEY = 'only_placeholders_can_be_merged_into_another_member';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class OrganizationHasNoSubscriptionButMultipleMembersException extends ApiException
|
class OrganizationHasNoSubscriptionButMultipleMembersException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'organization_has_no_subscription_but_multiple_members';
|
public const string KEY = 'organization_has_no_subscription_but_multiple_members';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class OrganizationNeedsAtLeastOneOwner extends ApiException
|
class OrganizationNeedsAtLeastOneOwner extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'organization_needs_at_least_one_owner';
|
public const string KEY = 'organization_needs_at_least_one_owner';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class OverlappingTimeEntryApiException extends ApiException
|
class OverlappingTimeEntryApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'overlapping_time_entry';
|
public const string KEY = 'overlapping_time_entry';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class ThisPlaceholderCanNotBeInvitedUseTheMergeToolInsteadException extends ApiException
|
class ThisPlaceholderCanNotBeInvitedUseTheMergeToolInsteadException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'this_placeholder_can_not_be_invited_use_the_merge_tool_instead_api_exception';
|
public const string KEY = 'this_placeholder_can_not_be_invited_use_the_merge_tool_instead_api_exception';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class TimeEntryCanNotBeRestartedApiException extends ApiException
|
class TimeEntryCanNotBeRestartedApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'time_entry_can_not_be_restarted';
|
public const string KEY = 'time_entry_can_not_be_restarted';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,14 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class TimeEntryStillRunningApiException extends ApiException
|
class TimeEntryStillRunningApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'time_entry_still_running';
|
public const string KEY = 'time_entry_still_running';
|
||||||
|
|
||||||
/**
|
|
||||||
* Report the exception.
|
|
||||||
*
|
|
||||||
* @return bool true means the exception handler will not report it again
|
|
||||||
*/
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class UserIsAlreadyMemberOfOrganizationApiException extends ApiException
|
class UserIsAlreadyMemberOfOrganizationApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'user_is_already_member_of_organization';
|
public const string KEY = 'user_is_already_member_of_organization';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class UserIsAlreadyMemberOfProjectApiException extends ApiException
|
class UserIsAlreadyMemberOfProjectApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'user_is_already_member_of_project';
|
public const string KEY = 'user_is_already_member_of_project';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class UserNotPlaceholderApiException extends ApiException
|
class UserNotPlaceholderApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'user_not_placeholder';
|
public const string KEY = 'user_not_placeholder';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,9 +7,4 @@ namespace App\Exceptions\Api;
|
|||||||
class UserResendEmailVerificationNoPendingEmailApiException extends ApiException
|
class UserResendEmailVerificationNoPendingEmailApiException extends ApiException
|
||||||
{
|
{
|
||||||
public const string KEY = 'user_resend_email_verification_no_pending_email';
|
public const string KEY = 'user_resend_email_verification_no_pending_email';
|
||||||
|
|
||||||
public function report(): bool
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,7 +7,6 @@ namespace App\Exceptions;
|
|||||||
use Illuminate\Foundation\Exceptions\Handler as ExceptionHandler;
|
use Illuminate\Foundation\Exceptions\Handler as ExceptionHandler;
|
||||||
use Illuminate\Http\RedirectResponse;
|
use Illuminate\Http\RedirectResponse;
|
||||||
use Illuminate\Http\Request;
|
use Illuminate\Http\Request;
|
||||||
use League\OAuth2\Server\Exception\OAuthServerException;
|
|
||||||
use Symfony\Component\HttpFoundation\Exception\SuspiciousOperationException;
|
use Symfony\Component\HttpFoundation\Exception\SuspiciousOperationException;
|
||||||
use Symfony\Component\HttpFoundation\Response;
|
use Symfony\Component\HttpFoundation\Response;
|
||||||
use Symfony\Component\HttpKernel\Exception\BadRequestHttpException;
|
use Symfony\Component\HttpKernel\Exception\BadRequestHttpException;
|
||||||
@@ -35,10 +34,6 @@ class Handler extends ExceptionHandler
|
|||||||
//
|
//
|
||||||
});
|
});
|
||||||
|
|
||||||
$this->dontReportWhen(fn (Throwable $e): bool => $e instanceof OAuthServerException
|
|
||||||
&& $e->getErrorType() === 'access_denied'
|
|
||||||
&& $e->getHttpStatusCode() === 401);
|
|
||||||
|
|
||||||
// A request on an untrusted host (see App\Http\Middleware\TrustHosts)
|
// A request on an untrusted host (see App\Http\Middleware\TrustHosts)
|
||||||
// otherwise renders as a bare "Bad request." 400. Show a message that
|
// otherwise renders as a bare "Bad request." 400. Show a message that
|
||||||
// says how to fix it instead. The framework has already converted the
|
// says how to fix it instead. The framework has already converted the
|
||||||
|
|||||||
@@ -28,9 +28,7 @@ class ExportController extends Controller
|
|||||||
|
|
||||||
$filepath = $exportService->export($organization);
|
$filepath = $exportService->export($organization);
|
||||||
$downloadUrl = Storage::disk(config('filesystems.private'))
|
$downloadUrl = Storage::disk(config('filesystems.private'))
|
||||||
->temporaryUrl($filepath, Carbon::now()->addMinutes(10), [
|
->temporaryUrl($filepath, Carbon::now()->addMinutes(10));
|
||||||
'ResponseContentDisposition' => 'attachment; filename="'.basename($filepath).'"',
|
|
||||||
]);
|
|
||||||
|
|
||||||
return new JsonResponse([
|
return new JsonResponse([
|
||||||
'success' => true,
|
'success' => true,
|
||||||
|
|||||||
@@ -336,9 +336,7 @@ class TimeEntryController extends Controller
|
|||||||
|
|
||||||
return response()->json([
|
return response()->json([
|
||||||
'download_url' => Storage::disk(config('filesystems.private'))
|
'download_url' => Storage::disk(config('filesystems.private'))
|
||||||
->temporaryUrl($path, now()->addMinutes(5), [
|
->temporaryUrl($path, now()->addMinutes(5)),
|
||||||
'ResponseContentDisposition' => 'attachment; filename="'.$filename.'"',
|
|
||||||
]),
|
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -549,9 +547,7 @@ class TimeEntryController extends Controller
|
|||||||
|
|
||||||
return response()->json([
|
return response()->json([
|
||||||
'download_url' => Storage::disk(config('filesystems.private'))
|
'download_url' => Storage::disk(config('filesystems.private'))
|
||||||
->temporaryUrl($path, now()->addMinutes(5), [
|
->temporaryUrl($path, now()->addMinutes(5)),
|
||||||
'ResponseContentDisposition' => 'attachment; filename="'.$filename.'"',
|
|
||||||
]),
|
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -124,10 +124,6 @@ class UserController extends Controller
|
|||||||
$user->week_start = $request->getWeekStart();
|
$user->week_start = $request->getWeekStart();
|
||||||
}
|
}
|
||||||
|
|
||||||
if ($request->getSendTimeEntryStillRunningEmail() !== null) {
|
|
||||||
$user->send_time_entry_still_running_email = $request->getSendTimeEntryStillRunningEmail();
|
|
||||||
}
|
|
||||||
|
|
||||||
$user->save();
|
$user->save();
|
||||||
|
|
||||||
if ($emailToVerify !== null) {
|
if ($emailToVerify !== null) {
|
||||||
|
|||||||
@@ -36,7 +36,6 @@ class OrganizationInvitationController extends Controller
|
|||||||
}
|
}
|
||||||
|
|
||||||
return redirect(route('register'))
|
return redirect(route('register'))
|
||||||
->with('registration_email', $email)
|
|
||||||
->with('bannerText', __('Please create an account to finish joining the :organization organization.', [
|
->with('bannerText', __('Please create an account to finish joining the :organization organization.', [
|
||||||
'organization' => $organization->name,
|
'organization' => $organization->name,
|
||||||
]))
|
]))
|
||||||
|
|||||||
@@ -24,7 +24,6 @@ class ImportRequest extends BaseFormRequest
|
|||||||
'data' => [
|
'data' => [
|
||||||
'required',
|
'required',
|
||||||
'string',
|
'string',
|
||||||
'max:'.config('import.max_data_size'),
|
|
||||||
],
|
],
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -58,9 +58,6 @@ class UserUpdateRequest extends BaseFormRequest
|
|||||||
'week_start' => [
|
'week_start' => [
|
||||||
Rule::enum(Weekday::class),
|
Rule::enum(Weekday::class),
|
||||||
],
|
],
|
||||||
'send_time_entry_still_running_email' => [
|
|
||||||
'boolean',
|
|
||||||
],
|
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -84,13 +81,6 @@ class UserUpdateRequest extends BaseFormRequest
|
|||||||
return $this->has('week_start') ? Weekday::from($this->input('week_start')) : null;
|
return $this->has('week_start') ? Weekday::from($this->input('week_start')) : null;
|
||||||
}
|
}
|
||||||
|
|
||||||
public function getSendTimeEntryStillRunningEmail(): ?bool
|
|
||||||
{
|
|
||||||
return $this->has('send_time_entry_still_running_email')
|
|
||||||
? $this->boolean('send_time_entry_still_running_email')
|
|
||||||
: null;
|
|
||||||
}
|
|
||||||
|
|
||||||
public function hasPhotoKey(): bool
|
public function hasPhotoKey(): bool
|
||||||
{
|
{
|
||||||
return $this->has('photo');
|
return $this->has('photo');
|
||||||
|
|||||||
@@ -36,8 +36,6 @@ class UserResource extends BaseResource
|
|||||||
'timezone' => $this->resource->timezone,
|
'timezone' => $this->resource->timezone,
|
||||||
/** @var Weekday $week_start Starting day of the week */
|
/** @var Weekday $week_start Starting day of the week */
|
||||||
'week_start' => $this->resource->week_start->value,
|
'week_start' => $this->resource->week_start->value,
|
||||||
/** @var bool $send_time_entry_still_running_email Whether to email the user when a time entry has been running for more than 8 hours */
|
|
||||||
'send_time_entry_still_running_email' => $this->resource->send_time_entry_still_running_email,
|
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -38,14 +38,10 @@ use OwenIt\Auditing\Contracts\Auditable as AuditableContract;
|
|||||||
* @property string|null $pending_email
|
* @property string|null $pending_email
|
||||||
* @property Carbon|null $email_verified_at
|
* @property Carbon|null $email_verified_at
|
||||||
* @property string|null $password
|
* @property string|null $password
|
||||||
* @property string|null $remember_token
|
|
||||||
* @property string|null $two_factor_secret
|
* @property string|null $two_factor_secret
|
||||||
* @property string|null $two_factor_recovery_codes
|
|
||||||
* @property Carbon|null $two_factor_confirmed_at
|
|
||||||
* @property string $timezone
|
* @property string $timezone
|
||||||
* @property bool $is_placeholder
|
* @property bool $is_placeholder
|
||||||
* @property Weekday $week_start
|
* @property Weekday $week_start
|
||||||
* @property bool $send_time_entry_still_running_email
|
|
||||||
* @property string|null $profile_photo_path
|
* @property string|null $profile_photo_path
|
||||||
* @property-read Organization|null $currentOrganization
|
* @property-read Organization|null $currentOrganization
|
||||||
* @property-read string $profile_photo_url
|
* @property-read string $profile_photo_url
|
||||||
@@ -112,7 +108,6 @@ class User extends Authenticatable implements AuditableContract, FilamentUser, M
|
|||||||
'is_admin' => 'boolean',
|
'is_admin' => 'boolean',
|
||||||
'is_placeholder' => 'boolean',
|
'is_placeholder' => 'boolean',
|
||||||
'week_start' => Weekday::class,
|
'week_start' => Weekday::class,
|
||||||
'send_time_entry_still_running_email' => 'boolean',
|
|
||||||
];
|
];
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -122,7 +117,6 @@ class User extends Authenticatable implements AuditableContract, FilamentUser, M
|
|||||||
*/
|
*/
|
||||||
protected $attributes = [
|
protected $attributes = [
|
||||||
'week_start' => Weekday::Monday,
|
'week_start' => Weekday::Monday,
|
||||||
'send_time_entry_still_running_email' => true,
|
|
||||||
];
|
];
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -153,9 +147,7 @@ class User extends Authenticatable implements AuditableContract, FilamentUser, M
|
|||||||
|
|
||||||
public function canAccessPanel(Panel $panel): bool
|
public function canAccessPanel(Panel $panel): bool
|
||||||
{
|
{
|
||||||
return $this->is_placeholder === false
|
return in_array($this->email, config('auth.super_admins', []), true) && $this->hasVerifiedEmail();
|
||||||
&& in_array($this->email, config('auth.super_admins', []), true)
|
|
||||||
&& $this->hasVerifiedEmail();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public function isMemberOfOrganization(Organization $organization): bool
|
public function isMemberOfOrganization(Organization $organization): bool
|
||||||
|
|||||||
@@ -20,7 +20,6 @@ use App\Service\BillingContract;
|
|||||||
use App\Service\IpLookup\IpLookupServiceContract;
|
use App\Service\IpLookup\IpLookupServiceContract;
|
||||||
use App\Service\IpLookup\NoIpLookupService;
|
use App\Service\IpLookup\NoIpLookupService;
|
||||||
use App\Service\PermissionStore;
|
use App\Service\PermissionStore;
|
||||||
use DateTimeInterface;
|
|
||||||
use Dedoc\Scramble\Scramble;
|
use Dedoc\Scramble\Scramble;
|
||||||
use Dedoc\Scramble\Support\Generator\OpenApi;
|
use Dedoc\Scramble\Support\Generator\OpenApi;
|
||||||
use Dedoc\Scramble\Support\Generator\SecurityScheme;
|
use Dedoc\Scramble\Support\Generator\SecurityScheme;
|
||||||
@@ -30,13 +29,8 @@ use Filament\Tables\Table;
|
|||||||
use Illuminate\Database\Eloquent\Model;
|
use Illuminate\Database\Eloquent\Model;
|
||||||
use Illuminate\Database\Eloquent\Relations\Relation;
|
use Illuminate\Database\Eloquent\Relations\Relation;
|
||||||
use Illuminate\Foundation\Application;
|
use Illuminate\Foundation\Application;
|
||||||
use Illuminate\Http\Request;
|
|
||||||
use Illuminate\Support\Facades\Route;
|
use Illuminate\Support\Facades\Route;
|
||||||
use Illuminate\Support\Facades\Storage;
|
|
||||||
use Illuminate\Support\Facades\URL;
|
|
||||||
use Illuminate\Support\ServiceProvider;
|
use Illuminate\Support\ServiceProvider;
|
||||||
use Illuminate\Support\Str;
|
|
||||||
use Symfony\Component\HttpFoundation\StreamedResponse;
|
|
||||||
|
|
||||||
class AppServiceProvider extends ServiceProvider
|
class AppServiceProvider extends ServiceProvider
|
||||||
{
|
{
|
||||||
@@ -104,27 +98,6 @@ class AppServiceProvider extends ServiceProvider
|
|||||||
$this->app->bind(IpLookupServiceContract::class, NoIpLookupService::class);
|
$this->app->bind(IpLookupServiceContract::class, NoIpLookupService::class);
|
||||||
$this->app->bind(BillingContract::class);
|
$this->app->bind(BillingContract::class);
|
||||||
|
|
||||||
// Storage
|
|
||||||
// The local driver ignores the ResponseContentDisposition option of temporaryUrl,
|
|
||||||
// so mirror it through the signed query parameters of the storage route.
|
|
||||||
$privateDisk = config('filesystems.private');
|
|
||||||
if (config('filesystems.disks.'.$privateDisk.'.driver') === 'local') {
|
|
||||||
$disk = Storage::disk($privateDisk);
|
|
||||||
$disk->serveUsing(function (Request $request, string $path, array $headers) use ($disk): StreamedResponse {
|
|
||||||
return $disk->response($path, null, $headers, $request->query('disposition', 'inline'));
|
|
||||||
});
|
|
||||||
$disk->buildTemporaryUrlsUsing(function (string $path, DateTimeInterface $expiration, array $options) use ($privateDisk): string {
|
|
||||||
$parameters = array_filter([
|
|
||||||
'path' => $path,
|
|
||||||
'disposition' => isset($options['ResponseContentDisposition'])
|
|
||||||
? Str::before($options['ResponseContentDisposition'], ';')
|
|
||||||
: null,
|
|
||||||
]);
|
|
||||||
|
|
||||||
return url(URL::temporarySignedRoute('storage.'.$privateDisk, $expiration, $parameters, absolute: false));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Routing
|
// Routing
|
||||||
Route::model('member', Member::class);
|
Route::model('member', Member::class);
|
||||||
Route::model('invitation', OrganizationInvitation::class);
|
Route::model('invitation', OrganizationInvitation::class);
|
||||||
|
|||||||
@@ -4,14 +4,11 @@ declare(strict_types=1);
|
|||||||
|
|
||||||
namespace App\Providers;
|
namespace App\Providers;
|
||||||
|
|
||||||
use App\Auth\ActiveUserProvider;
|
|
||||||
use App\Models\Passport\AuthCode;
|
use App\Models\Passport\AuthCode;
|
||||||
use App\Models\Passport\Client;
|
use App\Models\Passport\Client;
|
||||||
use App\Models\Passport\RefreshToken;
|
use App\Models\Passport\RefreshToken;
|
||||||
use App\Models\Passport\Token;
|
use App\Models\Passport\Token;
|
||||||
use Illuminate\Contracts\Foundation\Application;
|
|
||||||
use Illuminate\Foundation\Support\Providers\AuthServiceProvider as ServiceProvider;
|
use Illuminate\Foundation\Support\Providers\AuthServiceProvider as ServiceProvider;
|
||||||
use Illuminate\Support\Facades\Auth;
|
|
||||||
use Laravel\Passport\Passport;
|
use Laravel\Passport\Passport;
|
||||||
|
|
||||||
class AuthServiceProvider extends ServiceProvider
|
class AuthServiceProvider extends ServiceProvider
|
||||||
@@ -29,13 +26,6 @@ class AuthServiceProvider extends ServiceProvider
|
|||||||
*/
|
*/
|
||||||
public function boot(): void
|
public function boot(): void
|
||||||
{
|
{
|
||||||
// Replaces the built-in eloquent user provider, so that no authentication flow can
|
|
||||||
// resolve a placeholder user. The driver name is kept, because Passport recognizes
|
|
||||||
// only providers that are configured with the driver "eloquent".
|
|
||||||
Auth::provider('eloquent', function (Application $app, array $config): ActiveUserProvider {
|
|
||||||
return new ActiveUserProvider($app->make('hash'), $config['model']);
|
|
||||||
});
|
|
||||||
|
|
||||||
// define scopes for passport tokens
|
// define scopes for passport tokens
|
||||||
Passport::tokensCan([
|
Passport::tokensCan([
|
||||||
'create' => 'Create resources',
|
'create' => 'Create resources',
|
||||||
|
|||||||
@@ -45,7 +45,6 @@ class FortifyServiceProvider extends ServiceProvider
|
|||||||
|
|
||||||
Fortify::registerView(function () {
|
Fortify::registerView(function () {
|
||||||
return Inertia::render('Auth/Register', [
|
return Inertia::render('Auth/Register', [
|
||||||
'email' => session('registration_email', ''),
|
|
||||||
'terms_url' => config('auth.terms_url'),
|
'terms_url' => config('auth.terms_url'),
|
||||||
'privacy_policy_url' => config('auth.privacy_policy_url'),
|
'privacy_policy_url' => config('auth.privacy_policy_url'),
|
||||||
'newsletter_consent' => config('auth.newsletter_consent'),
|
'newsletter_consent' => config('auth.newsletter_consent'),
|
||||||
|
|||||||
@@ -9,8 +9,11 @@ use App\Service\Import\Importers\ImporterContract;
|
|||||||
use App\Service\Import\Importers\ImporterProvider;
|
use App\Service\Import\Importers\ImporterProvider;
|
||||||
use App\Service\Import\Importers\ImportException;
|
use App\Service\Import\Importers\ImportException;
|
||||||
use App\Service\Import\Importers\ReportDto;
|
use App\Service\Import\Importers\ReportDto;
|
||||||
|
use Illuminate\Support\Carbon;
|
||||||
use Illuminate\Support\Facades\Cache;
|
use Illuminate\Support\Facades\Cache;
|
||||||
use Illuminate\Support\Facades\DB;
|
use Illuminate\Support\Facades\DB;
|
||||||
|
use Illuminate\Support\Facades\Storage;
|
||||||
|
use Illuminate\Support\Str;
|
||||||
|
|
||||||
class ImportService
|
class ImportService
|
||||||
{
|
{
|
||||||
@@ -22,6 +25,8 @@ class ImportService
|
|||||||
/** @var ImporterContract $importer */
|
/** @var ImporterContract $importer */
|
||||||
$importer = app(ImporterProvider::class)->getImporter($importerType);
|
$importer = app(ImporterProvider::class)->getImporter($importerType);
|
||||||
$importer->init($organization);
|
$importer->init($organization);
|
||||||
|
Storage::disk(config('filesystems.default'))
|
||||||
|
->put('import/'.Carbon::now()->toDateString().'-'.$organization->getKey().'-'.Str::uuid(), $data);
|
||||||
|
|
||||||
$lock = Cache::lock('import:'.$organization->getKey(), config('octane.max_execution_time', 60) + 1);
|
$lock = Cache::lock('import:'.$organization->getKey(), config('octane.max_execution_time', 60) + 1);
|
||||||
|
|
||||||
|
|||||||
@@ -16,6 +16,7 @@ use Illuminate\Support\Str;
|
|||||||
use League\Csv\Reader;
|
use League\Csv\Reader;
|
||||||
use Override;
|
use Override;
|
||||||
use Spatie\TemporaryDirectory\TemporaryDirectory;
|
use Spatie\TemporaryDirectory\TemporaryDirectory;
|
||||||
|
use ZipArchive;
|
||||||
|
|
||||||
class SolidtimeImporter extends DefaultImporter
|
class SolidtimeImporter extends DefaultImporter
|
||||||
{
|
{
|
||||||
@@ -33,10 +34,16 @@ class SolidtimeImporter extends DefaultImporter
|
|||||||
$temporaryDirectoryZip = null;
|
$temporaryDirectoryZip = null;
|
||||||
$temporaryDirectory = null;
|
$temporaryDirectory = null;
|
||||||
try {
|
try {
|
||||||
|
$zip = new ZipArchive;
|
||||||
$temporaryDirectoryZip = TemporaryDirectory::make();
|
$temporaryDirectoryZip = TemporaryDirectory::make();
|
||||||
file_put_contents($temporaryDirectoryZip->path('import.zip'), $data);
|
file_put_contents($temporaryDirectoryZip->path('import.zip'), $data);
|
||||||
|
$res = $zip->open($temporaryDirectoryZip->path('import.zip'), ZipArchive::RDONLY);
|
||||||
|
if ($res !== true) {
|
||||||
|
throw new ImportException('Invalid ZIP, error code: '.$res);
|
||||||
|
}
|
||||||
$temporaryDirectory = TemporaryDirectory::make();
|
$temporaryDirectory = TemporaryDirectory::make();
|
||||||
app(ZipImportHelper::class)->extract($temporaryDirectoryZip->path('import.zip'), $temporaryDirectory->path());
|
$zip->extractTo($temporaryDirectory->path());
|
||||||
|
$zip->close();
|
||||||
|
|
||||||
if (! file_exists($temporaryDirectory->path('meta.json'))) {
|
if (! file_exists($temporaryDirectory->path('meta.json'))) {
|
||||||
throw new ImportException('File "meta.json" missing in ZIP');
|
throw new ImportException('File "meta.json" missing in ZIP');
|
||||||
|
|||||||
@@ -13,6 +13,7 @@ use Illuminate\Support\Str;
|
|||||||
use Override;
|
use Override;
|
||||||
use Spatie\TemporaryDirectory\TemporaryDirectory;
|
use Spatie\TemporaryDirectory\TemporaryDirectory;
|
||||||
use ValueError;
|
use ValueError;
|
||||||
|
use ZipArchive;
|
||||||
|
|
||||||
class TogglDataImporter extends DefaultImporter
|
class TogglDataImporter extends DefaultImporter
|
||||||
{
|
{
|
||||||
@@ -25,10 +26,16 @@ class TogglDataImporter extends DefaultImporter
|
|||||||
$temporaryDirectoryZip = null;
|
$temporaryDirectoryZip = null;
|
||||||
$temporaryDirectory = null;
|
$temporaryDirectory = null;
|
||||||
try {
|
try {
|
||||||
|
$zip = new ZipArchive;
|
||||||
$temporaryDirectoryZip = TemporaryDirectory::make();
|
$temporaryDirectoryZip = TemporaryDirectory::make();
|
||||||
file_put_contents($temporaryDirectoryZip->path('import.zip'), $data);
|
file_put_contents($temporaryDirectoryZip->path('import.zip'), $data);
|
||||||
|
$res = $zip->open($temporaryDirectoryZip->path('import.zip'), ZipArchive::RDONLY);
|
||||||
|
if ($res !== true) {
|
||||||
|
throw new ImportException('Invalid ZIP, error code: '.$res);
|
||||||
|
}
|
||||||
$temporaryDirectory = TemporaryDirectory::make();
|
$temporaryDirectory = TemporaryDirectory::make();
|
||||||
app(ZipImportHelper::class)->extract($temporaryDirectoryZip->path('import.zip'), $temporaryDirectory->path());
|
$zip->extractTo($temporaryDirectory->path());
|
||||||
|
$zip->close();
|
||||||
if (! file_exists($temporaryDirectory->path('clients.json'))) {
|
if (! file_exists($temporaryDirectory->path('clients.json'))) {
|
||||||
throw new ImportException('File "clients.json" missing in ZIP');
|
throw new ImportException('File "clients.json" missing in ZIP');
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,129 +0,0 @@
|
|||||||
<?php
|
|
||||||
|
|
||||||
declare(strict_types=1);
|
|
||||||
|
|
||||||
namespace App\Service\Import\Importers;
|
|
||||||
|
|
||||||
use ZipArchive;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Extracts uploaded ZIP archives with limits on file count, total uncompressed
|
|
||||||
* size and entry paths, so a small malicious archive can not fill the disk
|
|
||||||
* (decompression bomb) or write outside the target directory (zip slip).
|
|
||||||
*/
|
|
||||||
class ZipImportHelper
|
|
||||||
{
|
|
||||||
private const int CHUNK_SIZE = 1024 * 1024;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @throws ImportException
|
|
||||||
*/
|
|
||||||
public function extract(string $zipPath, string $targetPath): void
|
|
||||||
{
|
|
||||||
$zip = new ZipArchive;
|
|
||||||
$res = $zip->open($zipPath, ZipArchive::RDONLY);
|
|
||||||
if ($res !== true) {
|
|
||||||
throw new ImportException('Invalid ZIP, error code: '.$res);
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
$maxFiles = (int) config('import.zip_max_files');
|
|
||||||
$maxUncompressedSize = (int) config('import.zip_max_uncompressed_size');
|
|
||||||
|
|
||||||
if ($zip->numFiles > $maxFiles) {
|
|
||||||
throw new ImportException('ZIP contains too many files, maximum is '.$maxFiles);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check the sizes declared in the archive before writing anything to disk
|
|
||||||
$declaredSize = 0;
|
|
||||||
for ($index = 0; $index < $zip->numFiles; $index++) {
|
|
||||||
$stat = $zip->statIndex($index);
|
|
||||||
if ($stat === false) {
|
|
||||||
throw new ImportException('Invalid ZIP entry');
|
|
||||||
}
|
|
||||||
$this->validateEntryName($stat['name']);
|
|
||||||
$declaredSize += $stat['size'];
|
|
||||||
if ($declaredSize > $maxUncompressedSize) {
|
|
||||||
throw new ImportException('ZIP uncompressed size exceeds the maximum of '.$maxUncompressedSize.' bytes');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// The declared sizes can be forged, so the written bytes are counted as well
|
|
||||||
$writtenSize = 0;
|
|
||||||
for ($index = 0; $index < $zip->numFiles; $index++) {
|
|
||||||
$stat = $zip->statIndex($index);
|
|
||||||
if ($stat === false) {
|
|
||||||
throw new ImportException('Invalid ZIP entry');
|
|
||||||
}
|
|
||||||
$name = $stat['name'];
|
|
||||||
$entryPath = $targetPath.DIRECTORY_SEPARATOR.$name;
|
|
||||||
|
|
||||||
if (str_ends_with($name, '/')) {
|
|
||||||
$this->ensureDirectoryExists($entryPath);
|
|
||||||
|
|
||||||
continue;
|
|
||||||
}
|
|
||||||
$this->ensureDirectoryExists(dirname($entryPath));
|
|
||||||
|
|
||||||
$stream = $zip->getStreamIndex($index);
|
|
||||||
if ($stream === false) {
|
|
||||||
throw new ImportException('ZIP entry "'.$name.'" can not be read');
|
|
||||||
}
|
|
||||||
$target = fopen($entryPath, 'wb');
|
|
||||||
if ($target === false) {
|
|
||||||
fclose($stream);
|
|
||||||
throw new ImportException('ZIP entry "'.$name.'" can not be extracted');
|
|
||||||
}
|
|
||||||
try {
|
|
||||||
while (! feof($stream)) {
|
|
||||||
$chunk = fread($stream, self::CHUNK_SIZE);
|
|
||||||
if ($chunk === false) {
|
|
||||||
throw new ImportException('ZIP entry "'.$name.'" can not be read');
|
|
||||||
}
|
|
||||||
$writtenSize += strlen($chunk);
|
|
||||||
if ($writtenSize > $maxUncompressedSize) {
|
|
||||||
throw new ImportException('ZIP uncompressed size exceeds the maximum of '.$maxUncompressedSize.' bytes');
|
|
||||||
}
|
|
||||||
fwrite($target, $chunk);
|
|
||||||
}
|
|
||||||
} finally {
|
|
||||||
fclose($target);
|
|
||||||
fclose($stream);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} finally {
|
|
||||||
$zip->close();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @throws ImportException
|
|
||||||
*/
|
|
||||||
private function validateEntryName(string $name): void
|
|
||||||
{
|
|
||||||
if ($name === '' || str_contains($name, "\0") || str_contains($name, '\\') || str_starts_with($name, '/')) {
|
|
||||||
throw new ImportException('ZIP contains an invalid file path: "'.$name.'"');
|
|
||||||
}
|
|
||||||
if (preg_match('/^[a-zA-Z]:/', $name) === 1) {
|
|
||||||
throw new ImportException('ZIP contains an invalid file path: "'.$name.'"');
|
|
||||||
}
|
|
||||||
foreach (explode('/', rtrim($name, '/')) as $segment) {
|
|
||||||
if ($segment === '' || $segment === '..') {
|
|
||||||
throw new ImportException('ZIP contains an invalid file path: "'.$name.'"');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @throws ImportException
|
|
||||||
*/
|
|
||||||
private function ensureDirectoryExists(string $path): void
|
|
||||||
{
|
|
||||||
if (is_dir($path)) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (! mkdir($path, 0700, true) && ! is_dir($path)) {
|
|
||||||
throw new ImportException('Directory "'.$path.'" can not be created');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -18,22 +18,6 @@ use Illuminate\Support\Facades\Mail;
|
|||||||
|
|
||||||
class InvitationService
|
class InvitationService
|
||||||
{
|
{
|
||||||
public function hasAcceptedInvitationForEmail(string $email): bool
|
|
||||||
{
|
|
||||||
return OrganizationInvitation::query()
|
|
||||||
->whereRaw('lower(email) = ?', [strtolower($email)])
|
|
||||||
->whereNotNull('accepted_at')
|
|
||||||
->exists();
|
|
||||||
}
|
|
||||||
|
|
||||||
public function hasPendingInvitationForEmail(string $email): bool
|
|
||||||
{
|
|
||||||
return OrganizationInvitation::query()
|
|
||||||
->whereRaw('lower(email) = ?', [strtolower($email)])
|
|
||||||
->whereNull('accepted_at')
|
|
||||||
->exists();
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @throws UserIsAlreadyMemberOfOrganizationApiException|InvitationForTheEmailAlreadyExistsApiException
|
* @throws UserIsAlreadyMemberOfOrganizationApiException|InvitationForTheEmailAlreadyExistsApiException
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -218,16 +218,7 @@ class MemberService
|
|||||||
|
|
||||||
$placeholderUser = $user->replicate();
|
$placeholderUser = $user->replicate();
|
||||||
$placeholderUser->is_placeholder = true;
|
$placeholderUser->is_placeholder = true;
|
||||||
// Reset authentication relevant properties on the placeholder user
|
$placeholderUser->current_team_id = $member->organization_id;
|
||||||
$placeholderUser->password = null;
|
|
||||||
$placeholderUser->remember_token = null;
|
|
||||||
$placeholderUser->two_factor_secret = null;
|
|
||||||
$placeholderUser->two_factor_recovery_codes = null;
|
|
||||||
$placeholderUser->two_factor_confirmed_at = null;
|
|
||||||
$placeholderUser->email_verified_at = null;
|
|
||||||
$placeholderUser->pending_email = null;
|
|
||||||
$placeholderUser->current_team_id = null;
|
|
||||||
$placeholderUser->profile_photo_path = null;
|
|
||||||
$placeholderUser->save();
|
$placeholderUser->save();
|
||||||
|
|
||||||
$member->user()->associate($placeholderUser);
|
$member->user()->associate($placeholderUser);
|
||||||
|
|||||||
@@ -80,10 +80,6 @@ class PermissionStore
|
|||||||
'invoices:update',
|
'invoices:update',
|
||||||
'invoices:download',
|
'invoices:download',
|
||||||
'invoices:delete',
|
'invoices:delete',
|
||||||
'invoice-recipients:view',
|
|
||||||
'invoice-recipients:create',
|
|
||||||
'invoice-recipients:update',
|
|
||||||
'invoice-recipients:delete',
|
|
||||||
'invoice-settings:view',
|
'invoice-settings:view',
|
||||||
'invoice-settings:update',
|
'invoice-settings:update',
|
||||||
],
|
],
|
||||||
@@ -151,10 +147,6 @@ class PermissionStore
|
|||||||
'invoices:update',
|
'invoices:update',
|
||||||
'invoices:download',
|
'invoices:download',
|
||||||
'invoices:delete',
|
'invoices:delete',
|
||||||
'invoice-recipients:view',
|
|
||||||
'invoice-recipients:create',
|
|
||||||
'invoice-recipients:update',
|
|
||||||
'invoice-recipients:delete',
|
|
||||||
'invoice-settings:view',
|
'invoice-settings:view',
|
||||||
'invoice-settings:update',
|
'invoice-settings:update',
|
||||||
],
|
],
|
||||||
@@ -211,10 +203,6 @@ class PermissionStore
|
|||||||
'invoices:update',
|
'invoices:update',
|
||||||
'invoices:download',
|
'invoices:download',
|
||||||
'invoices:delete',
|
'invoices:delete',
|
||||||
'invoice-recipients:view',
|
|
||||||
'invoice-recipients:create',
|
|
||||||
'invoice-recipients:update',
|
|
||||||
'invoice-recipients:delete',
|
|
||||||
'invoice-settings:view',
|
'invoice-settings:view',
|
||||||
'invoice-settings:update',
|
'invoice-settings:update',
|
||||||
],
|
],
|
||||||
|
|||||||
@@ -100,7 +100,7 @@ return [
|
|||||||
|
|
||||||
'force_https' => (bool) env('APP_FORCE_HTTPS', false),
|
'force_https' => (bool) env('APP_FORCE_HTTPS', false),
|
||||||
|
|
||||||
'enable_registration' => env('APP_ENABLE_REGISTRATION', 'off'),
|
'enable_registration' => (bool) env('APP_ENABLE_REGISTRATION', false),
|
||||||
|
|
||||||
'local_email_verification' => (bool) env('APP_LOCAL_EMAIL_VERIFICATION', false),
|
'local_email_verification' => (bool) env('APP_LOCAL_EMAIL_VERIFICATION', false),
|
||||||
|
|
||||||
|
|||||||
@@ -1,34 +0,0 @@
|
|||||||
<?php
|
|
||||||
|
|
||||||
declare(strict_types=1);
|
|
||||||
|
|
||||||
return [
|
|
||||||
|
|
||||||
/*
|
|
||||||
|--------------------------------------------------------------------------
|
|
||||||
| Import payload limit
|
|
||||||
|--------------------------------------------------------------------------
|
|
||||||
|
|
|
||||||
| Maximum length of the base64 encoded "data" field of an import request in
|
|
||||||
| bytes. Requests with a larger payload are rejected with a validation error.
|
|
||||||
|
|
|
||||||
*/
|
|
||||||
|
|
||||||
'max_data_size' => (int) (env('IMPORT_MAX_DATA_SIZE') ?: 50 * 1024 * 1024),
|
|
||||||
|
|
||||||
/*
|
|
||||||
|--------------------------------------------------------------------------
|
|
||||||
| ZIP extraction limits
|
|
||||||
|--------------------------------------------------------------------------
|
|
||||||
|
|
|
||||||
| Limits applied to ZIP based importers before and during extraction to
|
|
||||||
| protect the instance against decompression bombs. The uncompressed size
|
|
||||||
| is the sum of all files in the archive in bytes.
|
|
||||||
|
|
|
||||||
*/
|
|
||||||
|
|
||||||
'zip_max_files' => (int) (env('IMPORT_ZIP_MAX_FILES') ?: 100),
|
|
||||||
|
|
||||||
'zip_max_uncompressed_size' => (int) (env('IMPORT_ZIP_MAX_UNCOMPRESSED_SIZE') ?: 500 * 1024 * 1024),
|
|
||||||
|
|
||||||
];
|
|
||||||
@@ -1,24 +0,0 @@
|
|||||||
<?php
|
|
||||||
|
|
||||||
declare(strict_types=1);
|
|
||||||
|
|
||||||
use Illuminate\Database\Migrations\Migration;
|
|
||||||
use Illuminate\Database\Schema\Blueprint;
|
|
||||||
use Illuminate\Support\Facades\Schema;
|
|
||||||
|
|
||||||
return new class extends Migration
|
|
||||||
{
|
|
||||||
public function up(): void
|
|
||||||
{
|
|
||||||
Schema::table('users', function (Blueprint $table): void {
|
|
||||||
$table->boolean('send_time_entry_still_running_email')->default(true)->after('week_start');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
public function down(): void
|
|
||||||
{
|
|
||||||
Schema::table('users', function (Blueprint $table): void {
|
|
||||||
$table->dropColumn('send_time_entry_still_running_email');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
@@ -1,53 +0,0 @@
|
|||||||
<?php
|
|
||||||
|
|
||||||
declare(strict_types=1);
|
|
||||||
|
|
||||||
use Illuminate\Database\Migrations\Migration;
|
|
||||||
use Illuminate\Database\Query\Builder;
|
|
||||||
use Illuminate\Support\Facades\DB;
|
|
||||||
|
|
||||||
return new class extends Migration
|
|
||||||
{
|
|
||||||
/**
|
|
||||||
* Placeholder users used to be created as a full copy of the user they were made from,
|
|
||||||
* which included the credentials and the account state of that user. A placeholder is a
|
|
||||||
* stand-in for a person in one organization, not an account, and the row shares the email
|
|
||||||
* address with the real account, so these values are removed from the placeholders that
|
|
||||||
* already exist. The organization a placeholder belongs to is recorded on its member row.
|
|
||||||
*/
|
|
||||||
public function up(): void
|
|
||||||
{
|
|
||||||
DB::table('users')
|
|
||||||
->where('is_placeholder', '=', true)
|
|
||||||
->where(function (Builder $builder): void {
|
|
||||||
$builder->whereNotNull('password')
|
|
||||||
->orWhereNotNull('remember_token')
|
|
||||||
->orWhereNotNull('two_factor_secret')
|
|
||||||
->orWhereNotNull('two_factor_recovery_codes')
|
|
||||||
->orWhereNotNull('two_factor_confirmed_at')
|
|
||||||
->orWhereNotNull('email_verified_at')
|
|
||||||
->orWhereNotNull('pending_email')
|
|
||||||
->orWhereNotNull('current_team_id')
|
|
||||||
->orWhereNotNull('profile_photo_path');
|
|
||||||
})
|
|
||||||
->update([
|
|
||||||
'password' => null,
|
|
||||||
'remember_token' => null,
|
|
||||||
'two_factor_secret' => null,
|
|
||||||
'two_factor_recovery_codes' => null,
|
|
||||||
'two_factor_confirmed_at' => null,
|
|
||||||
'email_verified_at' => null,
|
|
||||||
'pending_email' => null,
|
|
||||||
'current_team_id' => null,
|
|
||||||
'profile_photo_path' => null,
|
|
||||||
]);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Reverse the migrations.
|
|
||||||
*/
|
|
||||||
public function down(): void
|
|
||||||
{
|
|
||||||
//
|
|
||||||
}
|
|
||||||
};
|
|
||||||
@@ -8,7 +8,7 @@ import {
|
|||||||
createProjectViaApi,
|
createProjectViaApi,
|
||||||
createPublicProjectViaApi,
|
createPublicProjectViaApi,
|
||||||
} from './utils/api';
|
} from './utils/api';
|
||||||
import { clearTableState, getTableRowNames } from './utils/table';
|
import { getTableRowNames } from './utils/table';
|
||||||
|
|
||||||
async function goToClientsOverview(page: Page) {
|
async function goToClientsOverview(page: Page) {
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/clients');
|
await page.goto(PLAYWRIGHT_BASE_URL + '/clients');
|
||||||
@@ -210,12 +210,18 @@ test('test that client context menu delete deletes the client', async ({ page, c
|
|||||||
// Sorting Tests
|
// Sorting Tests
|
||||||
// =============================================
|
// =============================================
|
||||||
|
|
||||||
|
async function clearClientTableState(page: Page) {
|
||||||
|
await page.evaluate(() => {
|
||||||
|
localStorage.removeItem('client-table-state');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
test('test that sorting clients by name and status works', async ({ page, ctx }) => {
|
test('test that sorting clients by name and status works', async ({ page, ctx }) => {
|
||||||
await createClientViaApi(ctx, { name: 'AAA SortClient' });
|
await createClientViaApi(ctx, { name: 'AAA SortClient' });
|
||||||
await createClientViaApi(ctx, { name: 'ZZZ SortClient' });
|
await createClientViaApi(ctx, { name: 'ZZZ SortClient' });
|
||||||
|
|
||||||
await goToClientsOverview(page);
|
await goToClientsOverview(page);
|
||||||
await clearTableState(page, 'client-table-state');
|
await clearClientTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
const table = page.getByTestId('client_table');
|
const table = page.getByTestId('client_table');
|
||||||
@@ -247,7 +253,7 @@ test('test that sorting clients by project count works', async ({ page, ctx }) =
|
|||||||
await createProjectViaApi(ctx, { name: 'Proj2', client_id: clientWithMany.id });
|
await createProjectViaApi(ctx, { name: 'Proj2', client_id: clientWithMany.id });
|
||||||
|
|
||||||
await goToClientsOverview(page);
|
await goToClientsOverview(page);
|
||||||
await clearTableState(page, 'client-table-state');
|
await clearClientTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
const table = page.getByTestId('client_table');
|
const table = page.getByTestId('client_table');
|
||||||
@@ -268,7 +274,7 @@ test('test that sorting clients by project count works', async ({ page, ctx }) =
|
|||||||
|
|
||||||
test('test that client sort state persists after page reload', async ({ page }) => {
|
test('test that client sort state persists after page reload', async ({ page }) => {
|
||||||
await goToClientsOverview(page);
|
await goToClientsOverview(page);
|
||||||
await clearTableState(page, 'client-table-state');
|
await clearClientTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
const table = page.getByTestId('client_table');
|
const table = page.getByTestId('client_table');
|
||||||
@@ -391,7 +397,7 @@ test.describe('Clients Pagination', () => {
|
|||||||
);
|
);
|
||||||
|
|
||||||
await goToClientsOverview(page);
|
await goToClientsOverview(page);
|
||||||
await clearTableState(page, 'client-table-state');
|
await clearClientTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
// Default sort is name asc; first 15 clients (00–14) on page 1.
|
// Default sort is name asc; first 15 clients (00–14) on page 1.
|
||||||
@@ -444,7 +450,7 @@ test.describe('Clients Pagination', () => {
|
|||||||
);
|
);
|
||||||
|
|
||||||
await goToClientsOverview(page);
|
await goToClientsOverview(page);
|
||||||
await clearTableState(page, 'client-table-state');
|
await clearClientTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
await expect(page.getByTestId('client_table')).toBeVisible();
|
await expect(page.getByTestId('client_table')).toBeVisible();
|
||||||
@@ -464,7 +470,7 @@ test.describe('Clients Pagination', () => {
|
|||||||
);
|
);
|
||||||
|
|
||||||
await goToClientsOverview(page);
|
await goToClientsOverview(page);
|
||||||
await clearTableState(page, 'client-table-state');
|
await clearClientTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });
|
await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });
|
||||||
|
|||||||
@@ -1,32 +0,0 @@
|
|||||||
import { expect, test } from '../playwright/fixtures';
|
|
||||||
import { PLAYWRIGHT_BASE_URL } from '../playwright/config';
|
|
||||||
import { getInvitationAcceptUrl } from './utils/mailpit';
|
|
||||||
|
|
||||||
test('prefills the registration email after accepting an invitation', async ({ page, browser }) => {
|
|
||||||
const memberId = `${Date.now()}-${Math.floor(Math.random() * 100000)}`;
|
|
||||||
const memberEmail = `prefill-${memberId}@invitation.test`;
|
|
||||||
|
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/members');
|
|
||||||
await page.getByRole('button', { name: 'Invite Member' }).click();
|
|
||||||
await page.getByPlaceholder('Member Email').fill(memberEmail);
|
|
||||||
await page.getByRole('button', { name: 'Employee' }).click();
|
|
||||||
await Promise.all([
|
|
||||||
page.waitForResponse(
|
|
||||||
(response) =>
|
|
||||||
response.url().includes('/invitations') &&
|
|
||||||
response.request().method() === 'POST' &&
|
|
||||||
response.status() === 204
|
|
||||||
),
|
|
||||||
page.getByRole('button', { name: 'Invite Member', exact: true }).click(),
|
|
||||||
]);
|
|
||||||
|
|
||||||
const inviteeContext = await browser.newContext();
|
|
||||||
const inviteePage = await inviteeContext.newPage();
|
|
||||||
const acceptUrl = await getInvitationAcceptUrl(inviteePage.request, memberEmail);
|
|
||||||
await inviteePage.goto(acceptUrl);
|
|
||||||
await inviteePage.waitForURL(/\/register$/);
|
|
||||||
|
|
||||||
await expect(inviteePage.getByLabel('Email')).toHaveValue(memberEmail);
|
|
||||||
|
|
||||||
await inviteeContext.close();
|
|
||||||
});
|
|
||||||
@@ -11,7 +11,7 @@ import {
|
|||||||
updateMemberBillableRateViaApi,
|
updateMemberBillableRateViaApi,
|
||||||
updateOrganizationSettingViaApi,
|
updateOrganizationSettingViaApi,
|
||||||
} from './utils/api';
|
} from './utils/api';
|
||||||
import { clearTableState, getTableRowNames } from './utils/table';
|
import { getTableRowNames } from './utils/table';
|
||||||
|
|
||||||
// Tests that invite + accept members need more time
|
// Tests that invite + accept members need more time
|
||||||
test.describe.configure({ timeout: 45000 });
|
test.describe.configure({ timeout: 45000 });
|
||||||
@@ -779,18 +779,20 @@ test('test that accepted invitation disappears from invitations tab', async ({ p
|
|||||||
// Sorting Tests
|
// Sorting Tests
|
||||||
// =============================================
|
// =============================================
|
||||||
|
|
||||||
|
// Helper to clear localStorage before tests that check sorting
|
||||||
|
async function clearMemberTableState(page: Page) {
|
||||||
|
await page.evaluate(() => {
|
||||||
|
localStorage.removeItem('member-table-state');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
test('test that sorting members by name, role, and status works', async ({ page, ctx }) => {
|
test('test that sorting members by name, role, and status works', async ({ page, ctx }) => {
|
||||||
// Create two placeholder members with names that sort predictably around "John Doe".
|
// Create two placeholder members with names that sort predictably around "John Doe"
|
||||||
// Seeded alphabetically a second apart: created_at only has second precision and
|
|
||||||
// same-second rows fall back to a random UUID order. The spacing is what makes the
|
|
||||||
// API order (created_at desc: ZZZ, AAA, John) deterministic, so the tie-break
|
|
||||||
// assertions below are testing the tie-break rather than a coin flip.
|
|
||||||
await createPlaceholderMemberViaImportApi(ctx, 'AAA SortFirst');
|
await createPlaceholderMemberViaImportApi(ctx, 'AAA SortFirst');
|
||||||
await page.waitForTimeout(1100);
|
|
||||||
await createPlaceholderMemberViaImportApi(ctx, 'ZZZ SortLast');
|
await createPlaceholderMemberViaImportApi(ctx, 'ZZZ SortLast');
|
||||||
|
|
||||||
await goToMembersPage(page);
|
await goToMembersPage(page);
|
||||||
await clearTableState(page, 'member-table-state');
|
await clearMemberTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
const table = page.getByTestId('member_table');
|
const table = page.getByTestId('member_table');
|
||||||
@@ -812,24 +814,20 @@ test('test that sorting members by name, role, and status works', async ({ page,
|
|||||||
const ownerIdx = names.indexOf('John Doe');
|
const ownerIdx = names.indexOf('John Doe');
|
||||||
const placeholderIdx = names.indexOf('AAA SortFirst');
|
const placeholderIdx = names.indexOf('AAA SortFirst');
|
||||||
expect(ownerIdx).toBeLessThan(placeholderIdx);
|
expect(ownerIdx).toBeLessThan(placeholderIdx);
|
||||||
expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('ZZZ SortLast'));
|
|
||||||
|
|
||||||
await roleHeader.click(); // desc: Placeholder first
|
await roleHeader.click(); // desc: Placeholder first
|
||||||
names = await getTableRowNames(table);
|
names = await getTableRowNames(table);
|
||||||
expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('John Doe'));
|
expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('John Doe'));
|
||||||
expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('ZZZ SortLast'));
|
|
||||||
|
|
||||||
// -- Status sorting --
|
// -- Status sorting --
|
||||||
const statusHeader = table.getByText('Status').first();
|
const statusHeader = table.getByText('Status').first();
|
||||||
await statusHeader.click(); // asc: Active(0) < Inactive(1)
|
await statusHeader.click(); // asc: Active(0) < Inactive(1)
|
||||||
names = await getTableRowNames(table);
|
names = await getTableRowNames(table);
|
||||||
expect(names.indexOf('John Doe')).toBeLessThan(names.indexOf('AAA SortFirst'));
|
expect(names.indexOf('John Doe')).toBeLessThan(names.indexOf('AAA SortFirst'));
|
||||||
expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('ZZZ SortLast'));
|
|
||||||
|
|
||||||
await statusHeader.click(); // desc: Inactive first
|
await statusHeader.click(); // desc: Inactive first
|
||||||
names = await getTableRowNames(table);
|
names = await getTableRowNames(table);
|
||||||
expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('John Doe'));
|
expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('John Doe'));
|
||||||
expect(names.indexOf('AAA SortFirst')).toBeLessThan(names.indexOf('ZZZ SortLast'));
|
|
||||||
|
|
||||||
// -- Email: just verify sort indicator appears --
|
// -- Email: just verify sort indicator appears --
|
||||||
const emailHeader = table.getByText('Email').first();
|
const emailHeader = table.getByText('Email').first();
|
||||||
@@ -839,7 +837,7 @@ test('test that sorting members by name, role, and status works', async ({ page,
|
|||||||
|
|
||||||
test('test that member sort state persists after page reload', async ({ page }) => {
|
test('test that member sort state persists after page reload', async ({ page }) => {
|
||||||
await goToMembersPage(page);
|
await goToMembersPage(page);
|
||||||
await clearTableState(page, 'member-table-state');
|
await clearMemberTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
const table = page.getByTestId('member_table');
|
const table = page.getByTestId('member_table');
|
||||||
@@ -877,7 +875,7 @@ test('test that sorting members by billable rate works', async ({ page, ctx }) =
|
|||||||
await updateMemberBillableRateViaApi(ctx, lowRateMember!.id, 5000);
|
await updateMemberBillableRateViaApi(ctx, lowRateMember!.id, 5000);
|
||||||
|
|
||||||
await goToMembersPage(page);
|
await goToMembersPage(page);
|
||||||
await clearTableState(page, 'member-table-state');
|
await clearMemberTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
const table = page.getByTestId('member_table');
|
const table = page.getByTestId('member_table');
|
||||||
|
|||||||
@@ -20,12 +20,6 @@ function profileInformationForm(page: Page) {
|
|||||||
.locator('xpath=ancestor::*[descendant::form][1]');
|
.locator('xpath=ancestor::*[descendant::form][1]');
|
||||||
}
|
}
|
||||||
|
|
||||||
function notificationSettingsForm(page: Page) {
|
|
||||||
return page
|
|
||||||
.getByRole('heading', { name: 'Notifications', exact: true })
|
|
||||||
.locator('xpath=ancestor::*[descendant::form][1]');
|
|
||||||
}
|
|
||||||
|
|
||||||
async function saveProfileForm(page: Page): Promise<void> {
|
async function saveProfileForm(page: Page): Promise<void> {
|
||||||
const form = profileInformationForm(page);
|
const form = profileInformationForm(page);
|
||||||
await form.getByRole('button', { name: 'Save' }).click();
|
await form.getByRole('button', { name: 'Save' }).click();
|
||||||
@@ -56,22 +50,6 @@ test('week-start change persists across reload', async ({ page }) => {
|
|||||||
await expect(page.getByLabel('Start of the week')).toHaveValue('sunday');
|
await expect(page.getByLabel('Start of the week')).toHaveValue('sunday');
|
||||||
});
|
});
|
||||||
|
|
||||||
test('still-running email notification setting persists across reload', async ({ page }) => {
|
|
||||||
await goToProfilePage(page);
|
|
||||||
const form = notificationSettingsForm(page);
|
|
||||||
const checkbox = form.getByLabel('Still-running time entry reminders');
|
|
||||||
|
|
||||||
await expect(checkbox).toBeChecked();
|
|
||||||
await checkbox.uncheck();
|
|
||||||
await form.getByRole('button', { name: 'Save' }).click();
|
|
||||||
await expect(form.getByText('Saved.', { exact: true })).toBeVisible();
|
|
||||||
|
|
||||||
await page.reload();
|
|
||||||
await expect(
|
|
||||||
notificationSettingsForm(page).getByLabel('Still-running time entry reminders')
|
|
||||||
).not.toBeChecked();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('profile photo can be uploaded, persists across reload, and can be removed', async ({
|
test('profile photo can be uploaded, persists across reload, and can be removed', async ({
|
||||||
page,
|
page,
|
||||||
}) => {
|
}) => {
|
||||||
|
|||||||
@@ -13,12 +13,18 @@ import {
|
|||||||
archiveProjectViaApi,
|
archiveProjectViaApi,
|
||||||
updateOrganizationSettingViaApi,
|
updateOrganizationSettingViaApi,
|
||||||
} from './utils/api';
|
} from './utils/api';
|
||||||
import { clearTableState, getSeededRowOrder } from './utils/table';
|
|
||||||
|
|
||||||
async function goToProjectsOverview(page: Page) {
|
async function goToProjectsOverview(page: Page) {
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/projects');
|
await page.goto(PLAYWRIGHT_BASE_URL + '/projects');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Helper to clear localStorage before tests that check persistence
|
||||||
|
async function clearProjectTableState(page: Page) {
|
||||||
|
await page.evaluate(() => {
|
||||||
|
localStorage.removeItem('project-table-state');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
// Create new project via modal
|
// Create new project via modal
|
||||||
test('test that creating and deleting a new project via the modal works', async ({ page }) => {
|
test('test that creating and deleting a new project via the modal works', async ({ page }) => {
|
||||||
const newProjectName = 'New Project ' + Math.floor(1 + Math.random() * 10000);
|
const newProjectName = 'New Project ' + Math.floor(1 + Math.random() * 10000);
|
||||||
@@ -78,7 +84,7 @@ test('test that archiving and unarchiving projects works', async ({ page, ctx })
|
|||||||
await createProjectViaApi(ctx, { name: newProjectName });
|
await createProjectViaApi(ctx, { name: newProjectName });
|
||||||
|
|
||||||
await goToProjectsOverview(page);
|
await goToProjectsOverview(page);
|
||||||
await clearTableState(page, 'project-table-state');
|
await clearProjectTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
await expect(page.getByText(newProjectName)).toBeVisible({ timeout: 10000 });
|
await expect(page.getByText(newProjectName)).toBeVisible({ timeout: 10000 });
|
||||||
|
|
||||||
@@ -474,7 +480,7 @@ test('test that sorting projects by all columns works', async ({ page, ctx }) =>
|
|||||||
});
|
});
|
||||||
|
|
||||||
await goToProjectsOverview(page);
|
await goToProjectsOverview(page);
|
||||||
await clearTableState(page, 'project-table-state');
|
await clearProjectTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
await expect(page.getByTestId('project_table')).toBeVisible();
|
await expect(page.getByTestId('project_table')).toBeVisible();
|
||||||
await expect(page.getByText('AAA Project')).toBeVisible();
|
await expect(page.getByText('AAA Project')).toBeVisible();
|
||||||
@@ -603,7 +609,7 @@ test('test that filtering projects by status works', async ({ page, ctx }) => {
|
|||||||
await createProjectViaApi(ctx, { name: newProjectName });
|
await createProjectViaApi(ctx, { name: newProjectName });
|
||||||
|
|
||||||
await goToProjectsOverview(page);
|
await goToProjectsOverview(page);
|
||||||
await clearTableState(page, 'project-table-state');
|
await clearProjectTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
await expect(page.getByText(newProjectName)).toBeVisible({ timeout: 10000 });
|
await expect(page.getByText(newProjectName)).toBeVisible({ timeout: 10000 });
|
||||||
|
|
||||||
@@ -634,7 +640,7 @@ test('test that filtering projects by status works', async ({ page, ctx }) => {
|
|||||||
|
|
||||||
test('test that filter state persists after page reload', async ({ page }) => {
|
test('test that filter state persists after page reload', async ({ page }) => {
|
||||||
await goToProjectsOverview(page);
|
await goToProjectsOverview(page);
|
||||||
await clearTableState(page, 'project-table-state');
|
await clearProjectTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
// Apply Active status filter
|
// Apply Active status filter
|
||||||
@@ -650,96 +656,9 @@ test('test that filter state persists after page reload', async ({ page }) => {
|
|||||||
await expect(page.getByTestId('status-filter-badge')).toBeVisible();
|
await expect(page.getByTestId('status-filter-badge')).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
test('test that projects without a client or estimate are ordered by name at the bottom', async ({
|
|
||||||
page,
|
|
||||||
ctx,
|
|
||||||
}) => {
|
|
||||||
// Seeded a second apart: created_at only has second precision and same-second rows
|
|
||||||
// fall back to a random UUID order. The spacing makes the API order of the clientless
|
|
||||||
// rows (created_at desc: ZZZ, AAA) deterministic and different from the alphabetical
|
|
||||||
// order the name tie-break should produce.
|
|
||||||
await createProjectViaApi(ctx, { name: 'AAA Tiebreak Project' });
|
|
||||||
await page.waitForTimeout(1100);
|
|
||||||
await createProjectViaApi(ctx, { name: 'ZZZ Tiebreak Project' });
|
|
||||||
|
|
||||||
const clientAardvark = await createClientViaApi(ctx, { name: 'Aardvark Co' });
|
|
||||||
const clientZulu = await createClientViaApi(ctx, { name: 'Zulu Co' });
|
|
||||||
const projectM = await createProjectViaApi(ctx, {
|
|
||||||
name: 'MMM Tiebreak Project',
|
|
||||||
client_id: clientAardvark.id,
|
|
||||||
estimated_time: 36000, // 10h, 1h tracked below = 10%
|
|
||||||
});
|
|
||||||
await createTimeEntryViaApi(ctx, { duration: '1h', projectId: projectM.id });
|
|
||||||
const projectN = await createProjectViaApi(ctx, {
|
|
||||||
name: 'NNN Tiebreak Project',
|
|
||||||
client_id: clientZulu.id,
|
|
||||||
estimated_time: 14400, // 4h, 2h tracked below = 50%
|
|
||||||
});
|
|
||||||
await createTimeEntryViaApi(ctx, { duration: '2h', projectId: projectN.id });
|
|
||||||
|
|
||||||
await goToProjectsOverview(page);
|
|
||||||
await clearTableState(page, 'project-table-state');
|
|
||||||
await page.reload();
|
|
||||||
|
|
||||||
const table = page.getByTestId('project_table');
|
|
||||||
await expect(table).toBeVisible();
|
|
||||||
|
|
||||||
const seeded = [
|
|
||||||
'AAA Tiebreak Project',
|
|
||||||
'MMM Tiebreak Project',
|
|
||||||
'NNN Tiebreak Project',
|
|
||||||
'ZZZ Tiebreak Project',
|
|
||||||
];
|
|
||||||
const getOrder = () => getSeededRowOrder(table, seeded);
|
|
||||||
|
|
||||||
// -- Client: empty rows last in both directions, alphabetical among themselves --
|
|
||||||
const clientHeader = table.locator('.select-none', { hasText: 'Client' }).first();
|
|
||||||
await clientHeader.click();
|
|
||||||
await expect
|
|
||||||
.poll(getOrder)
|
|
||||||
.toEqual([
|
|
||||||
'MMM Tiebreak Project',
|
|
||||||
'NNN Tiebreak Project',
|
|
||||||
'AAA Tiebreak Project',
|
|
||||||
'ZZZ Tiebreak Project',
|
|
||||||
]);
|
|
||||||
|
|
||||||
await clientHeader.click();
|
|
||||||
await expect
|
|
||||||
.poll(getOrder)
|
|
||||||
.toEqual([
|
|
||||||
'NNN Tiebreak Project',
|
|
||||||
'MMM Tiebreak Project',
|
|
||||||
'AAA Tiebreak Project',
|
|
||||||
'ZZZ Tiebreak Project',
|
|
||||||
]);
|
|
||||||
|
|
||||||
// -- Progress: same, and the first click sorts highest first --
|
|
||||||
const progressHeader = table.locator('.select-none', { hasText: 'Progress' }).first();
|
|
||||||
await progressHeader.click();
|
|
||||||
await expect
|
|
||||||
.poll(getOrder)
|
|
||||||
.toEqual([
|
|
||||||
'NNN Tiebreak Project',
|
|
||||||
'MMM Tiebreak Project',
|
|
||||||
'AAA Tiebreak Project',
|
|
||||||
'ZZZ Tiebreak Project',
|
|
||||||
]);
|
|
||||||
|
|
||||||
await progressHeader.click();
|
|
||||||
await expect
|
|
||||||
.poll(getOrder)
|
|
||||||
.toEqual([
|
|
||||||
'MMM Tiebreak Project',
|
|
||||||
'NNN Tiebreak Project',
|
|
||||||
'AAA Tiebreak Project',
|
|
||||||
'ZZZ Tiebreak Project',
|
|
||||||
]);
|
|
||||||
});
|
|
||||||
|
|
||||||
test('test that sort state persists after page reload', async ({ page }) => {
|
test('test that sort state persists after page reload', async ({ page }) => {
|
||||||
await goToProjectsOverview(page);
|
await goToProjectsOverview(page);
|
||||||
await clearTableState(page, 'project-table-state');
|
await clearProjectTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
// Click on Name header twice to sort descending
|
// Click on Name header twice to sort descending
|
||||||
@@ -1195,7 +1114,7 @@ test.describe('Projects Pagination', () => {
|
|||||||
);
|
);
|
||||||
|
|
||||||
await goToProjectsOverview(page);
|
await goToProjectsOverview(page);
|
||||||
await clearTableState(page, 'project-table-state');
|
await clearProjectTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
// Default sort is name asc; first 15 projects (00–14) should be on page 1.
|
// Default sort is name asc; first 15 projects (00–14) should be on page 1.
|
||||||
@@ -1249,7 +1168,7 @@ test.describe('Projects Pagination', () => {
|
|||||||
);
|
);
|
||||||
|
|
||||||
await goToProjectsOverview(page);
|
await goToProjectsOverview(page);
|
||||||
await clearTableState(page, 'project-table-state');
|
await clearProjectTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
await expect(page.getByTestId('project_table')).toBeVisible();
|
await expect(page.getByTestId('project_table')).toBeVisible();
|
||||||
@@ -1266,7 +1185,7 @@ test.describe('Projects Pagination', () => {
|
|||||||
);
|
);
|
||||||
|
|
||||||
await goToProjectsOverview(page);
|
await goToProjectsOverview(page);
|
||||||
await clearTableState(page, 'project-table-state');
|
await clearProjectTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });
|
await expect(page.getByText(prefix + '00')).toBeVisible({ timeout: 10000 });
|
||||||
@@ -1288,36 +1207,3 @@ test.describe('Projects Pagination', () => {
|
|||||||
await expect(page.getByText(prefix + '00')).not.toBeVisible();
|
await expect(page.getByText(prefix + '00')).not.toBeVisible();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test('test that searching projects by name works', async ({ page, ctx }) => {
|
|
||||||
const suffix = Math.floor(1 + Math.random() * 10000);
|
|
||||||
const matchingProjectName = 'Searchable Project ' + suffix;
|
|
||||||
const otherProjectName = 'Unrelated Work ' + suffix;
|
|
||||||
await createProjectViaApi(ctx, { name: matchingProjectName });
|
|
||||||
await createProjectViaApi(ctx, { name: otherProjectName });
|
|
||||||
|
|
||||||
await goToProjectsOverview(page);
|
|
||||||
await clearTableState(page, 'project-table-state');
|
|
||||||
await page.reload();
|
|
||||||
await expect(page.getByText(matchingProjectName)).toBeVisible({ timeout: 10000 });
|
|
||||||
await expect(page.getByText(otherProjectName)).toBeVisible();
|
|
||||||
|
|
||||||
const searchInput = page.getByRole('searchbox', { name: 'Search projects' });
|
|
||||||
|
|
||||||
// Searching is case insensitive and matches part of the name
|
|
||||||
await searchInput.fill('SEARCHABLE');
|
|
||||||
await expect(page.getByText(matchingProjectName)).toBeVisible();
|
|
||||||
await expect(page.getByText(otherProjectName)).not.toBeVisible();
|
|
||||||
|
|
||||||
// A term that matches nothing empties the table
|
|
||||||
await searchInput.fill('no project has this name');
|
|
||||||
await expect(page.getByText(matchingProjectName)).not.toBeVisible();
|
|
||||||
await expect(page.getByText(otherProjectName)).not.toBeVisible();
|
|
||||||
await expect(page.getByText('No matching projects')).toBeVisible();
|
|
||||||
await expect(page.getByRole('button', { name: 'Create your First Project' })).not.toBeVisible();
|
|
||||||
|
|
||||||
// Clearing the search restores both projects
|
|
||||||
await searchInput.fill('');
|
|
||||||
await expect(page.getByText(matchingProjectName)).toBeVisible();
|
|
||||||
await expect(page.getByText(otherProjectName)).toBeVisible();
|
|
||||||
});
|
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import type { Page } from '@playwright/test';
|
|||||||
import { PLAYWRIGHT_BASE_URL } from '../playwright/config';
|
import { PLAYWRIGHT_BASE_URL } from '../playwright/config';
|
||||||
import { test } from '../playwright/fixtures';
|
import { test } from '../playwright/fixtures';
|
||||||
import { createTagViaApi } from './utils/api';
|
import { createTagViaApi } from './utils/api';
|
||||||
import { clearTableState, getTableRowNames } from './utils/table';
|
import { getTableRowNames } from './utils/table';
|
||||||
|
|
||||||
async function goToTagsOverview(page: Page) {
|
async function goToTagsOverview(page: Page) {
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/tags');
|
await page.goto(PLAYWRIGHT_BASE_URL + '/tags');
|
||||||
@@ -147,12 +147,18 @@ test('test that tag context menu delete deletes the tag', async ({ page, ctx })
|
|||||||
// Sorting Tests
|
// Sorting Tests
|
||||||
// =============================================
|
// =============================================
|
||||||
|
|
||||||
|
async function clearTagTableState(page: Page) {
|
||||||
|
await page.evaluate(() => {
|
||||||
|
localStorage.removeItem('tag-table-state');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
test('test that sorting tags by name works', async ({ page, ctx }) => {
|
test('test that sorting tags by name works', async ({ page, ctx }) => {
|
||||||
await createTagViaApi(ctx, { name: 'AAA SortTag' });
|
await createTagViaApi(ctx, { name: 'AAA SortTag' });
|
||||||
await createTagViaApi(ctx, { name: 'ZZZ SortTag' });
|
await createTagViaApi(ctx, { name: 'ZZZ SortTag' });
|
||||||
|
|
||||||
await goToTagsOverview(page);
|
await goToTagsOverview(page);
|
||||||
await clearTableState(page, 'tag-table-state');
|
await clearTagTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
const table = page.getByTestId('tag_table');
|
const table = page.getByTestId('tag_table');
|
||||||
@@ -170,7 +176,7 @@ test('test that sorting tags by name works', async ({ page, ctx }) => {
|
|||||||
|
|
||||||
test('test that tag sort state persists after page reload', async ({ page }) => {
|
test('test that tag sort state persists after page reload', async ({ page }) => {
|
||||||
await goToTagsOverview(page);
|
await goToTagsOverview(page);
|
||||||
await clearTableState(page, 'tag-table-state');
|
await clearTagTableState(page);
|
||||||
await page.reload();
|
await page.reload();
|
||||||
|
|
||||||
const table = page.getByTestId('tag_table');
|
const table = page.getByTestId('tag_table');
|
||||||
|
|||||||
@@ -7,56 +7,13 @@ import {
|
|||||||
createPublicProjectViaApi,
|
createPublicProjectViaApi,
|
||||||
createTaskViaApi,
|
createTaskViaApi,
|
||||||
createClientViaApi,
|
createClientViaApi,
|
||||||
createTimeEntryViaApi,
|
|
||||||
updateOrganizationSettingViaApi,
|
updateOrganizationSettingViaApi,
|
||||||
type TestContext,
|
|
||||||
} from './utils/api';
|
} from './utils/api';
|
||||||
import { clearTableState, getTableRowNames } from './utils/table';
|
|
||||||
|
|
||||||
async function goToProjectsOverview(page: Page) {
|
async function goToProjectsOverview(page: Page) {
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/projects');
|
await page.goto(PLAYWRIGHT_BASE_URL + '/projects');
|
||||||
}
|
}
|
||||||
|
|
||||||
async function createSortableTasks(ctx: TestContext) {
|
|
||||||
const project = await createProjectViaApi(ctx, { name: 'Task Sorting Project' });
|
|
||||||
const taskA = await createTaskViaApi(ctx, {
|
|
||||||
name: 'AAA Sorting Task',
|
|
||||||
project_id: project.id,
|
|
||||||
estimated_time: 36000,
|
|
||||||
});
|
|
||||||
const taskB = await createTaskViaApi(ctx, {
|
|
||||||
name: 'BBB Sorting Task',
|
|
||||||
project_id: project.id,
|
|
||||||
estimated_time: 14400,
|
|
||||||
});
|
|
||||||
const taskC = await createTaskViaApi(ctx, {
|
|
||||||
name: 'CCC Sorting Task',
|
|
||||||
project_id: project.id,
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(taskA.estimated_time).toBe(36000);
|
|
||||||
expect(taskB.estimated_time).toBe(14400);
|
|
||||||
expect(taskC.estimated_time).toBeNull();
|
|
||||||
|
|
||||||
await createTimeEntryViaApi(ctx, {
|
|
||||||
duration: '1h',
|
|
||||||
projectId: project.id,
|
|
||||||
taskId: taskA.id,
|
|
||||||
});
|
|
||||||
await createTimeEntryViaApi(ctx, {
|
|
||||||
duration: '2h',
|
|
||||||
projectId: project.id,
|
|
||||||
taskId: taskB.id,
|
|
||||||
});
|
|
||||||
await createTimeEntryViaApi(ctx, {
|
|
||||||
duration: '3h',
|
|
||||||
projectId: project.id,
|
|
||||||
taskId: taskC.id,
|
|
||||||
});
|
|
||||||
|
|
||||||
return { project, taskA, taskB, taskC };
|
|
||||||
}
|
|
||||||
|
|
||||||
test('test that creating and deleting a new task in a new project works', async ({ page }) => {
|
test('test that creating and deleting a new task in a new project works', async ({ page }) => {
|
||||||
const newProjectName = 'New Project ' + Math.floor(1 + Math.random() * 10000);
|
const newProjectName = 'New Project ' + Math.floor(1 + Math.random() * 10000);
|
||||||
await goToProjectsOverview(page);
|
await goToProjectsOverview(page);
|
||||||
@@ -344,59 +301,6 @@ test('test that creating a new project from the task create modal project dropdo
|
|||||||
await expect(page.getByTestId('task_table')).toContainText(newTaskName);
|
await expect(page.getByTestId('task_table')).toContainText(newTaskName);
|
||||||
});
|
});
|
||||||
|
|
||||||
// =============================================
|
|
||||||
// Sorting Tests
|
|
||||||
// =============================================
|
|
||||||
|
|
||||||
test('test that sorting tasks by name, total time and progress works', async ({ page, ctx }) => {
|
|
||||||
const { project, taskA, taskB, taskC } = await createSortableTasks(ctx);
|
|
||||||
await goToProjectsOverview(page);
|
|
||||||
await clearTableState(page, 'task-table-state');
|
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/projects/' + project.id);
|
|
||||||
const table = page.getByTestId('task_table');
|
|
||||||
await expect(table).toBeVisible();
|
|
||||||
|
|
||||||
// This project contains only the seeded tasks, so assert the complete order.
|
|
||||||
const expectOrder = async (expected: string[]) => {
|
|
||||||
await expect.poll(() => getTableRowNames(table)).toEqual(expected);
|
|
||||||
};
|
|
||||||
const clickHeader = async (headerText: string) => {
|
|
||||||
await table.getByText(headerText).first().click();
|
|
||||||
};
|
|
||||||
|
|
||||||
await expectOrder([taskA.name, taskB.name, taskC.name]);
|
|
||||||
await clickHeader('Task Name');
|
|
||||||
await expectOrder([taskC.name, taskB.name, taskA.name]);
|
|
||||||
await clickHeader('Task Name');
|
|
||||||
await expectOrder([taskA.name, taskB.name, taskC.name]);
|
|
||||||
|
|
||||||
await clickHeader('Total Time');
|
|
||||||
await expectOrder([taskC.name, taskB.name, taskA.name]);
|
|
||||||
await clickHeader('Total Time');
|
|
||||||
await expectOrder([taskA.name, taskB.name, taskC.name]);
|
|
||||||
|
|
||||||
await clickHeader('Progress');
|
|
||||||
await expectOrder([taskB.name, taskA.name, taskC.name]);
|
|
||||||
await clickHeader('Progress');
|
|
||||||
await expectOrder([taskA.name, taskB.name, taskC.name]);
|
|
||||||
});
|
|
||||||
|
|
||||||
test('test that task sort state persists after page reload', async ({ page, ctx }) => {
|
|
||||||
const { project, taskA, taskB, taskC } = await createSortableTasks(ctx);
|
|
||||||
await goToProjectsOverview(page);
|
|
||||||
await clearTableState(page, 'task-table-state');
|
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/projects/' + project.id);
|
|
||||||
const table = page.getByTestId('task_table');
|
|
||||||
await expect(table).toBeVisible();
|
|
||||||
|
|
||||||
await table.getByText('Progress').first().click();
|
|
||||||
await expect.poll(() => getTableRowNames(table)).toEqual([taskB.name, taskA.name, taskC.name]);
|
|
||||||
await page.reload();
|
|
||||||
|
|
||||||
// Verify the persisted row order, not just the sort indicator.
|
|
||||||
await expect.poll(() => getTableRowNames(table)).toEqual([taskB.name, taskA.name, taskC.name]);
|
|
||||||
});
|
|
||||||
|
|
||||||
// =============================================
|
// =============================================
|
||||||
// Employee Permission Tests
|
// Employee Permission Tests
|
||||||
// =============================================
|
// =============================================
|
||||||
|
|||||||
@@ -1,89 +0,0 @@
|
|||||||
import { test, expect } from '../playwright/fixtures';
|
|
||||||
import { PLAYWRIGHT_BASE_URL } from '../playwright/config';
|
|
||||||
import type { Page, TestContext } from '../playwright/fixtures';
|
|
||||||
import { getCurrentUserViaApi, updateUserProfileViaApi } from './utils/api';
|
|
||||||
|
|
||||||
const BROWSER_TIMEZONE = 'Europe/Vienna';
|
|
||||||
const MISMATCHED_TIMEZONE = 'America/New_York';
|
|
||||||
|
|
||||||
test.use({ timezoneId: BROWSER_TIMEZONE });
|
|
||||||
|
|
||||||
function mismatchModal(page: Page) {
|
|
||||||
return page.getByRole('dialog').filter({ hasText: 'Timezone mismatch detected' });
|
|
||||||
}
|
|
||||||
|
|
||||||
async function openPageWithTimezoneMismatch(page: Page, ctx: TestContext) {
|
|
||||||
await updateUserProfileViaApi(ctx, { timezone: MISMATCHED_TIMEZONE });
|
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
|
|
||||||
await expect(mismatchModal(page)).toBeVisible();
|
|
||||||
}
|
|
||||||
|
|
||||||
test('timezone mismatch modal saves the device timezone through the users API', async ({
|
|
||||||
page,
|
|
||||||
ctx,
|
|
||||||
}) => {
|
|
||||||
await openPageWithTimezoneMismatch(page, ctx);
|
|
||||||
|
|
||||||
await Promise.all([
|
|
||||||
page.waitForResponse(
|
|
||||||
(response) =>
|
|
||||||
response.url().includes('/api/v1/users/') &&
|
|
||||||
response.request().method() === 'PUT' &&
|
|
||||||
response.status() === 200
|
|
||||||
),
|
|
||||||
mismatchModal(page).getByRole('button', { name: 'Update timezone' }).click(),
|
|
||||||
]);
|
|
||||||
await expect(mismatchModal(page)).toBeHidden();
|
|
||||||
|
|
||||||
const user = await getCurrentUserViaApi(ctx);
|
|
||||||
expect(user.timezone).toBe(BROWSER_TIMEZONE);
|
|
||||||
|
|
||||||
// After the automatic reload the timezones match again, so the modal stays gone.
|
|
||||||
await page.waitForLoadState('load');
|
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
|
|
||||||
await expect(mismatchModal(page)).toBeHidden();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('timezone mismatch modal does not open for a different timezone with the same time', async ({
|
|
||||||
page,
|
|
||||||
ctx,
|
|
||||||
}) => {
|
|
||||||
// Berlin and Vienna share the same offset and DST rules, so the times match.
|
|
||||||
await updateUserProfileViaApi(ctx, { timezone: 'Europe/Berlin' });
|
|
||||||
await page.goto(PLAYWRIGHT_BASE_URL + '/dashboard');
|
|
||||||
|
|
||||||
// Wait until the dashboard is rendered so the modal had its chance to mount.
|
|
||||||
await expect(page.getByTestId('dashboard_view')).toBeVisible();
|
|
||||||
await expect(mismatchModal(page)).toBeHidden();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('timezone mismatch modal stays open when the update fails', async ({ page, ctx }) => {
|
|
||||||
await openPageWithTimezoneMismatch(page, ctx);
|
|
||||||
|
|
||||||
await page.route('**/api/v1/users/*', (route) => {
|
|
||||||
if (route.request().method() === 'PUT') {
|
|
||||||
return route.fulfill({
|
|
||||||
status: 500,
|
|
||||||
contentType: 'application/json',
|
|
||||||
body: JSON.stringify({ message: 'Server error' }),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
return route.fallback();
|
|
||||||
});
|
|
||||||
|
|
||||||
await Promise.all([
|
|
||||||
page.waitForResponse(
|
|
||||||
(response) =>
|
|
||||||
response.url().includes('/api/v1/users/') &&
|
|
||||||
response.request().method() === 'PUT' &&
|
|
||||||
response.status() === 500
|
|
||||||
),
|
|
||||||
mismatchModal(page).getByRole('button', { name: 'Update timezone' }).click(),
|
|
||||||
]);
|
|
||||||
|
|
||||||
await expect(mismatchModal(page)).toBeVisible();
|
|
||||||
await expect(page.getByText('Failed to update profile')).toBeVisible();
|
|
||||||
|
|
||||||
const user = await getCurrentUserViaApi(ctx);
|
|
||||||
expect(user.timezone).toBe(MISMATCHED_TIMEZONE);
|
|
||||||
});
|
|
||||||
@@ -357,7 +357,7 @@ export async function createProjectWithClientViaApi(
|
|||||||
|
|
||||||
export async function createTaskViaApi(
|
export async function createTaskViaApi(
|
||||||
ctx: TestContext,
|
ctx: TestContext,
|
||||||
data: { name: string; project_id: string; estimated_time?: number }
|
data: { name: string; project_id: string }
|
||||||
) {
|
) {
|
||||||
const response = await ctx.request.post(
|
const response = await ctx.request.post(
|
||||||
`${PLAYWRIGHT_BASE_URL}/api/v1/organizations/${ctx.orgId}/tasks`,
|
`${PLAYWRIGHT_BASE_URL}/api/v1/organizations/${ctx.orgId}/tasks`,
|
||||||
@@ -365,20 +365,12 @@ export async function createTaskViaApi(
|
|||||||
data: {
|
data: {
|
||||||
name: data.name,
|
name: data.name,
|
||||||
project_id: data.project_id,
|
project_id: data.project_id,
|
||||||
...(data.estimated_time !== undefined
|
|
||||||
? { estimated_time: data.estimated_time }
|
|
||||||
: {}),
|
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
expect(response.status()).toBe(201);
|
expect(response.status()).toBe(201);
|
||||||
const body = await response.json();
|
const body = await response.json();
|
||||||
return body.data as {
|
return body.data as { id: string; name: string; project_id: string };
|
||||||
id: string;
|
|
||||||
name: string;
|
|
||||||
project_id: string;
|
|
||||||
estimated_time: number | null;
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function markTaskDoneViaApi(ctx: TestContext, task: { id: string; name: string }) {
|
export async function markTaskDoneViaApi(ctx: TestContext, task: { id: string; name: string }) {
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import type { Locator, Page } from '@playwright/test';
|
import type { Locator } from '@playwright/test';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Extract the first cell's text content from each row in a table.
|
* Extract the first cell's text content from each row in a table.
|
||||||
@@ -14,22 +14,3 @@ export async function getTableRowNames(table: Locator): Promise<string[]> {
|
|||||||
}
|
}
|
||||||
return names;
|
return names;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* The visual order of the given seeded names within the table, ignoring any other rows.
|
|
||||||
*/
|
|
||||||
export async function getSeededRowOrder(table: Locator, seeded: string[]): Promise<string[]> {
|
|
||||||
const rowNames = await getTableRowNames(table);
|
|
||||||
return rowNames
|
|
||||||
.map((rowName) => seeded.find((name) => rowName.includes(name)))
|
|
||||||
.filter((name): name is string => Boolean(name));
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Drop a table's persisted sort/filter state so a test starts from the defaults.
|
|
||||||
*/
|
|
||||||
export async function clearTableState(page: Page, key: string) {
|
|
||||||
await page.evaluate((storageKey) => {
|
|
||||||
localStorage.removeItem(storageKey);
|
|
||||||
}, key);
|
|
||||||
}
|
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"Billing": {
|
"Billing": {
|
||||||
"repository": "solidtime-io/extension-billing",
|
"repository": "solidtime-io/extension-billing",
|
||||||
"ref": "v0.0.6"
|
"ref": "v0.0.5"
|
||||||
},
|
},
|
||||||
"Services": {
|
"Services": {
|
||||||
"repository": "solidtime-io/extension-services",
|
"repository": "solidtime-io/extension-services",
|
||||||
@@ -9,6 +9,6 @@
|
|||||||
},
|
},
|
||||||
"Invoicing": {
|
"Invoicing": {
|
||||||
"repository": "solidtime-io/extension-invoicing",
|
"repository": "solidtime-io/extension-invoicing",
|
||||||
"ref": "v0.0.6"
|
"ref": "v0.0.2"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
2197
package-lock.json
generated
2197
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -57,7 +57,7 @@
|
|||||||
"@floating-ui/core": "^1.7.5",
|
"@floating-ui/core": "^1.7.5",
|
||||||
"@floating-ui/vue": "^1.1.11",
|
"@floating-ui/vue": "^1.1.11",
|
||||||
"@heroicons/vue": "^2.2.0",
|
"@heroicons/vue": "^2.2.0",
|
||||||
"@lucide/vue": "^1.28.0",
|
"@lucide/vue": "^1.14.0",
|
||||||
"@rushstack/eslint-patch": "^1.16.1",
|
"@rushstack/eslint-patch": "^1.16.1",
|
||||||
"@tailwindcss/container-queries": "^0.1.1",
|
"@tailwindcss/container-queries": "^0.1.1",
|
||||||
"@tanstack/vue-form": "^1.32.0",
|
"@tanstack/vue-form": "^1.32.0",
|
||||||
@@ -67,7 +67,7 @@
|
|||||||
"@tanstack/vue-virtual": "^3.13.24",
|
"@tanstack/vue-virtual": "^3.13.24",
|
||||||
"@vue/eslint-config-prettier": "^10.2.0",
|
"@vue/eslint-config-prettier": "^10.2.0",
|
||||||
"@vue/eslint-config-typescript": "^14.7.0",
|
"@vue/eslint-config-typescript": "^14.7.0",
|
||||||
"@vueuse/core": "^14.4.0",
|
"@vueuse/core": "^14.3.0",
|
||||||
"@vueuse/integrations": "^14.3.0",
|
"@vueuse/integrations": "^14.3.0",
|
||||||
"@zodios/core": "^10.9.6",
|
"@zodios/core": "^10.9.6",
|
||||||
"chroma-js": "^3.2.0",
|
"chroma-js": "^3.2.0",
|
||||||
@@ -79,7 +79,7 @@
|
|||||||
"parse-duration": "^2.1.6",
|
"parse-duration": "^2.1.6",
|
||||||
"pinia": "^3.0.4",
|
"pinia": "^3.0.4",
|
||||||
"radix-vue": "^1.9.17",
|
"radix-vue": "^1.9.17",
|
||||||
"reka-ui": "^2.10.1",
|
"reka-ui": "^2.9.7",
|
||||||
"tailwind-merge": "^2.6.1",
|
"tailwind-merge": "^2.6.1",
|
||||||
"tailwindcss-animate": "^1.0.7",
|
"tailwindcss-animate": "^1.0.7",
|
||||||
"vue-draggable-plus": "^0.6.1",
|
"vue-draggable-plus": "^0.6.1",
|
||||||
|
|||||||
@@ -7,17 +7,18 @@ import { type Client } from '@/packages/api/src';
|
|||||||
import ClientTableRow from '@/Components/Common/Client/ClientTableRow.vue';
|
import ClientTableRow from '@/Components/Common/Client/ClientTableRow.vue';
|
||||||
import ClientCreateModal from '@/Components/Common/Client/ClientCreateModal.vue';
|
import ClientCreateModal from '@/Components/Common/Client/ClientCreateModal.vue';
|
||||||
import ClientTableHeading from '@/Components/Common/Client/ClientTableHeading.vue';
|
import ClientTableHeading from '@/Components/Common/Client/ClientTableHeading.vue';
|
||||||
import Pagination from '@/packages/ui/src/Pagination.vue';
|
import Pagination from '@/Components/Common/Pagination.vue';
|
||||||
import { canCreateClients } from '@/utils/permissions';
|
import { canCreateClients } from '@/utils/permissions';
|
||||||
import { useProjectsQuery } from '@/utils/useProjectsQuery';
|
import { useProjectsQuery } from '@/utils/useProjectsQuery';
|
||||||
import {
|
import {
|
||||||
useSortableTable,
|
useVueTable,
|
||||||
type SortableColumnDef,
|
getCoreRowModel,
|
||||||
type SortDirection,
|
getSortedRowModel,
|
||||||
} from '@/utils/useSortableTable';
|
type SortingState,
|
||||||
|
} from '@tanstack/vue-table';
|
||||||
|
|
||||||
export type SortColumn = 'name' | 'projects_count' | 'status';
|
export type SortColumn = 'name' | 'projects_count' | 'status';
|
||||||
export type { SortDirection } from '@/utils/useSortableTable';
|
export type SortDirection = 'asc' | 'desc';
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
clients: Client[];
|
clients: Client[];
|
||||||
@@ -43,7 +44,17 @@ const projectCountMap = computed(() => {
|
|||||||
return map;
|
return map;
|
||||||
});
|
});
|
||||||
|
|
||||||
const columns = computed<SortableColumnDef<Client, SortColumn>[]>(() => [
|
// Name is always the secondary sort so rows with equal values render
|
||||||
|
// alphabetically instead of in API (created_at) order.
|
||||||
|
const sorting = computed<SortingState>(() => [
|
||||||
|
{
|
||||||
|
id: props.sortColumn,
|
||||||
|
desc: props.sortDirection === 'desc',
|
||||||
|
},
|
||||||
|
...(props.sortColumn !== 'name' ? [{ id: 'name', desc: false }] : []),
|
||||||
|
]);
|
||||||
|
|
||||||
|
const columns = computed(() => [
|
||||||
{
|
{
|
||||||
id: 'name',
|
id: 'name',
|
||||||
accessorFn: (row: Client) => row.name.toLowerCase(),
|
accessorFn: (row: Client) => row.name.toLowerCase(),
|
||||||
@@ -59,22 +70,41 @@ const columns = computed<SortableColumnDef<Client, SortColumn>[]>(() => [
|
|||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const {
|
const descFirstColumns = new Set<SortColumn>(
|
||||||
sortedRows: sortedClients,
|
columns.value
|
||||||
descFirstColumns,
|
.filter((c) => 'sortDescFirst' in c && c.sortDescFirst)
|
||||||
nextDirection,
|
.map((c) => c.id as SortColumn)
|
||||||
} = useSortableTable({
|
);
|
||||||
data: () => props.clients,
|
|
||||||
columns: () => columns.value,
|
|
||||||
sortColumn: () => props.sortColumn,
|
|
||||||
sortDirection: () => props.sortDirection,
|
|
||||||
tieBreakColumn: 'name',
|
|
||||||
});
|
|
||||||
|
|
||||||
function handleSort(column: SortColumn) {
|
function handleSort(column: SortColumn) {
|
||||||
emit('sort', column, nextDirection(column));
|
if (props.sortColumn === column) {
|
||||||
|
emit('sort', column, props.sortDirection === 'asc' ? 'desc' : 'asc');
|
||||||
|
} else {
|
||||||
|
emit('sort', column, descFirstColumns.has(column) ? 'desc' : 'asc');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const table = useVueTable({
|
||||||
|
get data() {
|
||||||
|
return props.clients;
|
||||||
|
},
|
||||||
|
get columns() {
|
||||||
|
return columns.value;
|
||||||
|
},
|
||||||
|
getCoreRowModel: getCoreRowModel(),
|
||||||
|
getSortedRowModel: getSortedRowModel(),
|
||||||
|
state: {
|
||||||
|
get sorting() {
|
||||||
|
return sorting.value;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
manualSorting: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const sortedClients = computed(() => {
|
||||||
|
return table.getRowModel().rows.map((row) => row.original);
|
||||||
|
});
|
||||||
|
|
||||||
// Client-side pagination: the full list is in memory, only one page is mounted at a time.
|
// Client-side pagination: the full list is in memory, only one page is mounted at a time.
|
||||||
const PAGE_SIZE = 15;
|
const PAGE_SIZE = 15;
|
||||||
const currentPage = ref(1);
|
const currentPage = ref(1);
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import TableHeading from '@/Components/Common/TableHeading.vue';
|
import TableHeading from '@/Components/Common/TableHeading.vue';
|
||||||
import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
|
import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
|
||||||
import type { SortColumn, SortDirection } from '@/Components/Common/Client/ClientTable.vue';
|
import type { SortColumn, SortDirection } from '@/Components/Common/Client/ClientTable.vue';
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
@@ -9,29 +9,57 @@ const props = defineProps<{
|
|||||||
descFirstColumns: ReadonlySet<SortColumn>;
|
descFirstColumns: ReadonlySet<SortColumn>;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
defineEmits<{
|
const emit = defineEmits<{
|
||||||
sort: [column: SortColumn];
|
sort: [column: SortColumn];
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
|
function handleSort(column: SortColumn) {
|
||||||
|
emit('sort', column);
|
||||||
|
}
|
||||||
|
|
||||||
|
function isSorted(column: SortColumn): boolean {
|
||||||
|
return props.sortColumn === column;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isChevronDown(column: SortColumn): boolean {
|
||||||
|
if (!isSorted(column)) return false;
|
||||||
|
return props.descFirstColumns.has(column)
|
||||||
|
? props.sortDirection === 'desc'
|
||||||
|
: props.sortDirection === 'asc';
|
||||||
|
}
|
||||||
|
|
||||||
|
function isChevronUp(column: SortColumn): boolean {
|
||||||
|
if (!isSorted(column)) return false;
|
||||||
|
return !isChevronDown(column);
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TableHeading>
|
<TableHeading>
|
||||||
<SortableTableHeaderCell
|
<div
|
||||||
class="pr-3 pl-4 sm:pl-6 lg:pl-8 3xl:pl-12"
|
class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12 cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
column="name"
|
@click="handleSort('name')">
|
||||||
v-bind="props"
|
|
||||||
@sort="$emit('sort', $event)">
|
|
||||||
Name
|
Name
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('name')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell
|
<ChevronUpIcon v-else-if="isChevronUp('name')" class="w-4 h-4" />
|
||||||
column="projects_count"
|
<span v-else class="w-4 h-4"></span>
|
||||||
v-bind="props"
|
</div>
|
||||||
@sort="$emit('sort', $event)">
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('projects_count')">
|
||||||
Projects
|
Projects
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('projects_count')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell column="status" v-bind="props" @sort="$emit('sort', $event)">
|
<ChevronUpIcon v-else-if="isChevronUp('projects_count')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('status')">
|
||||||
Status
|
Status
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('status')" class="w-4 h-4" />
|
||||||
|
<ChevronUpIcon v-else-if="isChevronUp('status')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
<div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
|
<div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
|
||||||
<span class="sr-only">Edit</span>
|
<span class="sr-only">Edit</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -3,14 +3,16 @@ import MemberTableHeading from '@/Components/Common/Member/MemberTableHeading.vu
|
|||||||
import MemberTableRow from '@/Components/Common/Member/MemberTableRow.vue';
|
import MemberTableRow from '@/Components/Common/Member/MemberTableRow.vue';
|
||||||
import { useMembersQuery } from '@/utils/useMembersQuery';
|
import { useMembersQuery } from '@/utils/useMembersQuery';
|
||||||
import type { Member } from '@/packages/api/src';
|
import type { Member } from '@/packages/api/src';
|
||||||
|
import { computed } from 'vue';
|
||||||
import {
|
import {
|
||||||
useSortableTable,
|
useVueTable,
|
||||||
type SortableColumnDef,
|
getCoreRowModel,
|
||||||
type SortDirection,
|
getSortedRowModel,
|
||||||
} from '@/utils/useSortableTable';
|
type SortingState,
|
||||||
|
} from '@tanstack/vue-table';
|
||||||
|
|
||||||
export type SortColumn = 'name' | 'email' | 'role' | 'billable_rate' | 'status';
|
export type SortColumn = 'name' | 'email' | 'role' | 'billable_rate' | 'status';
|
||||||
export type { SortDirection } from '@/utils/useSortableTable';
|
export type SortDirection = 'asc' | 'desc';
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
sortColumn: SortColumn;
|
sortColumn: SortColumn;
|
||||||
@@ -31,7 +33,14 @@ const roleOrder: Record<string, number> = {
|
|||||||
placeholder: 4,
|
placeholder: 4,
|
||||||
};
|
};
|
||||||
|
|
||||||
const columns: SortableColumnDef<Member, SortColumn>[] = [
|
const sorting = computed<SortingState>(() => [
|
||||||
|
{
|
||||||
|
id: props.sortColumn,
|
||||||
|
desc: props.sortDirection === 'desc',
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
|
const columns = [
|
||||||
{
|
{
|
||||||
id: 'name',
|
id: 'name',
|
||||||
accessorFn: (row: Member) => row.name.toLowerCase(),
|
accessorFn: (row: Member) => row.name.toLowerCase(),
|
||||||
@@ -47,6 +56,7 @@ const columns: SortableColumnDef<Member, SortColumn>[] = [
|
|||||||
{
|
{
|
||||||
id: 'billable_rate',
|
id: 'billable_rate',
|
||||||
sortDescFirst: true,
|
sortDescFirst: true,
|
||||||
|
sortUndefined: 'last' as const,
|
||||||
accessorFn: (row: Member) => {
|
accessorFn: (row: Member) => {
|
||||||
if (row.billable_rate === null) return undefined;
|
if (row.billable_rate === null) return undefined;
|
||||||
return row.billable_rate;
|
return row.billable_rate;
|
||||||
@@ -58,21 +68,36 @@ const columns: SortableColumnDef<Member, SortColumn>[] = [
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
const {
|
const descFirstColumns = new Set<SortColumn>(
|
||||||
sortedRows: sortedMembers,
|
columns.filter((c) => c.sortDescFirst).map((c) => c.id as SortColumn)
|
||||||
descFirstColumns,
|
);
|
||||||
nextDirection,
|
|
||||||
} = useSortableTable({
|
|
||||||
data: () => members.value,
|
|
||||||
columns: () => columns,
|
|
||||||
sortColumn: () => props.sortColumn,
|
|
||||||
sortDirection: () => props.sortDirection,
|
|
||||||
tieBreakColumn: 'name',
|
|
||||||
});
|
|
||||||
|
|
||||||
function handleSort(column: SortColumn) {
|
function handleSort(column: SortColumn) {
|
||||||
emit('sort', column, nextDirection(column));
|
if (props.sortColumn === column) {
|
||||||
|
emit('sort', column, props.sortDirection === 'asc' ? 'desc' : 'asc');
|
||||||
|
} else {
|
||||||
|
emit('sort', column, descFirstColumns.has(column) ? 'desc' : 'asc');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const table = useVueTable({
|
||||||
|
get data() {
|
||||||
|
return members.value;
|
||||||
|
},
|
||||||
|
columns,
|
||||||
|
getCoreRowModel: getCoreRowModel(),
|
||||||
|
getSortedRowModel: getSortedRowModel(),
|
||||||
|
state: {
|
||||||
|
get sorting() {
|
||||||
|
return sorting.value;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
manualSorting: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const sortedMembers = computed(() => {
|
||||||
|
return table.getRowModel().rows.map((row) => row.original);
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import TableHeading from '@/Components/Common/TableHeading.vue';
|
import TableHeading from '@/Components/Common/TableHeading.vue';
|
||||||
import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
|
import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
|
||||||
import type { SortColumn, SortDirection } from '@/Components/Common/Member/MemberTable.vue';
|
import type { SortColumn, SortDirection } from '@/Components/Common/Member/MemberTable.vue';
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
@@ -9,35 +9,73 @@ const props = defineProps<{
|
|||||||
descFirstColumns: ReadonlySet<SortColumn>;
|
descFirstColumns: ReadonlySet<SortColumn>;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
defineEmits<{
|
const emit = defineEmits<{
|
||||||
sort: [column: SortColumn];
|
sort: [column: SortColumn];
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
|
function handleSort(column: SortColumn) {
|
||||||
|
emit('sort', column);
|
||||||
|
}
|
||||||
|
|
||||||
|
function isSorted(column: SortColumn): boolean {
|
||||||
|
return props.sortColumn === column;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isChevronDown(column: SortColumn): boolean {
|
||||||
|
if (!isSorted(column)) return false;
|
||||||
|
return props.descFirstColumns.has(column)
|
||||||
|
? props.sortDirection === 'desc'
|
||||||
|
: props.sortDirection === 'asc';
|
||||||
|
}
|
||||||
|
|
||||||
|
function isChevronUp(column: SortColumn): boolean {
|
||||||
|
if (!isSorted(column)) return false;
|
||||||
|
return !isChevronDown(column);
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TableHeading>
|
<TableHeading>
|
||||||
<SortableTableHeaderCell
|
<div
|
||||||
class="pr-3 pl-4 sm:pl-6 lg:pl-8 3xl:pl-12"
|
class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12 cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
column="name"
|
@click="handleSort('name')">
|
||||||
v-bind="props"
|
|
||||||
@sort="$emit('sort', $event)">
|
|
||||||
Name
|
Name
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('name')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell column="email" v-bind="props" @sort="$emit('sort', $event)">
|
<ChevronUpIcon v-else-if="isChevronUp('name')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('email')">
|
||||||
Email
|
Email
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('email')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell column="role" v-bind="props" @sort="$emit('sort', $event)">
|
<ChevronUpIcon v-else-if="isChevronUp('email')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('role')">
|
||||||
Role
|
Role
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('role')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell
|
<ChevronUpIcon v-else-if="isChevronUp('role')" class="w-4 h-4" />
|
||||||
column="billable_rate"
|
<span v-else class="w-4 h-4"></span>
|
||||||
v-bind="props"
|
</div>
|
||||||
@sort="$emit('sort', $event)">
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('billable_rate')">
|
||||||
Billable Rate
|
Billable Rate
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('billable_rate')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell column="status" v-bind="props" @sort="$emit('sort', $event)">
|
<ChevronUpIcon v-else-if="isChevronUp('billable_rate')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('status')">
|
||||||
Status
|
Status
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('status')" class="w-4 h-4" />
|
||||||
|
<ChevronUpIcon v-else-if="isChevronUp('status')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
<div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12 bg-row-heading-background">
|
<div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12 bg-row-heading-background">
|
||||||
<span class="sr-only">Edit</span>
|
<span class="sr-only">Edit</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -16,8 +16,8 @@ import {
|
|||||||
ChevronRightIcon,
|
ChevronRightIcon,
|
||||||
EllipsisHorizontalIcon,
|
EllipsisHorizontalIcon,
|
||||||
} from '@heroicons/vue/20/solid';
|
} from '@heroicons/vue/20/solid';
|
||||||
import { buttonVariants } from './Buttons/index';
|
import { buttonVariants } from '@/packages/ui/src';
|
||||||
import { cn } from './utils/cn';
|
import { cn } from '@/lib/utils';
|
||||||
import { computed, watch } from 'vue';
|
import { computed, watch } from 'vue';
|
||||||
|
|
||||||
const page = defineModel<number>('page', { default: 1 });
|
const page = defineModel<number>('page', { default: 1 });
|
||||||
@@ -6,12 +6,17 @@ import { computed, ref, watch } from 'vue';
|
|||||||
import ProjectCreateModal from '@/packages/ui/src/Project/ProjectCreateModal.vue';
|
import ProjectCreateModal from '@/packages/ui/src/Project/ProjectCreateModal.vue';
|
||||||
import ProjectTableHeading from '@/Components/Common/Project/ProjectTableHeading.vue';
|
import ProjectTableHeading from '@/Components/Common/Project/ProjectTableHeading.vue';
|
||||||
import ProjectTableRow from '@/Components/Common/Project/ProjectTableRow.vue';
|
import ProjectTableRow from '@/Components/Common/Project/ProjectTableRow.vue';
|
||||||
import Pagination from '@/packages/ui/src/Pagination.vue';
|
import Pagination from '@/Components/Common/Pagination.vue';
|
||||||
import LoadingSpinner from '@/packages/ui/src/LoadingSpinner.vue';
|
|
||||||
|
|
||||||
export type SortColumn =
|
export type SortColumn =
|
||||||
'name' | 'client_name' | 'spent_time' | 'progress' | 'billable_rate' | 'status' | 'visibility';
|
| 'name'
|
||||||
export type { SortDirection } from '@/utils/useSortableTable';
|
| 'client_name'
|
||||||
|
| 'spent_time'
|
||||||
|
| 'progress'
|
||||||
|
| 'billable_rate'
|
||||||
|
| 'status'
|
||||||
|
| 'visibility';
|
||||||
|
export type SortDirection = 'asc' | 'desc';
|
||||||
import { canCreateProjects } from '@/utils/permissions';
|
import { canCreateProjects } from '@/utils/permissions';
|
||||||
import type { CreateProjectBody, Project, Client, CreateClientBody } from '@/packages/api/src';
|
import type { CreateProjectBody, Project, Client, CreateClientBody } from '@/packages/api/src';
|
||||||
import { useProjectsStore } from '@/utils/useProjects';
|
import { useProjectsStore } from '@/utils/useProjects';
|
||||||
@@ -22,24 +27,20 @@ import { isAllowedToPerformPremiumAction } from '@/utils/billing';
|
|||||||
import { useOrganizationQuery } from '@/utils/useOrganizationQuery';
|
import { useOrganizationQuery } from '@/utils/useOrganizationQuery';
|
||||||
import { getCurrentOrganizationId } from '@/utils/useUser';
|
import { getCurrentOrganizationId } from '@/utils/useUser';
|
||||||
import {
|
import {
|
||||||
useSortableTable,
|
useVueTable,
|
||||||
type SortableColumnDef,
|
getCoreRowModel,
|
||||||
type SortDirection,
|
getSortedRowModel,
|
||||||
} from '@/utils/useSortableTable';
|
type SortingState,
|
||||||
|
} from '@tanstack/vue-table';
|
||||||
|
|
||||||
const { organization } = useOrganizationQuery(getCurrentOrganizationId()!);
|
const { organization } = useOrganizationQuery(getCurrentOrganizationId()!);
|
||||||
|
|
||||||
const props = withDefaults(
|
const props = defineProps<{
|
||||||
defineProps<{
|
projects: Project[];
|
||||||
projects: Project[];
|
showBillableRate: boolean;
|
||||||
showBillableRate: boolean;
|
sortColumn: SortColumn;
|
||||||
sortColumn: SortColumn;
|
sortDirection: SortDirection;
|
||||||
sortDirection: SortDirection;
|
}>();
|
||||||
isFiltered?: boolean;
|
|
||||||
isLoading?: boolean;
|
|
||||||
}>(),
|
|
||||||
{ isFiltered: false, isLoading: false }
|
|
||||||
);
|
|
||||||
|
|
||||||
const emit = defineEmits<{
|
const emit = defineEmits<{
|
||||||
sort: [column: SortColumn, direction: SortDirection];
|
sort: [column: SortColumn, direction: SortDirection];
|
||||||
@@ -56,16 +57,28 @@ const clientNameMap = computed(() => {
|
|||||||
return map;
|
return map;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Convert sort props to TanStack Table format.
|
||||||
|
// Name is always the secondary sort so rows with equal values render
|
||||||
|
// alphabetically instead of in API (created_at) order.
|
||||||
|
const sorting = computed<SortingState>(() => [
|
||||||
|
{
|
||||||
|
id: props.sortColumn,
|
||||||
|
desc: props.sortDirection === 'desc',
|
||||||
|
},
|
||||||
|
...(props.sortColumn !== 'name' ? [{ id: 'name', desc: false }] : []),
|
||||||
|
]);
|
||||||
|
|
||||||
// Define column accessors for sorting.
|
// Define column accessors for sorting.
|
||||||
// Numeric columns use sortDescFirst so that the first click (chevron down) sorts highest-first,
|
// 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).
|
// while text columns default to ascending (A-Z) on first click (chevron down).
|
||||||
const columns = computed<SortableColumnDef<Project, SortColumn>[]>(() => [
|
const columns = computed(() => [
|
||||||
{
|
{
|
||||||
id: 'name',
|
id: 'name',
|
||||||
accessorFn: (row: Project) => row.name.toLowerCase(),
|
accessorFn: (row: Project) => row.name.toLowerCase(),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'client_name',
|
id: 'client_name',
|
||||||
|
sortUndefined: 'last' as const,
|
||||||
accessorFn: (row: Project) => {
|
accessorFn: (row: Project) => {
|
||||||
if (!row.client_id) return undefined;
|
if (!row.client_id) return undefined;
|
||||||
return (clientNameMap.value.get(row.client_id) ?? '').toLowerCase();
|
return (clientNameMap.value.get(row.client_id) ?? '').toLowerCase();
|
||||||
@@ -74,11 +87,12 @@ const columns = computed<SortableColumnDef<Project, SortColumn>[]>(() => [
|
|||||||
{
|
{
|
||||||
id: 'spent_time',
|
id: 'spent_time',
|
||||||
sortDescFirst: true,
|
sortDescFirst: true,
|
||||||
accessorFn: (row: Project) => row.spent_time,
|
accessorFn: (row: Project) => row.spent_time ?? 0,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'progress',
|
id: 'progress',
|
||||||
sortDescFirst: true,
|
sortDescFirst: true,
|
||||||
|
sortUndefined: 'last' as const,
|
||||||
accessorFn: (row: Project) => {
|
accessorFn: (row: Project) => {
|
||||||
if (!row.estimated_time) return undefined;
|
if (!row.estimated_time) return undefined;
|
||||||
return (row.spent_time / row.estimated_time) * 100;
|
return (row.spent_time / row.estimated_time) * 100;
|
||||||
@@ -87,7 +101,7 @@ const columns = computed<SortableColumnDef<Project, SortColumn>[]>(() => [
|
|||||||
{
|
{
|
||||||
id: 'billable_rate',
|
id: 'billable_rate',
|
||||||
sortDescFirst: true,
|
sortDescFirst: true,
|
||||||
accessorFn: (row: Project) => row.billable_rate,
|
accessorFn: (row: Project) => row.billable_rate ?? 0,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'status',
|
id: 'status',
|
||||||
@@ -99,22 +113,40 @@ const columns = computed<SortableColumnDef<Project, SortColumn>[]>(() => [
|
|||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const {
|
// Columns with sortDescFirst get desc as default direction on first click.
|
||||||
sortedRows: sortedProjects,
|
const descFirstColumns = new Set<SortColumn>(
|
||||||
descFirstColumns,
|
columns.value.filter((c) => c.sortDescFirst).map((c) => c.id as SortColumn)
|
||||||
nextDirection,
|
);
|
||||||
} = useSortableTable({
|
|
||||||
data: () => props.projects,
|
|
||||||
columns: () => columns.value,
|
|
||||||
sortColumn: () => props.sortColumn,
|
|
||||||
sortDirection: () => props.sortDirection,
|
|
||||||
tieBreakColumn: 'name',
|
|
||||||
});
|
|
||||||
|
|
||||||
function handleSort(column: SortColumn) {
|
function handleSort(column: SortColumn) {
|
||||||
emit('sort', column, nextDirection(column));
|
if (props.sortColumn === column) {
|
||||||
|
emit('sort', column, props.sortDirection === 'asc' ? 'desc' : 'asc');
|
||||||
|
} else {
|
||||||
|
emit('sort', column, descFirstColumns.has(column) ? 'desc' : 'asc');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const table = useVueTable({
|
||||||
|
get data() {
|
||||||
|
return props.projects;
|
||||||
|
},
|
||||||
|
get columns() {
|
||||||
|
return columns.value;
|
||||||
|
},
|
||||||
|
getCoreRowModel: getCoreRowModel(),
|
||||||
|
getSortedRowModel: getSortedRowModel(),
|
||||||
|
state: {
|
||||||
|
get sorting() {
|
||||||
|
return sorting.value;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
manualSorting: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const sortedProjects = computed(() => {
|
||||||
|
return table.getRowModel().rows.map((row) => row.original);
|
||||||
|
});
|
||||||
|
|
||||||
// Client-side pagination: the full list is in memory, only one page is mounted at a time.
|
// Client-side pagination: the full list is in memory, only one page is mounted at a time.
|
||||||
const PAGE_SIZE = 15;
|
const PAGE_SIZE = 15;
|
||||||
const currentPage = ref(1);
|
const currentPage = ref(1);
|
||||||
@@ -128,28 +160,6 @@ const paginatedProjects = computed(() => {
|
|||||||
return sortedProjects.value.slice(start, start + PAGE_SIZE);
|
return sortedProjects.value.slice(start, start + PAGE_SIZE);
|
||||||
});
|
});
|
||||||
|
|
||||||
const emptyState = computed(() => {
|
|
||||||
if (props.isFiltered) {
|
|
||||||
return {
|
|
||||||
title: 'No matching projects',
|
|
||||||
description: 'Try a different search term or adjust your filters.',
|
|
||||||
showCreateButton: false,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
if (!canCreateProjects()) {
|
|
||||||
return {
|
|
||||||
title: 'You are not a member of any projects',
|
|
||||||
description: 'Ask your manager to add you to a project as a team member.',
|
|
||||||
showCreateButton: false,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
return {
|
|
||||||
title: 'No projects found',
|
|
||||||
description: 'Create your first project now!',
|
|
||||||
showCreateButton: true,
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
const showCreateProjectModal = ref(false);
|
const showCreateProjectModal = ref(false);
|
||||||
|
|
||||||
async function createProject(project: CreateProjectBody): Promise<Project | undefined> {
|
async function createProject(project: CreateProjectBody): Promise<Project | undefined> {
|
||||||
@@ -183,21 +193,24 @@ const gridTemplate = computed(() => {
|
|||||||
:sort-direction="props.sortDirection"
|
:sort-direction="props.sortDirection"
|
||||||
:desc-first-columns="descFirstColumns"
|
:desc-first-columns="descFirstColumns"
|
||||||
@sort="handleSort"></ProjectTableHeading>
|
@sort="handleSort"></ProjectTableHeading>
|
||||||
<div
|
<div v-if="sortedProjects.length === 0" class="col-span-full py-24 text-center">
|
||||||
v-if="props.isLoading"
|
|
||||||
class="col-span-full flex justify-center items-center py-24">
|
|
||||||
<LoadingSpinner></LoadingSpinner>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-else-if="sortedProjects.length === 0"
|
|
||||||
class="col-span-full py-24 text-center">
|
|
||||||
<FolderPlusIcon class="w-8 text-icon-default inline pb-2"></FolderPlusIcon>
|
<FolderPlusIcon class="w-8 text-icon-default inline pb-2"></FolderPlusIcon>
|
||||||
<h3 class="text-text-primary font-semibold">{{ emptyState.title }}</h3>
|
<h3 class="text-text-primary font-semibold">
|
||||||
|
{{
|
||||||
|
canCreateProjects()
|
||||||
|
? 'No projects found'
|
||||||
|
: 'You are not a member of any projects'
|
||||||
|
}}
|
||||||
|
</h3>
|
||||||
<p class="pb-5 max-w-md mx-auto text-sm pt-1">
|
<p class="pb-5 max-w-md mx-auto text-sm pt-1">
|
||||||
{{ emptyState.description }}
|
{{
|
||||||
|
canCreateProjects()
|
||||||
|
? 'Create your first project now!'
|
||||||
|
: 'Ask your manager to add you to a project as a team member.'
|
||||||
|
}}
|
||||||
</p>
|
</p>
|
||||||
<SecondaryButton
|
<SecondaryButton
|
||||||
v-if="emptyState.showCreateButton"
|
v-if="canCreateProjects()"
|
||||||
:icon="PlusIcon"
|
:icon="PlusIcon"
|
||||||
@click="showCreateProjectModal = true"
|
@click="showCreateProjectModal = true"
|
||||||
>Create your First Project
|
>Create your First Project
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed } from 'vue';
|
|
||||||
import TableHeading from '@/Components/Common/TableHeading.vue';
|
import TableHeading from '@/Components/Common/TableHeading.vue';
|
||||||
import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
|
import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
|
||||||
import type { SortColumn, SortDirection } from '@/Components/Common/Project/ProjectTable.vue';
|
import type { SortColumn, SortDirection } from '@/Components/Common/Project/ProjectTable.vue';
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
@@ -15,51 +14,90 @@ const emit = defineEmits<{
|
|||||||
sort: [column: SortColumn];
|
sort: [column: SortColumn];
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
// Bound once per cell instead of repeating the three sort props on every column.
|
|
||||||
const sortState = computed(() => ({
|
|
||||||
sortColumn: props.sortColumn,
|
|
||||||
sortDirection: props.sortDirection,
|
|
||||||
descFirstColumns: props.descFirstColumns,
|
|
||||||
}));
|
|
||||||
|
|
||||||
function handleSort(column: SortColumn) {
|
function handleSort(column: SortColumn) {
|
||||||
emit('sort', column);
|
emit('sort', column);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function isSorted(column: SortColumn): boolean {
|
||||||
|
return props.sortColumn === column;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isChevronDown(column: SortColumn): boolean {
|
||||||
|
if (!isSorted(column)) return false;
|
||||||
|
return props.descFirstColumns.has(column)
|
||||||
|
? props.sortDirection === 'desc'
|
||||||
|
: props.sortDirection === 'asc';
|
||||||
|
}
|
||||||
|
|
||||||
|
function isChevronUp(column: SortColumn): boolean {
|
||||||
|
if (!isSorted(column)) return false;
|
||||||
|
return !isChevronDown(column);
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TableHeading>
|
<TableHeading>
|
||||||
<SortableTableHeaderCell
|
<div
|
||||||
class="pr-3 pl-2 sm:pl-4 lg:pl-6"
|
class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12 cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
column="name"
|
@click="handleSort('name')">
|
||||||
v-bind="sortState"
|
|
||||||
@sort="handleSort">
|
|
||||||
Name
|
Name
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('name')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell column="client_name" v-bind="sortState" @sort="handleSort">
|
<ChevronUpIcon v-else-if="isChevronUp('name')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('client_name')">
|
||||||
Client
|
Client
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('client_name')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell column="spent_time" v-bind="sortState" @sort="handleSort">
|
<ChevronUpIcon v-else-if="isChevronUp('client_name')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('spent_time')">
|
||||||
Total Time
|
Total Time
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('spent_time')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell column="progress" v-bind="sortState" @sort="handleSort">
|
<ChevronUpIcon v-else-if="isChevronUp('spent_time')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('progress')">
|
||||||
Progress
|
Progress
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('progress')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell
|
<ChevronUpIcon v-else-if="isChevronUp('progress')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
v-if="showBillableRate"
|
v-if="showBillableRate"
|
||||||
column="billable_rate"
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
v-bind="sortState"
|
@click="handleSort('billable_rate')">
|
||||||
@sort="handleSort">
|
|
||||||
Billable Rate
|
Billable Rate
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('billable_rate')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell column="status" v-bind="sortState" @sort="handleSort">
|
<ChevronUpIcon v-else-if="isChevronUp('billable_rate')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('status')">
|
||||||
Status
|
Status
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('status')" class="w-4 h-4" />
|
||||||
<SortableTableHeaderCell column="visibility" v-bind="sortState" @sort="handleSort">
|
<ChevronUpIcon v-else-if="isChevronUp('status')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
|
@click="handleSort('visibility')">
|
||||||
Visibility
|
Visibility
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('visibility')" class="w-4 h-4" />
|
||||||
<div class="relative py-1.5 pl-3 pr-2 sm:pr-4 lg:pr-6">
|
<ChevronUpIcon v-else-if="isChevronUp('visibility')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
|
<div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
|
||||||
<span class="sr-only">Edit</span>
|
<span class="sr-only">Edit</span>
|
||||||
</div>
|
</div>
|
||||||
</TableHeading>
|
</TableHeading>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<style scoped></style>
|
||||||
|
|||||||
@@ -88,13 +88,13 @@ const showEditProjectModal = ref(false);
|
|||||||
<ContextMenuTrigger as-child>
|
<ContextMenuTrigger as-child>
|
||||||
<TableRow :href="route('projects.show', { project: project.id })">
|
<TableRow :href="route('projects.show', { project: project.id })">
|
||||||
<div
|
<div
|
||||||
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">
|
class="whitespace-nowrap min-w-0 flex items-center space-x-5 3xl:pl-12 py-4 pr-3 text-sm font-medium text-text-primary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12">
|
||||||
<div
|
<div
|
||||||
:style="{
|
:style="{
|
||||||
backgroundColor: project.color,
|
backgroundColor: project.color,
|
||||||
boxShadow: `var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) ${project.color}30`,
|
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>
|
class="w-3 h-3 rounded-full"></div>
|
||||||
<span class="overflow-ellipsis overflow-hidden">
|
<span class="overflow-ellipsis overflow-hidden">
|
||||||
{{ project.name }}
|
{{ project.name }}
|
||||||
</span>
|
</span>
|
||||||
@@ -155,7 +155,7 @@ const showEditProjectModal = ref(false);
|
|||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="relative whitespace-nowrap flex items-center pl-3 text-right text-sm font-medium pr-2 sm:pr-4 lg:pr-6">
|
class="relative whitespace-nowrap flex items-center pl-3 text-right text-sm font-medium pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
|
||||||
<ProjectMoreOptionsDropdown
|
<ProjectMoreOptionsDropdown
|
||||||
:project="project"
|
:project="project"
|
||||||
@edit="showEditProjectModal = true"
|
@edit="showEditProjectModal = true"
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
import { UserGroupIcon, CheckCircleIcon, GlobeAltIcon } from '@heroicons/vue/16/solid';
|
import { UserGroupIcon, CheckCircleIcon, GlobeAltIcon } from '@heroicons/vue/16/solid';
|
||||||
import ListFilterIcon from '@/packages/ui/src/Icons/ListFilterIcon.vue';
|
import ListFilterIcon from '@/packages/ui/src/Icons/ListFilterIcon.vue';
|
||||||
import {
|
import {
|
||||||
@@ -81,18 +81,23 @@ function toggleNoClient() {
|
|||||||
clientIds,
|
clientIds,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const hasActiveFilters = computed(() => {
|
||||||
|
return (
|
||||||
|
props.filters.status !== 'all' ||
|
||||||
|
props.filters.visibility !== 'all' ||
|
||||||
|
props.filters.clientIds.length > 0
|
||||||
|
);
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<DropdownMenu v-model:open="open">
|
<DropdownMenu v-model:open="open">
|
||||||
<DropdownMenuTrigger as-child>
|
<DropdownMenuTrigger as-child>
|
||||||
<!-- -ml-1.5 cancels the icon's inset inside the button so it sits flush with the toolbar's left padding -->
|
<Button variant="ghost" size="xs" aria-label="Filter projects">
|
||||||
<Button
|
<ListFilterIcon
|
||||||
variant="ghost"
|
:class="[hasActiveFilters ? '' : '-ml-0.5', 'h-4 w-4 text-icon-default']" />
|
||||||
size="icon"
|
<span v-if="!hasActiveFilters" class="text-nowrap">Filter</span>
|
||||||
class="-ml-1.5 h-7 w-7 flex-shrink-0"
|
|
||||||
aria-label="Filter projects">
|
|
||||||
<ListFilterIcon class="h-4 w-4 text-icon-default" />
|
|
||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent align="start" class="w-56">
|
<DropdownMenuContent align="start" class="w-56">
|
||||||
|
|||||||
@@ -9,7 +9,7 @@ const showExportModal = defineModel('show', { default: false });
|
|||||||
|
|
||||||
function downloadCurrentExport() {
|
function downloadCurrentExport() {
|
||||||
if (props.exportUrl) {
|
if (props.exportUrl) {
|
||||||
window.open(props.exportUrl, '_self');
|
window.open(props.exportUrl, '_blank')?.focus();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -1,54 +0,0 @@
|
|||||||
<script setup lang="ts" generic="TColumn extends string">
|
|
||||||
import { computed, useAttrs } from 'vue';
|
|
||||||
import type { ClassValue } from 'clsx';
|
|
||||||
import { cn } from '@/lib/utils';
|
|
||||||
import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
|
|
||||||
import type { SortDirection } from '@/utils/useSortableTable';
|
|
||||||
|
|
||||||
defineOptions({ inheritAttrs: false });
|
|
||||||
|
|
||||||
const props = defineProps<{
|
|
||||||
column: TColumn;
|
|
||||||
sortColumn: TColumn;
|
|
||||||
sortDirection: SortDirection;
|
|
||||||
descFirstColumns: ReadonlySet<TColumn>;
|
|
||||||
}>();
|
|
||||||
|
|
||||||
const emit = defineEmits<{
|
|
||||||
sort: [column: TColumn];
|
|
||||||
}>();
|
|
||||||
|
|
||||||
const attrs = useAttrs();
|
|
||||||
|
|
||||||
const isSorted = computed(() => props.sortColumn === props.column);
|
|
||||||
|
|
||||||
const isChevronDown = computed(() => {
|
|
||||||
if (!isSorted.value) return false;
|
|
||||||
return props.descFirstColumns.has(props.column)
|
|
||||||
? props.sortDirection === 'desc'
|
|
||||||
: props.sortDirection === 'asc';
|
|
||||||
});
|
|
||||||
|
|
||||||
const cellClass = computed(() =>
|
|
||||||
cn(
|
|
||||||
'px-3 py-1.5 text-left text-text-tertiary cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1',
|
|
||||||
attrs.class as ClassValue
|
|
||||||
)
|
|
||||||
);
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<button type="button" :class="cellClass" @click="emit('sort', column)">
|
|
||||||
<slot></slot>
|
|
||||||
<span class="sr-only">
|
|
||||||
{{
|
|
||||||
isSorted
|
|
||||||
? `sorted ${sortDirection === 'asc' ? 'ascending' : 'descending'}`
|
|
||||||
: 'not sorted'
|
|
||||||
}}
|
|
||||||
</span>
|
|
||||||
<ChevronDownIcon v-if="isChevronDown" aria-hidden="true" class="w-4 h-4" />
|
|
||||||
<ChevronUpIcon v-else-if="isSorted" aria-hidden="true" class="w-4 h-4" />
|
|
||||||
<span v-else aria-hidden="true" class="w-4 h-4"></span>
|
|
||||||
</button>
|
|
||||||
</template>
|
|
||||||
@@ -2,7 +2,7 @@
|
|||||||
import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
|
import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
|
||||||
import { FolderPlusIcon } from '@heroicons/vue/24/solid';
|
import { FolderPlusIcon } from '@heroicons/vue/24/solid';
|
||||||
import { PlusIcon } from '@heroicons/vue/16/solid';
|
import { PlusIcon } from '@heroicons/vue/16/solid';
|
||||||
import { ref } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
import { useTagsQuery } from '@/utils/useTagsQuery';
|
import { useTagsQuery } from '@/utils/useTagsQuery';
|
||||||
import TagTableRow from '@/Components/Common/Tag/TagTableRow.vue';
|
import TagTableRow from '@/Components/Common/Tag/TagTableRow.vue';
|
||||||
import TagCreateModal from '@/packages/ui/src/Tag/TagCreateModal.vue';
|
import TagCreateModal from '@/packages/ui/src/Tag/TagCreateModal.vue';
|
||||||
@@ -10,13 +10,14 @@ import TagTableHeading from '@/Components/Common/Tag/TagTableHeading.vue';
|
|||||||
import { canCreateTags } from '@/utils/permissions';
|
import { canCreateTags } from '@/utils/permissions';
|
||||||
import type { Tag } from '@/packages/api/src';
|
import type { Tag } from '@/packages/api/src';
|
||||||
import {
|
import {
|
||||||
useSortableTable,
|
useVueTable,
|
||||||
type SortableColumnDef,
|
getCoreRowModel,
|
||||||
type SortDirection,
|
getSortedRowModel,
|
||||||
} from '@/utils/useSortableTable';
|
type SortingState,
|
||||||
|
} from '@tanstack/vue-table';
|
||||||
|
|
||||||
export type SortColumn = 'name';
|
export type SortColumn = 'name';
|
||||||
export type { SortDirection } from '@/utils/useSortableTable';
|
export type SortDirection = 'asc' | 'desc';
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
createTag: (name: string) => Promise<Tag | undefined>;
|
createTag: (name: string) => Promise<Tag | undefined>;
|
||||||
@@ -31,27 +32,50 @@ const emit = defineEmits<{
|
|||||||
const { tags } = useTagsQuery();
|
const { tags } = useTagsQuery();
|
||||||
const showCreateTagModal = ref(false);
|
const showCreateTagModal = ref(false);
|
||||||
|
|
||||||
const columns: SortableColumnDef<Tag, SortColumn>[] = [
|
const sorting = computed<SortingState>(() => [
|
||||||
|
{
|
||||||
|
id: props.sortColumn,
|
||||||
|
desc: props.sortDirection === 'desc',
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
|
const columns = [
|
||||||
{
|
{
|
||||||
id: 'name',
|
id: 'name',
|
||||||
accessorFn: (row: Tag) => row.name.toLowerCase(),
|
accessorFn: (row: Tag) => row.name.toLowerCase(),
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
const {
|
const descFirstColumns = new Set<SortColumn>(
|
||||||
sortedRows: sortedTags,
|
columns.filter((c) => 'sortDescFirst' in c && c.sortDescFirst).map((c) => c.id as SortColumn)
|
||||||
descFirstColumns,
|
);
|
||||||
nextDirection,
|
|
||||||
} = useSortableTable({
|
|
||||||
data: () => tags.value,
|
|
||||||
columns: () => columns,
|
|
||||||
sortColumn: () => props.sortColumn,
|
|
||||||
sortDirection: () => props.sortDirection,
|
|
||||||
});
|
|
||||||
|
|
||||||
function handleSort(column: SortColumn) {
|
function handleSort(column: SortColumn) {
|
||||||
emit('sort', column, nextDirection(column));
|
if (props.sortColumn === column) {
|
||||||
|
emit('sort', column, props.sortDirection === 'asc' ? 'desc' : 'asc');
|
||||||
|
} else {
|
||||||
|
emit('sort', column, descFirstColumns.has(column) ? 'desc' : 'asc');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const table = useVueTable({
|
||||||
|
get data() {
|
||||||
|
return tags.value;
|
||||||
|
},
|
||||||
|
columns,
|
||||||
|
getCoreRowModel: getCoreRowModel(),
|
||||||
|
getSortedRowModel: getSortedRowModel(),
|
||||||
|
state: {
|
||||||
|
get sorting() {
|
||||||
|
return sorting.value;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
manualSorting: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const sortedTags = computed(() => {
|
||||||
|
return table.getRowModel().rows.map((row) => row.original);
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import TableHeading from '@/Components/Common/TableHeading.vue';
|
import TableHeading from '@/Components/Common/TableHeading.vue';
|
||||||
import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
|
import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/vue/16/solid';
|
||||||
import type { SortColumn, SortDirection } from '@/Components/Common/Tag/TagTable.vue';
|
import type { SortColumn, SortDirection } from '@/Components/Common/Tag/TagTable.vue';
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
@@ -9,20 +9,41 @@ const props = defineProps<{
|
|||||||
descFirstColumns: ReadonlySet<SortColumn>;
|
descFirstColumns: ReadonlySet<SortColumn>;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
defineEmits<{
|
const emit = defineEmits<{
|
||||||
sort: [column: SortColumn];
|
sort: [column: SortColumn];
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
|
function handleSort(column: SortColumn) {
|
||||||
|
emit('sort', column);
|
||||||
|
}
|
||||||
|
|
||||||
|
function isSorted(column: SortColumn): boolean {
|
||||||
|
return props.sortColumn === column;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isChevronDown(column: SortColumn): boolean {
|
||||||
|
if (!isSorted(column)) return false;
|
||||||
|
return props.descFirstColumns.has(column)
|
||||||
|
? props.sortDirection === 'desc'
|
||||||
|
: props.sortDirection === 'asc';
|
||||||
|
}
|
||||||
|
|
||||||
|
function isChevronUp(column: SortColumn): boolean {
|
||||||
|
if (!isSorted(column)) return false;
|
||||||
|
return !isChevronDown(column);
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TableHeading>
|
<TableHeading>
|
||||||
<SortableTableHeaderCell
|
<div
|
||||||
class="pr-3 pl-4 sm:pl-6 lg:pl-8 3xl:pl-12"
|
class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12 cursor-pointer hover:bg-secondary hover:text-text-primary transition-colors select-none flex items-center gap-1"
|
||||||
column="name"
|
@click="handleSort('name')">
|
||||||
v-bind="props"
|
|
||||||
@sort="$emit('sort', $event)">
|
|
||||||
Name
|
Name
|
||||||
</SortableTableHeaderCell>
|
<ChevronDownIcon v-if="isChevronDown('name')" class="w-4 h-4" />
|
||||||
|
<ChevronUpIcon v-else-if="isChevronUp('name')" class="w-4 h-4" />
|
||||||
|
<span v-else class="w-4 h-4"></span>
|
||||||
|
</div>
|
||||||
<div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
|
<div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
|
||||||
<span class="sr-only">Edit</span>
|
<span class="sr-only">Edit</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -8,62 +8,12 @@ import TaskTableHeading from '@/Components/Common/Task/TaskTableHeading.vue';
|
|||||||
import TaskCreateModal from '@/Components/Common/Task/TaskCreateModal.vue';
|
import TaskCreateModal from '@/Components/Common/Task/TaskCreateModal.vue';
|
||||||
import { canCreateTasks } from '@/utils/permissions';
|
import { canCreateTasks } from '@/utils/permissions';
|
||||||
import type { Task } from '@/packages/api/src';
|
import type { Task } from '@/packages/api/src';
|
||||||
import {
|
|
||||||
useSortableTable,
|
|
||||||
type SortableColumnDef,
|
|
||||||
type SortDirection,
|
|
||||||
} from '@/utils/useSortableTable';
|
|
||||||
|
|
||||||
export type SortColumn = 'name' | 'spent_time' | 'progress';
|
|
||||||
export type { SortDirection } from '@/utils/useSortableTable';
|
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
projectId: string;
|
projectId: string;
|
||||||
tasks: Task[];
|
tasks: Task[];
|
||||||
sortColumn: SortColumn;
|
|
||||||
sortDirection: SortDirection;
|
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
const emit = defineEmits<{
|
|
||||||
sort: [column: SortColumn, direction: SortDirection];
|
|
||||||
}>();
|
|
||||||
|
|
||||||
const columns: SortableColumnDef<Task, SortColumn>[] = [
|
|
||||||
{
|
|
||||||
id: 'name',
|
|
||||||
accessorFn: (row: Task) => row.name.toLowerCase(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 'spent_time',
|
|
||||||
sortDescFirst: true,
|
|
||||||
accessorFn: (row: Task) => row.spent_time,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 'progress',
|
|
||||||
sortDescFirst: true,
|
|
||||||
accessorFn: (row: Task) => {
|
|
||||||
if (!row.estimated_time) return undefined;
|
|
||||||
return (row.spent_time / row.estimated_time) * 100;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
const {
|
|
||||||
sortedRows: sortedTasks,
|
|
||||||
descFirstColumns,
|
|
||||||
nextDirection,
|
|
||||||
} = useSortableTable({
|
|
||||||
data: () => props.tasks,
|
|
||||||
columns: () => columns,
|
|
||||||
sortColumn: () => props.sortColumn,
|
|
||||||
sortDirection: () => props.sortDirection,
|
|
||||||
tieBreakColumn: 'name',
|
|
||||||
});
|
|
||||||
|
|
||||||
function handleSort(column: SortColumn) {
|
|
||||||
emit('sort', column, nextDirection(column));
|
|
||||||
}
|
|
||||||
|
|
||||||
const createTask = ref(false);
|
const createTask = ref(false);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -80,12 +30,8 @@ const createTask = ref(false);
|
|||||||
1fr minmax(80px, auto) minmax(120px, auto) minmax(50px, auto)
|
1fr minmax(80px, auto) minmax(120px, auto) minmax(50px, auto)
|
||||||
80px;
|
80px;
|
||||||
">
|
">
|
||||||
<TaskTableHeading
|
<TaskTableHeading></TaskTableHeading>
|
||||||
:sort-column="sortColumn"
|
<div v-if="tasks.length === 0" class="col-span-5 py-24 text-center">
|
||||||
:sort-direction="sortDirection"
|
|
||||||
:desc-first-columns="descFirstColumns"
|
|
||||||
@sort="handleSort"></TaskTableHeading>
|
|
||||||
<div v-if="sortedTasks.length === 0" class="col-span-5 py-24 text-center">
|
|
||||||
<PlusCircleIcon class="w-8 text-icon-default inline pb-2"></PlusCircleIcon>
|
<PlusCircleIcon class="w-8 text-icon-default inline pb-2"></PlusCircleIcon>
|
||||||
<h3 class="text-text-primary font-semibold">No tasks found</h3>
|
<h3 class="text-text-primary font-semibold">No tasks found</h3>
|
||||||
<p v-if="canCreateTasks()" class="pb-5">Create your first task now!</p>
|
<p v-if="canCreateTasks()" class="pb-5">Create your first task now!</p>
|
||||||
@@ -96,7 +42,7 @@ const createTask = ref(false);
|
|||||||
>Create your First Task
|
>Create your First Task
|
||||||
</SecondaryButton>
|
</SecondaryButton>
|
||||||
</div>
|
</div>
|
||||||
<template v-for="task in sortedTasks" :key="task.id">
|
<template v-for="task in tasks" :key="task.id">
|
||||||
<TaskTableRow :task="task"></TaskTableRow>
|
<TaskTableRow :task="task"></TaskTableRow>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,37 +1,19 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import TableHeading from '@/Components/Common/TableHeading.vue';
|
import TableHeading from '@/Components/Common/TableHeading.vue';
|
||||||
import SortableTableHeaderCell from '@/Components/Common/SortableTableHeaderCell.vue';
|
|
||||||
import type { SortColumn, SortDirection } from '@/Components/Common/Task/TaskTable.vue';
|
|
||||||
|
|
||||||
const props = defineProps<{
|
|
||||||
sortColumn: SortColumn;
|
|
||||||
sortDirection: SortDirection;
|
|
||||||
descFirstColumns: ReadonlySet<SortColumn>;
|
|
||||||
}>();
|
|
||||||
|
|
||||||
defineEmits<{
|
|
||||||
sort: [column: SortColumn];
|
|
||||||
}>();
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TableHeading>
|
<TableHeading>
|
||||||
<SortableTableHeaderCell
|
<div class="py-1.5 pr-3 text-left text-text-tertiary pl-4 sm:pl-6 lg:pl-8 3xl:pl-12">
|
||||||
class="pr-3 pl-4 sm:pl-6 lg:pl-8 3xl:pl-12"
|
|
||||||
column="name"
|
|
||||||
v-bind="props"
|
|
||||||
@sort="$emit('sort', $event)">
|
|
||||||
Task Name
|
Task Name
|
||||||
</SortableTableHeaderCell>
|
</div>
|
||||||
<SortableTableHeaderCell column="spent_time" v-bind="props" @sort="$emit('sort', $event)">
|
<div class="px-3 py-1.5 text-left text-text-tertiary">Total Time</div>
|
||||||
Total Time
|
<div class="px-3 py-1.5 text-left text-text-tertiary">Progress</div>
|
||||||
</SortableTableHeaderCell>
|
|
||||||
<SortableTableHeaderCell column="progress" v-bind="props" @sort="$emit('sort', $event)">
|
|
||||||
Progress
|
|
||||||
</SortableTableHeaderCell>
|
|
||||||
<div class="px-3 py-1.5 text-left text-text-tertiary">Status</div>
|
<div class="px-3 py-1.5 text-left text-text-tertiary">Status</div>
|
||||||
<div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
|
<div class="relative py-1.5 pl-3 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
|
||||||
<span class="sr-only">Edit</span>
|
<span class="sr-only">Edit</span>
|
||||||
</div>
|
</div>
|
||||||
</TableHeading>
|
</TableHeading>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<style scoped></style>
|
||||||
|
|||||||
@@ -1,10 +1,11 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { usePage } from '@inertiajs/vue3';
|
import { ref } from 'vue';
|
||||||
|
import { useForm, usePage } from '@inertiajs/vue3';
|
||||||
import type { User } from '@/types/models';
|
import type { User } from '@/types/models';
|
||||||
import TimezoneMismatchModal from '@/packages/ui/src/TimezoneMismatchModal.vue';
|
import TimezoneMismatchModal from '@/packages/ui/src/TimezoneMismatchModal.vue';
|
||||||
import { useUpdateUserMutation } from '@/utils/useUserQuery';
|
|
||||||
|
|
||||||
const show = defineModel('show', { default: false });
|
const show = defineModel('show', { default: false });
|
||||||
|
const saving = ref(false);
|
||||||
|
|
||||||
const page = usePage<{
|
const page = usePage<{
|
||||||
auth: {
|
auth: {
|
||||||
@@ -12,28 +13,33 @@ const page = usePage<{
|
|||||||
};
|
};
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
const updateUser = useUpdateUserMutation();
|
function handleUpdate(timezone: string) {
|
||||||
|
saving.value = true;
|
||||||
|
const form = useForm({
|
||||||
|
_method: 'PUT',
|
||||||
|
timezone: timezone,
|
||||||
|
name: page.props.auth.user.name,
|
||||||
|
email: page.props.auth.user.email,
|
||||||
|
week_start: page.props.auth.user.week_start,
|
||||||
|
});
|
||||||
|
|
||||||
async function handleUpdate(timezone: string) {
|
form.post(route('user-profile-information.update'), {
|
||||||
try {
|
errorBag: 'updateProfileInformation',
|
||||||
await updateUser.mutateAsync({
|
preserveScroll: true,
|
||||||
userId: page.props.auth.user.id,
|
onSuccess: () => {
|
||||||
body: { timezone },
|
saving.value = false;
|
||||||
});
|
show.value = false;
|
||||||
show.value = false;
|
location.reload();
|
||||||
// reload the whole page to re-read the timezone update
|
},
|
||||||
location.reload();
|
onError: () => {
|
||||||
} catch {
|
saving.value = false;
|
||||||
// notification handled by mutation
|
},
|
||||||
}
|
});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TimezoneMismatchModal
|
<TimezoneMismatchModal v-model:show="show" :saving="saving" @update="handleUpdate" />
|
||||||
v-model:show="show"
|
|
||||||
:saving="updateUser.isPending.value"
|
|
||||||
@update="handleUpdate" />
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped></style>
|
<style scoped></style>
|
||||||
|
|||||||
@@ -63,7 +63,7 @@ const max = computed(() => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
const backgroundColor = useCssVariable('--theme-color-card-background');
|
const backgroundColor = useCssVariable('--theme-color-card-background');
|
||||||
const borderColor = useCssVariable('--color-border-secondary');
|
const borderColor = useCssVariable('--color-border');
|
||||||
const labelColor = useCssVariable('--color-text-secondary');
|
const labelColor = useCssVariable('--color-text-secondary');
|
||||||
const chartColorRaw = useCssVariable('--theme-color-chart');
|
const chartColorRaw = useCssVariable('--theme-color-chart');
|
||||||
|
|
||||||
|
|||||||
@@ -146,10 +146,7 @@ const changeSummary = computed<PlanLine[]>(() => {
|
|||||||
{ times: range(plan.breakSlot), label: 'Break' },
|
{ times: range(plan.breakSlot), label: 'Break' },
|
||||||
{ times: range(plan.secondHalf), label: workLabel },
|
{ times: range(plan.secondHalf), label: workLabel },
|
||||||
...plan.shifted.map((shift) => ({
|
...plan.shifted.map((shift) => ({
|
||||||
times: moved(
|
times: moved(req.otherEntries.find((e) => e.id === shift.id)!, shift),
|
||||||
req.otherEntries.find((e) => e.id === shift.id)!,
|
|
||||||
shift
|
|
||||||
),
|
|
||||||
label: props.entryLabel(shift.id),
|
label: props.entryLabel(shift.id),
|
||||||
})),
|
})),
|
||||||
];
|
];
|
||||||
|
|||||||
@@ -161,7 +161,7 @@ const emit = defineEmits<{
|
|||||||
:organization-billable-rate="organization?.billable_rate ?? null"
|
:organization-billable-rate="organization?.billable_rate ?? null"
|
||||||
:no-project-value="null"
|
:no-project-value="null"
|
||||||
align="start"
|
align="start"
|
||||||
@changed="(p: string | null, t: string | null) => emit('add-row', p, t)">
|
@changed="(p, t) => emit('add-row', p, t)">
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<Button variant="ghost" size="sm" class="text-text-secondary">
|
<Button variant="ghost" size="sm" class="text-text-secondary">
|
||||||
<PlusIcon class="h-4 w-4 mr-1 text-icon-default" />
|
<PlusIcon class="h-4 w-4 mr-1 text-icon-default" />
|
||||||
|
|||||||
@@ -25,21 +25,16 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
|
|||||||
<template>
|
<template>
|
||||||
<AlertDialogPortal>
|
<AlertDialogPortal>
|
||||||
<AlertDialogOverlay
|
<AlertDialogOverlay
|
||||||
class="fixed inset-0 z-50 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0">
|
class="fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0" />
|
||||||
<div class="absolute inset-0 bg-default-background opacity-30" />
|
<AlertDialogContent
|
||||||
</AlertDialogOverlay>
|
v-bind="forwarded"
|
||||||
<div
|
:class="
|
||||||
class="fixed top-0 left-0 z-50 pointer-events-none w-screen h-screen flex items-start px-2 pt-3 md:pt-14 xl:pt-24 justify-center overflow-auto">
|
cn(
|
||||||
<AlertDialogContent
|
'fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',
|
||||||
v-bind="forwarded"
|
props.class
|
||||||
:class="
|
)
|
||||||
cn(
|
">
|
||||||
'pointer-events-auto bg-default-background grid w-full max-w-lg gap-4 border border-border-tertiary p-6 shadow-lg duration-200 rounded-lg outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',
|
<slot />
|
||||||
props.class
|
</AlertDialogContent>
|
||||||
)
|
|
||||||
">
|
|
||||||
<slot />
|
|
||||||
</AlertDialogContent>
|
|
||||||
</div>
|
|
||||||
</AlertDialogPortal>
|
</AlertDialogPortal>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -253,9 +253,7 @@ const page = usePage<{
|
|||||||
v-if="isInvoicingActivated() && canViewInvoices()"
|
v-if="isInvoicingActivated() && canViewInvoices()"
|
||||||
title="Invoices"
|
title="Invoices"
|
||||||
:icon="DocumentTextIcon"
|
:icon="DocumentTextIcon"
|
||||||
:current="
|
:current="route().current('invoices')"
|
||||||
route().current('invoices') || route().current('invoices.*')
|
|
||||||
"
|
|
||||||
href="/invoices"></NavigationSidebarItem>
|
href="/invoices"></NavigationSidebarItem>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
|||||||
@@ -8,13 +8,9 @@ import { Field, FieldLabel, FieldError } from '@/packages/ui/src/field';
|
|||||||
import PrimaryButton from '@/packages/ui/src/Buttons/PrimaryButton.vue';
|
import PrimaryButton from '@/packages/ui/src/Buttons/PrimaryButton.vue';
|
||||||
import TextInput from '@/packages/ui/src/Input/TextInput.vue';
|
import TextInput from '@/packages/ui/src/Input/TextInput.vue';
|
||||||
|
|
||||||
const props = defineProps<{
|
|
||||||
email: string;
|
|
||||||
}>();
|
|
||||||
|
|
||||||
const form = useForm({
|
const form = useForm({
|
||||||
name: '',
|
name: '',
|
||||||
email: props.email,
|
email: '',
|
||||||
password: '',
|
password: '',
|
||||||
password_confirmation: '',
|
password_confirmation: '',
|
||||||
terms: false,
|
terms: false,
|
||||||
|
|||||||
@@ -11,8 +11,8 @@ import ClientCreateModal from '@/Components/Common/Client/ClientCreateModal.vue'
|
|||||||
import PageTitle from '@/Components/Common/PageTitle.vue';
|
import PageTitle from '@/Components/Common/PageTitle.vue';
|
||||||
import { canCreateClients } from '@/utils/permissions';
|
import { canCreateClients } from '@/utils/permissions';
|
||||||
import { TabBar, TabBarItem } from '@/packages/ui/src';
|
import { TabBar, TabBarItem } from '@/packages/ui/src';
|
||||||
import { useTableSortState } from '@/utils/useTableSortState';
|
import { useStorage } from '@vueuse/core';
|
||||||
import type { SortColumn } from '@/Components/Common/Client/ClientTable.vue';
|
import type { SortColumn, SortDirection } from '@/Components/Common/Client/ClientTable.vue';
|
||||||
|
|
||||||
const { clients } = useClientsQuery();
|
const { clients } = useClientsQuery();
|
||||||
|
|
||||||
@@ -20,10 +20,25 @@ const activeTab = ref<'active' | 'archived'>('active');
|
|||||||
|
|
||||||
const createClient = ref(false);
|
const createClient = ref(false);
|
||||||
|
|
||||||
const { tableState, handleSort } = useTableSortState<SortColumn>('client-table-state', {
|
interface ClientTableState {
|
||||||
sortColumn: 'name',
|
sortColumn: SortColumn;
|
||||||
sortDirection: 'asc',
|
sortDirection: SortDirection;
|
||||||
});
|
}
|
||||||
|
|
||||||
|
const tableState = useStorage<ClientTableState>(
|
||||||
|
'client-table-state',
|
||||||
|
{
|
||||||
|
sortColumn: 'name',
|
||||||
|
sortDirection: 'asc',
|
||||||
|
},
|
||||||
|
undefined,
|
||||||
|
{ mergeDefaults: true }
|
||||||
|
);
|
||||||
|
|
||||||
|
function handleSort(column: SortColumn, direction: SortDirection) {
|
||||||
|
tableState.value.sortColumn = column;
|
||||||
|
tableState.value.sortDirection = direction;
|
||||||
|
}
|
||||||
|
|
||||||
const shownClients = computed(() => {
|
const shownClients = computed(() => {
|
||||||
return clients.value.filter((client) => {
|
return clients.value.filter((client) => {
|
||||||
|
|||||||
@@ -12,8 +12,8 @@ import type { Role } from '@/types/jetstream';
|
|||||||
import PageTitle from '@/Components/Common/PageTitle.vue';
|
import PageTitle from '@/Components/Common/PageTitle.vue';
|
||||||
import InvitationTable from '@/Components/Common/Invitation/InvitationTable.vue';
|
import InvitationTable from '@/Components/Common/Invitation/InvitationTable.vue';
|
||||||
import { canCreateInvitations } from '@/utils/permissions';
|
import { canCreateInvitations } from '@/utils/permissions';
|
||||||
import { useTableSortState } from '@/utils/useTableSortState';
|
import { useStorage } from '@vueuse/core';
|
||||||
import type { SortColumn } from '@/Components/Common/Member/MemberTable.vue';
|
import type { SortColumn, SortDirection } from '@/Components/Common/Member/MemberTable.vue';
|
||||||
|
|
||||||
const inviteMember = ref(false);
|
const inviteMember = ref(false);
|
||||||
|
|
||||||
@@ -23,10 +23,25 @@ defineProps<{
|
|||||||
|
|
||||||
const activeTab = ref<'all' | 'invitations'>('all');
|
const activeTab = ref<'all' | 'invitations'>('all');
|
||||||
|
|
||||||
const { tableState, handleSort } = useTableSortState<SortColumn>('member-table-state', {
|
interface MemberTableState {
|
||||||
sortColumn: 'name',
|
sortColumn: SortColumn;
|
||||||
sortDirection: 'asc',
|
sortDirection: SortDirection;
|
||||||
});
|
}
|
||||||
|
|
||||||
|
const tableState = useStorage<MemberTableState>(
|
||||||
|
'member-table-state',
|
||||||
|
{
|
||||||
|
sortColumn: 'name',
|
||||||
|
sortDirection: 'asc',
|
||||||
|
},
|
||||||
|
undefined,
|
||||||
|
{ mergeDefaults: true }
|
||||||
|
);
|
||||||
|
|
||||||
|
function handleSort(column: SortColumn, direction: SortDirection) {
|
||||||
|
tableState.value.sortColumn = column;
|
||||||
|
tableState.value.sortDirection = direction;
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|||||||
@@ -35,7 +35,8 @@ async function deleteUser() {
|
|||||||
} catch (error) {
|
} catch (error) {
|
||||||
if (error && typeof error === 'object' && 'response' in error) {
|
if (error && typeof error === 'object' && 'response' in error) {
|
||||||
const response = error.response as
|
const response = error.response as
|
||||||
{ status?: number; data?: { errors?: { password?: string[] } } } | undefined;
|
| { status?: number; data?: { errors?: { password?: string[] } } }
|
||||||
|
| undefined;
|
||||||
if (response?.status === 422) {
|
if (response?.status === 422) {
|
||||||
passwordError.value = response.data?.errors?.password?.[0] ?? 'Invalid password.';
|
passwordError.value = response.data?.errors?.password?.[0] ?? 'Invalid password.';
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,103 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import { computed, ref, watch } from 'vue';
|
|
||||||
import ActionMessage from '@/Components/ActionMessage.vue';
|
|
||||||
import FormSection from '@/Components/FormSection.vue';
|
|
||||||
import PrimaryButton from '@/packages/ui/src/Buttons/PrimaryButton.vue';
|
|
||||||
import { Checkbox } from '@/packages/ui/src';
|
|
||||||
import {
|
|
||||||
Field,
|
|
||||||
FieldContent,
|
|
||||||
FieldDescription,
|
|
||||||
FieldError,
|
|
||||||
FieldLabel,
|
|
||||||
} from '@/packages/ui/src/field';
|
|
||||||
import { getApiValidationFieldErrors } from '@/utils/apiValidation';
|
|
||||||
import { useUpdateUserMutation, useUserQuery } from '@/utils/useUserQuery';
|
|
||||||
|
|
||||||
const { user } = useUserQuery();
|
|
||||||
const updateUser = useUpdateUserMutation();
|
|
||||||
|
|
||||||
const sendTimeEntryStillRunningEmail = ref(true);
|
|
||||||
const recentlySaved = ref(false);
|
|
||||||
|
|
||||||
watch(
|
|
||||||
user,
|
|
||||||
(currentUser, previousUser) => {
|
|
||||||
if (currentUser && previousUser === undefined) {
|
|
||||||
sendTimeEntryStillRunningEmail.value = currentUser.send_time_entry_still_running_email;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ immediate: true }
|
|
||||||
);
|
|
||||||
|
|
||||||
const isUserLoaded = computed(() => user.value !== undefined);
|
|
||||||
const isSaveDisabled = computed(() => !isUserLoaded.value || updateUser.isPending.value);
|
|
||||||
const fieldErrors = computed<Record<string, string>>(() =>
|
|
||||||
getApiValidationFieldErrors(updateUser.error.value)
|
|
||||||
);
|
|
||||||
|
|
||||||
async function save() {
|
|
||||||
if (isSaveDisabled.value || !user.value) return;
|
|
||||||
|
|
||||||
if (sendTimeEntryStillRunningEmail.value === user.value.send_time_entry_still_running_email) {
|
|
||||||
flashSaved();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
const updatedUser = await updateUser.mutateAsync({
|
|
||||||
userId: user.value.id,
|
|
||||||
body: {
|
|
||||||
send_time_entry_still_running_email: sendTimeEntryStillRunningEmail.value,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
sendTimeEntryStillRunningEmail.value = updatedUser.send_time_entry_still_running_email;
|
|
||||||
flashSaved();
|
|
||||||
} catch {
|
|
||||||
// 422: field errors render below. Other errors: toast handled in the mutation.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function flashSaved() {
|
|
||||||
recentlySaved.value = true;
|
|
||||||
setTimeout(() => (recentlySaved.value = false), 2000);
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<FormSection @submitted="save">
|
|
||||||
<template #title>Notifications</template>
|
|
||||||
|
|
||||||
<template #description>Choose which email notifications you want to receive.</template>
|
|
||||||
|
|
||||||
<template #form>
|
|
||||||
<div class="col-span-6 sm:col-span-4">
|
|
||||||
<Field orientation="horizontal">
|
|
||||||
<Checkbox
|
|
||||||
id="send_time_entry_still_running_email"
|
|
||||||
v-model:checked="sendTimeEntryStillRunningEmail"
|
|
||||||
:disabled="!isUserLoaded" />
|
|
||||||
<FieldContent>
|
|
||||||
<FieldLabel for="send_time_entry_still_running_email">
|
|
||||||
Still-running time entry reminders
|
|
||||||
</FieldLabel>
|
|
||||||
<FieldDescription>
|
|
||||||
Email me when a time entry has been running for more than 8 hours.
|
|
||||||
</FieldDescription>
|
|
||||||
</FieldContent>
|
|
||||||
</Field>
|
|
||||||
<FieldError v-if="fieldErrors.send_time_entry_still_running_email">
|
|
||||||
{{ fieldErrors.send_time_entry_still_running_email }}
|
|
||||||
</FieldError>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #actions>
|
|
||||||
<ActionMessage :on="recentlySaved" class="me-3">Saved.</ActionMessage>
|
|
||||||
|
|
||||||
<PrimaryButton :class="{ 'opacity-25': isSaveDisabled }" :disabled="isSaveDisabled">
|
|
||||||
Save
|
|
||||||
</PrimaryButton>
|
|
||||||
</template>
|
|
||||||
</FormSection>
|
|
||||||
</template>
|
|
||||||
@@ -9,7 +9,6 @@ import UpdateProfileInformationForm from '@/Pages/Profile/Partials/UpdateProfile
|
|||||||
import type { Session } from '@/types/jetstream';
|
import type { Session } from '@/types/jetstream';
|
||||||
import ApiTokensForm from '@/Pages/Profile/Partials/ApiTokensForm.vue';
|
import ApiTokensForm from '@/Pages/Profile/Partials/ApiTokensForm.vue';
|
||||||
import ThemeForm from '@/Pages/Profile/Partials/ThemeForm.vue';
|
import ThemeForm from '@/Pages/Profile/Partials/ThemeForm.vue';
|
||||||
import NotificationSettingsForm from '@/Pages/Profile/Partials/NotificationSettingsForm.vue';
|
|
||||||
|
|
||||||
defineProps<{
|
defineProps<{
|
||||||
confirmsTwoFactorAuthentication: boolean;
|
confirmsTwoFactorAuthentication: boolean;
|
||||||
@@ -37,12 +36,6 @@ defineProps<{
|
|||||||
<SectionBorder />
|
<SectionBorder />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
|
||||||
<NotificationSettingsForm />
|
|
||||||
|
|
||||||
<SectionBorder />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<UpdatePasswordForm class="mt-10 sm:mt-0" />
|
<UpdatePasswordForm class="mt-10 sm:mt-0" />
|
||||||
|
|
||||||
|
|||||||
@@ -15,7 +15,6 @@ import {
|
|||||||
import { Link } from '@inertiajs/vue3';
|
import { Link } from '@inertiajs/vue3';
|
||||||
import TaskCreateModal from '@/Components/Common/Task/TaskCreateModal.vue';
|
import TaskCreateModal from '@/Components/Common/Task/TaskCreateModal.vue';
|
||||||
import TaskTable from '@/Components/Common/Task/TaskTable.vue';
|
import TaskTable from '@/Components/Common/Task/TaskTable.vue';
|
||||||
import type { SortColumn } from '@/Components/Common/Task/TaskTable.vue';
|
|
||||||
import CardTitle from '@/packages/ui/src/CardTitle.vue';
|
import CardTitle from '@/packages/ui/src/CardTitle.vue';
|
||||||
import Card from '@/Components/Common/Card.vue';
|
import Card from '@/Components/Common/Card.vue';
|
||||||
import ProjectMemberTable from '@/Components/Common/ProjectMember/ProjectMemberTable.vue';
|
import ProjectMemberTable from '@/Components/Common/ProjectMember/ProjectMemberTable.vue';
|
||||||
@@ -30,7 +29,6 @@ import { formatCents } from '../packages/ui/src/utils/money';
|
|||||||
import { getOrganizationCurrencyString } from '../utils/money';
|
import { getOrganizationCurrencyString } from '../utils/money';
|
||||||
import { useOrganizationQuery } from '@/utils/useOrganizationQuery';
|
import { useOrganizationQuery } from '@/utils/useOrganizationQuery';
|
||||||
import { getCurrentOrganizationId } from '@/utils/useUser';
|
import { getCurrentOrganizationId } from '@/utils/useUser';
|
||||||
import { useTableSortState } from '@/utils/useTableSortState';
|
|
||||||
|
|
||||||
const { projects } = useProjectsQuery();
|
const { projects } = useProjectsQuery();
|
||||||
|
|
||||||
@@ -67,11 +65,6 @@ const activeTab = ref<'active' | 'done'>('active');
|
|||||||
|
|
||||||
const { tasks } = useTasksQuery();
|
const { tasks } = useTasksQuery();
|
||||||
|
|
||||||
const { tableState, handleSort } = useTableSortState<SortColumn>('task-table-state', {
|
|
||||||
sortColumn: 'name',
|
|
||||||
sortDirection: 'asc',
|
|
||||||
});
|
|
||||||
|
|
||||||
const shownTasks = computed(() => {
|
const shownTasks = computed(() => {
|
||||||
return tasks.value.filter((task) => {
|
return tasks.value.filter((task) => {
|
||||||
if (activeTab.value === 'active') {
|
if (activeTab.value === 'active') {
|
||||||
@@ -166,12 +159,7 @@ const shownTasks = computed(() => {
|
|||||||
</template>
|
</template>
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
<Card>
|
<Card>
|
||||||
<TaskTable
|
<TaskTable :tasks="shownTasks" :project-id="projectId"></TaskTable>
|
||||||
:tasks="shownTasks"
|
|
||||||
:project-id="projectId"
|
|
||||||
:sort-column="tableState.sortColumn"
|
|
||||||
:sort-direction="tableState.sortDirection"
|
|
||||||
@sort="handleSort"></TaskTable>
|
|
||||||
</Card>
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="canViewProjectMembers()">
|
<div v-if="canViewProjectMembers()">
|
||||||
|
|||||||
@@ -1,12 +1,10 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import AppLayout from '@/Layouts/AppLayout.vue';
|
|
||||||
import MainContainer from '@/packages/ui/src/MainContainer.vue';
|
import MainContainer from '@/packages/ui/src/MainContainer.vue';
|
||||||
|
import AppLayout from '@/Layouts/AppLayout.vue';
|
||||||
import { FolderIcon, PlusIcon } from '@heroicons/vue/20/solid';
|
import { FolderIcon, PlusIcon } from '@heroicons/vue/20/solid';
|
||||||
import { Search } from '@lucide/vue';
|
|
||||||
import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
|
import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
|
||||||
import ProjectTable from '@/Components/Common/Project/ProjectTable.vue';
|
import ProjectTable from '@/Components/Common/Project/ProjectTable.vue';
|
||||||
import TextInput from '@/packages/ui/src/Input/TextInput.vue';
|
import { computed } from 'vue';
|
||||||
import { computed, ref } from 'vue';
|
|
||||||
import { useProjectsQuery } from '@/utils/useProjectsQuery';
|
import { useProjectsQuery } from '@/utils/useProjectsQuery';
|
||||||
import { useProjectsStore } from '@/utils/useProjects';
|
import { useProjectsStore } from '@/utils/useProjects';
|
||||||
import ProjectCreateModal from '@/packages/ui/src/Project/ProjectCreateModal.vue';
|
import ProjectCreateModal from '@/packages/ui/src/Project/ProjectCreateModal.vue';
|
||||||
@@ -20,7 +18,6 @@ import { getCurrentOrganizationId, getCurrentRole } from '@/utils/useUser';
|
|||||||
import { useOrganizationQuery } from '@/utils/useOrganizationQuery';
|
import { useOrganizationQuery } from '@/utils/useOrganizationQuery';
|
||||||
import { isAllowedToPerformPremiumAction } from '@/utils/billing';
|
import { isAllowedToPerformPremiumAction } from '@/utils/billing';
|
||||||
import { useStorage } from '@vueuse/core';
|
import { useStorage } from '@vueuse/core';
|
||||||
import { useTableSortState } from '@/utils/useTableSortState';
|
|
||||||
import ProjectsFilterDropdown from '@/Components/Common/Project/ProjectsFilterDropdown.vue';
|
import ProjectsFilterDropdown from '@/Components/Common/Project/ProjectsFilterDropdown.vue';
|
||||||
import ProjectStatusFilterBadge from '@/Components/Common/Project/ProjectStatusFilterBadge.vue';
|
import ProjectStatusFilterBadge from '@/Components/Common/Project/ProjectStatusFilterBadge.vue';
|
||||||
import ProjectVisibilityFilterBadge from '@/Components/Common/Project/ProjectVisibilityFilterBadge.vue';
|
import ProjectVisibilityFilterBadge from '@/Components/Common/Project/ProjectVisibilityFilterBadge.vue';
|
||||||
@@ -29,7 +26,7 @@ import { NO_CLIENT_ID } from '@/Components/Common/Project/constants';
|
|||||||
import type { SortColumn, SortDirection } from '@/Components/Common/Project/ProjectTable.vue';
|
import type { SortColumn, SortDirection } from '@/Components/Common/Project/ProjectTable.vue';
|
||||||
|
|
||||||
// Fetch data using TanStack Query
|
// Fetch data using TanStack Query
|
||||||
const { projects, isLoading: projectsLoading } = useProjectsQuery();
|
const { projects } = useProjectsQuery();
|
||||||
const { clients } = useClientsQuery();
|
const { clients } = useClientsQuery();
|
||||||
const { organization } = useOrganizationQuery(getCurrentOrganizationId()!);
|
const { organization } = useOrganizationQuery(getCurrentOrganizationId()!);
|
||||||
|
|
||||||
@@ -44,7 +41,7 @@ interface ProjectTableState {
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
const { tableState, handleSort } = useTableSortState<SortColumn, ProjectTableState>(
|
const tableState = useStorage<ProjectTableState>(
|
||||||
'project-table-state',
|
'project-table-state',
|
||||||
{
|
{
|
||||||
sortColumn: 'name',
|
sortColumn: 'name',
|
||||||
@@ -55,28 +52,24 @@ const { tableState, handleSort } = useTableSortState<SortColumn, ProjectTableSta
|
|||||||
visibility: 'all',
|
visibility: 'all',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
// The filters are merged key by key so a stored value missing a newer filter still
|
undefined,
|
||||||
// picks up its default instead of the whole object falling back.
|
{
|
||||||
(storage, defaults) => ({
|
mergeDefaults: (storage, defaults) => ({
|
||||||
...defaults,
|
...defaults,
|
||||||
...storage,
|
...storage,
|
||||||
filters: { ...defaults.filters, ...storage.filters },
|
filters: { ...defaults.filters, ...storage.filters },
|
||||||
})
|
}),
|
||||||
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
// Not persisted, so a reload never starts silently filtered
|
function handleSort(column: SortColumn, direction: SortDirection) {
|
||||||
const search = ref('');
|
tableState.value.sortColumn = column;
|
||||||
|
tableState.value.sortDirection = direction;
|
||||||
|
}
|
||||||
|
|
||||||
// Filter projects based on current filters
|
// Filter projects based on current filters
|
||||||
const filteredProjects = computed(() => {
|
const filteredProjects = computed(() => {
|
||||||
const searchTerm = search.value.trim().toLowerCase();
|
|
||||||
|
|
||||||
return projects.value.filter((project) => {
|
return projects.value.filter((project) => {
|
||||||
// Name search
|
|
||||||
if (searchTerm && !project.name.toLowerCase().includes(searchTerm)) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Status filter
|
// Status filter
|
||||||
if (tableState.value.filters.status === 'active' && project.is_archived) {
|
if (tableState.value.filters.status === 'active' && project.is_archived) {
|
||||||
return false;
|
return false;
|
||||||
@@ -110,15 +103,6 @@ const filteredProjects = computed(() => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
const hasActiveFilters = computed(() => {
|
|
||||||
return (
|
|
||||||
search.value.trim() !== '' ||
|
|
||||||
tableState.value.filters.status !== 'all' ||
|
|
||||||
tableState.value.filters.visibility !== 'all' ||
|
|
||||||
tableState.value.filters.clientIds.length > 0
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Helper functions for active filters
|
// Helper functions for active filters
|
||||||
function removeStatusFilter() {
|
function removeStatusFilter() {
|
||||||
tableState.value.filters.status = 'all';
|
tableState.value.filters.status = 'all';
|
||||||
@@ -151,7 +135,8 @@ const showBillableRate = computed(() => {
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<AppLayout title="Projects" data-testid="projects_view">
|
<AppLayout title="Projects" data-testid="projects_view">
|
||||||
<MainContainer class="py-3 sm:pt-5 flex justify-between items-center">
|
<MainContainer
|
||||||
|
class="py-3 sm:pt-5 border-b border-default-background-separator flex justify-between items-center">
|
||||||
<div class="flex items-center space-x-3 sm:space-x-6">
|
<div class="flex items-center space-x-3 sm:space-x-6">
|
||||||
<PageTitle :icon="FolderIcon" title="Projects"></PageTitle>
|
<PageTitle :icon="FolderIcon" title="Projects"></PageTitle>
|
||||||
</div>
|
</div>
|
||||||
@@ -204,25 +189,11 @@ const showBillableRate = computed(() => {
|
|||||||
:clients="clients"
|
:clients="clients"
|
||||||
@remove="removeClientFilter"
|
@remove="removeClientFilter"
|
||||||
@update:value="tableState.filters.clientIds = $event as string[]" />
|
@update:value="tableState.filters.clientIds = $event as string[]" />
|
||||||
|
|
||||||
<div class="relative">
|
|
||||||
<Search
|
|
||||||
class="pointer-events-none absolute left-2 top-1/2 h-4 w-4 -translate-y-1/2 text-icon-default" />
|
|
||||||
<TextInput
|
|
||||||
v-model="search"
|
|
||||||
size="sm"
|
|
||||||
type="search"
|
|
||||||
aria-label="Search projects"
|
|
||||||
placeholder="Search projects..."
|
|
||||||
class="w-60 border-transparent bg-transparent pl-7 shadow-none placeholder:text-text-tertiary hover:bg-black/5 focus-visible:bg-input-background dark:hover:bg-white/5 [&::-webkit-search-cancel-button]:hidden" />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</MainContainer>
|
</MainContainer>
|
||||||
|
|
||||||
<ProjectTable
|
<ProjectTable
|
||||||
:show-billable-rate="showBillableRate"
|
:show-billable-rate="showBillableRate"
|
||||||
:is-filtered="hasActiveFilters"
|
|
||||||
:is-loading="projectsLoading"
|
|
||||||
:projects="filteredProjects"
|
:projects="filteredProjects"
|
||||||
:sort-column="tableState.sortColumn"
|
:sort-column="tableState.sortColumn"
|
||||||
:sort-direction="tableState.sortDirection"
|
:sort-direction="tableState.sortDirection"
|
||||||
|
|||||||
@@ -9,7 +9,7 @@ import {
|
|||||||
ArrowDownTrayIcon,
|
ArrowDownTrayIcon,
|
||||||
LockClosedIcon,
|
LockClosedIcon,
|
||||||
} from '@heroicons/vue/20/solid';
|
} from '@heroicons/vue/20/solid';
|
||||||
import Pagination from '@/packages/ui/src/Pagination.vue';
|
import Pagination from '@/Components/Common/Pagination.vue';
|
||||||
import {
|
import {
|
||||||
DropdownMenu,
|
DropdownMenu,
|
||||||
DropdownMenuContent,
|
DropdownMenuContent,
|
||||||
|
|||||||
@@ -9,15 +9,30 @@ import TagCreateModal from '@/packages/ui/src/Tag/TagCreateModal.vue';
|
|||||||
import PageTitle from '@/Components/Common/PageTitle.vue';
|
import PageTitle from '@/Components/Common/PageTitle.vue';
|
||||||
import { canCreateTags } from '@/utils/permissions';
|
import { canCreateTags } from '@/utils/permissions';
|
||||||
import { useTagsStore } from '@/utils/useTags';
|
import { useTagsStore } from '@/utils/useTags';
|
||||||
import { useTableSortState } from '@/utils/useTableSortState';
|
import { useStorage } from '@vueuse/core';
|
||||||
import type { SortColumn } from '@/Components/Common/Tag/TagTable.vue';
|
import type { SortColumn, SortDirection } from '@/Components/Common/Tag/TagTable.vue';
|
||||||
|
|
||||||
const showCreateTagModal = ref(false);
|
const showCreateTagModal = ref(false);
|
||||||
|
|
||||||
const { tableState, handleSort } = useTableSortState<SortColumn>('tag-table-state', {
|
interface TagTableState {
|
||||||
sortColumn: 'name',
|
sortColumn: SortColumn;
|
||||||
sortDirection: 'asc',
|
sortDirection: SortDirection;
|
||||||
});
|
}
|
||||||
|
|
||||||
|
const tableState = useStorage<TagTableState>(
|
||||||
|
'tag-table-state',
|
||||||
|
{
|
||||||
|
sortColumn: 'name',
|
||||||
|
sortDirection: 'asc',
|
||||||
|
},
|
||||||
|
undefined,
|
||||||
|
{ mergeDefaults: true }
|
||||||
|
);
|
||||||
|
|
||||||
|
function handleSort(column: SortColumn, direction: SortDirection) {
|
||||||
|
tableState.value.sortColumn = column;
|
||||||
|
tableState.value.sortDirection = direction;
|
||||||
|
}
|
||||||
|
|
||||||
async function createTag(tag: string) {
|
async function createTag(tag: string) {
|
||||||
return await useTagsStore().createTag(tag);
|
return await useTagsStore().createTag(tag);
|
||||||
|
|||||||
@@ -38,7 +38,8 @@ const deleteTeam = async () => {
|
|||||||
} catch (error) {
|
} catch (error) {
|
||||||
if (error && typeof error === 'object' && 'response' in error) {
|
if (error && typeof error === 'object' && 'response' in error) {
|
||||||
const response = error.response as
|
const response = error.response as
|
||||||
{ status?: number; data?: { errors?: { password?: string[] } } } | undefined;
|
| { status?: number; data?: { errors?: { password?: string[] } } }
|
||||||
|
| undefined;
|
||||||
if (response?.status === 422) {
|
if (response?.status === 422) {
|
||||||
passwordError.value = response.data?.errors?.password?.[0] ?? 'Invalid password.';
|
passwordError.value = response.data?.errors?.password?.[0] ?? 'Invalid password.';
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -118,11 +118,6 @@ export type DetailedInvoiceResponse = ZodiosResponseByAlias<SolidTimeApi, 'getIn
|
|||||||
export type DetailedInvoice = DetailedInvoiceResponse['data'];
|
export type DetailedInvoice = DetailedInvoiceResponse['data'];
|
||||||
|
|
||||||
export type InvoiceIndexEntry = ZodiosResponseByAlias<SolidTimeApi, 'getInvoices'>['data'][0];
|
export type InvoiceIndexEntry = ZodiosResponseByAlias<SolidTimeApi, 'getInvoices'>['data'][0];
|
||||||
export type InvoiceRecipient = ZodiosResponseByAlias<
|
|
||||||
SolidTimeApi,
|
|
||||||
'getInvoiceRecipients'
|
|
||||||
>['data'][0];
|
|
||||||
export type InvoiceRecipientBody = ZodiosBodyByAlias<SolidTimeApi, 'createInvoiceRecipient'>;
|
|
||||||
|
|
||||||
export type UpdateInvoiceSettings = ZodiosBodyByAlias<SolidTimeApi, 'updateInvoiceSettings'>;
|
export type UpdateInvoiceSettings = ZodiosBodyByAlias<SolidTimeApi, 'updateInvoiceSettings'>;
|
||||||
|
|
||||||
|
|||||||
@@ -45,54 +45,14 @@ const InvitationResource = z
|
|||||||
const InvitationStoreRequest = z
|
const InvitationStoreRequest = z
|
||||||
.object({ email: z.string().email(), role: z.enum(['admin', 'manager', 'employee']) })
|
.object({ email: z.string().email(), role: z.enum(['admin', 'manager', 'employee']) })
|
||||||
.passthrough();
|
.passthrough();
|
||||||
const InvoiceRecipientResource = z
|
|
||||||
.object({
|
|
||||||
id: z.string(),
|
|
||||||
organization_id: z.string(),
|
|
||||||
name: z.string(),
|
|
||||||
vatin: z.union([z.string(), z.null()]),
|
|
||||||
address_line_1: z.union([z.string(), z.null()]),
|
|
||||||
address_line_2: z.union([z.string(), z.null()]),
|
|
||||||
address_line_3: z.union([z.string(), z.null()]),
|
|
||||||
address_post_code: z.union([z.string(), z.null()]),
|
|
||||||
address_city: z.union([z.string(), z.null()]),
|
|
||||||
address_country: z.union([z.string(), z.null()]),
|
|
||||||
phone: z.union([z.string(), z.null()]),
|
|
||||||
email: z.union([z.string(), z.null()]),
|
|
||||||
is_archived: z.boolean(),
|
|
||||||
archived_at: z.union([z.string(), z.null()]),
|
|
||||||
invoices_count: z.number().int(),
|
|
||||||
has_non_draft_invoices: z.boolean(),
|
|
||||||
created_at: z.union([z.string(), z.null()]),
|
|
||||||
updated_at: z.union([z.string(), z.null()]),
|
|
||||||
})
|
|
||||||
.passthrough();
|
|
||||||
const InvoiceRecipientCollection = z.array(InvoiceRecipientResource);
|
|
||||||
const InvoiceRecipientRequest = z
|
|
||||||
.object({
|
|
||||||
name: z.string(),
|
|
||||||
vatin: z.union([z.string(), z.null()]).optional(),
|
|
||||||
address_line_1: z.union([z.string(), z.null()]).optional(),
|
|
||||||
address_line_2: z.union([z.string(), z.null()]).optional(),
|
|
||||||
address_line_3: z.union([z.string(), z.null()]).optional(),
|
|
||||||
address_post_code: z.union([z.string(), z.null()]).optional(),
|
|
||||||
address_city: z.union([z.string(), z.null()]).optional(),
|
|
||||||
address_country: z.union([z.string(), z.null()]).optional(),
|
|
||||||
phone: z.union([z.string(), z.null()]).optional(),
|
|
||||||
email: z.union([z.string(), z.null()]).optional(),
|
|
||||||
is_archived: z.boolean().optional(),
|
|
||||||
})
|
|
||||||
.passthrough();
|
|
||||||
const InvoiceResource = z
|
const InvoiceResource = z
|
||||||
.object({
|
.object({
|
||||||
id: z.string(),
|
id: z.string(),
|
||||||
organization_id: z.string(),
|
organization_id: z.string(),
|
||||||
invoice_recipient_id: z.string(),
|
|
||||||
reference: z.string(),
|
reference: z.string(),
|
||||||
seller_name: z.string(),
|
seller_name: z.string(),
|
||||||
recipient: z.string(),
|
buyer_name: z.string(),
|
||||||
status: z.string(),
|
status: z.string(),
|
||||||
status_label: z.string(),
|
|
||||||
date: z.string(),
|
date: z.string(),
|
||||||
due_at: z.string(),
|
due_at: z.string(),
|
||||||
paid_date: z.string(),
|
paid_date: z.string(),
|
||||||
@@ -116,7 +76,16 @@ const InvoiceStoreRequest = z
|
|||||||
seller_address_country: z.union([z.string(), z.null()]).optional(),
|
seller_address_country: z.union([z.string(), z.null()]).optional(),
|
||||||
seller_phone: z.union([z.string(), z.null()]).optional(),
|
seller_phone: z.union([z.string(), z.null()]).optional(),
|
||||||
seller_email: z.union([z.string(), z.null()]).optional(),
|
seller_email: z.union([z.string(), z.null()]).optional(),
|
||||||
invoice_recipient_id: z.string(),
|
buyer_name: z.string(),
|
||||||
|
buyer_vatin: z.union([z.string(), z.null()]).optional(),
|
||||||
|
buyer_address_line_1: z.union([z.string(), z.null()]).optional(),
|
||||||
|
buyer_address_line_2: z.union([z.string(), z.null()]).optional(),
|
||||||
|
buyer_address_line_3: z.union([z.string(), z.null()]).optional(),
|
||||||
|
buyer_address_post_code: z.union([z.string(), z.null()]).optional(),
|
||||||
|
buyer_address_city: z.union([z.string(), z.null()]).optional(),
|
||||||
|
buyer_address_country: z.union([z.string(), z.null()]).optional(),
|
||||||
|
buyer_phone: z.union([z.string(), z.null()]).optional(),
|
||||||
|
buyer_email: z.union([z.string(), z.null()]).optional(),
|
||||||
date: z.string(),
|
date: z.string(),
|
||||||
billing_period_start: z.union([z.string(), z.null()]).optional(),
|
billing_period_start: z.union([z.string(), z.null()]).optional(),
|
||||||
billing_period_end: z.union([z.string(), z.null()]).optional(),
|
billing_period_end: z.union([z.string(), z.null()]).optional(),
|
||||||
@@ -161,7 +130,6 @@ const DetailedInvoiceResource = z
|
|||||||
.object({
|
.object({
|
||||||
id: z.string(),
|
id: z.string(),
|
||||||
organization_id: z.string(),
|
organization_id: z.string(),
|
||||||
invoice_recipient_id: z.string(),
|
|
||||||
reference: z.string(),
|
reference: z.string(),
|
||||||
seller_name: z.string(),
|
seller_name: z.string(),
|
||||||
seller_vatin: z.string(),
|
seller_vatin: z.string(),
|
||||||
@@ -173,7 +141,16 @@ const DetailedInvoiceResource = z
|
|||||||
seller_address_country: z.string(),
|
seller_address_country: z.string(),
|
||||||
seller_phone: z.string(),
|
seller_phone: z.string(),
|
||||||
seller_email: z.string(),
|
seller_email: z.string(),
|
||||||
recipient: InvoiceRecipientResource,
|
buyer_name: z.string(),
|
||||||
|
buyer_vatin: z.string(),
|
||||||
|
buyer_address_line_1: z.string(),
|
||||||
|
buyer_address_line_2: z.string(),
|
||||||
|
buyer_address_line_3: z.string(),
|
||||||
|
buyer_address_post_code: z.string(),
|
||||||
|
buyer_address_city: z.string(),
|
||||||
|
buyer_address_country: z.string(),
|
||||||
|
buyer_phone: z.string(),
|
||||||
|
buyer_email: z.string(),
|
||||||
paid_date: z.string(),
|
paid_date: z.string(),
|
||||||
due_at: z.string(),
|
due_at: z.string(),
|
||||||
discount_type: z.string(),
|
discount_type: z.string(),
|
||||||
@@ -194,7 +171,7 @@ const DetailedInvoiceResource = z
|
|||||||
entries: z.array(InvoiceEntryResource),
|
entries: z.array(InvoiceEntryResource),
|
||||||
})
|
})
|
||||||
.passthrough();
|
.passthrough();
|
||||||
const InvoiceStatus = z.enum(['draft', 'sent', 'paid', 'cancelled']);
|
const InvoiceStatus = z.enum(['draft', 'sent', 'cancelled']);
|
||||||
const InvoiceUpdateRequest = z
|
const InvoiceUpdateRequest = z
|
||||||
.object({
|
.object({
|
||||||
status: InvoiceStatus,
|
status: InvoiceStatus,
|
||||||
@@ -210,7 +187,16 @@ const InvoiceUpdateRequest = z
|
|||||||
seller_address_country: z.union([z.string(), z.null()]),
|
seller_address_country: z.union([z.string(), z.null()]),
|
||||||
seller_phone: z.union([z.string(), z.null()]),
|
seller_phone: z.union([z.string(), z.null()]),
|
||||||
seller_email: z.union([z.string(), z.null()]),
|
seller_email: z.union([z.string(), z.null()]),
|
||||||
invoice_recipient_id: z.string(),
|
buyer_name: z.string(),
|
||||||
|
buyer_vatin: z.union([z.string(), z.null()]),
|
||||||
|
buyer_address_line_1: z.union([z.string(), z.null()]),
|
||||||
|
buyer_address_line_2: z.union([z.string(), z.null()]),
|
||||||
|
buyer_address_line_3: z.union([z.string(), z.null()]),
|
||||||
|
buyer_address_post_code: z.union([z.string(), z.null()]),
|
||||||
|
buyer_address_city: z.union([z.string(), z.null()]),
|
||||||
|
buyer_address_country: z.union([z.string(), z.null()]),
|
||||||
|
buyer_phone: z.union([z.string(), z.null()]),
|
||||||
|
buyer_email: z.union([z.string(), z.null()]),
|
||||||
date: z.string(),
|
date: z.string(),
|
||||||
billing_period_start: z.union([z.string(), z.null()]),
|
billing_period_start: z.union([z.string(), z.null()]),
|
||||||
billing_period_end: z.union([z.string(), z.null()]),
|
billing_period_end: z.union([z.string(), z.null()]),
|
||||||
@@ -719,7 +705,6 @@ const UserResource = z
|
|||||||
profile_photo_url: z.string(),
|
profile_photo_url: z.string(),
|
||||||
timezone: z.string(),
|
timezone: z.string(),
|
||||||
week_start: Weekday,
|
week_start: Weekday,
|
||||||
send_time_entry_still_running_email: z.boolean(),
|
|
||||||
})
|
})
|
||||||
.passthrough();
|
.passthrough();
|
||||||
const UserUpdateRequest = z
|
const UserUpdateRequest = z
|
||||||
@@ -729,7 +714,6 @@ const UserUpdateRequest = z
|
|||||||
photo: z.union([z.string(), z.null()]),
|
photo: z.union([z.string(), z.null()]),
|
||||||
timezone: z.string(),
|
timezone: z.string(),
|
||||||
week_start: Weekday,
|
week_start: Weekday,
|
||||||
send_time_entry_still_running_email: z.boolean(),
|
|
||||||
})
|
})
|
||||||
.partial()
|
.partial()
|
||||||
.passthrough();
|
.passthrough();
|
||||||
@@ -1911,125 +1895,6 @@ const endpoints = makeApi([
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
|
||||||
method: 'get',
|
|
||||||
path: '/v1/organizations/:organization/invoice-recipients',
|
|
||||||
alias: 'getInvoiceRecipients',
|
|
||||||
requestFormat: 'json',
|
|
||||||
parameters: [
|
|
||||||
{
|
|
||||||
name: 'organization',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
],
|
|
||||||
response: z.object({ data: InvoiceRecipientCollection }).passthrough(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
method: 'post',
|
|
||||||
path: '/v1/organizations/:organization/invoice-recipients',
|
|
||||||
alias: 'createInvoiceRecipient',
|
|
||||||
requestFormat: 'json',
|
|
||||||
parameters: [
|
|
||||||
{
|
|
||||||
name: 'body',
|
|
||||||
type: 'Body',
|
|
||||||
schema: InvoiceRecipientRequest,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'organization',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
],
|
|
||||||
response: z.object({ data: InvoiceRecipientResource }).passthrough(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
method: 'get',
|
|
||||||
path: '/v1/organizations/:organization/invoice-recipients/:invoiceRecipient',
|
|
||||||
alias: 'getInvoiceRecipient',
|
|
||||||
requestFormat: 'json',
|
|
||||||
parameters: [
|
|
||||||
{
|
|
||||||
name: 'organization',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'invoiceRecipient',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
],
|
|
||||||
response: z.object({ data: InvoiceRecipientResource }).passthrough(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
method: 'put',
|
|
||||||
path: '/v1/organizations/:organization/invoice-recipients/:invoiceRecipient',
|
|
||||||
alias: 'updateInvoiceRecipient',
|
|
||||||
requestFormat: 'json',
|
|
||||||
parameters: [
|
|
||||||
{
|
|
||||||
name: 'body',
|
|
||||||
type: 'Body',
|
|
||||||
schema: InvoiceRecipientRequest,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'organization',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'invoiceRecipient',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
],
|
|
||||||
response: z.object({ data: InvoiceRecipientResource }).passthrough(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
method: 'post',
|
|
||||||
path: '/v1/organizations/:organization/invoice-recipients/:invoiceRecipient/duplicate',
|
|
||||||
alias: 'duplicateInvoiceRecipient',
|
|
||||||
requestFormat: 'json',
|
|
||||||
parameters: [
|
|
||||||
{
|
|
||||||
name: 'body',
|
|
||||||
type: 'Body',
|
|
||||||
schema: InvoiceRecipientRequest,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'organization',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'invoiceRecipient',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
],
|
|
||||||
response: z.object({ data: InvoiceRecipientResource }).passthrough(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
method: 'delete',
|
|
||||||
path: '/v1/organizations/:organization/invoice-recipients/:invoiceRecipient',
|
|
||||||
alias: 'deleteInvoiceRecipient',
|
|
||||||
requestFormat: 'json',
|
|
||||||
parameters: [
|
|
||||||
{
|
|
||||||
name: 'organization',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'invoiceRecipient',
|
|
||||||
type: 'Path',
|
|
||||||
schema: z.string(),
|
|
||||||
},
|
|
||||||
],
|
|
||||||
response: z.void(),
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
method: 'get',
|
method: 'get',
|
||||||
path: '/v1/organizations/:organization/invoices',
|
path: '/v1/organizations/:organization/invoices',
|
||||||
@@ -2046,11 +1911,6 @@ const endpoints = makeApi([
|
|||||||
type: 'Query',
|
type: 'Query',
|
||||||
schema: z.number().int().gte(1).lte(2147483647).optional(),
|
schema: z.number().int().gte(1).lte(2147483647).optional(),
|
||||||
},
|
},
|
||||||
{
|
|
||||||
name: 'status',
|
|
||||||
type: 'Query',
|
|
||||||
schema: InvoiceStatus.optional(),
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
response: z.object({ data: InvoiceCollection }).passthrough(),
|
response: z.object({ data: InvoiceCollection }).passthrough(),
|
||||||
errors: [
|
errors: [
|
||||||
|
|||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user