settings.ts

const actionCreators = {
  load: (data: SettingsJson) => createAction(LOAD, fromJson(data)),
  saveEditsAction: () => createAction(SAVE_EDITS),
  cancelEdits: () => createAction(CANCEL_EDITS),
  setPalette: (data: SetPaletteArgs) => createAction(SET_PALETTE, data),
  setSelectedColorPaletteName: (data: SetSelectedColorPaletteNameArgs) => createAction(SET_SELECTED_COLOR_PALETTE, data),
  setIntegerScale: (data: SetIntegerScaleArgs) => createAction(SET_INTEGER_SCALE, data)
};

type Actions = ActionsUnion<typeof actionCreators>

export const actions = {
  ...actionCreators,
  saveEdits, // this is a thunk action so it shouldn't be part of the Actions union
};

export type PropsFromDispatch = DispatchPropsFromActions<typeof actions>;

settings.tsx

interface SettingsStateProps {
  showSettings: boolean;
  palette0: number[];
  palette1: number[];
  palette2: number[];
  colorPalette: Rgb[];
  selectedColorPaletteName: PaletteName;
  integerScale: boolean;
};

interface SettingsDispatchProps  {
  Settings: settings.PropsFromDispatch; // this is the DispatchPropsFromActions magic from settings.ts
}

class Settings_ extends Component<SettingsStateProps & SettingsDispatchProps> {
...

export default connect(
  (state: RootState) => {
    const { getSettingsEditing, getSettingsEditingCurrentColorPalette } = selectors;
    return {
      showSettings: state.toolbar.showSettings,
      palette0: getSettingsEditing(state).palettes[1],
      palette1: getSettingsEditing(state).palettes[2],
      palette2: getSettingsEditing(state).palettes[3],
      colorPalette: getSettingsEditingCurrentColorPalette(state),
      selectedColorPaletteName: getSettingsEditing(state).selectedColorPalette,
      integerScale: getSettingsEditing(state).integerScale
    }
  },
  (dispatch) => {
    return {
      Settings: bindActionCreators(settings.actions, dispatch)
    }
  }
)(Settings_)