mirror of
https://github.com/solidtime-io/solidtime.git
synced 2026-10-19 19:23:17 +01:00
Compare commits
3 Commits
feature/go
...
dependabot
| Author | SHA1 | Date | |
|---|---|---|---|
|
aa8ab44c79 | ||
|
|
b46f015754 | ||
|
|
fc8985f513 |
1075
composer.lock
generated
1075
composer.lock
generated
File diff suppressed because it is too large
Load Diff
@@ -342,6 +342,89 @@ test('test that a running time entry counts towards the goal progress', async ({
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Close to midnight UTC an entry that started a few minutes ago could fall on the previous day, so
|
||||||
|
// the day of the goal is moved to a timezone (without daylight saving time) where it is late morning
|
||||||
|
function timezoneAwayFromMidnight() {
|
||||||
|
const utcHour = new Date().getUTCHours();
|
||||||
|
return utcHour >= 2 && utcHour < 22 ? 'UTC' : 'Asia/Tokyo';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Navigates via the sidebar, a full page load would start with an empty query cache and hide
|
||||||
|
// a missing goals invalidation
|
||||||
|
async function navigateViaSidebar(page: Page, name: 'Time' | 'Goals') {
|
||||||
|
await page.getByRole('link', { name, exact: true }).first().click();
|
||||||
|
await expect(page).toHaveURL(new RegExp('/' + name.toLowerCase() + '$'));
|
||||||
|
}
|
||||||
|
|
||||||
|
test('test that goal progress updates after creating a time entry without a page reload', async ({
|
||||||
|
page,
|
||||||
|
ctx,
|
||||||
|
}) => {
|
||||||
|
const goal = await createGoalViaApi(ctx, {
|
||||||
|
name: 'Cache goal',
|
||||||
|
target_seconds: 3600,
|
||||||
|
period: 'day',
|
||||||
|
timezone: timezoneAwayFromMidnight(),
|
||||||
|
});
|
||||||
|
|
||||||
|
await goToGoalsOverview(page);
|
||||||
|
await expect(goalRow(page, goal.id).getByTestId('goal_tracked_time')).toHaveText('0h 00min');
|
||||||
|
|
||||||
|
await navigateViaSidebar(page, 'Time');
|
||||||
|
await page.getByRole('button', { name: 'Time entry actions' }).click();
|
||||||
|
await page.getByRole('menuitem', { name: 'Manual time entry' }).click();
|
||||||
|
const durationInput = page.locator('[role="dialog"] input[name="Duration"]');
|
||||||
|
await durationInput.fill('15min');
|
||||||
|
await durationInput.press('Tab');
|
||||||
|
await Promise.all([
|
||||||
|
page.waitForResponse(
|
||||||
|
(response) => response.url().includes('/time-entries') && response.status() === 201
|
||||||
|
),
|
||||||
|
page.getByRole('button', { name: 'Create Time Entry' }).click(),
|
||||||
|
]);
|
||||||
|
|
||||||
|
await navigateViaSidebar(page, 'Goals');
|
||||||
|
await expect(goalRow(page, goal.id).getByTestId('goal_tracked_time')).toHaveText('0h 15min');
|
||||||
|
});
|
||||||
|
|
||||||
|
test('test that goal progress updates after changing the project of the running time entry without a page reload', async ({
|
||||||
|
page,
|
||||||
|
ctx,
|
||||||
|
}) => {
|
||||||
|
const project = await createProjectViaApi(ctx, { name: 'Running Project', is_public: true });
|
||||||
|
const start = new Date(Date.now() - 30 * 60 * 1000).toISOString().replace(/\.\d{3}Z$/, 'Z');
|
||||||
|
await createRunningTimeEntryWithStartViaApi(ctx, 'Running work', start);
|
||||||
|
const goal = await createGoalViaApi(ctx, {
|
||||||
|
name: 'Running project goal',
|
||||||
|
target_seconds: 3600,
|
||||||
|
period: 'day',
|
||||||
|
timezone: timezoneAwayFromMidnight(),
|
||||||
|
filters: { project_ids: [project.id], time_entry_type: 'work' },
|
||||||
|
});
|
||||||
|
|
||||||
|
await goToGoalsOverview(page);
|
||||||
|
await expect(goalRow(page, goal.id).getByTestId('goal_tracked_time')).toHaveText('0h 00min');
|
||||||
|
|
||||||
|
await navigateViaSidebar(page, 'Time');
|
||||||
|
await page.getByRole('button', { name: 'No Project' }).click();
|
||||||
|
await Promise.all([
|
||||||
|
page.waitForResponse(
|
||||||
|
async (response) =>
|
||||||
|
response.url().includes('/time-entries') &&
|
||||||
|
response.request().method() === 'PUT' &&
|
||||||
|
response.status() === 200 &&
|
||||||
|
(await response.json()).data.project_id === project.id
|
||||||
|
),
|
||||||
|
page.getByRole('option').filter({ hasText: project.name }).click(),
|
||||||
|
]);
|
||||||
|
|
||||||
|
await navigateViaSidebar(page, 'Goals');
|
||||||
|
// The entry keeps running while the test runs
|
||||||
|
await expect(goalRow(page, goal.id).getByTestId('goal_tracked_time')).toHaveText(
|
||||||
|
/^0h 3[0-2]min$/
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
test('test that editing a goal via the modal works', async ({ page, ctx }) => {
|
test('test that editing a goal via the modal works', async ({ page, ctx }) => {
|
||||||
const goal = await createGoalViaApi(ctx, {
|
const goal = await createGoalViaApi(ctx, {
|
||||||
name: 'Old goal name',
|
name: 'Old goal name',
|
||||||
|
|||||||
@@ -29,6 +29,7 @@ import ClientCreateModal from '@/Components/Common/Client/ClientCreateModal.vue'
|
|||||||
import TaskCreateModal from '@/Components/Common/Task/TaskCreateModal.vue';
|
import TaskCreateModal from '@/Components/Common/Task/TaskCreateModal.vue';
|
||||||
import TagCreateModal from '@/packages/ui/src/Tag/TagCreateModal.vue';
|
import TagCreateModal from '@/packages/ui/src/Tag/TagCreateModal.vue';
|
||||||
import GoalCreateModal from '@/Components/Common/Goal/GoalCreateModal.vue';
|
import GoalCreateModal from '@/Components/Common/Goal/GoalCreateModal.vue';
|
||||||
|
import UpgradeModal from '@/packages/ui/src/UpgradeModal.vue';
|
||||||
import MemberInviteModal from '@/Components/Common/Member/MemberInviteModal.vue';
|
import MemberInviteModal from '@/Components/Common/Member/MemberInviteModal.vue';
|
||||||
import TimeEntryCreateModal from '@/packages/ui/src/TimeEntry/TimeEntryCreateModal.vue';
|
import TimeEntryCreateModal from '@/packages/ui/src/TimeEntry/TimeEntryCreateModal.vue';
|
||||||
|
|
||||||
@@ -53,6 +54,7 @@ const {
|
|||||||
showCreateTaskModal,
|
showCreateTaskModal,
|
||||||
showCreateTagModal,
|
showCreateTagModal,
|
||||||
showCreateGoalModal,
|
showCreateGoalModal,
|
||||||
|
showGoalUpgradeModal,
|
||||||
showInviteMemberModal,
|
showInviteMemberModal,
|
||||||
showCreateTimeEntryModal,
|
showCreateTimeEntryModal,
|
||||||
showProjectSelector,
|
showProjectSelector,
|
||||||
@@ -185,6 +187,7 @@ const firstProjectId = computed(() => projects.value[0]?.id ?? '');
|
|||||||
|
|
||||||
<!-- Goal Create Modal -->
|
<!-- Goal Create Modal -->
|
||||||
<GoalCreateModal v-model:show="showCreateGoalModal" />
|
<GoalCreateModal v-model:show="showCreateGoalModal" />
|
||||||
|
<UpgradeModal v-model:show="showGoalUpgradeModal" feature="goals" />
|
||||||
|
|
||||||
<!-- Member Invite Modal -->
|
<!-- Member Invite Modal -->
|
||||||
<MemberInviteModal v-model:show="showInviteMemberModal" :available-roles="availableRoles" />
|
<MemberInviteModal v-model:show="showInviteMemberModal" :available-roles="availableRoles" />
|
||||||
|
|||||||
43
resources/js/Components/Common/Goal/GoalCreateButton.test.ts
Normal file
43
resources/js/Components/Common/Goal/GoalCreateButton.test.ts
Normal file
@@ -0,0 +1,43 @@
|
|||||||
|
import { describe, it, expect } from 'vitest';
|
||||||
|
import { mount } from '@vue/test-utils';
|
||||||
|
import GoalCreateButton from './GoalCreateButton.vue';
|
||||||
|
|
||||||
|
function mountGoalCreateButton(canCreateMoreGoals: boolean) {
|
||||||
|
return mount(GoalCreateButton, {
|
||||||
|
props: { canCreateMoreGoals },
|
||||||
|
slots: { default: 'Create your first goal' },
|
||||||
|
global: {
|
||||||
|
stubs: {
|
||||||
|
GoalCreateModal: { name: 'GoalCreateModal', props: ['show'], template: '<div />' },
|
||||||
|
UpgradeModal: {
|
||||||
|
name: 'UpgradeModal',
|
||||||
|
props: ['show', 'feature'],
|
||||||
|
template: '<div />',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
describe('GoalCreateButton', () => {
|
||||||
|
it('opens the create modal while more goals can be created', async () => {
|
||||||
|
const wrapper = mountGoalCreateButton(true);
|
||||||
|
|
||||||
|
await wrapper.get('button').trigger('click');
|
||||||
|
|
||||||
|
expect(wrapper.getComponent({ name: 'GoalCreateModal' }).props('show')).toBe(true);
|
||||||
|
expect(wrapper.getComponent({ name: 'UpgradeModal' }).props('show')).toBe(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('opens the upgrade modal once the goal limit is reached', async () => {
|
||||||
|
const wrapper = mountGoalCreateButton(false);
|
||||||
|
|
||||||
|
expect(wrapper.get('button').text()).toBe('Create your first goal');
|
||||||
|
await wrapper.get('button').trigger('click');
|
||||||
|
|
||||||
|
const upgradeModal = wrapper.getComponent({ name: 'UpgradeModal' });
|
||||||
|
expect(upgradeModal.props('show')).toBe(true);
|
||||||
|
expect(upgradeModal.props('feature')).toBe('goals');
|
||||||
|
expect(wrapper.getComponent({ name: 'GoalCreateModal' }).props('show')).toBe(false);
|
||||||
|
});
|
||||||
|
});
|
||||||
31
resources/js/Components/Common/Goal/GoalCreateButton.vue
Normal file
31
resources/js/Components/Common/Goal/GoalCreateButton.vue
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
|
||||||
|
import UpgradeModal from '@/packages/ui/src/UpgradeModal.vue';
|
||||||
|
import GoalCreateModal from '@/Components/Common/Goal/GoalCreateModal.vue';
|
||||||
|
import { PlusIcon } from '@heroicons/vue/16/solid';
|
||||||
|
import { ref } from 'vue';
|
||||||
|
|
||||||
|
const props = defineProps<{
|
||||||
|
canCreateMoreGoals: boolean;
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const showCreateGoalModal = ref(false);
|
||||||
|
const showUpgradeModal = ref(false);
|
||||||
|
|
||||||
|
// The button stays visible when the goal limit is reached and explains the limit instead
|
||||||
|
function onClick() {
|
||||||
|
if (props.canCreateMoreGoals) {
|
||||||
|
showCreateGoalModal.value = true;
|
||||||
|
} else {
|
||||||
|
showUpgradeModal.value = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<GoalCreateModal v-model:show="showCreateGoalModal"></GoalCreateModal>
|
||||||
|
<UpgradeModal v-model:show="showUpgradeModal" feature="goals" />
|
||||||
|
<SecondaryButton :icon="PlusIcon" @click="onClick">
|
||||||
|
<slot>Create Goal</slot>
|
||||||
|
</SecondaryButton>
|
||||||
|
</template>
|
||||||
@@ -1,12 +1,9 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
|
|
||||||
import { Target } from '@lucide/vue';
|
import { Target } from '@lucide/vue';
|
||||||
import { PlusIcon } from '@heroicons/vue/16/solid';
|
|
||||||
import { ref } from 'vue';
|
|
||||||
import type { Goal } from '@/packages/api/src';
|
import type { Goal } from '@/packages/api/src';
|
||||||
import GoalTableRow from '@/Components/Common/Goal/GoalTableRow.vue';
|
import GoalTableRow from '@/Components/Common/Goal/GoalTableRow.vue';
|
||||||
import GoalTableHeading from '@/Components/Common/Goal/GoalTableHeading.vue';
|
import GoalTableHeading from '@/Components/Common/Goal/GoalTableHeading.vue';
|
||||||
import GoalCreateModal from '@/Components/Common/Goal/GoalCreateModal.vue';
|
import GoalCreateButton from '@/Components/Common/Goal/GoalCreateButton.vue';
|
||||||
import { canCreateGoals } from '@/utils/permissions';
|
import { canCreateGoals } from '@/utils/permissions';
|
||||||
import { LoadingSpinner } from '@/packages/ui/src';
|
import { LoadingSpinner } from '@/packages/ui/src';
|
||||||
import { isGoalsExtensionActivated } from '@/utils/billing';
|
import { isGoalsExtensionActivated } from '@/utils/billing';
|
||||||
@@ -18,7 +15,6 @@ const props = defineProps<{
|
|||||||
showingArchived: boolean;
|
showingArchived: boolean;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
const showCreateGoalModal = ref(false);
|
|
||||||
const showTargetColumn = isGoalsExtensionActivated();
|
const showTargetColumn = isGoalsExtensionActivated();
|
||||||
// Every column gets a share of the free space so the columns are spread evenly over the table
|
// Every column gets a share of the free space so the columns are spread evenly over the table
|
||||||
const gridTemplateColumns = [
|
const gridTemplateColumns = [
|
||||||
@@ -33,7 +29,6 @@ const gridTemplateColumns = [
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<GoalCreateModal v-model:show="showCreateGoalModal"></GoalCreateModal>
|
|
||||||
<div class="flow-root max-w-[100vw] overflow-x-auto">
|
<div class="flow-root max-w-[100vw] overflow-x-auto">
|
||||||
<div class="inline-block min-w-full align-middle">
|
<div class="inline-block min-w-full align-middle">
|
||||||
<div data-testid="goal_table" class="grid min-w-full" :style="{ gridTemplateColumns }">
|
<div data-testid="goal_table" class="grid min-w-full" :style="{ gridTemplateColumns }">
|
||||||
@@ -51,14 +46,11 @@ const gridTemplateColumns = [
|
|||||||
<p v-if="canCreateGoals() && !props.showingArchived" class="pb-5">
|
<p v-if="canCreateGoals() && !props.showingArchived" class="pb-5">
|
||||||
Set yourself a target and track your progress every day, week or month.
|
Set yourself a target and track your progress every day, week or month.
|
||||||
</p>
|
</p>
|
||||||
<SecondaryButton
|
<GoalCreateButton
|
||||||
v-if="
|
v-if="canCreateGoals() && !props.showingArchived"
|
||||||
canCreateGoals() && !props.showingArchived && props.canCreateMoreGoals
|
:can-create-more-goals="props.canCreateMoreGoals"
|
||||||
"
|
|
||||||
:icon="PlusIcon"
|
|
||||||
@click="showCreateGoalModal = true"
|
|
||||||
>Create your first goal
|
>Create your first goal
|
||||||
</SecondaryButton>
|
</GoalCreateButton>
|
||||||
</div>
|
</div>
|
||||||
<template v-for="goal in props.goals" :key="goal.id">
|
<template v-for="goal in props.goals" :key="goal.id">
|
||||||
<GoalTableRow
|
<GoalTableRow
|
||||||
|
|||||||
@@ -43,6 +43,7 @@ const deleteMutation = useMutation({
|
|||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
close();
|
close();
|
||||||
queryClient.invalidateQueries({ queryKey: ['members'] });
|
queryClient.invalidateQueries({ queryKey: ['members'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -52,6 +52,7 @@ async function submit() {
|
|||||||
'There was an error merging the members.',
|
'There was an error merging the members.',
|
||||||
() => {
|
() => {
|
||||||
queryClient.invalidateQueries({ queryKey: ['members'] });
|
queryClient.invalidateQueries({ queryKey: ['members'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
show.value = false;
|
show.value = false;
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -2,19 +2,15 @@
|
|||||||
import MainContainer from '@/packages/ui/src/MainContainer.vue';
|
import MainContainer from '@/packages/ui/src/MainContainer.vue';
|
||||||
import AppLayout from '@/Layouts/AppLayout.vue';
|
import AppLayout from '@/Layouts/AppLayout.vue';
|
||||||
import { Target } from '@lucide/vue';
|
import { Target } from '@lucide/vue';
|
||||||
import { PlusIcon } from '@heroicons/vue/16/solid';
|
|
||||||
import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
|
|
||||||
import { computed, ref } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
import GoalTable from '@/Components/Common/Goal/GoalTable.vue';
|
import GoalTable from '@/Components/Common/Goal/GoalTable.vue';
|
||||||
import GoalCreateModal from '@/Components/Common/Goal/GoalCreateModal.vue';
|
import GoalCreateButton from '@/Components/Common/Goal/GoalCreateButton.vue';
|
||||||
import PageTitle from '@/Components/Common/PageTitle.vue';
|
import PageTitle from '@/Components/Common/PageTitle.vue';
|
||||||
import UpgradeBadge from '@/packages/ui/src/UpgradeBadge.vue';
|
|
||||||
import { canCreateGoals } from '@/utils/permissions';
|
import { canCreateGoals } from '@/utils/permissions';
|
||||||
import { canCreateMoreGoals } from '@/utils/billing';
|
import { canCreateMoreGoals } from '@/utils/billing';
|
||||||
import { useGoalsQuery } from '@/utils/useGoalsQuery';
|
import { useGoalsQuery } from '@/utils/useGoalsQuery';
|
||||||
import { TabBar, TabBarItem } from '@/packages/ui/src';
|
import { TabBar, TabBarItem } from '@/packages/ui/src';
|
||||||
|
|
||||||
const showCreateGoalModal = ref(false);
|
|
||||||
const activeTab = ref('active');
|
const activeTab = ref('active');
|
||||||
const showArchived = computed(() => activeTab.value === 'archived');
|
const showArchived = computed(() => activeTab.value === 'archived');
|
||||||
|
|
||||||
@@ -41,16 +37,9 @@ const canCreateMore = computed(() => canCreateMoreGoals(goals.value.length));
|
|||||||
</TabBarItem>
|
</TabBarItem>
|
||||||
</TabBar>
|
</TabBar>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex items-center space-x-3">
|
<GoalCreateButton
|
||||||
<UpgradeBadge v-if="canCreateGoals() && !canCreateMore" feature="goals" />
|
v-if="canCreateGoals()"
|
||||||
<SecondaryButton
|
:can-create-more-goals="canCreateMore"></GoalCreateButton>
|
||||||
v-if="canCreateGoals() && canCreateMore"
|
|
||||||
:icon="PlusIcon"
|
|
||||||
@click="showCreateGoalModal = true"
|
|
||||||
>Create Goal
|
|
||||||
</SecondaryButton>
|
|
||||||
</div>
|
|
||||||
<GoalCreateModal v-model:show="showCreateGoalModal"></GoalCreateModal>
|
|
||||||
</MainContainer>
|
</MainContainer>
|
||||||
<GoalTable
|
<GoalTable
|
||||||
:goals="visibleGoals"
|
:goals="visibleGoals"
|
||||||
|
|||||||
@@ -422,6 +422,7 @@ export function useBreakPlacement(deps: BreakPlacementDeps) {
|
|||||||
},
|
},
|
||||||
onSettled: () => {
|
onSettled: () => {
|
||||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -217,6 +217,7 @@ export function useCopyLastWeek(
|
|||||||
}
|
}
|
||||||
|
|
||||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
|
|
||||||
if (attempted === 0) return;
|
if (attempted === 0) return;
|
||||||
|
|
||||||
|
|||||||
@@ -174,6 +174,7 @@ export function useTimesheetCellMutations(
|
|||||||
);
|
);
|
||||||
} finally {
|
} finally {
|
||||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -22,6 +22,8 @@ import {
|
|||||||
canCreateInvitations,
|
canCreateInvitations,
|
||||||
} from '@/utils/permissions';
|
} from '@/utils/permissions';
|
||||||
import { isBillingActivated, isInvoicingActivated } from '@/utils/billing';
|
import { isBillingActivated, isInvoicingActivated } from '@/utils/billing';
|
||||||
|
import { useQueryClient } from '@tanstack/vue-query';
|
||||||
|
import { fetchCanCreateMoreGoals } from '@/utils/useGoalsQuery';
|
||||||
import { useTimeEntriesInfiniteQuery } from '@/utils/useTimeEntriesInfiniteQuery';
|
import { useTimeEntriesInfiniteQuery } from '@/utils/useTimeEntriesInfiniteQuery';
|
||||||
import { useProjectsQuery } from '@/utils/useProjectsQuery';
|
import { useProjectsQuery } from '@/utils/useProjectsQuery';
|
||||||
import { useClientsQuery } from '@/utils/useClientsQuery';
|
import { useClientsQuery } from '@/utils/useClientsQuery';
|
||||||
@@ -66,6 +68,7 @@ const showCreateClientModal = ref(false);
|
|||||||
const showCreateTaskModal = ref(false);
|
const showCreateTaskModal = ref(false);
|
||||||
const showCreateTagModal = ref(false);
|
const showCreateTagModal = ref(false);
|
||||||
const showCreateGoalModal = ref(false);
|
const showCreateGoalModal = ref(false);
|
||||||
|
const showGoalUpgradeModal = ref(false);
|
||||||
const showInviteMemberModal = ref(false);
|
const showInviteMemberModal = ref(false);
|
||||||
const showCreateTimeEntryModal = ref(false);
|
const showCreateTimeEntryModal = ref(false);
|
||||||
|
|
||||||
@@ -103,6 +106,7 @@ const ENTITY_ICONS: Record<string, typeof FolderIcon> = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export function useCommandPalette() {
|
export function useCommandPalette() {
|
||||||
|
const queryClient = useQueryClient();
|
||||||
const currentTimeEntryStore = useCurrentTimeEntryStore();
|
const currentTimeEntryStore = useCurrentTimeEntryStore();
|
||||||
const { currentTimeEntry, isActive } = storeToRefs(currentTimeEntryStore);
|
const { currentTimeEntry, isActive } = storeToRefs(currentTimeEntryStore);
|
||||||
const { setActiveState, updateTimer } = currentTimeEntryStore;
|
const { setActiveState, updateTimer } = currentTimeEntryStore;
|
||||||
@@ -240,9 +244,13 @@ export function useCommandPalette() {
|
|||||||
showCreateTagModal.value = true;
|
showCreateTagModal.value = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
function openCreateGoalModal() {
|
async function openCreateGoalModal() {
|
||||||
closePaletteAfterAction();
|
closePaletteAfterAction();
|
||||||
showCreateGoalModal.value = true;
|
if (await fetchCanCreateMoreGoals(queryClient)) {
|
||||||
|
showCreateGoalModal.value = true;
|
||||||
|
} else {
|
||||||
|
showGoalUpgradeModal.value = true;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function openInviteMemberModal() {
|
function openInviteMemberModal() {
|
||||||
@@ -525,6 +533,7 @@ export function useCommandPalette() {
|
|||||||
showCreateTaskModal,
|
showCreateTaskModal,
|
||||||
showCreateTagModal,
|
showCreateTagModal,
|
||||||
showCreateGoalModal,
|
showCreateGoalModal,
|
||||||
|
showGoalUpgradeModal,
|
||||||
showInviteMemberModal,
|
showInviteMemberModal,
|
||||||
showCreateTimeEntryModal,
|
showCreateTimeEntryModal,
|
||||||
showProjectSelector,
|
showProjectSelector,
|
||||||
|
|||||||
@@ -261,6 +261,7 @@ export const useCurrentTimeEntryStore = defineStore('currentTimeEntry', () => {
|
|||||||
stopLiveTimer();
|
stopLiveTimer();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
} else {
|
} else {
|
||||||
throw new Error(
|
throw new Error(
|
||||||
'Failed to fetch current time entry because organization ID is missing.'
|
'Failed to fetch current time entry because organization ID is missing.'
|
||||||
|
|||||||
@@ -1,9 +1,10 @@
|
|||||||
import { useQuery, useQueryClient } from '@tanstack/vue-query';
|
import { useQuery, useQueryClient, type QueryClient } from '@tanstack/vue-query';
|
||||||
import { api } from '@/packages/api/src';
|
import { api } from '@/packages/api/src';
|
||||||
import { getCurrentOrganizationId } from '@/utils/useUser';
|
import { getCurrentOrganizationId } from '@/utils/useUser';
|
||||||
import type { Goal } from '@/packages/api/src';
|
import type { Goal } from '@/packages/api/src';
|
||||||
import { computed } from 'vue';
|
import { computed } from 'vue';
|
||||||
import { fetchAllPages } from '@/utils/fetchAllPages';
|
import { fetchAllPages } from '@/utils/fetchAllPages';
|
||||||
|
import { canCreateMoreGoals, goalLimit } from '@/utils/billing';
|
||||||
|
|
||||||
export type GoalArchivedFilter = 'true' | 'false' | 'all';
|
export type GoalArchivedFilter = 'true' | 'false' | 'all';
|
||||||
|
|
||||||
@@ -19,19 +20,38 @@ export async function fetchAllGoals(
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function useGoalsQuery(archived: GoalArchivedFilter = 'false') {
|
export function goalsQueryOptions(archived: GoalArchivedFilter = 'false') {
|
||||||
const queryClient = useQueryClient();
|
return {
|
||||||
|
queryKey: ['goals', getCurrentOrganizationId(), archived],
|
||||||
const query = useQuery({
|
|
||||||
queryKey: computed(() => ['goals', getCurrentOrganizationId(), archived]),
|
|
||||||
queryFn: async () => {
|
queryFn: async () => {
|
||||||
const organizationId = getCurrentOrganizationId();
|
const organizationId = getCurrentOrganizationId();
|
||||||
if (!organizationId) throw new Error('No organization');
|
if (!organizationId) throw new Error('No organization');
|
||||||
const data = await fetchAllGoals(organizationId, archived);
|
const data = await fetchAllGoals(organizationId, archived);
|
||||||
return { data };
|
return { data };
|
||||||
},
|
},
|
||||||
enabled: () => !!getCurrentOrganizationId(),
|
|
||||||
staleTime: 1000 * 30, // 30 seconds
|
staleTime: 1000 * 30, // 30 seconds
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Checks the goal limit outside of the goals page, where the goals are not loaded yet.
|
||||||
|
* Archived goals count towards the limit, so all goals are counted.
|
||||||
|
*/
|
||||||
|
export async function fetchCanCreateMoreGoals(queryClient: QueryClient): Promise<boolean> {
|
||||||
|
if (goalLimit() === null) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
const { data } = await queryClient.fetchQuery(goalsQueryOptions('all'));
|
||||||
|
return canCreateMoreGoals(data.length);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGoalsQuery(archived: GoalArchivedFilter = 'false') {
|
||||||
|
const queryClient = useQueryClient();
|
||||||
|
|
||||||
|
const query = useQuery({
|
||||||
|
...goalsQueryOptions(archived),
|
||||||
|
queryKey: computed(() => goalsQueryOptions(archived).queryKey),
|
||||||
|
enabled: () => !!getCurrentOrganizationId(),
|
||||||
// Progress is computed server side, keep it fresh while the page is open
|
// Progress is computed server side, keep it fresh while the page is open
|
||||||
refetchInterval: 1000 * 60,
|
refetchInterval: 1000 * 60,
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -36,6 +36,7 @@ export function useTimeEntriesMutations() {
|
|||||||
},
|
},
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -58,6 +59,7 @@ export function useTimeEntriesMutations() {
|
|||||||
},
|
},
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -105,6 +107,7 @@ export function useTimeEntriesMutations() {
|
|||||||
},
|
},
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -127,6 +130,7 @@ export function useTimeEntriesMutations() {
|
|||||||
},
|
},
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -152,6 +156,7 @@ export function useTimeEntriesMutations() {
|
|||||||
},
|
},
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user