move ui and api to seperate packages and add npm actions for them

resources/js/Components/Common/ProjectMember/ProjectMemberBillableRateModal.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
-import { formatCents } from '../../../utils/money';
-import BillableRateModal from '@/Components/Common/BillableRateModal.vue';
+import { getOrganizationCurrencyString } from '@/utils/money';
+import BillableRateModal from '@/packages/ui/src/BillableRateModal.vue';
+import { formatCents } from '@/packages/ui/src/utils/money';
 
 const show = defineModel('show', { default: false });
 const saving = defineModel('saving', { default: false });
@@ -25,7 +26,10 @@ defineEmits<{
             The billable rate of {{ memberName }} will be updated to
             <strong>{{
                 newBillableRate
-                    ? formatCents(newBillableRate)
+                    ? formatCents(
+                          newBillableRate,
+                          getOrganizationCurrencyString()
+                      )
                     : ' the default rate of the project'
             }}</strong
             >.

resources/js/Components/Common/ProjectMember/ProjectMemberCreateModal.vue

@@ -1,13 +1,17 @@
 <script setup lang="ts">
-import SecondaryButton from '@/Components/SecondaryButton.vue';
-import DialogModal from '@/Components/DialogModal.vue';
+import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
+import DialogModal from '@/packages/ui/src/DialogModal.vue';
 import { ref } from 'vue';
-import type { CreateProjectMemberBody, ProjectMember } from '@/utils/api';
-import PrimaryButton from '@/Components/PrimaryButton.vue';
+import type {
+    CreateProjectMemberBody,
+    ProjectMember,
+} from '@/packages/api/src';
+import PrimaryButton from '@/packages/ui/src/Buttons/PrimaryButton.vue';
 import { useFocus } from '@vueuse/core';
 import { useProjectMembersStore } from '@/utils/useProjectMembers';
 import MemberCombobox from '@/Components/Common/Member/MemberCombobox.vue';
-import BillableRateInput from '@/Components/Common/BillableRateInput.vue';
+import BillableRateInput from '@/packages/ui/src/Input/BillableRateInput.vue';
+import { getOrganizationCurrencyString } from '@/utils/money';
 const { createProjectMember } = useProjectMembersStore();
 const show = defineModel('show', { default: false });
 const saving = ref(false);
@@ -54,6 +58,7 @@ useFocus(projectNameInput, { initialValue: true });
                 <div class="col-span-3 sm:col-span-1 flex-1">
                     <BillableRateInput
                         name="billable_rate"
+                        :currency="getOrganizationCurrencyString()"
                         v-model="
                             projectMember.billable_rate
                         "></BillableRateInput>

resources/js/Components/Common/ProjectMember/ProjectMemberEditModal.vue

@@ -1,15 +1,19 @@
 <script setup lang="ts">
-import SecondaryButton from '@/Components/SecondaryButton.vue';
-import DialogModal from '@/Components/DialogModal.vue';
+import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
+import DialogModal from '@/packages/ui/src/DialogModal.vue';
 import { ref, watch } from 'vue';
-import type { ProjectMember, UpdateProjectMemberBody } from '@/utils/api';
-import PrimaryButton from '@/Components/PrimaryButton.vue';
+import type {
+    ProjectMember,
+    UpdateProjectMemberBody,
+} from '@/packages/api/src';
+import PrimaryButton from '@/packages/ui/src/Buttons/PrimaryButton.vue';
 import { useFocus } from '@vueuse/core';
 import { useProjectMembersStore } from '@/utils/useProjectMembers';
-import BillableRateInput from '@/Components/Common/BillableRateInput.vue';
+import BillableRateInput from '@/packages/ui/src/Input/BillableRateInput.vue';
 import { UserIcon } from '@heroicons/vue/24/solid';
 import ProjectMemberBillableRateModal from '@/Components/Common/ProjectMember/ProjectMemberBillableRateModal.vue';
-import InputLabel from '@/Components/InputLabel.vue';
+import InputLabel from '@/packages/ui/src/Input/InputLabel.vue';
+import { getOrganizationCurrencyString } from '@/utils/money';
 const { updateProjectMember } = useProjectMembersStore();
 
 const show = defineModel('show', { default: false });
@@ -87,6 +91,7 @@ useFocus(projectNameInput, { initialValue: true });
                         value="Billable Rate"></InputLabel>
                     <BillableRateInput
                         @keydown.enter="submit"
+                        :currency="getOrganizationCurrencyString()"
                         name="billable_rate"
                         v-model="
                             projectMemberBody.billable_rate

resources/js/Components/Common/ProjectMember/ProjectMemberMoreOptionsDropdown.vue

@@ -1,10 +1,10 @@
 <script setup lang="ts">
 import { TrashIcon, PencilSquareIcon } from '@heroicons/vue/20/solid';
-import type { ProjectMember } from '@/utils/api';
+import type { ProjectMember } from '@/packages/api/src';
 import { useMembersStore } from '@/utils/useMembers';
 import { storeToRefs } from 'pinia';
 import { computed } from 'vue';
-import MoreOptionsDropdown from '@/Components/MoreOptionsDropdown.vue';
+import MoreOptionsDropdown from '@/packages/ui/src/MoreOptionsDropdown.vue';
 
 const emit = defineEmits<{
     delete: [];

resources/js/Components/Common/ProjectMember/ProjectMemberTable.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
-import SecondaryButton from '@/Components/SecondaryButton.vue';
+import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
 import { PlusIcon } from '@heroicons/vue/16/solid';
 import { ref } from 'vue';
 import ProjectMemberTableRow from '@/Components/Common/ProjectMember/ProjectMemberTableRow.vue';
 import { UserGroupIcon } from '@heroicons/vue/24/solid';
 import ProjectMemberTableHeading from '@/Components/Common/ProjectMember/ProjectMemberTableHeading.vue';
 import ProjectMemberCreateModal from '@/Components/Common/ProjectMember/ProjectMemberCreateModal.vue';
-import type { ProjectMember } from '@/utils/api';
+import type { ProjectMember } from '@/packages/api/src';
 
 defineProps<{
     projectId: string;

resources/js/Components/Common/ProjectMember/ProjectMemberTableRow.vue

@@ -1,14 +1,15 @@
 <script setup lang="ts">
-import type { ProjectMember } from '@/utils/api';
+import type { ProjectMember } from '@/packages/api/src';
 import { computed, ref } from 'vue';
 import { storeToRefs } from 'pinia';
 import TableRow from '@/Components/TableRow.vue';
 import { useMembersStore } from '@/utils/useMembers';
 import { useProjectMembersStore } from '@/utils/useProjectMembers';
 import ProjectMemberMoreOptionsDropdown from '@/Components/Common/ProjectMember/ProjectMemberMoreOptionsDropdown.vue';
-import { formatCents } from '@/utils/money';
+import { formatCents } from '@/packages/ui/src/utils/money';
 import { capitalizeFirstLetter } from '@/utils/format';
 import ProjectMemberEditModal from '@/Components/Common/ProjectMember/ProjectMemberEditModal.vue';
+import { getOrganizationCurrencyString } from '@/utils/money';
 
 const props = defineProps<{
     projectMember: ProjectMember;
@@ -48,7 +49,10 @@ const showEditModal = ref(false);
         <div class="whitespace-nowrap px-3 py-4 text-sm text-muted">
             {{
                 projectMember.billable_rate
-                    ? formatCents(projectMember.billable_rate)
+                    ? formatCents(
+                          projectMember.billable_rate,
+                          getOrganizationCurrencyString()
+                      )
                     : '--'
             }}
         </div>