Merge pull request #946 from hgiesel/dispatchtype

Correctly type createEventDispatch and dispatch

ts/graphs/AddedGraph.svelte

@@ -1,6 +1,6 @@
 <script lang="typescript">
     import { RevlogRange, GraphRange } from "./graph-helpers";
-    import type { TableDatum } from "./graph-helpers";
+    import type { TableDatum, SearchEventMap } from "./graph-helpers";
     import type { I18n } from "anki/i18n";
     import type { HistogramData } from "./histogram-graph";
     import { gatherData, buildHistogram } from "./added";
@@ -21,7 +21,7 @@
     let graphRange: GraphRange = GraphRange.Month;
     let { browserLinksSupported } = preferences;
 
-    const dispatch = createEventDispatcher();
+    const dispatch = createEventDispatcher<SearchEventMap>();
 
     let addedData: GraphData | null = null;
     $: if (sourceData) {

ts/graphs/CalendarGraph.svelte

@@ -3,6 +3,7 @@
     import NoDataOverlay from "./NoDataOverlay.svelte";
     import AxisTicks from "./AxisTicks.svelte";
     import { defaultGraphBounds, RevlogRange } from "./graph-helpers";
+    import type { SearchEventMap } from "./graph-helpers";
     import { gatherData, renderCalendar } from "./calendar";
     import type { PreferenceStore } from "./preferences";
     import type { GraphData } from "./calendar";
@@ -16,7 +17,7 @@
     export let nightMode: boolean;
 
     let { calendarFirstDayOfWeek } = preferences;
-    const dispatch = createEventDispatcher();
+    const dispatch = createEventDispatcher<SearchEventMap>();
 
     let graphData: GraphData | null = null;
 

ts/graphs/CardCounts.svelte

@@ -1,6 +1,7 @@
 <script lang="typescript">
     import { createEventDispatcher } from "svelte";
     import { defaultGraphBounds } from "./graph-helpers";
+    import type { SearchEventMap } from "./graph-helpers";
     import { gatherData, renderCards } from "./card-counts";
     import type { GraphData, TableDatum } from "./card-counts";
     import type { PreferenceStore } from "./preferences";
@@ -12,7 +13,7 @@
     export let preferences: PreferenceStore;
 
     let { cardCountsSeparateInactive, browserLinksSupported } = preferences;
-    const dispatch = createEventDispatcher();
+    const dispatch = createEventDispatcher<SearchEventMap>();
 
     let svg = null as HTMLElement | SVGElement | null;
 

ts/graphs/EaseGraph.svelte

@@ -4,7 +4,7 @@
     import type pb from "anki/backend_proto";
     import HistogramGraph from "./HistogramGraph.svelte";
     import type { I18n } from "anki/i18n";
-    import type { TableDatum } from "./graph-helpers";
+    import type { TableDatum, SearchEventMap } from "./graph-helpers";
     import TableData from "./TableData.svelte";
     import { createEventDispatcher } from "svelte";
     import type { PreferenceStore } from "./preferences";
@@ -13,7 +13,7 @@
     export let i18n: I18n;
     export let preferences: PreferenceStore;
 
-    const dispatch = createEventDispatcher();
+    const dispatch = createEventDispatcher<SearchEventMap>();
 
     let histogramData = null as HistogramData | null;
     let tableData: TableDatum[] = [];

ts/graphs/FutureDue.svelte

@@ -2,7 +2,7 @@
     import type { I18n } from "anki/i18n";
     import type { HistogramData } from "./histogram-graph";
     import { GraphRange, RevlogRange } from "./graph-helpers";
-    import type { TableDatum } from "./graph-helpers";
+    import type { TableDatum, SearchEventMap } from "./graph-helpers";
     import { gatherData, buildHistogram } from "./future-due";
     import type { GraphData } from "./future-due";
     import type pb from "anki/backend_proto";
@@ -16,7 +16,7 @@
     export let i18n: I18n;
     export let preferences: PreferenceStore;
 
-    const dispatch = createEventDispatcher();
+    const dispatch = createEventDispatcher<SearchEventMap>();
 
     let graphData = null as GraphData | null;
     let histogramData = null as HistogramData | null;

ts/graphs/IntervalsGraph.svelte

@@ -10,7 +10,7 @@
     import type { IntervalGraphData } from "./intervals";
     import type pb from "anki/backend_proto";
     import HistogramGraph from "./HistogramGraph.svelte";
-    import type { TableDatum } from "./graph-helpers";
+    import type { TableDatum, SearchEventMap } from "./graph-helpers";
     import TableData from "./TableData.svelte";
     import { createEventDispatcher } from "svelte";
     import type { PreferenceStore } from "./preferences";
@@ -19,7 +19,7 @@
     export let i18n: I18n;
     export let preferences: PreferenceStore;
 
-    const dispatch = createEventDispatcher();
+    const dispatch = createEventDispatcher<SearchEventMap>();
 
     let intervalData: IntervalGraphData | null = null;
     let histogramData = null as HistogramData | null;

ts/graphs/RangeBox.svelte

@@ -10,13 +10,17 @@
         Custom = 3,
     }
 
