Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Discover] Fix sidebar element focus behavior when adding / removing columns #75749

9 changes: 4 additions & 5 deletions src/plugins/discover/public/application/angular/discover.html
Original file line number Diff line number Diff line change
@@ -31,7 +31,6 @@ <h1 class="euiScreenReaderOnly">{{screenTitle}}</h1>
on-remove-field="removeColumn"
selected-index-pattern="searchSource.getField('index')"
set-index-pattern="setIndexPattern"
state="state"
>
</discover-sidebar>
</div>
@@ -78,11 +77,11 @@ <h1 class="euiScreenReaderOnly">{{screenTitle}}</h1>
class="dscTimechart"
ng-if="opts.timefield"
>
<timechart-header
<timechart-header
from="toMoment(timeRange.from)"
to="toMoment(timeRange.to)"
options="intervalOptions"
on-change-interval="changeInterval"
to="toMoment(timeRange.to)"
options="intervalOptions"
on-change-interval="changeInterval"
state-interval="state.interval"
show-scaled-info="bucketInterval.scaled"
bucket-interval-description="bucketInterval.description"
Original file line number Diff line number Diff line change
@@ -45,7 +45,7 @@ export function buildSearchBody(id: string, indexPattern: IndexPattern): Record<
stored_fields: computedFields.storedFields,
_source: true,
script_fields: computedFields.scriptFields,
docvalue_fields: computedFields.docvalueFields,
fields: computedFields.docvalueFields,
};
}

Original file line number Diff line number Diff line change
@@ -30,7 +30,6 @@ import { SavedObject } from '../../../../../../core/types';
import { FIELDS_LIMIT_SETTING } from '../../../../common';
import { groupFields } from './lib/group_fields';
import { IndexPatternField, IndexPattern, UI_SETTINGS } from '../../../../../data/public';
import { AppState } from '../../angular/discover_state';
import { getDetails } from './lib/get_details';
import { getDefaultFieldFilter, setFieldFilterProp } from './lib/field_filter';
import { getIndexPatternFieldList } from './lib/get_index_pattern_field_list';
@@ -74,10 +73,6 @@ export interface DiscoverSidebarProps {
* Callback function to select another index pattern
*/
setIndexPattern: (id: string) => void;
/**
* Current app state, used for generating a link to visualize
*/
state: AppState;
}

export function DiscoverSidebar({
@@ -90,7 +85,6 @@ export function DiscoverSidebar({
onRemoveField,
selectedIndexPattern,
setIndexPattern,
state,
}: DiscoverSidebarProps) {
const [showFields, setShowFields] = useState(false);
const [fields, setFields] = useState<IndexPatternField[] | null>(null);
@@ -185,10 +179,10 @@ export function DiscoverSidebar({
aria-labelledby="selected_fields"
data-test-subj={`fieldList-selected`}
>
{selectedFields.map((field: IndexPatternField, idx: number) => {
{selectedFields.map((field: IndexPatternField) => {
return (
<li
key={`field${idx}`}
key={`field${field.name}`}
data-attr-field={field.name}
className="dscSidebar__item"
>
@@ -260,10 +254,10 @@ export function DiscoverSidebar({
aria-labelledby="available_fields available_fields_popular"
data-test-subj={`fieldList-popular`}
>
{popularFields.map((field: IndexPatternField, idx: number) => {
{popularFields.map((field: IndexPatternField) => {
return (
<li
key={`field${idx}`}
key={`field${field.name}`}
data-attr-field={field.name}
className="dscSidebar__item"
>
@@ -290,9 +284,13 @@ export function DiscoverSidebar({
aria-labelledby="available_fields"
data-test-subj={`fieldList-unpopular`}
>
{unpopularFields.map((field: IndexPatternField, idx: number) => {
{unpopularFields.map((field: IndexPatternField) => {
return (
<li key={`field${idx}`} data-attr-field={field.name} className="dscSidebar__item">
<li
key={`field${field.name}`}
data-attr-field={field.name}
className="dscSidebar__item"
>
<DiscoverField
field={field}
indexPattern={selectedIndexPattern}
Original file line number Diff line number Diff line change
@@ -29,6 +29,5 @@ export function createDiscoverSidebarDirective(reactDirective: any) {
['onRemoveField', { watchDepth: 'reference' }],
['selectedIndexPattern', { watchDepth: 'reference' }],
['setIndexPattern', { watchDepth: 'reference' }],
['state', { watchDepth: 'reference' }],
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

PR also contains a few cleanups of unused state variable

]);
}