Convert `dashboard/actions/core` to TypeScript (#39464)

frontend/src/metabase-types/api/dashboard.ts

@@ -8,7 +8,11 @@ import type {
   ParameterTarget,
 } from "metabase-types/api";
 
-import type { ActionDisplayType, WritebackAction } from "./actions";
+import type {
+  ActionDisplayType,
+  WritebackAction,
+  WritebackActionId,
+} from "./actions";
 import type { Card, CardId, CardDisplayType } from "./card";
 import type { Dataset } from "./dataset";
 import type { SearchModelType } from "./search";
@@ -65,6 +69,11 @@ export type DashboardCardLayoutAttrs = {
   size_y: number;
 };
 
+export type DashCardVisualizationSettings = {
+  [key: string]: unknown;
+  virtual_card?: VirtualCard;
+};
+
 export type BaseDashboardCard = DashboardCardLayoutAttrs & {
   id: DashCardId;
   dashboard_id: DashboardId;
@@ -73,10 +82,7 @@ export type BaseDashboardCard = DashboardCardLayoutAttrs & {
   card: Card | VirtualCard;
   collection_authority_level?: CollectionAuthorityLevel;
   entity_id: string;
-  visualization_settings?: {
-    [key: string]: unknown;
-    virtual_card?: VirtualCard;
-  };
+  visualization_settings?: DashCardVisualizationSettings;
   justAdded?: boolean;
   created_at: string;
   updated_at: string;
@@ -102,13 +108,13 @@ export type ActionDashboardCard = Omit<
   BaseDashboardCard,
   "parameter_mappings"
 > & {
+  action_id: WritebackActionId;
   action?: WritebackAction;
   card_id: CardId | null; // model card id for the associated action
   card: Card;
 
   parameter_mappings?: ActionParametersMapping[] | null;
-  visualization_settings: {
-    [key: string]: unknown;
+  visualization_settings: DashCardVisualizationSettings & {
     "button.label"?: string;
     click_behavior?: ClickBehavior;
     actionDisplayType?: ActionDisplayType;

frontend/src/metabase-types/api/mocks/dashboard.ts

@@ -84,6 +84,7 @@ export const createMockActionDashboardCard = (
   opts?: Partial<ActionDashboardCard>,
 ): ActionDashboardCard => ({
   ...createMockDashboardCard(),
+  action_id: 1,
   action: undefined,
   card: createMockCard({ display: "action" }),
   visualization_settings: {

frontend/src/metabase/dashboard/actions/actions.ts

@@ -8,8 +8,6 @@ import { ActionsApi, PublicApi } from "metabase/services";
 import type {
   ActionDashboardCard,
   ActionFormSubmitResult,
-  ActionParametersMapping,
-  CardId,
   Dashboard,
   ParametersForActionExecution,
   WritebackAction,
@@ -21,16 +19,12 @@ import { getDashboardType } from "../utils";
 import { setDashCardAttributes } from "./core";
 import { closeSidebar, setSidebar } from "./ui";
 
-interface DashboardAttributes {
-  card_id?: CardId | null;
-  action?: WritebackAction | null;
-  parameter_mappings?: ActionParametersMapping[] | null;
-  visualization_settings?: ActionDashboardCard["visualization_settings"];
-}
-
 export function updateButtonActionMapping(
   dashCardId: number,
-  attributes: DashboardAttributes,
+  attributes: Pick<
+    ActionDashboardCard,
+    "card_id" | "action" | "parameter_mappings" | "visualization_settings"
+  >,
 ) {
   return (dispatch: Dispatch) => {
     dispatch(

frontend/src/metabase/dashboard/actions/auto-wire-parameters/toasts.ts

 import { t } from "ttag";
 import _ from "underscore";
 
+import type { SetMultipleDashCardAttributesOpts } from "metabase/dashboard/actions";
 import {
   setDashCardAttributes,
   setMultipleDashCardAttributes,
 } from "metabase/dashboard/actions";
 import { addUndo, dismissUndo } from "metabase/redux/undo";
-import type {
-  ActionParametersMapping,
-  QuestionDashboardCard,
-  DashboardParameterMapping,
-  DashCardId,
-} from "metabase-types/api";
+import type { QuestionDashboardCard, DashCardId } from "metabase-types/api";
 import type { Dispatch } from "metabase-types/store";
 
 export const AUTO_WIRE_TOAST_ID = _.uniqueId();
 
-type ShowAutoWireParametersToastType = {
-  dashcardAttributes: {
-    id: DashCardId;
-    attributes: {
-      parameter_mappings:
-        | ActionParametersMapping[]
-        | DashboardParameterMapping[]
-        | null
-        | undefined;
-    };
-  }[];
-};
-
 export const showAutoWireParametersToast =
-  ({ dashcardAttributes }: ShowAutoWireParametersToastType) =>
+  ({
+    dashcardAttributes,
+  }: {
+    dashcardAttributes: SetMultipleDashCardAttributesOpts;
+  }) =>
   (dispatch: Dispatch) => {
     dispatch(
       addUndo({

frontend/src/metabase/dashboard/actions/auto-wire-parameters/utils.ts

@@ -14,13 +14,14 @@ import type {
   CardId,
   QuestionDashboardCard,
   DashboardId,
-  DashboardParameterMapping,
   DashCardId,
   ParameterId,
   ParameterTarget,
 } from "metabase-types/api";
 import type { DashboardState } from "metabase-types/store";
 
+import type { SetMultipleDashCardAttributesOpts } from "../core";
+
 export function getAllDashboardCardsWithUnmappedParameters({
   dashboardState,
   dashboardId,
@@ -80,13 +81,6 @@ export function getMatchingParameterOption(
   );
 }
 
-export type DashCardAttribute = {
-  id: DashCardId;
-  attributes: {
-    parameter_mappings: DashboardParameterMapping[];
-  };
-};
-
 export function getAutoWiredMappingsForDashcards(
   sourceDashcard: QuestionDashboardCard,
   targetDashcards: QuestionDashboardCard[],
@@ -94,12 +88,12 @@ export function getAutoWiredMappingsForDashcards(
   target: ParameterTarget,
   metadata: Metadata,
   questions: Record<CardId, Question>,
-): DashCardAttribute[] {
+): SetMultipleDashCardAttributesOpts {
   if (targetDashcards.length === 0) {
     return [];
   }
 
-  const targetDashcardMappings: DashCardAttribute[] = [];
+  const targetDashcardMappings: SetMultipleDashCardAttributesOpts = [];
 
   for (const targetDashcard of targetDashcards) {
     const selectedMappingOption: {

frontend/src/metabase/dashboard/actions/core.js → frontend/src/metabase/dashboard/actions/core.ts

 import { createAction } from "metabase/lib/redux";
+import type {
+  DashCardId,
+  DashCardVisualizationSettings,
+  Dashboard,
+  DashboardCard,
+  DashboardId,
+} from "metabase-types/api";
 
 export const INITIALIZE = "metabase/dashboard/INITIALIZE";
 export const initialize = createAction(INITIALIZE);
@@ -7,16 +14,31 @@ export const RESET = "metabase/dashboard/RESET";
 export const reset = createAction(RESET);
 
 export const SET_EDITING_DASHBOARD = "metabase/dashboard/SET_EDITING_DASHBOARD";
-export const setEditingDashboard = createAction(SET_EDITING_DASHBOARD);
+export const setEditingDashboard = createAction<Dashboard | false>(
+  SET_EDITING_DASHBOARD,
+);
 
+export type SetDashboardAttributesOpts = {
+  id: DashboardId;
+  attributes: Partial<Dashboard>;
+};
 export const SET_DASHBOARD_ATTRIBUTES =
   "metabase/dashboard/SET_DASHBOARD_ATTRIBUTES";
-export const setDashboardAttributes = createAction(SET_DASHBOARD_ATTRIBUTES);
+export const setDashboardAttributes = createAction<SetDashboardAttributesOpts>(
+  SET_DASHBOARD_ATTRIBUTES,
+);
 
+export type SetDashCardAttributesOpts = {
+  id: DashCardId;
+  attributes: Partial<DashboardCard>;
+};
 export const SET_DASHCARD_ATTRIBUTES =
   "metabase/dashboard/SET_DASHCARD_ATTRIBUTES";
-export const setDashCardAttributes = createAction(SET_DASHCARD_ATTRIBUTES);
+export const setDashCardAttributes = createAction<SetDashCardAttributesOpts>(
+  SET_DASHCARD_ATTRIBUTES,
+);
 
+export type SetMultipleDashCardAttributesOpts = SetDashCardAttributesOpts[];
 export const SET_MULTIPLE_DASHCARD_ATTRIBUTES =
   "metabase/dashboard/SET_MULTIPLE_DASHCARD_ATTRIBUTES";
 export const setMultipleDashCardAttributes = createAction(
@@ -36,19 +58,29 @@ export const UPDATE_DASHCARD_VISUALIZATION_SETTINGS =
   "metabase/dashboard/UPDATE_DASHCARD_VISUALIZATION_SETTINGS";
 export const onUpdateDashCardVisualizationSettings = createAction(
   UPDATE_DASHCARD_VISUALIZATION_SETTINGS,
-  (id, settings) => ({ id, settings }),
+  (id: DashCardId, settings: DashCardVisualizationSettings) => ({
+    id,
+    settings,
+  }),
 );
 
 export const UPDATE_DASHCARD_VISUALIZATION_SETTINGS_FOR_COLUMN =
   "metabase/dashboard/UPDATE_DASHCARD_VISUALIZATION_SETTINGS_FOR_COLUMN";
 export const onUpdateDashCardColumnSettings = createAction(
   UPDATE_DASHCARD_VISUALIZATION_SETTINGS_FOR_COLUMN,
-  (id, column, settings) => ({ id, column, settings }),
+  (
+    id: DashCardId,
+    column: string,
+    settings?: Record<string, unknown> | null,
+  ) => ({ id, column, settings }),
 );
 
 export const REPLACE_ALL_DASHCARD_VISUALIZATION_SETTINGS =
   "metabase/dashboard/REPLACE_ALL_DASHCARD_VISUALIZATION_SETTINGS";
 export const onReplaceAllDashCardVisualizationSettings = createAction(
   REPLACE_ALL_DASHCARD_VISUALIZATION_SETTINGS,
-  (id, settings) => ({ id, settings }),
+  (id: DashCardId, settings: DashCardVisualizationSettings) => ({
+    id,
+    settings,
+  }),
 );

frontend/src/metabase/dashboard/components/Dashboard/Dashboard.tsx

@@ -5,7 +5,10 @@ import type { Route } from "react-router";
 import { usePrevious, useUnmount } from "react-use";
 import _ from "underscore";
 
-import type { NewDashCardOpts } from "metabase/dashboard/actions";
+import type {
+  NewDashCardOpts,
+  SetDashboardAttributesOpts,
+} from "metabase/dashboard/actions";
 import { DashboardHeader } from "metabase/dashboard/components/DashboardHeader";
 import { DashboardControls } from "metabase/dashboard/hoc/DashboardControls";
 import type {
@@ -137,10 +140,7 @@ interface DashboardProps {
 
   onRefreshPeriodChange: (period: number | null) => void;
   setEditingDashboard: (dashboard: IDashboard | boolean) => void;
-  setDashboardAttributes: (opts: {
-    id: DashboardId;
-    attributes: Partial<IDashboard>;
-  }) => void;
+  setDashboardAttributes: (opts: SetDashboardAttributesOpts) => void;
   setSharing: (isSharing: boolean) => void;
   toggleSidebar: (sidebarName: DashboardSidebarName) => void;
   closeSidebar: () => void;