src/views-components/form-fields/search-bar-form-fields.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import * as React from "react";
   6 import { Field, WrappedFieldProps } from 'redux-form';
   7 import { TextField, DateTextField } from "~/components/text-field/text-field";
   8 import { CheckboxField } from '~/components/checkbox-field/checkbox-field';
   9 import { NativeSelectField } from '~/components/select-field/select-field';
  10 import { ResourceKind } from '~/models/resource';
  11 import { ClusterObjectType } from '~/models/search-bar';
  12 import { HomeTreePicker } from '~/views-components/projects-tree-picker/home-tree-picker';
  13 import { SEARCH_BAR_ADVANCE_FORM_PICKER_ID } from '~/store/search-bar/search-bar-actions';
  14
  15 export const SearchBarTypeField = () =>
  16     <Field
  17         name='type'
  18         component={NativeSelectField}
  19         items={[
  20             { key: '', value: 'Any'},
  21             { key: ResourceKind.COLLECTION, value: 'Collection'},
  22             { key: ResourceKind.PROJECT, value: 'Project' },
  23             { key: ResourceKind.PROCESS, value: 'Process' }
  24         ]}/>;
  25
  26 export const SearchBarClusterField = () =>
  27     <Field
  28         name='cluster'
  29         component={NativeSelectField}
  30         items={[
  31             { key: '', value: 'Any' },
  32             { key: ClusterObjectType.INDIANAPOLIS, value: 'Indianapolis' },
  33             { key: ClusterObjectType.KAISERAUGST, value: 'Kaiseraugst' },
  34             { key: ClusterObjectType.PENZBERG, value: 'Penzberg' }
  35         ]} />;
  36
  37 export const SearchBarProjectField = () =>
  38     <Field
  39         name='projectUuid'
  40         component={ProjectsPicker} />;
  41
  42 const ProjectsPicker = (props: WrappedFieldProps) =>
  43     <div style={{ height: '100px', display: 'flex', flexDirection: 'column', overflow: 'overlay' }}>
  44         <HomeTreePicker pickerId={SEARCH_BAR_ADVANCE_FORM_PICKER_ID} />
  45     </div>;
  46
  47 export const SearchBarTrashField = () =>
  48     <Field
  49         name='inTrash'
  50         component={CheckboxField}
  51         label="In trash" />;
  52
  53 export const SearchBarDataFromField = () =>
  54     <Field
  55         name='dateFrom'
  56         component={DateTextField} />;
  57
  58 export const SearchBarDataToField = () =>
  59     <Field
  60         name='dateTo'
  61         component={DateTextField} />;
  62
  63 export const SearchBarKeyField = () =>
  64     <Field
  65         name='key'
  66         component={TextField}
  67         label="Key" />;
  68
  69 export const SearchBarValueField = () =>
  70     <Field
  71         name='value'
  72         component={TextField}
  73         label="Value" />;
  74
  75 export const SearchBarSaveSearchField = () =>
  76     <Field
  77         name='saveQuery'
  78         component={CheckboxField}
  79         label="Save search query" />;
  80
  81 export const SearchBarQuerySearchField = () =>
  82     <Field
  83         name='searchQuery'
  84         component={TextField}
  85         label="Search query name" />;