diff --git a/app/src/frontend/building/data-components/pattern-data-entry.tsx b/app/src/frontend/building/data-components/pattern-data-entry.tsx new file mode 100644 index 00000000..9681e981 --- /dev/null +++ b/app/src/frontend/building/data-components/pattern-data-entry.tsx @@ -0,0 +1,43 @@ +import React, { Fragment } from 'react'; + +import { BaseDataEntryProps } from './data-entry'; +import { DataTitleCopyable } from './data-title'; + + +interface PatternDataEntryProps extends BaseDataEntryProps { + value?: string; + placeholder?: string; + /** + * This is not a JS RegExp, so there's no validation in code, because we're passing it to HTML input as a string + */ + pattern: string; + maxLength?: number; +} + +export const PatternDataEntry: React.FC = props => { + const handleChange = (value: string) => { + props.onChange?.(props.slug, value); + }; + + return ( + <> + + handleChange(e.target.value)} + /> + + ); +} diff --git a/app/src/frontend/building/data-containers/location.tsx b/app/src/frontend/building/data-containers/location.tsx index 553cb6ce..d631388e 100644 --- a/app/src/frontend/building/data-containers/location.tsx +++ b/app/src/frontend/building/data-containers/location.tsx @@ -7,9 +7,12 @@ import NumericDataEntry from '../data-components/numeric-data-entry'; import UPRNsDataEntry from '../data-components/uprns-data-entry'; import Verification from '../data-components/verification'; import withCopyEdit from '../data-container'; +import { PatternDataEntry } from '../data-components/pattern-data-entry'; import { CategoryViewProps } from './category-view-props'; +const locationNumberPattern = "[1-9]\\d*[a-z]?(-([1-9]\\d*))?"; ///[1-9]\d*[a-z]?(-([1-9]\d*))?/; + const LocationView: React.FunctionComponent = (props) => ( @@ -33,15 +36,15 @@ const LocationView: React.FunctionComponent = (props) => ( verified_count={props.building.verified.location_name} /> -