Use new projects-tree-picker in ProjectTreePickerField
authorMichal Klobukowski <michal.klobukowski@contractors.roche.com>
Wed, 14 Nov 2018 14:55:40 +0000 (15:55 +0100)
committerMichal Klobukowski <michal.klobukowski@contractors.roche.com>
Wed, 14 Nov 2018 14:55:40 +0000 (15:55 +0100)
Feature #14470

Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski@contractors.roche.com>

src/views-components/project-tree-picker/project-tree-picker.tsx

index a4e4c4062631e6881de807a19970ec9e8b6bd582..101fca08d1b87a652587f97463c82c6b772e0f98 100644 (file)
@@ -16,6 +16,8 @@ import { RootState } from "~/store/store";
 import { ServiceRepository } from "~/services/services";
 import { WrappedFieldProps } from 'redux-form';
 import { TreePickerId } from '~/models/tree';
+import { ProjectsTreePicker } from '~/views-components/projects-tree-picker/projects-tree-picker';
+import { ProjectsTreePickerItem } from '~/views-components/projects-tree-picker/generic-projects-tree-picker';
 
 type ProjectTreePickerProps = Pick<TreePickerProps<ProjectResource>, 'onContextMenu' | 'toggleItemActive' | 'toggleItemOpen' | 'toggleItemSelection'>;
 
@@ -87,17 +89,19 @@ const renderTreeItem = (item: TreeItem<ProjectResource>) =>
         isActive={item.active}
         hasMargin={true} />;
 
-export const ProjectTreePickerField = (props: WrappedFieldProps) =>
+export const ProjectTreePickerField = (props: WrappedFieldProps & { pickerId: string }) =>
     <div style={{ height: '200px', display: 'flex', flexDirection: 'column' }}>
-        <ProjectTreePicker onChange={handleChange(props)} />
+        <ProjectsTreePicker
+            pickerId={props.pickerId}
+            toggleItemActive={handleChange(props)} />
         {props.meta.dirty && props.meta.error &&
             <Typography variant='caption' color='error'>
                 {props.meta.error}
             </Typography>}
     </div>;
 
-const handleChange = (props: WrappedFieldProps) => (value: string) =>
-    props.input.value === value
-        ? props.input.onChange('')
-        : props.input.onChange(value);
-
+const handleChange = (props: WrappedFieldProps) =>
+    (_: any, { id }: TreeItem<ProjectsTreePickerItem>) =>
+        props.input.value === id
+            ? props.input.onChange('')
+            : props.input.onChange(id);