diff --git a/plugins/scaffolder/src/components/fields/EntityNamePicker/EntityNamePicker.tsx b/plugins/scaffolder/src/components/fields/EntityNamePicker/EntityNamePicker.tsx index 15ded2f9dc..8e7c0b0bea 100644 --- a/plugins/scaffolder/src/components/fields/EntityNamePicker/EntityNamePicker.tsx +++ b/plugins/scaffolder/src/components/fields/EntityNamePicker/EntityNamePicker.tsx @@ -15,30 +15,11 @@ */ import React from 'react'; import { FieldProps } from '@rjsf/core'; -import InputLabel from '@material-ui/core/InputLabel'; -import Input from '@material-ui/core/Input'; -import FormControl from '@material-ui/core/FormControl'; -import FormHelperText from '@material-ui/core/FormHelperText'; +import { TextValuePicker } from '../TextValuePicker'; -// TODO(Mike/Himanshu): Create a simple TextValuePicker so that it could be reused for creating custom field extensions with its own validators. export const EntityNamePicker = ({ - onChange, - required, schema: { title = 'Name', description = 'Unique name of the component' }, - rawErrors, - formData, + ...props }: FieldProps) => ( - 0 && !formData} - > - {title} - onChange(value)} - value={formData ?? ''} - /> - {description} - + ); diff --git a/plugins/scaffolder/src/components/fields/TextValuePicker/TextValuePicker.tsx b/plugins/scaffolder/src/components/fields/TextValuePicker/TextValuePicker.tsx new file mode 100644 index 0000000000..20e19d8526 --- /dev/null +++ b/plugins/scaffolder/src/components/fields/TextValuePicker/TextValuePicker.tsx @@ -0,0 +1,36 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react'; +import { FieldProps } from '@rjsf/core'; +import { TextField } from '@material-ui/core'; + +export const TextValuePicker = ({ + onChange, + required, + schema: { title, description }, + rawErrors, + formData, +}: FieldProps) => ( + onChange(value)} + margin="normal" + error={rawErrors?.length > 0 && !formData} + /> +); diff --git a/plugins/scaffolder/src/components/fields/TextValuePicker/index.ts b/plugins/scaffolder/src/components/fields/TextValuePicker/index.ts new file mode 100644 index 0000000000..8ab810b6ed --- /dev/null +++ b/plugins/scaffolder/src/components/fields/TextValuePicker/index.ts @@ -0,0 +1,16 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +export { TextValuePicker } from './TextValuePicker'; diff --git a/plugins/scaffolder/src/components/fields/index.ts b/plugins/scaffolder/src/components/fields/index.ts index 805cc6bb2b..5adc3d3141 100644 --- a/plugins/scaffolder/src/components/fields/index.ts +++ b/plugins/scaffolder/src/components/fields/index.ts @@ -17,3 +17,4 @@ export * from './EntityNamePicker'; export * from './EntityPicker'; export * from './OwnerPicker'; export * from './RepoUrlPicker'; +export * from './TextValuePicker'; diff --git a/plugins/scaffolder/src/index.ts b/plugins/scaffolder/src/index.ts index 4821f681bc..989b3b53ce 100644 --- a/plugins/scaffolder/src/index.ts +++ b/plugins/scaffolder/src/index.ts @@ -35,4 +35,5 @@ export { EntityPicker, OwnerPicker, RepoUrlPicker, + TextValuePicker, } from './components/fields';