From cd7573dcf1f4ad5283f565b0b1d09e78c4268a89 Mon Sep 17 00:00:00 2001
From: Gregor Vostrak <gregor@solidtime.io>
Date: Mon, 28 Oct 2024 13:37:39 +0100
Subject: [PATCH] hide create project buttons and modal depending on the
 permission

---
 .../Components/Common/TimeEntry/TimeEntryCreateModal.vue   | 2 ++
 resources/js/Components/TimeTracker.vue                    | 2 ++
 resources/js/Pages/ReportingDetailed.vue                   | 3 +++
 resources/js/Pages/Time.vue                                | 3 +++
 .../js/packages/ui/src/TimeEntry/TimeEntryAggregateRow.vue | 3 +++
 .../js/packages/ui/src/TimeEntry/TimeEntryGroupedTable.vue | 3 +++
 .../packages/ui/src/TimeEntry/TimeEntryMassActionRow.vue   | 2 ++
 .../packages/ui/src/TimeEntry/TimeEntryMassUpdateModal.vue | 2 ++
 resources/js/packages/ui/src/TimeEntry/TimeEntryRow.vue    | 2 ++
 .../js/packages/ui/src/TimeTracker/TimeTrackerControls.vue | 2 ++
 .../ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue  | 7 +++++--
 11 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/resources/js/Components/Common/TimeEntry/TimeEntryCreateModal.vue b/resources/js/Components/Common/TimeEntry/TimeEntryCreateModal.vue
