Merge pull request #193 from autentia/feature/expand_project_types

Add project types attending to billing

src/features/administration/features/project/ui/components/projects-table.tsx

@@ -16,6 +16,7 @@ import { StatusBadge } from './status-badge'
 import { useIsMobile } from '../../../../../../shared/hooks/use-is-mobile'
 import { Project } from '../../../../../shared/project/domain/project'
 import { ProjectOrganizationFilters } from '../../../../../shared/project/domain/project-organization-filters'
+import { ProjectBillingType } from '../../../../../shared/project/domain/project-billing-type'
 
 interface Props {
   onProjectClicked(project: Project): void
@@ -93,11 +94,13 @@ export const ProjectsTable: FC<Props> = (props) => {
         render: (open: boolean) => <StatusBadge status={open} />
       },
       {
-        title: 'projects.billable',
-        dataIndex: 'billable',
-        key: 'billable',
+        title: 'projects.projectType',
+        dataIndex: 'projectBillingType',
+        key: 'projectBillingType',
         showLabelInMobile: true,
-        render: (billable: boolean) => (billable ? t('projects.yes') : t('projects.no'))
+        render: (projectBillingType: ProjectBillingType) => {
+          return t('projects.' + projectBillingType.name)
+        }
       },
       {
         title: 'projects.blocking_date',

src/features/administration/features/project/ui/projects-page-utils.tsx

@@ -1,13 +1,14 @@
 import { chrono } from '../../../../../shared/utils/chrono'
 import { Project } from '../../../../shared/project/domain/project'
+import { ProjectBillingType } from '../../../../shared/project/domain/project-billing-type'
 
 export interface AdaptedProjects {
   key: number
   organization: string
   project: string
   startDate: string
   open: boolean
-  billable: boolean
+  projectBillingType: ProjectBillingType
   blockDate: string
   action: Project
 }
@@ -23,7 +24,7 @@ export const adaptProjectsToTable = (
       project: project.name,
       startDate: project.startDate ? chrono(project.startDate).format('dd/MM/yyyy') : '-',
       open: project.open,
-      billable: project.billable,
+      projectBillingType: project.projectBillingType,
       blockDate: project.blockDate ? chrono(project.blockDate).format('dd/MM/yyyy') : '-',
       action: project
     }

src/features/binnacle/features/activity/application/create-subcontracted-activity-cmd.test.ts

@@ -22,6 +22,7 @@ function setup() {
 
   const newSubcontractedActivity: NewSubcontractedActivity = {
     description: 'any-description',
+    billable: true,
     projectRoleId: 1,
     duration: 333,
     month: '2024-05'

src/features/binnacle/features/activity/application/update-subcontracted-activity-cmd.test.ts

@@ -23,6 +23,7 @@ function setup() {
   const updateSubcontractedActivity: UpdateSubcontractedActivity = {
     id: 1,
     description: 'Minutes activity',
+    billable: true,
     projectRoleId: 1,
     duration: 555,
     month: '2024-05'

src/features/binnacle/features/activity/domain/new-subcontracted-activity.ts

@@ -2,5 +2,5 @@ import { SubcontractedActivityWithProjectRoleId } from './subcontracted-activity
 
 export type NewSubcontractedActivity = Pick<
   SubcontractedActivityWithProjectRoleId,
-  'description' | 'projectRoleId' | 'duration' | 'month'
+  'description' | 'billable' | 'projectRoleId' | 'duration' | 'month'
 >

src/features/binnacle/features/activity/domain/subcontracted-activity.ts

@@ -7,6 +7,7 @@ export interface SubcontractedActivity {
   id: Id
   description: string
   userId: Id
+  billable: boolean
   organization: Organization
   project: LiteProjectWithOrganizationId
   projectRole: LiteProjectRoleWithProjectId

src/features/binnacle/features/activity/domain/update-subcontracted-activity.ts

@@ -2,5 +2,5 @@ import { SubcontractedActivityWithProjectRoleId } from './subcontracted-activity
 
 export type UpdateSubcontractedActivity = Pick<
   SubcontractedActivityWithProjectRoleId,
-  'id' | 'description' | 'projectRoleId' | 'duration' | 'month'
+  'id' | 'description' | 'billable' | 'projectRoleId' | 'duration' | 'month'
 >

src/features/binnacle/features/activity/tests/change-billable-activity-form.int.tsx

@@ -0,0 +1,37 @@
+import ActivitiesPage from '../ui/activities-page'
+
+describe('Change billable type activity', () => {
+  it('should put not billable when no billable project', () => {
+    setup()
+    cy.findByTestId('show_activity_modal').click()
+    cy.findByRole('button', { name: 'Add role' }).click()
+    cy.findByTestId('organization_field').type('Test organization\n')
+    cy.findByTestId('project_field').type('Proyecto C\n')
+
+    cy.findByText('No billable').should('exist')
+  })
+
+  it('should closed price when billable project', () => {
+    setup()
+    cy.findByTestId('show_activity_modal').click()
+    cy.findByRole('button', { name: 'Add role' }).click()
+    cy.findByTestId('organization_field').type('Test organization\n')
+    cy.findByTestId('project_field').type('Proyecto B\n')
+
+    cy.findByText('Closed price').should('exist')
+  })
+
+  it('should change billable field when billable project', () => {
+    setup()
+    cy.findByTestId('show_activity_modal').click()
+    cy.findByRole('button', { name: 'Add role' }).click()
+    cy.findByTestId('organization_field').type('Test organization\n')
+    cy.findByTestId('project_field').type('Proyecto A\n')
+
+    cy.findByText('Billable').should('exist')
+  })
+})
+
+function setup() {
+  cy.mount(<ActivitiesPage />)
+}

src/features/binnacle/features/activity/ui/components/activities-list/activities-list-adapter.test.tsx

@@ -37,10 +37,14 @@ describe('ActivitiesListAdapter', () => {
             name: 'Test organization'
           },
           project: {
-            billable: false,
             id: 2,
             name: 'Billable project',
-            organizationId: 1
+            organizationId: 1,
+            projectBillingType: {
+              billableByDefault: true,
+              name: 'CLOSED_PRICE',
+              type: 'ALWAYS'
+            }
           },
           projectRole: {
             id: 3,
@@ -50,9 +54,13 @@ describe('ActivitiesListAdapter', () => {
               name: 'Test organization'
             },
             project: {
-              billable: false,
               id: 1,
-              name: 'No billable project'
+              name: 'No billable project',
+              projectBillingType: {
+                billableByDefault: false,
+                name: 'NO_BILLABLE',
+                type: 'NEVER'
+              }
             },
             timeInfo: {
               timeUnit: TimeUnits.DAYS,

src/features/binnacle/features/activity/ui/components/activity-form/activity-form.tsx

@@ -29,6 +29,7 @@ import { GetAutofillHours } from './utils/get-autofill-hours'
 import { GetInitialActivityFormValues } from './utils/get-initial-activity-form-values'
 import { TimeUnits } from '../../../../../../../shared/types/time-unit'
 import { NonHydratedProjectRole } from '../../../../project-role/domain/non-hydrated-project-role'
+import { ProjectBillableType } from '../../../../../../shared/project/domain/project-billable-type'
 
 export const ACTIVITY_FORM_ID = 'activity-form-id'
 
@@ -217,6 +218,11 @@ export const ActivityForm: FC<ActivityFormProps> = (props) => {
     [isHourlyProject, startTime, date, endTime, startDate, endDate]
   )
 
+  const billableType: ProjectBillableType =
+    (showRecentRole
+      ? recentProjectRole?.project.projectBillingType.type
+      : project?.projectBillingType.type) ?? 'OPTIONAL'
+
   useEffect(() => {
     function setBillableProjectOnChange() {
       if (showRecentRole) {
@@ -225,7 +231,10 @@ export const ActivityForm: FC<ActivityFormProps> = (props) => {
           return
         }
 
-        setValue('billable', recentProjectRole?.project?.billable || false)
+        setValue(
+          'billable',
+          recentProjectRole?.project?.projectBillingType.billableByDefault || false
+        )
         return
       }
 
@@ -234,7 +243,7 @@ export const ActivityForm: FC<ActivityFormProps> = (props) => {
         return
       }
 
-      setValue('billable', project?.billable || false)
+      setValue('billable', project?.projectBillingType.billableByDefault || false)
     }
 
     setBillableProjectOnChange()
@@ -350,7 +359,7 @@ export const ActivityForm: FC<ActivityFormProps> = (props) => {
         )}
       </Flex>
 
-      {!isReadOnly && (
+      {!isReadOnly && billableType === 'OPTIONAL' && (
         <Box gridArea="billable">
           <Controller
             control={control}
@@ -372,6 +381,18 @@ export const ActivityForm: FC<ActivityFormProps> = (props) => {
         </Box>
       )}
 
+      {!isReadOnly && billableType === 'NEVER' && (
+        <Box gridArea="billable">
+          <span>{t('projects.NO_BILLABLE')}</span>
+        </Box>
+      )}
+
+      {!isReadOnly && billableType === 'ALWAYS' && (
+        <Box gridArea="billable">
+          <span>{t('projects.CLOSED_PRICE')}</span>
+        </Box>
+      )}
+
       <ActivityTextArea
         {...register('description')}
         control={control}

src/features/binnacle/features/activity/ui/components/activity-form/utils/get-initial-activity-form-values.ts

@@ -31,7 +31,7 @@ export class GetInitialActivityFormValues {
       startDate: chrono(startDate).format(chrono.DATE_FORMAT),
       endDate: chrono(startDate).format(chrono.DATE_FORMAT),
       description: '',
-      billable: recentRole?.project.billable ?? false,
+      billable: recentRole?.project.projectBillingType.billableByDefault ?? false,
       recentProjectRole: recentRole,
       showRecentRole: true
     }

src/features/binnacle/features/activity/ui/components/subcontracted-activities-list/subcontracted-activities-list-adapter.test.tsx

@@ -15,6 +15,7 @@ describe('SubcontractedActivitiesListAdapter', () => {
     const expected: AdaptedSubcontractedActivity = {
       key: subcontractedActivity.id,
       id: subcontractedActivity.id,
+      billable: subcontractedActivity.billable,
       month: subcontractedActivity.month,
       duration: subcontractedActivity.duration + 'h',
       organization: organization.name,

src/features/binnacle/features/activity/ui/components/subcontracted-activities-list/subcontracted-activities-list-adapter.tsx

@@ -8,6 +8,7 @@ export const subcontractedActivitiesListAdapter = (
     return {
       key: activity.id,
       id: activity.id,
+      billable: activity.billable,
       month: activity.month,
       duration: activity.duration + 'h',
       organization: activity.organization.name,

src/features/binnacle/features/activity/ui/components/subcontracted-activities-list/types/adapted-subcontracted-activity.ts

@@ -3,6 +3,7 @@ import { SubcontractedActivity } from '../../../../domain/subcontracted-activity
 export interface AdaptedSubcontractedActivity {
   key: number
   id: number
+  billable: boolean
   month: string
   duration: string
   organization: string

src/features/binnacle/features/activity/ui/components/subcontracted-activity-form/subcontracted-activity-form.schema.ts

@@ -5,6 +5,7 @@ import * as yup from 'yup'
 import { Project } from '../../../../../../shared/project/domain/project'
 
 export interface SubcontractedActivityFormSchema {
+  billable: boolean
   description: string
   organization?: Organization
   project?: Project
@@ -18,6 +19,7 @@ const MAX_DESCRIPTION_LENGTH = 2048
 export const SubcontractedActivityFormValidationSchema: yup.ObjectSchema<SubcontractedActivityFormSchema> =
   yup
     .object({
+      billable: yup.boolean().required(i18n.t('form_errors.field_required')),
       description: yup
         .string()
         .required(i18n.t('form_errors.field_required'))

src/features/binnacle/features/activity/ui/components/subcontracted-activity-form/subcontracted-activity-form.tsx

@@ -1,8 +1,8 @@
-import { Box, Flex, Grid } from '@chakra-ui/react'
-import { useForm } from 'react-hook-form'
+import { Box, Checkbox, Flex, Grid } from '@chakra-ui/react'
+import { Controller, useForm, useWatch } from 'react-hook-form'
 import { yupResolver } from '@hookform/resolvers/yup'
 import { UserSettings } from '../../../../../../shared/user/features/settings/domain/user-settings'
-import { FC, useMemo } from 'react'
+import { FC, useEffect, useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useGetUseCase } from '../../../../../../../shared/arch/hooks/use-get-use-case'
 import { useResolve } from '../../../../../../../shared/di/use-resolve'
@@ -23,6 +23,7 @@ import { SubcontractedActivity } from '../../../domain/subcontracted-activity'
 import { MonthField } from '../../../../../../../shared/components/form-fields/month-field'
 import { NumberField } from '../../../../../../../shared/components/form-fields/number-field'
 import { SelectRoleSectionWithoutRecentRole } from './components/role-selection-without-recent-roles'
+import { ProjectBillableType } from '../../../../../../shared/project/domain/project-billable-type'
 
 export const SUBCONTRACTED_ACTIVITY_FORM_ID = 'subcontracted-activity-form-id'
 
@@ -83,13 +84,19 @@ export const SubcontractedActivityForm: FC<SubcontractedActivityFormProps> = (pr
     register,
     handleSubmit,
     control,
+    setValue,
     formState: { errors }
   } = useForm<SubcontractedActivityFormSchema>({
     defaultValues: initialFormValues,
     resolver: yupResolver(SubcontractedActivityFormValidationSchema),
     mode: 'onSubmit'
   })
 
+  const [project] = useWatch({
+    control,
+    name: ['project']
+  })
+
   const onSubmit = async (data: SubcontractedActivityFormSchema) => {
     const projectRoleId = data.projectRole!.id
     const isNewActivity = subcontractedActivity?.id === undefined
@@ -98,6 +105,7 @@ export const SubcontractedActivityForm: FC<SubcontractedActivityFormProps> = (pr
     if (isNewActivity && data.duration != null) {
       const newSubcontractedActivity: NewSubcontractedActivity = {
         description: data.description,
+        billable: data.billable,
         projectRoleId: projectRoleId,
         duration: data.duration,
         month: data.month
@@ -115,6 +123,7 @@ export const SubcontractedActivityForm: FC<SubcontractedActivityFormProps> = (pr
       const updateSubcontractedActivity: UpdateSubcontractedActivity = {
         id: subcontractedActivity!.id,
         description: data.description,
+        billable: data.billable,
         projectRoleId: projectRoleId,
         duration: data.duration!,
         month: data.month
@@ -131,6 +140,21 @@ export const SubcontractedActivityForm: FC<SubcontractedActivityFormProps> = (pr
     }
   }
 
+  const billableType: ProjectBillableType = project?.projectBillingType.type ?? 'OPTIONAL'
+
+  useEffect(() => {
+    function setBillableProjectOnChange() {
+      if (subcontractedActivity && subcontractedActivity?.project.id === project?.id) {
+        setValue('billable', subcontractedActivity?.billable || false)
+        return
+      }
+
+      setValue('billable', project?.projectBillingType.billableByDefault || false)
+    }
+
+    setBillableProjectOnChange()
+  }, [subcontractedActivity, project, setValue])
+
   return (
     <Grid
       templateColumns="repeat(6, [col] 1fr)"
@@ -187,6 +211,40 @@ export const SubcontractedActivityForm: FC<SubcontractedActivityFormProps> = (pr
         />
       </Box>
 
+      {!isReadOnly && billableType == 'OPTIONAL' && (
+        <Box gridArea="billable">
+          <Controller
+            control={control}
+            name="billable"
+            render={({ field: { onChange, onBlur, value, ref } }) => (
+              <Checkbox
+                defaultChecked={value}
+                isChecked={value}
+                onChange={onChange}
+                onBlur={onBlur}
+                ref={ref}
+                colorScheme="brand"
+                isDisabled={isReadOnly}
+              >
+                {t('activity_form.billable')}
+              </Checkbox>
+            )}
+          />
+        </Box>
+      )}
+
+      {!isReadOnly && billableType == 'NEVER' && (
+        <Box gridArea="billable">
+          <span>{t('projects.NO_BILLABLE')}</span>
+        </Box>
+      )}
+
+      {!isReadOnly && billableType == 'ALWAYS' && (
+        <Box gridArea="billable">
+          <span>{t('projects.CLOSED_PRICE')}</span>
+        </Box>
+      )}
+
       <ActivityTextArea
         {...register('description')}
         control={control}