Chore: Update slate types to fix more strict TypeScript errors (#37159)

package.json

@@ -127,7 +127,7 @@
     "@types/redux-mock-store": "1.0.2",
     "@types/reselect": "2.2.0",
     "@types/semver": "^6.0.0",
-    "@types/slate": "0.47.1",
+    "@types/slate": "0.47.2",
     "@types/slate-plain-serializer": "0.6.1",
     "@types/slate-react": "0.22.5",
     "@types/testing-library__jest-dom": "5.9.5",

public/app/features/admin/UserListAdminPage.tsx

@@ -1,8 +1,7 @@
 import React, { useEffect } from 'react';
 import { css, cx } from '@emotion/css';
 import { hot } from 'react-hot-loader';
-import { connect, MapDispatchToProps, MapStateToProps } from 'react-redux';
+import { connect, ConnectedProps } from 'react-redux';
-import { NavModel } from '@grafana/data';
 import { Pagination, Tooltip, stylesFactory, LinkButton, Icon } from '@grafana/ui';
 import { AccessControlAction, StoreState, UserDTO } from '../../types';
 import Page from 'app/core/components/Page/Page';
@@ -12,24 +11,26 @@ import { TagBadge } from 'app/core/components/TagFilter/TagBadge';
 import { contextSrv } from 'app/core/core';
 import { FilterInput } from 'app/core/components/FilterInput/FilterInput';
 
+const mapDispatchToProps = {
+  fetchUsers,
+  changeQuery,
+  changePage,
+};
+
+const mapStateToProps = (state: StoreState) => ({
+  navModel: getNavModel(state.navIndex, 'global-users'),
+  users: state.userListAdmin.users,
+  query: state.userListAdmin.query,
+  showPaging: state.userListAdmin.showPaging,
+  totalPages: state.userListAdmin.totalPages,
+  page: state.userListAdmin.page,
+});
+
+const connector = connect(mapStateToProps, mapDispatchToProps);
+
 interface OwnProps {}
 
-interface ConnectedProps {
+type Props = OwnProps & ConnectedProps<typeof connector>;
-  navModel: NavModel;
-  users: UserDTO[];
-  query: string;
-  showPaging: boolean;
-  totalPages: number;
-  page: number;
-}
-
-interface DispatchProps {
-  fetchUsers: typeof fetchUsers;
-  changeQuery: typeof changeQuery;
-  changePage: typeof changePage;
-}
-
-type Props = OwnProps & ConnectedProps & DispatchProps;
 
 const UserListAdminPageUnConnected: React.FC<Props> = (props) => {
   const styles = getStyles();
@@ -141,19 +142,4 @@ const getStyles = stylesFactory(() => {
   };
 });
 
-const mapDispatchToProps: MapDispatchToProps<DispatchProps, OwnProps> = {
+export default hot(module)(connector(UserListAdminPageUnConnected));
-  fetchUsers,
-  changeQuery,
-  changePage,
-};
-
-const mapStateToProps: MapStateToProps<ConnectedProps, OwnProps, StoreState> = (state) => ({
-  navModel: getNavModel(state.navIndex, 'global-users'),
-  users: state.userListAdmin.users,
-  query: state.userListAdmin.query,
-  showPaging: state.userListAdmin.showPaging,
-  totalPages: state.userListAdmin.totalPages,
-  page: state.userListAdmin.page,
-});
-
-export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(UserListAdminPageUnConnected));

public/app/features/panel/panel_ctrl.ts

