diff --git a/packages/frontend/src/components/projects/project/deployments/FilterForm.tsx b/packages/frontend/src/components/projects/project/deployments/FilterForm.tsx index 5cf4c200..78324eff 100644 --- a/packages/frontend/src/components/projects/project/deployments/FilterForm.tsx +++ b/packages/frontend/src/components/projects/project/deployments/FilterForm.tsx @@ -1,7 +1,14 @@ import React, { useEffect, useState } from 'react'; import { Input } from 'components/shared/Input'; -import { CrossCircleIcon, SearchIcon } from 'components/shared/CustomIcon'; +import { + CheckRadioOutlineIcon, + CrossCircleIcon, + LoaderIcon, + SearchIcon, + TrendingIcon, + WarningTriangleIcon, +} from 'components/shared/CustomIcon'; import { DatePicker } from 'components/shared/DatePicker'; import { Value } from 'react-calendar/dist/cjs/shared/types'; import { Select, SelectOption } from 'components/shared/Select'; @@ -43,10 +50,25 @@ const FilterForm = ({ value, onChange }: FilterFormProps) => { setDateRange(value.updateAtRange); }, [value]); + const getOptionIcon = (status: StatusOptions) => { + switch (status) { + case StatusOptions.BUILDING: + return ; + case StatusOptions.READY: + return ; + case StatusOptions.ERROR: + return ; + case StatusOptions.ALL_STATUS: + default: + return ; + } + }; + const statusOptions = Object.values(StatusOptions) .map((status) => ({ label: status, value: status, + leftIcon: getOptionIcon(status), })) .filter((status) => status.value !== StatusOptions.ALL_STATUS); @@ -78,6 +100,7 @@ const FilterForm = ({ value, onChange }: FilterFormProps) => {