+
diff --git a/packages/frontend/src/pages/org-slug/projects/id/Deployments.tsx b/packages/frontend/src/pages/org-slug/projects/id/Deployments.tsx
index d26a2dd..8ae231d 100644
--- a/packages/frontend/src/pages/org-slug/projects/id/Deployments.tsx
+++ b/packages/frontend/src/pages/org-slug/projects/id/Deployments.tsx
@@ -2,15 +2,15 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { Deployment, Domain } from 'gql-client';
import { useOutletContext } from 'react-router-dom';
-import { Button, Typography } from '@material-tailwind/react';
-
-import DeploymentDetailsCard from '../../../../components/projects/project/deployments/DeploymentDetailsCard';
+import DeploymentDetailsCard from 'components/projects/project/deployments/DeploymentDetailsCard';
import FilterForm, {
FilterValue,
StatusOptions,
-} from '../../../../components/projects/project/deployments/FilterForm';
-import { OutletContextType } from '../../../../types';
-import { useGQLClient } from '../../../../context/GQLClientContext';
+} from 'components/projects/project/deployments/FilterForm';
+import { OutletContextType } from 'types';
+import { useGQLClient } from 'context/GQLClientContext';
+import { Button } from 'components/shared/Button';
+import { RefreshIcon } from 'components/shared/CustomIcon';
const DEFAULT_FILTER_VALUE: FilterValue = {
searchedBranch: '',
@@ -73,12 +73,19 @@ const DeploymentsTabPanel = () => {
// TODO: match status field types
(deployment.status as unknown as StatusOptions) === filterValue.status;
+ const startDate =
+ filterValue.updateAtRange instanceof Array
+ ? filterValue.updateAtRange[0]
+ : null;
+ const endDate =
+ filterValue.updateAtRange instanceof Array
+ ? filterValue.updateAtRange[1]
+ : null;
+
const dateMatch =
!filterValue.updateAtRange ||
- (new Date(Number(deployment.createdAt)) >=
- filterValue.updateAtRange!.from! &&
- new Date(Number(deployment.createdAt)) <=
- filterValue.updateAtRange!.to!);
+ (new Date(Number(deployment.createdAt)) >= startDate! &&
+ new Date(Number(deployment.createdAt)) <= endDate!);
return branchMatch && statusMatch && dateMatch;
});
@@ -93,12 +100,12 @@ const DeploymentsTabPanel = () => {
};
return (
-
+
setFilterValue(value)}
/>
-
+
{Boolean(filteredDeployments.length) ? (
filteredDeployments.map((deployment, key) => {
return (
@@ -113,27 +120,27 @@ const DeploymentsTabPanel = () => {
);
})
) : (
-
-
-
+ // TODO: Update the height based on the layout, need to re-styling the layout similar to create project layout
+
+
+
No deployments found
-
-
- Please change your search query or filters
-
-
+
+
+ Please change your search query or filters.
+
+
}
+ onClick={handleResetFilters}
+ >
+ Reset filters
+
)}
-
+
);
};