diff --git a/packages/@ourworldindata/explorer/src/Explorer.tsx b/packages/@ourworldindata/explorer/src/Explorer.tsx index da070a9e21a..8a9b232f4ba 100644 --- a/packages/@ourworldindata/explorer/src/Explorer.tsx +++ b/packages/@ourworldindata/explorer/src/Explorer.tsx @@ -27,6 +27,7 @@ import { SlideShowManager, DEFAULT_GRAPHER_ENTITY_TYPE, GrapherAnalytics, + FocusArray, } from "@ourworldindata/grapher" import { Bounds, @@ -277,6 +278,8 @@ export class Explorer ? this.props.selection : new SelectionArray(this.explorerProgram.selection) + focusArray = new FocusArray() + entityType = this.explorerProgram.entityType ?? DEFAULT_GRAPHER_ENTITY_TYPE @observable.ref grapher?: Grapher diff --git a/packages/@ourworldindata/grapher/src/controls/entityPicker/EntityPicker.tsx b/packages/@ourworldindata/grapher/src/controls/entityPicker/EntityPicker.tsx index 754584323a4..0f8a7fae886 100644 --- a/packages/@ourworldindata/grapher/src/controls/entityPicker/EntityPicker.tsx +++ b/packages/@ourworldindata/grapher/src/controls/entityPicker/EntityPicker.tsx @@ -95,6 +95,11 @@ export class EntityPicker extends React.Component<{ ): void { this.manager.selection.toggleSelection(name) + // Remove focus from an entity that has been removed from the selection + if (!this.manager.selection.selectedSet.has(name)) { + this.manager.focusArray?.remove(name) + } + // Clear search input this.searchInput = "" this.manager.analytics?.logEntityPickerEvent( @@ -644,9 +649,10 @@ export class EntityPicker extends React.Component<{ title={selectedDebugMessage} className="ClearSelectionButton" data-track-note="entity_picker_clear_selection" - onClick={(): void => + onClick={(): void => { selection.clearSelection() - } + this.manager.focusArray?.clear() + }} > Clear selection diff --git a/packages/@ourworldindata/grapher/src/controls/entityPicker/EntityPickerConstants.ts b/packages/@ourworldindata/grapher/src/controls/entityPicker/EntityPickerConstants.ts index 2370530d877..cdd1d2e6cea 100644 --- a/packages/@ourworldindata/grapher/src/controls/entityPicker/EntityPickerConstants.ts +++ b/packages/@ourworldindata/grapher/src/controls/entityPicker/EntityPickerConstants.ts @@ -3,6 +3,7 @@ import { GrapherAnalytics } from "../../core/GrapherAnalytics" import { OwidTable } from "@ourworldindata/core-table" import { CoreColumnDef, SortOrder } from "@ourworldindata/types" import { SelectionArray } from "../../selection/SelectionArray" +import { FocusArray } from "../../focus/FocusArray" export interface EntityPickerManager { entityPickerMetric?: ColumnSlug @@ -19,4 +20,5 @@ export interface EntityPickerManager { selection: SelectionArray entityType?: string analytics?: GrapherAnalytics + focusArray?: FocusArray } diff --git a/packages/@ourworldindata/grapher/src/core/Grapher.tsx b/packages/@ourworldindata/grapher/src/core/Grapher.tsx index 8cbd4e22d1f..9ac3eaf20eb 100644 --- a/packages/@ourworldindata/grapher/src/core/Grapher.tsx +++ b/packages/@ourworldindata/grapher/src/core/Grapher.tsx @@ -341,6 +341,7 @@ export interface GrapherManager { embedDialogUrl?: string embedDialogAdditionalElements?: React.ReactElement selection?: SelectionArray + focusArray?: FocusArray editUrl?: string } @@ -512,7 +513,7 @@ export class Grapher this.props.table?.availableEntities ?? [] ) - focusArray = new FocusArray() + focusArray = this.manager?.focusArray ?? new FocusArray() /** * todo: factor this out and make more RAII. diff --git a/packages/@ourworldindata/grapher/src/index.ts b/packages/@ourworldindata/grapher/src/index.ts index b9b100cdf1e..8d52675e86c 100644 --- a/packages/@ourworldindata/grapher/src/index.ts +++ b/packages/@ourworldindata/grapher/src/index.ts @@ -72,6 +72,7 @@ export { MapProjectionGeos, } from "./mapCharts/MapProjections" export { SelectionArray } from "./selection/SelectionArray" +export { FocusArray } from "./focus/FocusArray" export { setSelectedEntityNamesParam, migrateSelectedEntityNamesParam,