index 6b19b01b..dead653f 100644
--- a/resources/js/Components/Common/TimeEntry/TimeEntryCreateModal.vue
+++ b/resources/js/Components/Common/TimeEntry/TimeEntryCreateModal.vue
@@ -28,6 +28,7 @@ import type {
 import { useClientsStore } from '@/utils/useClients';
 import TimePicker from '@/packages/ui/src/Input/TimePicker.vue';
 import { getOrganizationCurrencyString } from '@/utils/money';
+import { canCreateProjects } from '@/utils/permissions';
 const projectStore = useProjectsStore();
 const { projects } = storeToRefs(projectStore);
 const taskStore = useTasksStore();
@@ -134,6 +135,7 @@ async function createTag(tag: string) {
                             :clients
                             :createProject
                             :createClient
+                            :canCreateProject="canCreateProjects()"
                             :currency="getOrganizationCurrencyString()"
                             class="mt-1"
                             size="xlarge"
diff --git a/resources/js/Components/TimeTracker.vue b/resources/js/Components/TimeTracker.vue
index 9d79e357..50b58bdc 100644
--- a/resources/js/Components/TimeTracker.vue
+++ b/resources/js/Components/TimeTracker.vue
@@ -25,6 +25,7 @@ import TimeTrackerRunningInDifferentOrganizationOverlay from '@/packages/ui/src/
 import { useClientsStore } from '@/utils/useClients';
 import { getOrganizationCurrencyString } from '@/utils/money';
 import { isAllowedToPerformPremiumAction } from '@/utils/billing';
+import { canCreateProjects } from '@/utils/permissions';
 
 const page = usePage<{
     auth: {
@@ -113,6 +114,7 @@ const { tags } = storeToRefs(useTagsStore());
         <TimeTrackerControls
             :createProject
             :enableEstimatedTime="isAllowedToPerformPremiumAction()"
+            :canCreateProject="canCreateProjects()"
             :createClient
             :clients
             :tags
diff --git a/resources/js/Pages/ReportingDetailed.vue b/resources/js/Pages/ReportingDetailed.vue
index 65c7a332..dd3b22bb 100644
--- a/resources/js/Pages/ReportingDetailed.vue
+++ b/resources/js/Pages/ReportingDetailed.vue
@@ -66,6 +66,7 @@ import { getCurrentOrganizationId } from '@/utils/useUser';
 import { useTimeEntriesStore } from '@/utils/useTimeEntries';
 import TimeEntryMassActionRow from '@/packages/ui/src/TimeEntry/TimeEntryMassActionRow.vue';
 import { isAllowedToPerformPremiumAction } from '@/utils/billing';
+import { canCreateProjects } from '@/utils/permissions';
 
 const startDate = useSessionStorage<string>(
     'reporting-start-date',
@@ -340,6 +341,7 @@ async function clearSelectionAndState() {
         </div>
         <TimeEntryMassActionRow
             :selected-time-entries="selectedTimeEntries"
+            :canCreateProject="canCreateProjects()"
             :enableEstimatedTime="isAllowedToPerformPremiumAction()"
             @submit="clearSelectionAndState"
             :delete-selected="deleteSelected"
@@ -366,6 +368,7 @@ async function clearSelectionAndState() {
                 <TimeEntryRow
                     :selected="selectedTimeEntries.includes(entry)"
                     @selected="selectedTimeEntries.push(entry)"
+                    :canCreateProject="canCreateProjects()"
                     @unselected="
                         selectedTimeEntries = selectedTimeEntries.filter(
                             (item) => item.id !== entry.id
diff --git a/resources/js/Pages/Time.vue b/resources/js/Pages/Time.vue
index 354d96b3..8e8f9e2a 100644
--- a/resources/js/Pages/Time.vue
+++ b/resources/js/Pages/Time.vue
@@ -29,6 +29,7 @@ import { getOrganizationCurrencyString } from '@/utils/money';
 import TimeEntryMassActionRow from '@/packages/ui/src/TimeEntry/TimeEntryMassActionRow.vue';
 import type { UpdateMultipleTimeEntriesChangeset } from '@/packages/api/src';
 import { isAllowedToPerformPremiumAction } from '@/utils/billing';
+import { canCreateProjects } from '@/utils/permissions';
 
 const timeEntriesStore = useTimeEntriesStore();
 const { timeEntries, allTimeEntriesLoaded } = storeToRefs(timeEntriesStore);
@@ -142,6 +143,7 @@ function deleteSelected() {
         <TimeEntryMassActionRow
             :selected-time-entries="selectedTimeEntries"
             :enableEstimatedTime="isAllowedToPerformPremiumAction()"
+            :canCreateProject="canCreateProjects()"
             @submit="clearSelectionAndState"
             :all-selected="selectedTimeEntries.length === timeEntries.length"
             @select-all="selectedTimeEntries = [...timeEntries]"
@@ -166,6 +168,7 @@ function deleteSelected() {
             v-model:selected="selectedTimeEntries"
             :createProject
             :enableEstimatedTime="isAllowedToPerformPremiumAction()"
+            :canCreateProject="canCreateProjects()"
             :clients
             :createClient
             :updateTimeEntry
diff --git a/resources/js/packages/ui/src/TimeEntry/TimeEntryAggregateRow.vue b/resources/js/packages/ui/src/TimeEntry/TimeEntryAggregateRow.vue
index 0a4f7095..d046337a 100644
--- a/resources/js/packages/ui/src/TimeEntry/TimeEntryAggregateRow.vue
+++ b/resources/js/packages/ui/src/TimeEntry/TimeEntryAggregateRow.vue
@@ -40,6 +40,7 @@ const props = defineProps<{
     currency: string;
     selectedTimeEntries: TimeEntry[];
     enableEstimatedTime: boolean;
+    canCreateProject: boolean;
 }>();
 const emit = defineEmits<{
     selected: [TimeEntry[]];
@@ -121,6 +122,7 @@ function onSelectChange(event: Event) {
                             :clients
                             :createProject
                             :createClient
+                            :canCreateProject
                             :projects="projects"
                             :tasks="tasks"
                             :showBadgeBorder="false"
@@ -177,6 +179,7 @@ function onSelectChange(event: Event) {
             <TimeEntryRow
                 :projects="projects"
                 :enableEstimatedTime
+                :canCreateProject
                 :tasks="tasks"
                 :selected="
                     !!selectedTimeEntries.find(
diff --git a/resources/js/packages/ui/src/TimeEntry/TimeEntryGroupedTable.vue b/resources/js/packages/ui/src/TimeEntry/TimeEntryGroupedTable.vue
index b7740a9c..ecfcbb66 100644
--- a/resources/js/packages/ui/src/TimeEntry/TimeEntryGroupedTable.vue
+++ b/resources/js/packages/ui/src/TimeEntry/TimeEntryGroupedTable.vue
@@ -38,6 +38,7 @@ const props = defineProps<{
     createClient: (client: CreateClientBody) => Promise<Client | undefined>;
     currency: string;
     enableEstimatedTime: boolean;
+    canCreateProject: boolean;
 }>();
 
 const groupedTimeEntries = computed(() => {
@@ -161,6 +162,7 @@ function unselectAllTimeEntries(value: TimeEntriesGroupedByType[]) {
         <template v-for="entry in value" :key="entry.id">
             <TimeEntryAggregateRow
                 :createProject
+                :canCreateProject
                 :enableEstimatedTime
                 :selected-time-entries="selectedTimeEntries"
                 @selected="
@@ -197,6 +199,7 @@ function unselectAllTimeEntries(value: TimeEntriesGroupedByType[]) {
             <TimeEntryRow
                 :createClient
                 :enableEstimatedTime
+                :canCreateProject
                 :createProject
                 :projects="projects"
                 :selected="
diff --git a/resources/js/packages/ui/src/TimeEntry/TimeEntryMassActionRow.vue b/resources/js/packages/ui/src/TimeEntry/TimeEntryMassActionRow.vue
index c428291b..5f8b0160 100644
--- a/resources/js/packages/ui/src/TimeEntry/TimeEntryMassActionRow.vue
+++ b/resources/js/packages/ui/src/TimeEntry/TimeEntryMassActionRow.vue
@@ -33,6 +33,7 @@ const props = defineProps<{
     ) => Promise<void>;
     currency: string;
     enableEstimatedTime: boolean;
+    canCreateProject: boolean;
 }>();
 
 const emit = defineEmits<{
@@ -55,6 +56,7 @@ const showMassUpdateModal = ref(false);
         :createClient
         :updateTimeEntries
         :enableEstimatedTime
+        :canCreateProject
         :currency
         :time-entries="selectedTimeEntries"
         @submit="emit('submit')"
diff --git a/resources/js/packages/ui/src/TimeEntry/TimeEntryMassUpdateModal.vue b/resources/js/packages/ui/src/TimeEntry/TimeEntryMassUpdateModal.vue
index 1e9e9a66..af3adc93 100644
--- a/resources/js/packages/ui/src/TimeEntry/TimeEntryMassUpdateModal.vue
+++ b/resources/js/packages/ui/src/TimeEntry/TimeEntryMassUpdateModal.vue
@@ -36,6 +36,7 @@ const props = defineProps<{
     ) => Promise<void>;
     currency: string;
     enableEstimatedTime: boolean;
+    canCreateProject: boolean;
 }>();
 
 const emit = defineEmits<{
@@ -156,6 +157,7 @@ watch(removeAllTags, () => {
                         :createProject
                         :createClient
                         :currency="currency"
+                        :canCreateProject
                         class="mt-1"
                         empty-placeholder="Select project..."
                         allow-reset
diff --git a/resources/js/packages/ui/src/TimeEntry/TimeEntryRow.vue b/resources/js/packages/ui/src/TimeEntry/TimeEntryRow.vue
index 92ac5cb4..c79a7680 100644
--- a/resources/js/packages/ui/src/TimeEntry/TimeEntryRow.vue
+++ b/resources/js/packages/ui/src/TimeEntry/TimeEntryRow.vue
@@ -38,6 +38,7 @@ const props = defineProps<{
     showMember?: boolean;
     showDate?: boolean;
     selected?: boolean;
+    canCreateProject: boolean;
     enableEstimatedTime: boolean;
 }>();
 
@@ -111,6 +112,7 @@ function onSelectChange(event: Event) {
                     <TimeTrackerProjectTaskDropdown
                         :createProject
                         :createClient
+                        :canCreateProject
                         :clients
                         :projects="projects"
                         :tasks="tasks"
diff --git a/resources/js/packages/ui/src/TimeTracker/TimeTrackerControls.vue b/resources/js/packages/ui/src/TimeTracker/TimeTrackerControls.vue
index 7eb3c79a..89a994d2 100644
--- a/resources/js/packages/ui/src/TimeTracker/TimeTrackerControls.vue
+++ b/resources/js/packages/ui/src/TimeTracker/TimeTrackerControls.vue
@@ -34,6 +34,7 @@ const props = defineProps<{
     isActive: boolean;
     currency: string;
     enableEstimatedTime: boolean;
+    canCreateProject: boolean;
 }>();
 
 const emit = defineEmits<{
@@ -110,6 +111,7 @@ function updateTimeEntryDescription() {
                     class="flex items-center w-[130px] @2xl:w-auto shrink min-w-0">
                     <TimeTrackerProjectTaskDropdown
                         :createClient
+                        :canCreateProject
                         :clients
                         :createProject
                         :currency="currency"
diff --git a/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue b/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue
index c3e2eb78..df8870da 100644
--- a/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue
+++ b/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue
@@ -64,6 +64,7 @@ const props = withDefaults(
         emptyPlaceholder: string;
         allowReset: boolean;
         enableEstimatedTime: boolean;
+        canCreateProject: boolean;
     }>(),
     {
         showBadgeBorder: true,
@@ -532,7 +533,7 @@ const showCreateProject = ref(false);
 </script>
 
 <template>
-    <div v-if="projects.length === 0">
+    <div v-if="projects.length === 0 && canCreateProject">
         <Badge
             @click="showCreateProject = true"
             size="large"
@@ -689,7 +690,9 @@ const showCreateProject = ref(false);
                     </template>
                 </template>
             </div>
-            <div class="hover:bg-card-background-active rounded-b-lg">
+            <div
+                v-if="canCreateProject"
+                class="hover:bg-card-background-active rounded-b-lg">
                 <button
                     @click="
                         open = false;