@@ -16,7 +16,7 @@ import { AngularLocationWrapper } from 'app/angular/AngularLocationWrapper';
 export class PanelCtrl {
   panel: any;
   error: any;
-  dashboard: DashboardModel;
+  declare dashboard: DashboardModel;
   pluginName = '';
   pluginId = '';
   editorTabs: any;

public/app/features/users/InviteeRow.tsx

@@ -1,14 +1,21 @@
 import React, { PureComponent } from 'react';
-import { connect } from 'react-redux';
+import { connect, ConnectedProps } from 'react-redux';
 import { Invitee } from 'app/types';
 import { revokeInvite } from './state/actions';
 import { Button, ClipboardButton } from '@grafana/ui';
 
-export interface Props {
+const mapDispatchToProps = {
+  revokeInvite,
+};
+
+const connector = connect(null, mapDispatchToProps);
+
+interface OwnProps {
   invitee: Invitee;
-  revokeInvite: typeof revokeInvite;
 }
 
+export type Props = OwnProps & ConnectedProps<typeof connector>;
+
 class InviteeRow extends PureComponent<Props> {
   render() {
     const { invitee, revokeInvite } = this.props;
@@ -30,10 +37,4 @@ class InviteeRow extends PureComponent<Props> {
   }
 }
 
-const mapDispatchToProps = {
+export default connector(InviteeRow);
-  revokeInvite,
-};
-
-export default connect(() => {
-  return {};
-}, mapDispatchToProps)(InviteeRow);

public/app/features/users/UsersListPage.tsx

@@ -1,35 +1,44 @@
 import React, { PureComponent } from 'react';
 import { hot } from 'react-hot-loader';
-import { connect } from 'react-redux';
+import { connect, ConnectedProps } from 'react-redux';
-import { NavModel, renderMarkdown } from '@grafana/data';
+import { renderMarkdown } from '@grafana/data';
 import { HorizontalGroup, Pagination, VerticalGroup } from '@grafana/ui';
 
 import Page from 'app/core/components/Page/Page';
 import UsersActionBar from './UsersActionBar';
 import UsersTable from './UsersTable';
 import InviteesTable from './InviteesTable';
-import { Invitee, OrgUser, OrgRole } from 'app/types';
+import { OrgUser, OrgRole, StoreState } from 'app/types';
 import { loadInvitees, loadUsers, removeUser, updateUser } from './state/actions';
 import { getNavModel } from 'app/core/selectors/navModel';
 import { getInvitees, getUsers, getUsersSearchQuery, getUsersSearchPage } from './state/selectors';
 import { setUsersSearchQuery, setUsersSearchPage } from './state/reducers';
 
-export interface Props {
+function mapStateToProps(state: StoreState) {
-  navModel: NavModel;
+  return {
-  invitees: Invitee[];
+    navModel: getNavModel(state.navIndex, 'users'),
-  users: OrgUser[];
+    users: getUsers(state.users),
-  searchQuery: string;
+    searchQuery: getUsersSearchQuery(state.users),
-  searchPage: number;
+    searchPage: getUsersSearchPage(state.users),
-  externalUserMngInfo: string;
+    invitees: getInvitees(state.users),
-  hasFetched: boolean;
+    externalUserMngInfo: state.users.externalUserMngInfo,
-  loadUsers: typeof loadUsers;
+    hasFetched: state.users.hasFetched,
-  loadInvitees: typeof loadInvitees;
+  };
-  setUsersSearchQuery: typeof setUsersSearchQuery;
-  setUsersSearchPage: typeof setUsersSearchPage;
-  updateUser: typeof updateUser;
-  removeUser: typeof removeUser;
 }
 
+const mapDispatchToProps = {
+  loadUsers,
+  loadInvitees,
+  setUsersSearchQuery,
+  setUsersSearchPage,
+  updateUser,
+  removeUser,
+};
+
+const connector = connect(mapStateToProps, mapDispatchToProps);
+
+export type Props = ConnectedProps<typeof connector>;
+
 export interface State {
   showInvites: boolean;
 }
@@ -129,25 +138,4 @@ export class UsersListPage extends PureComponent<Props, State> {
   }
 }
 
-function mapStateToProps(state: any) {
+export default hot(module)(connector(UsersListPage));
-  return {
-    navModel: getNavModel(state.navIndex, 'users'),
-    users: getUsers(state.users),
-    searchQuery: getUsersSearchQuery(state.users),
-    searchPage: getUsersSearchPage(state.users),
-    invitees: getInvitees(state.users),
-    externalUserMngInfo: state.users.externalUserMngInfo,
-    hasFetched: state.users.hasFetched,
-  };
-}
-
-const mapDispatchToProps = {
-  loadUsers,
-  loadInvitees,
-  setUsersSearchQuery,
-  setUsersSearchPage,
-  updateUser,
-  removeUser,
-};
-
-export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(UsersListPage));

public/app/plugins/datasource/cloud-monitoring/components/Preprocessor.tsx

@@ -33,7 +33,7 @@ export const Preprocessor: FunctionComponent<Props> = ({ query, metricDescriptor
   );
 };
 
-const useOptions = (metricDescriptor?: MetricDescriptor): Array<SelectableValue<string>> => {
+const useOptions = (metricDescriptor?: MetricDescriptor): Array<SelectableValue<PreprocessorType>> => {
   const metricKind = metricDescriptor?.metricKind;
   const valueType = metricDescriptor?.valueType;
 

public/app/plugins/datasource/elasticsearch/configuration/ElasticDetails.tsx

@@ -5,7 +5,7 @@ import { ElasticsearchOptions, Interval } from '../types';
 import { DataSourceSettings, SelectableValue } from '@grafana/data';
 import { gte, lt } from 'semver';
 
-const indexPatternTypes = [
+const indexPatternTypes: Array<SelectableValue<'none' | Interval>> = [
   { label: 'No pattern', value: 'none' },
   { label: 'Hourly', value: 'Hourly', example: '[logstash-]YYYY.MM.DD.HH' },
   { label: 'Daily', value: 'Daily', example: '[logstash-]YYYY.MM.DD' },

scripts/ci-check-strict.sh

@@ -3,7 +3,7 @@ set -e
 
 echo -e "Collecting code stats (typescript errors & more)"
 
-ERROR_COUNT_LIMIT=136
+ERROR_COUNT_LIMIT=77
 ERROR_COUNT="$(./node_modules/.bin/tsc --project tsconfig.json --noEmit --strict true | grep -oP 'Found \K(\d+)')"
 
 if [ "$ERROR_COUNT" -gt $ERROR_COUNT_LIMIT ]; then

yarn.lock

@@ -4045,7 +4045,7 @@
     storybook-addon-outline "^1.4.1"
     ts-dedent "^2.0.0"
 
-"@storybook/addon-knobs@6.3.5":
+"@storybook/addon-knobs@6.3.0":
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/@storybook/addon-knobs/-/addon-knobs-6.3.0.tgz#f289c072729651150a27a163371df20922c24f93"
   integrity sha512-wsZZ1t38KHdaxzrc9oPyiIJDihJnjHRRabrENQbylktJwETEjb2z3eX0iBRJGiz/YCHO+tGd0ItyZArOdijT6g==
@@ -5866,14 +5866,6 @@
     "@types/react" "*"
     immutable "^3.8.2"
 
-"@types/slate@0.47.1":
-  version "0.47.1"
-  resolved "https://registry.yarnpkg.com/@types/slate/-/slate-0.47.1.tgz#6c66f82df085c764039eea2229be763f7e1906fd"
-  integrity sha512-2ZlnWI6/RYMXxeGFIeZtvmaXAeYAJh4ZVumziqVl77/liNEi9hOwkUTU2zFu+j/z21v385I2WVPl8sgadxfzXg==
-  dependencies:
-    "@types/react" "*"
-    immutable "^3.8.2"
-
 "@types/source-list-map@*":
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/@types/source-list-map/-/source-list-map-0.1.2.tgz#0078836063ffaf17412349bba364087e0ac02ec9"