+    type UpdateEventMap = {
+        update: { days: number; search: string; searchRange: SearchRange };
+    };
+
     export let i18n: I18n;
     export let active: boolean;
 
     export let days: number;
     export let search: string;
 
-    const dispatch = createEventDispatcher();
+    const dispatch = createEventDispatcher<UpdateEventMap>();
 
     let revlogRange = daysToRevlogRange(days);
     let searchRange: SearchRange =

ts/graphs/added.ts

@@ -14,7 +14,7 @@ import { interpolateBlues } from "d3-scale-chromatic";
 import type { I18n } from "anki/i18n";
 import { dayLabel } from "anki/time";
 import { GraphRange } from "./graph-helpers";
-import type { TableDatum } from "./graph-helpers";
+import type { TableDatum, SearchDispatch } from "./graph-helpers";
 
 export interface GraphData {
     daysAdded: number[];
@@ -43,7 +43,7 @@ export function buildHistogram(
     data: GraphData,
     range: GraphRange,
     i18n: I18n,
-    dispatch: any,
+    dispatch: SearchDispatch,
     browserLinksSupported: boolean
 ): [HistogramData | null, TableDatum[]] {
     // get min/max

ts/graphs/calendar.ts

@@ -12,7 +12,12 @@ import "d3-transition";
 import { select, mouse } from "d3-selection";
 import { scaleLinear, scaleSequentialSqrt } from "d3-scale";
 import { showTooltip, hideTooltip } from "./tooltip";
-import { GraphBounds, setDataAvailable, RevlogRange } from "./graph-helpers";
+import {
+    GraphBounds,
+    setDataAvailable,
+    RevlogRange,
+    SearchDispatch,
+} from "./graph-helpers";
 import {
     timeDay,
     timeYear,
@@ -82,7 +87,7 @@ export function renderCalendar(
     svgElem: SVGElement,
     bounds: GraphBounds,
     sourceData: GraphData,
-    dispatch: any,
+    dispatch: SearchDispatch,
     targetYear: number,
     i18n: I18n,
     nightMode: boolean,

ts/graphs/ease.ts

@@ -13,7 +13,7 @@ import { CardType } from "anki/cards";
 import type { HistogramData } from "./histogram-graph";
 import { interpolateRdYlGn } from "d3-scale-chromatic";
 import type { I18n } from "anki/i18n";
-import type { TableDatum } from "./graph-helpers";
+import type { TableDatum, SearchDispatch } from "./graph-helpers";
 
 export interface GraphData {
     eases: number[];
@@ -40,7 +40,7 @@ function makeQuery(start: number, end: number): string {
 export function prepareData(
     data: GraphData,
     i18n: I18n,
-    dispatch: any,
+    dispatch: SearchDispatch,
     browserLinksSupported: boolean
 ): [HistogramData | null, TableDatum[]] {
     // get min/max
@@ -49,7 +49,7 @@ export function prepareData(
         return [null, []];
     }
     const total = allEases.length;
-    const [_xMin, origXMax] = extent(allEases);
+    const [, origXMax] = extent(allEases);
     let xMax = origXMax;
     const xMin = 130;
 

ts/graphs/future-due.ts

@@ -15,7 +15,7 @@ import { interpolateGreens } from "d3-scale-chromatic";
 import { dayLabel } from "anki/time";
 import type { I18n } from "anki/i18n";
 import { GraphRange } from "./graph-helpers";
-import type { TableDatum } from "./graph-helpers";
+import type { TableDatum, SearchDispatch } from "./graph-helpers";
 
 export interface GraphData {
     dueCounts: Map<number, number>;
@@ -87,7 +87,7 @@ export function buildHistogram(
     range: GraphRange,
     backlog: boolean,
     i18n: I18n,
-    dispatch: any,
+    dispatch: SearchDispatch,
     browserLinksSupported: boolean
 ): FutureDueOut {
     const output = { histogramData: null, tableData: [] };

ts/graphs/graph-helpers.ts

@@ -118,3 +118,9 @@ export interface TableDatum {
     label: string;
     value: string;
 }
+
+export type SearchEventMap = { search: { query: string } };
+export type SearchDispatch = <EventKey extends Extract<keyof SearchEventMap, string>>(
+    type: EventKey,
+    detail: SearchEventMap[EventKey]
+) => void;

ts/graphs/intervals.ts

@@ -13,7 +13,7 @@ import { CardType } from "anki/cards";
 import type { HistogramData } from "./histogram-graph";
 import { interpolateBlues } from "d3-scale-chromatic";
 import type { I18n } from "anki/i18n";
-import type { TableDatum } from "./graph-helpers";
+import type { TableDatum, SearchDispatch } from "./graph-helpers";
 import { timeSpan } from "anki/time";
 
 export interface IntervalGraphData {
@@ -71,7 +71,7 @@ export function prepareIntervalData(
     data: IntervalGraphData,
     range: IntervalRange,
     i18n: I18n,
-    dispatch: any,
+    dispatch: SearchDispatch,
     browserLinksSupported: boolean
 ): [HistogramData | null, TableDatum[]] {
     // get min/max