diff --git a/src/containers/Expenses/ExpenseForm/ExpenseForm.schema.tsx b/src/containers/Expenses/ExpenseForm/ExpenseForm.schema.tsx index a85e34466..3f12128f9 100644 --- a/src/containers/Expenses/ExpenseForm/ExpenseForm.schema.tsx +++ b/src/containers/Expenses/ExpenseForm/ExpenseForm.schema.tsx @@ -33,6 +33,7 @@ const Schema = Yup.object().shape({ }), landed_cost: Yup.boolean(), description: Yup.string().max(DATATYPES_LENGTH.TEXT).nullable(), + project_id: Yup.number().nullable(), }), ), }); diff --git a/src/containers/Expenses/ExpenseForm/ExpenseFormEntriesField.tsx b/src/containers/Expenses/ExpenseForm/ExpenseFormEntriesField.tsx index abec92e0f..ac67ff2a7 100644 --- a/src/containers/Expenses/ExpenseForm/ExpenseFormEntriesField.tsx +++ b/src/containers/Expenses/ExpenseForm/ExpenseFormEntriesField.tsx @@ -9,12 +9,13 @@ import { defaultExpenseEntry, accountsFieldShouldUpdate } from './utils'; */ export default function ExpenseFormEntriesField({ linesNumber = 4 }) { // Expense form context. - const { accounts } = useExpenseFormContext(); + const { accounts, projects } = useExpenseFormContext(); return ( {({ diff --git a/src/containers/Expenses/ExpenseForm/ExpenseFormEntriesTable.tsx b/src/containers/Expenses/ExpenseForm/ExpenseFormEntriesTable.tsx index 481d2e456..b242bbc49 100644 --- a/src/containers/Expenses/ExpenseForm/ExpenseFormEntriesTable.tsx +++ b/src/containers/Expenses/ExpenseForm/ExpenseFormEntriesTable.tsx @@ -26,7 +26,7 @@ export default function ExpenseFormEntriesTable({ minLines, }) { // Expense form context. - const { accounts } = useExpenseFormContext(); + const { accounts, projects } = useExpenseFormContext(); // Memorized data table columns. const columns = useExpenseFormTableColumns({ landedCost }); @@ -69,11 +69,12 @@ export default function ExpenseFormEntriesTable({ sticky={true} payload={{ accounts: accounts, + projects: projects, errors: error, updateData: handleUpdateData, removeRow: handleRemoveRow, autoFocus: ['expense_account_id', 0], - currencyCode + currencyCode, }} /> ); @@ -81,4 +82,4 @@ export default function ExpenseFormEntriesTable({ ExpenseFormEntriesTable.defaultProps = { minLines: 1, -} \ No newline at end of file +}; diff --git a/src/containers/Expenses/ExpenseForm/ExpenseFormPageProvider.tsx b/src/containers/Expenses/ExpenseForm/ExpenseFormPageProvider.tsx index e52f45612..4ec0793e9 100644 --- a/src/containers/Expenses/ExpenseForm/ExpenseFormPageProvider.tsx +++ b/src/containers/Expenses/ExpenseForm/ExpenseFormPageProvider.tsx @@ -11,6 +11,7 @@ import { useCreateExpense, useEditExpense, } from '@/hooks/query'; +import { useProjects } from '@/containers/Projects/hooks'; const ExpenseFormPageContext = createContext(); @@ -45,6 +46,12 @@ function ExpenseFormPageProvider({ query, expenseId, ...props }) { // Fetch accounts list. const { data: accounts, isLoading: isAccountsLoading } = useAccounts(); + // Fetch the projects list. + const { + data: { projects }, + isLoading: isProjectsLoading, + } = useProjects(); + // Create and edit expense mutate. const { mutateAsync: createExpenseMutate } = useCreateExpense(); const { mutateAsync: editExpenseMutate } = useEditExpense(); @@ -66,7 +73,8 @@ function ExpenseFormPageProvider({ query, expenseId, ...props }) { expense, accounts, branches, - + projects, + isCurrenciesLoading, isExpenseLoading, isCustomersLoading, @@ -84,7 +92,8 @@ function ExpenseFormPageProvider({ query, expenseId, ...props }) { isCurrenciesLoading || isExpenseLoading || isCustomersLoading || - isAccountsLoading + isAccountsLoading || + isProjectsLoading } name={'expense-form'} > diff --git a/src/containers/Expenses/ExpenseForm/components.tsx b/src/containers/Expenses/ExpenseForm/components.tsx index 1389d1ebb..b19879782 100644 --- a/src/containers/Expenses/ExpenseForm/components.tsx +++ b/src/containers/Expenses/ExpenseForm/components.tsx @@ -14,11 +14,12 @@ import { InputGroupCell, MoneyFieldCell, AccountsListFieldCell, + ProjectsListFieldCell, CheckBoxFieldCell, } from '@/components/DataTableCells'; -import { CellType, Align } from '@/constants'; +import { CellType, Features, Align } from '@/constants'; -import { useCurrentOrganization } from '@/hooks/state'; +import { useCurrentOrganization, useFeatureCan } from '@/hooks/state'; import { useExpensesIsForeign } from './utils'; /** @@ -90,6 +91,8 @@ export function ExpenseAmountHeaderCell({ payload: { currencyCode } }) { * Retrieve expense form table entries columns. */ export function useExpenseFormTableColumns({ landedCost }) { + const { featureCan } = useFeatureCan(); + return React.useMemo( () => [ { @@ -118,6 +121,20 @@ export function useExpenseFormTableColumns({ landedCost }) { disableSortBy: true, width: 100, }, + ...(featureCan(Features.Branches) + ? [ + { + Header: intl.get('project'), + id: 'project_id', + accessor: 'project_id', + Cell: ProjectsListFieldCell, + className: 'project_id', + disableSortBy: true, + width: 40, + }, + ] + : []), + ...(landedCost ? [ { diff --git a/src/containers/Expenses/ExpenseForm/utils.tsx b/src/containers/Expenses/ExpenseForm/utils.tsx index bf53db4cd..80df901da 100644 --- a/src/containers/Expenses/ExpenseForm/utils.tsx +++ b/src/containers/Expenses/ExpenseForm/utils.tsx @@ -31,6 +31,7 @@ export const defaultExpenseEntry = { expense_account_id: '', description: '', landed_cost: 0, + project_id: '', }; export const defaultExpense = { diff --git a/src/lang/en/index.json b/src/lang/en/index.json index 1a15872fc..1cab693f9 100644 --- a/src/lang/en/index.json +++ b/src/lang/en/index.json @@ -2190,7 +2190,8 @@ "receipt.project_name.label": "Project Name", "bill.project_name.label": "Project Name", "payment_receive.project_name.label": "Project Name", - "select_project": "Select Project", + "select_project": "Select project", + "project":"Project", "projects_multi_select.label":"Projects", "projects_multi_select.placeholder": "Filter by projects…", "project_profitability_summary": "Project Profitability Summary",