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 | |
|---|---|---|---|
|
391be8c6bb | ||
|
|
b46f015754 | ||
|
|
fc8985f513 |
@@ -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 }) => {
|
||||
const goal = await createGoalViaApi(ctx, {
|
||||
name: 'Old goal name',
|
||||
|
||||
1119
package-lock.json
generated
1119
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
40
package.json
40
package.json
@@ -25,46 +25,46 @@
|
||||
"watch:api": "npm run watch --workspace=@solidtime/api"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/eslintrc": "^3.3.5",
|
||||
"@eslint/eslintrc": "^3.3.7",
|
||||
"@eslint/js": "^9.39.4",
|
||||
"@inertiajs/vue3": "^2.3.23",
|
||||
"@playwright/test": "^1.60.0",
|
||||
"@playwright/test": "^1.64.0",
|
||||
"@tailwindcss/forms": "^0.5.11",
|
||||
"@tailwindcss/typography": "^0.5.19",
|
||||
"@types/chroma-js": "^3.1.2",
|
||||
"@types/node": "^22.19.19",
|
||||
"@vitejs/plugin-vue": "^6.0.6",
|
||||
"@vue/test-utils": "^2.4.6",
|
||||
"@vue/tsconfig": "^0.8.1",
|
||||
"autoprefixer": "^10.5.0",
|
||||
"axios": "^1.16.0",
|
||||
"@vitejs/plugin-vue": "^6.0.10",
|
||||
"@vue/test-utils": "^2.5.1",
|
||||
"@vue/tsconfig": "^0.9.1",
|
||||
"autoprefixer": "^10.6.1",
|
||||
"axios": "^1.20.0",
|
||||
"eslint-plugin-unused-imports": "^4.4.1",
|
||||
"happy-dom": "^20.8.9",
|
||||
"laravel-vite-plugin": "^2.1.0",
|
||||
"openapi-zod-client": "^1.18.3",
|
||||
"postcss": "^8.5.14",
|
||||
"postcss": "^8.5.29",
|
||||
"postcss-import": "^15.1.0",
|
||||
"postcss-nesting": "^12.1.5",
|
||||
"tailwindcss": "^3.4.19",
|
||||
"typescript": "^5.9.3",
|
||||
"vite": "^7.3.3",
|
||||
"vite-plugin-checker": "^0.12.0",
|
||||
"vite-plugin-checker": "^0.14.5",
|
||||
"vitest": "^4.1.4",
|
||||
"vue": "^3.5.34",
|
||||
"vue-tsc": "^3.2.8"
|
||||
"vue": "^3.5.43",
|
||||
"vue-tsc": "^3.3.13"
|
||||
},
|
||||
"dependencies": {
|
||||
"@floating-ui/core": "^1.7.5",
|
||||
"@floating-ui/vue": "^1.1.11",
|
||||
"@heroicons/vue": "^2.2.0",
|
||||
"@lucide/vue": "^1.28.0",
|
||||
"@lucide/vue": "^1.55.0",
|
||||
"@rushstack/eslint-patch": "^1.16.1",
|
||||
"@tailwindcss/container-queries": "^0.1.1",
|
||||
"@tanstack/vue-form": "^1.32.0",
|
||||
"@tanstack/vue-query": "^5.100.10",
|
||||
"@tanstack/vue-form": "^1.33.5",
|
||||
"@tanstack/vue-query": "^5.104.2",
|
||||
"@tanstack/vue-query-devtools": "^5.91.0",
|
||||
"@tanstack/vue-table": "^8.21.3",
|
||||
"@tanstack/vue-virtual": "^3.13.24",
|
||||
"@tanstack/vue-virtual": "^3.13.41",
|
||||
"@vue/eslint-config-prettier": "^10.2.0",
|
||||
"@vue/eslint-config-typescript": "^14.7.0",
|
||||
"@vueuse/core": "^14.4.0",
|
||||
@@ -73,17 +73,17 @@
|
||||
"chroma-js": "^3.2.0",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
"dayjs": "^1.11.20",
|
||||
"dayjs": "^1.11.23",
|
||||
"echarts": "^6.0.0",
|
||||
"focus-trap": "^8.2.0",
|
||||
"parse-duration": "^2.1.6",
|
||||
"focus-trap": "^8.2.3",
|
||||
"parse-duration": "^2.1.9",
|
||||
"pinia": "^3.0.4",
|
||||
"radix-vue": "^1.9.17",
|
||||
"reka-ui": "^2.10.1",
|
||||
"reka-ui": "^2.11.0",
|
||||
"tailwind-merge": "^2.6.1",
|
||||
"tailwindcss-animate": "^1.0.7",
|
||||
"vue-draggable-plus": "^0.6.1",
|
||||
"vue-echarts": "^8.0.1",
|
||||
"vue-echarts": "^8.3.2",
|
||||
"zod": "^3.25.76"
|
||||
},
|
||||
"overrides": {
|
||||
|
||||
@@ -29,6 +29,7 @@ import ClientCreateModal from '@/Components/Common/Client/ClientCreateModal.vue'
|
||||
import TaskCreateModal from '@/Components/Common/Task/TaskCreateModal.vue';
|
||||
import TagCreateModal from '@/packages/ui/src/Tag/TagCreateModal.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 TimeEntryCreateModal from '@/packages/ui/src/TimeEntry/TimeEntryCreateModal.vue';
|
||||
|
||||
@@ -53,6 +54,7 @@ const {
|
||||
showCreateTaskModal,
|
||||
showCreateTagModal,
|
||||
showCreateGoalModal,
|
||||
showGoalUpgradeModal,
|
||||
showInviteMemberModal,
|
||||
showCreateTimeEntryModal,
|
||||
showProjectSelector,
|
||||
@@ -185,6 +187,7 @@ const firstProjectId = computed(() => projects.value[0]?.id ?? '');
|
||||
|
||||
<!-- Goal Create Modal -->
|
||||
<GoalCreateModal v-model:show="showCreateGoalModal" />
|
||||
<UpgradeModal v-model:show="showGoalUpgradeModal" feature="goals" />
|
||||
|
||||
<!-- Member Invite Modal -->
|
||||
<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">
|
||||
import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.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 GoalTableRow from '@/Components/Common/Goal/GoalTableRow.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 { LoadingSpinner } from '@/packages/ui/src';
|
||||
import { isGoalsExtensionActivated } from '@/utils/billing';
|
||||
@@ -18,7 +15,6 @@ const props = defineProps<{
|
||||
showingArchived: boolean;
|
||||
}>();
|
||||
|
||||
const showCreateGoalModal = ref(false);
|
||||
const showTargetColumn = isGoalsExtensionActivated();
|
||||
// Every column gets a share of the free space so the columns are spread evenly over the table
|
||||
const gridTemplateColumns = [
|
||||
@@ -33,7 +29,6 @@ const gridTemplateColumns = [
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<GoalCreateModal v-model:show="showCreateGoalModal"></GoalCreateModal>
|
||||
<div class="flow-root max-w-[100vw] overflow-x-auto">
|
||||
<div class="inline-block min-w-full align-middle">
|
||||
<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">
|
||||
Set yourself a target and track your progress every day, week or month.
|
||||
</p>
|
||||
<SecondaryButton
|
||||
v-if="
|
||||
canCreateGoals() && !props.showingArchived && props.canCreateMoreGoals
|
||||
"
|
||||
:icon="PlusIcon"
|
||||
@click="showCreateGoalModal = true"
|
||||
<GoalCreateButton
|
||||
v-if="canCreateGoals() && !props.showingArchived"
|
||||
:can-create-more-goals="props.canCreateMoreGoals"
|
||||
>Create your first goal
|
||||
</SecondaryButton>
|
||||
</GoalCreateButton>
|
||||
</div>
|
||||
<template v-for="goal in props.goals" :key="goal.id">
|
||||
<GoalTableRow
|
||||
|
||||
@@ -43,6 +43,7 @@ const deleteMutation = useMutation({
|
||||
onSuccess: () => {
|
||||
close();
|
||||
queryClient.invalidateQueries({ queryKey: ['members'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
@@ -52,6 +52,7 @@ async function submit() {
|
||||
'There was an error merging the members.',
|
||||
() => {
|
||||
queryClient.invalidateQueries({ queryKey: ['members'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
show.value = false;
|
||||
}
|
||||
);
|
||||
|
||||
@@ -2,19 +2,15 @@
|
||||
import MainContainer from '@/packages/ui/src/MainContainer.vue';
|
||||
import AppLayout from '@/Layouts/AppLayout.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 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 UpgradeBadge from '@/packages/ui/src/UpgradeBadge.vue';
|
||||
import { canCreateGoals } from '@/utils/permissions';
|
||||
import { canCreateMoreGoals } from '@/utils/billing';
|
||||
import { useGoalsQuery } from '@/utils/useGoalsQuery';
|
||||
import { TabBar, TabBarItem } from '@/packages/ui/src';
|
||||
|
||||
const showCreateGoalModal = ref(false);
|
||||
const activeTab = ref('active');
|
||||
const showArchived = computed(() => activeTab.value === 'archived');
|
||||
|
||||
@@ -41,16 +37,9 @@ const canCreateMore = computed(() => canCreateMoreGoals(goals.value.length));
|
||||
</TabBarItem>
|
||||
</TabBar>
|
||||
</div>
|
||||
<div class="flex items-center space-x-3">
|
||||
<UpgradeBadge v-if="canCreateGoals() && !canCreateMore" feature="goals" />
|
||||
<SecondaryButton
|
||||
v-if="canCreateGoals() && canCreateMore"
|
||||
:icon="PlusIcon"
|
||||
@click="showCreateGoalModal = true"
|
||||
>Create Goal
|
||||
</SecondaryButton>
|
||||
</div>
|
||||
<GoalCreateModal v-model:show="showCreateGoalModal"></GoalCreateModal>
|
||||
<GoalCreateButton
|
||||
v-if="canCreateGoals()"
|
||||
:can-create-more-goals="canCreateMore"></GoalCreateButton>
|
||||
</MainContainer>
|
||||
<GoalTable
|
||||
:goals="visibleGoals"
|
||||
|
||||
@@ -422,6 +422,7 @@ export function useBreakPlacement(deps: BreakPlacementDeps) {
|
||||
},
|
||||
onSettled: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
@@ -217,6 +217,7 @@ export function useCopyLastWeek(
|
||||
}
|
||||
|
||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
|
||||
if (attempted === 0) return;
|
||||
|
||||
|
||||
@@ -174,6 +174,7 @@ export function useTimesheetCellMutations(
|
||||
);
|
||||
} finally {
|
||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -22,6 +22,8 @@ import {
|
||||
canCreateInvitations,
|
||||
} from '@/utils/permissions';
|
||||
import { isBillingActivated, isInvoicingActivated } from '@/utils/billing';
|
||||
import { useQueryClient } from '@tanstack/vue-query';
|
||||
import { fetchCanCreateMoreGoals } from '@/utils/useGoalsQuery';
|
||||
import { useTimeEntriesInfiniteQuery } from '@/utils/useTimeEntriesInfiniteQuery';
|
||||
import { useProjectsQuery } from '@/utils/useProjectsQuery';
|
||||
import { useClientsQuery } from '@/utils/useClientsQuery';
|
||||
@@ -66,6 +68,7 @@ const showCreateClientModal = ref(false);
|
||||
const showCreateTaskModal = ref(false);
|
||||
const showCreateTagModal = ref(false);
|
||||
const showCreateGoalModal = ref(false);
|
||||
const showGoalUpgradeModal = ref(false);
|
||||
const showInviteMemberModal = ref(false);
|
||||
const showCreateTimeEntryModal = ref(false);
|
||||
|
||||
@@ -103,6 +106,7 @@ const ENTITY_ICONS: Record<string, typeof FolderIcon> = {
|
||||
};
|
||||
|
||||
export function useCommandPalette() {
|
||||
const queryClient = useQueryClient();
|
||||
const currentTimeEntryStore = useCurrentTimeEntryStore();
|
||||
const { currentTimeEntry, isActive } = storeToRefs(currentTimeEntryStore);
|
||||
const { setActiveState, updateTimer } = currentTimeEntryStore;
|
||||
@@ -240,9 +244,13 @@ export function useCommandPalette() {
|
||||
showCreateTagModal.value = true;
|
||||
}
|
||||
|
||||
function openCreateGoalModal() {
|
||||
async function openCreateGoalModal() {
|
||||
closePaletteAfterAction();
|
||||
showCreateGoalModal.value = true;
|
||||
if (await fetchCanCreateMoreGoals(queryClient)) {
|
||||
showCreateGoalModal.value = true;
|
||||
} else {
|
||||
showGoalUpgradeModal.value = true;
|
||||
}
|
||||
}
|
||||
|
||||
function openInviteMemberModal() {
|
||||
@@ -525,6 +533,7 @@ export function useCommandPalette() {
|
||||
showCreateTaskModal,
|
||||
showCreateTagModal,
|
||||
showCreateGoalModal,
|
||||
showGoalUpgradeModal,
|
||||
showInviteMemberModal,
|
||||
showCreateTimeEntryModal,
|
||||
showProjectSelector,
|
||||
|
||||
@@ -261,6 +261,7 @@ export const useCurrentTimeEntryStore = defineStore('currentTimeEntry', () => {
|
||||
stopLiveTimer();
|
||||
}
|
||||
}
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
} else {
|
||||
throw new Error(
|
||||
'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 { getCurrentOrganizationId } from '@/utils/useUser';
|
||||
import type { Goal } from '@/packages/api/src';
|
||||
import { computed } from 'vue';
|
||||
import { fetchAllPages } from '@/utils/fetchAllPages';
|
||||
import { canCreateMoreGoals, goalLimit } from '@/utils/billing';
|
||||
|
||||
export type GoalArchivedFilter = 'true' | 'false' | 'all';
|
||||
|
||||
@@ -19,19 +20,38 @@ export async function fetchAllGoals(
|
||||
);
|
||||
}
|
||||
|
||||
export function useGoalsQuery(archived: GoalArchivedFilter = 'false') {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const query = useQuery({
|
||||
queryKey: computed(() => ['goals', getCurrentOrganizationId(), archived]),
|
||||
export function goalsQueryOptions(archived: GoalArchivedFilter = 'false') {
|
||||
return {
|
||||
queryKey: ['goals', getCurrentOrganizationId(), archived],
|
||||
queryFn: async () => {
|
||||
const organizationId = getCurrentOrganizationId();
|
||||
if (!organizationId) throw new Error('No organization');
|
||||
const data = await fetchAllGoals(organizationId, archived);
|
||||
return { data };
|
||||
},
|
||||
enabled: () => !!getCurrentOrganizationId(),
|
||||
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
|
||||
refetchInterval: 1000 * 60,
|
||||
});
|
||||
|
||||
@@ -36,6 +36,7 @@ export function useTimeEntriesMutations() {
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
},
|
||||
});
|
||||
|
||||
@@ -58,6 +59,7 @@ export function useTimeEntriesMutations() {
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
},
|
||||
});
|
||||
|
||||
@@ -105,6 +107,7 @@ export function useTimeEntriesMutations() {
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
},
|
||||
});
|
||||
|
||||
@@ -127,6 +130,7 @@ export function useTimeEntriesMutations() {
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
},
|
||||
});
|
||||
|
||||
@@ -152,6 +156,7 @@ export function useTimeEntriesMutations() {
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||
queryClient.invalidateQueries({ queryKey: ['goals'] });
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user