fix: Drawer should not apply any filters if cancel is cliked

- also add TreeUl as prop
kernelci · Jul 23, 2024 · 63e4ca3 · 63e4ca3
1 parent 23bcc92
commit 63e4ca3
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 5 deletions.
diff --git a/dashboard/src/routes/TreeDetails/TreeDetails.tsx b/dashboard/src/routes/TreeDetails/TreeDetails.tsx
@@ -41,6 +41,19 @@ const TreeDetails = (): JSX.Element => {
     [filter],
   );
 
+  //TODO: at some point `treeUrl` should be returned in `data`
+  const treeUrl = useMemo(() => {
+    let url = '';
+    if (!data) return '';
+    Object.entries(data.builds).some(([, build]) => {
+      if (build.git_repository_url) {
+        url = build.git_repository_url;
+        return true;
+      }
+    });
+    return url;
+  }, [data]);
+
   useEffect(() => {
     if (data) {
       const configsData: IListingItem[] = Object.entries(
@@ -100,11 +113,15 @@ const TreeDetails = (): JSX.Element => {
     <div className="flex flex-col pt-8">
       <div className="flex flex-col pb-2">
         <div className="flex justify-end">
-          <TreeDetailsFilter filter={filter} onFilter={setFilter} />
+          <TreeDetailsFilter
+            filter={filter}
+            onFilter={setFilter}
+            treeUrl={treeUrl}
+          />
         </div>
         <TreeDetailsTab
           treeDetailsData={treeDetailsData}
-          FilterListElement={filterListElement}
+          filterListElement={filterListElement}
         />
       </div>
     </div>

diff --git a/dashboard/src/routes/TreeDetails/TreeDetailsFilter.tsx b/dashboard/src/routes/TreeDetails/TreeDetailsFilter.tsx
@@ -16,6 +16,7 @@ export type TFilter =
 interface ITreeDetailsFilter {
   filter: TFilter;
   onFilter: (filter: TFilter) => void;
+  treeUrl: string;
 }
 
 export type TFilterKeys = (typeof filterFieldMap)[keyof typeof filterFieldMap];
@@ -87,6 +88,7 @@ const changeFilterValue = (
 const TreeDetailsFilter = ({
   filter,
   onFilter,
+  treeUrl,
 }: ITreeDetailsFilter): JSX.Element => {
   const intl = useIntl();
   const [diffFilter, setDiffFilter] = useState<TFilter>({});
@@ -106,6 +108,10 @@ const TreeDetailsFilter = ({
     setDiffFilter({});
   }, [filter, diffFilter, onFilter]);
 
+  const onClickCancel = useCallback(() => {
+    setDiffFilter({});
+  }, []);
+
   const checkboxSectionsProps: ICheckboxSection[] = useMemo(() => {
     return [
       {
@@ -160,7 +166,11 @@ const TreeDetailsFilter = ({
   );
 
   return (
-    <FilterDrawer treeURL={treeUrl} onFilter={onClickFilterHandle}>
+    <FilterDrawer
+      treeURL={treeUrl}
+      onFilter={onClickFilterHandle}
+      onCancel={onClickCancel}
+    >
       <FilterSummarySection {...summarySectionProps} />
       {checkboxSectionsComponents}
     </FilterDrawer>
@@ -169,8 +179,6 @@ const TreeDetailsFilter = ({
 
 export default TreeDetailsFilter;
 
-const treeUrl =
-  'https://git.kernel.org/pub/scm/linux/kernel/git/torvalds/linux.git';
 const summarySectionProps = {
   title: 'Tree',
   columns: [