0ct0pu5/kafka-ui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

remove offset input render condition in topic messages filters (#1876)

Browse source
This commit is contained in:
Arsen Simonyan 2022-04-22 12:33:03 +04:00 • committed by GitHub
parent f70809128b
commit 4c76d07f04
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 36 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

66
kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/Filters.tsx
View file

@ -357,42 +357,40 @@ const Filters: React.FC<FiltersProps> = ({
value={query}
onChange={({ target: { value } }) => setQuery(value)}
/>
{isSeekTypeControlVisible && (
<S.SeekTypeSelectorWrapper>
<Select
id="selectSeekType"
onChange={(option) => setCurrentSeekType(option as SeekType)}
value={currentSeekType}
selectSize="M"
minWidth="100px"
options={SeekTypeOptions}
<S.SeekTypeSelectorWrapper>
<Select
id="selectSeekType"
onChange={(option) => setCurrentSeekType(option as SeekType)}
value={currentSeekType}
selectSize="M"
minWidth="100px"
options={SeekTypeOptions}
disabled={isLive}
/>
{currentSeekType === SeekType.OFFSET ? (
<Input
id="offset"
type="text"
inputSize="M"
value={offset}
className="offset-selector"
placeholder="Offset"
onChange={({ target: { value } }) => setOffset(value)}
disabled={isLive}
/>
{currentSeekType === SeekType.OFFSET ? (
<Input
id="offset"
type="text"
inputSize="M"
value={offset}
className="offset-selector"
placeholder="Offset"
onChange={({ target: { value } }) => setOffset(value)}
disabled={isLive}
/>
) : (
<DatePicker
selected={timestamp}
onChange={(date: Date | null) => setTimestamp(date)}
showTimeInput
timeInputLabel="Time:"
dateFormat="MMMM d, yyyy HH:mm"
className="date-picker"
placeholderText="Select timestamp"
disabled={isLive}
/>
)}
</S.SeekTypeSelectorWrapper>
)}
) : (
<DatePicker
selected={timestamp}
onChange={(date: Date | null) => setTimestamp(date)}
showTimeInput
timeInputLabel="Time:"
dateFormat="MMMM d, yyyy HH:mm"
className="date-picker"
placeholderText="Select timestamp"
disabled={isLive}
/>
)}
</S.SeekTypeSelectorWrapper>
<MultiSelect
options={partitions.map((p) => ({
label: `Partition #${p.partition.toString()}`,

8
kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/Messages.spec.tsx
View file

@ -35,14 +35,14 @@ describe('Messages', () => {
setUpComponent();
});
it('should check default seekDirection if it actually take the value from the url', () => {
expect(screen.getByRole('listbox')).toHaveTextContent(
expect(screen.getAllByRole('listbox')[1]).toHaveTextContent(
SeekDirectionOptionsObj[SeekDirection.FORWARD].label
);
});
it('should check the SeekDirection select changes', () => {
const seekDirectionSelect = screen.getByRole('listbox');
const seekDirectionOption = screen.getByRole('option');
const seekDirectionSelect = screen.getAllByRole('listbox')[1];
const seekDirectionOption = screen.getAllByRole('option')[1];
expect(seekDirectionOption).toHaveTextContent(
SeekDirectionOptionsObj[SeekDirection.FORWARD].label
@ -69,7 +69,7 @@ describe('Messages', () => {
setUpComponent(
searchParams.replace(SeekDirection.FORWARD, SeekDirection.BACKWARD)
);
expect(screen.getByRole('listbox')).toHaveTextContent(
expect(screen.getAllByRole('listbox')[1]).toHaveTextContent(
SeekDirectionOptionsObj[SeekDirection.BACKWARD].label
);
});