feat: query projects with status array

.env.development

@@ -1,2 +1,3 @@
-BASE_URL='https://develop-api.fortress.d.foundation/api/v1'
+# BASE_URL='https://develop-api.fortress.d.foundation/api/v1'
+BASE_URL='https://api.fortress.d.foundation/api/v1'
 GOOGLE_CLIENT_ID='180094408893-s17eot91hbmqa5lp6gsgjglan9et20sp.apps.googleusercontent.com'

src/components/pages/feedbacks/work/ToggleAllowSendSurveyModal.tsx

@@ -9,15 +9,16 @@ import {
   Switch,
   Typography,
 } from 'antd'
-import { useCallback, useMemo, useState } from 'react'
-import debounce from 'lodash.debounce'
+import { ProjectStatus } from 'constants/status'
 import { useFetchWithCache } from 'hooks/useFetchWithCache'
-import { GET_PATHS, client } from 'libs/apis'
-import { ProjectListFilter } from 'types/filters/ProjectListFilter'
 import { useFilter } from 'hooks/useFilter'
+import { client, GET_PATHS } from 'libs/apis'
+import debounce from 'lodash.debounce'
+import { useCallback, useMemo, useState } from 'react'
+import { theme } from 'styles'
+import { ProjectListFilter } from 'types/filters/ProjectListFilter'
 import { ViewProjectData } from 'types/schema'
 import { getErrorMessage } from 'utils/string'
-import { theme } from 'styles'
 
 interface Props {
   isOpen: boolean
@@ -27,7 +28,10 @@ interface Props {
 export const ToggleAllowSendSurveyModal = (props: Props) => {
   const { isOpen, onClose } = props
   const { filter } = useFilter(
-    new ProjectListFilter({ sort: '-start_date, -name', status: 'active' }),
+    new ProjectListFilter({
+      sort: '-start_date, -name',
+      status: [ProjectStatus.ACTIVE],
+    }),
   )
 
   const { data: projectsData, mutate } = useFetchWithCache(

src/components/pages/invoice/new/InvoiceForm.tsx

@@ -61,7 +61,7 @@ export const InvoiceForm = () => {
   const { data: projectData } = useFetchWithCache(GET_PATHS.getProjects, () =>
     client.getProjects({
       ...new ProjectListFilter({
-        status: ProjectStatus.ACTIVE,
+        status: [ProjectStatus.ACTIVE],
         type: [ProjectType.FIXED_COST, ProjectType.TIME_MATERIAL],
       }),
       ...fullListPagination,

src/libs/apis.ts

@@ -227,7 +227,9 @@ class Client {
   }
 
   public getProjects(filter: ProjectListFilter) {
-    const queryString = qs.stringify(filter)
+    const queryString = qs.stringify(filter, {
+      arrayFormat: 'repeat',
+    })
 
     return fetcher<ViewProjectListDataResponse & Meta>(
       `${BASE_URL}/projects?${queryString}`,

src/pages/projects/index.tsx

@@ -214,8 +214,8 @@ const columns = ({
     key: 'status',
     dataIndex: 'status',
     filterSearch: true,
-    filterMultiple: false,
-    filteredValue: filter.status ? [filter.status].flat() : [],
+    filterMultiple: true,
+    filteredValue: filter.status,
     filters: projectStatusData
       .map(transformMetadataToFilterOption)
       .map(({ text, value = '' }) => ({
@@ -270,7 +270,7 @@ const Default = () => {
 
   const { filter, setFilter } = useFilter(
     new ProjectListFilter({
-      status: ProjectStatus.ACTIVE,
+      status: [ProjectStatus.ONBOARDING, ProjectStatus.ACTIVE],
       ...queryFilter,
     }),
     { shouldUpdateToQuery: true },
@@ -365,7 +365,7 @@ const Default = () => {
                 )
                 .join(',')
               setFilter({
-                status: (filters.status?.[0] as string) || '',
+                status: (filters.status as string[]) || [],
                 sort,
               })
             }}

src/types/filters/ProjectListFilter.ts

@@ -2,7 +2,7 @@ import { Nullable } from 'types/common'
 import { Pagination } from './Pagination'
 
 interface RequestGetListProjectInput {
-  status?: string | string[]
+  status?: string[]
   name?: string
   type?: string | string[]
   sort?: string
@@ -18,7 +18,7 @@ export class ProjectListFilter
   sort
 
   constructor({
-    status = null,
+    status = [],
     name = null,
     type = null,
     sort = null,