Use date picker for events filtering (#3243)

This commit is contained in:
Jon Koops 2022-09-05 23:30:50 +02:00 committed by GitHub
parent a8ab21096b
commit fe1b602f45
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 42 additions and 28 deletions

View file

@ -3,6 +3,7 @@ import {
Button, Button,
Chip, Chip,
ChipGroup, ChipGroup,
DatePicker,
Dropdown, Dropdown,
DropdownToggle, DropdownToggle,
Flex, Flex,
@ -416,14 +417,17 @@ export const AdminEvents = () => {
fieldId="kc-dateFrom" fieldId="kc-dateFrom"
className="keycloak__events_search__form_label" className="keycloak__events_search__form_label"
> >
<KeycloakTextInput <Controller
ref={register()}
type="text"
id="kc-dateFrom"
name="dateFrom" name="dateFrom"
className="pf-c-form-control pf-m-icon pf-m-calendar" control={control}
placeholder="yyyy-MM-dd" render={({ onChange, value }) => (
data-testid="dateFrom-searchField" <DatePicker
className="pf-u-w-100"
value={value}
onChange={(value) => onChange(value)}
inputProps={{ id: "kc-dateFrom" }}
/>
)}
/> />
</FormGroup> </FormGroup>
<FormGroup <FormGroup
@ -431,14 +435,17 @@ export const AdminEvents = () => {
fieldId="kc-dateTo" fieldId="kc-dateTo"
className="keycloak__events_search__form_label" className="keycloak__events_search__form_label"
> >
<KeycloakTextInput <Controller
ref={register()}
type="text"
id="kc-dateTo"
name="dateTo" name="dateTo"
className="pf-c-form-control pf-m-icon pf-m-calendar" control={control}
placeholder="yyyy-MM-dd" render={({ onChange, value }) => (
data-testid="dateTo-searchField" <DatePicker
className="pf-u-w-100"
value={value}
onChange={(value) => onChange(value)}
inputProps={{ id: "kc-dateTo" }}
/>
)}
/> />
</FormGroup> </FormGroup>
<ActionGroup> <ActionGroup>

View file

@ -3,6 +3,7 @@ import {
Button, Button,
Chip, Chip,
ChipGroup, ChipGroup,
DatePicker,
DescriptionList, DescriptionList,
DescriptionListDescription, DescriptionListDescription,
DescriptionListGroup, DescriptionListGroup,
@ -327,14 +328,17 @@ export default function EventsSection() {
fieldId="kc-dateFrom" fieldId="kc-dateFrom"
className="keycloak__events_search__form_label" className="keycloak__events_search__form_label"
> >
<KeycloakTextInput <Controller
ref={register()}
type="text"
id="kc-dateFrom"
name="dateFrom" name="dateFrom"
className="pf-c-form-control pf-m-icon pf-m-calendar" control={control}
placeholder="yyyy-MM-dd" render={({ onChange, value }) => (
data-testid="dateFrom-searchField" <DatePicker
className="pf-u-w-100"
value={value}
onChange={(value) => onChange(value)}
inputProps={{ id: "kc-dateFrom" }}
/>
)}
/> />
</FormGroup> </FormGroup>
<FormGroup <FormGroup
@ -342,14 +346,17 @@ export default function EventsSection() {
fieldId="kc-dateTo" fieldId="kc-dateTo"
className="keycloak__events_search__form_label" className="keycloak__events_search__form_label"
> >
<KeycloakTextInput <Controller
ref={register()}
type="text"
id="kc-dateTo"
name="dateTo" name="dateTo"
className="pf-c-form-control pf-m-icon pf-m-calendar" control={control}
placeholder="yyyy-MM-dd" render={({ onChange, value }) => (
data-testid="dateTo-searchField" <DatePicker
className="pf-u-w-100"
value={value}
onChange={(value) => onChange(value)}
inputProps={{ id: "kc-dateTo" }}
/>
)}
/> />
</FormGroup> </FormGroup>
<ActionGroup> <ActionGroup>