deps: Audit 2020-03-24 (#344)

* deps(nimbus): Update to v3.1. * internal: Run Prettier on codebase. * types: Refine and improve any usage. * deps(storybook): Update to v5.3.17. * deps(react): Update to latest. * deps(aesthetic): Update to latest. * deps(interweave): Update to latest. * deps(happo): Update to latest. * deps(sentry): Update to v5.15. * internal: Fix emojis. * internal: Fix CI.
airbnb · Mar 25, 2020 · 1db54a9 · 1db54a9
1 parent a037cd4
commit 1db54a9
Show file tree

Hide file tree

Showing 190 changed files with 1,611 additions and 2,155 deletions.
diff --git a/.storybook/bootstrap.js b/.storybook/bootstrap.js
@@ -1,14 +1,14 @@
 import 'airbnb-js-shims';
 import { stripHexcode } from 'emojibase';
-import Lunar from '@airbnb/lunar';
+import Lunar from '@airbnb/lunar/src'; // src required because of aliases
 import { THEME } from './constants';
 
 Lunar.initialize({
   name: 'Lunar',
   emojiCDN: (hexcode, large) =>
-    `https://cdn.jsdelivr.net/emojione/assets/4.5/png/${large ? 64 : 32}/${stripHexcode(
-      hexcode,
-    ).toLowerCase()}.png`,
+    `https://cdn.jsdelivr.net/gh/joypixels/emoji-assets@latest/png/${
+      large ? 64 : 32
+    }/${stripHexcode(hexcode).toLowerCase()}.png`,
   logger: console.log,
   theme: THEME,
 });
diff --git a/configs/eslint.js b/configs/eslint.js
@@ -27,6 +27,9 @@ module.exports = {
         'import/no-extraneous-dependencies': 'off',
         'jest/require-to-throw-message': 'off', // Prop type errors
         'react/jsx-no-literals': 'off',
+        '@typescript-eslint/no-unsafe-call': 'off',
+        '@typescript-eslint/no-unsafe-member-access': 'off',
+        '@typescript-eslint/no-unsafe-return': 'off',
       },
     },
     {

diff --git a/package.json b/package.json
@@ -72,65 +72,65 @@
     "./packages/*"
   ],
   "dependencies": {
-    "@storybook/addon-a11y": "^5.3.14",
-    "@storybook/addon-actions": "^5.3.14",
+    "@storybook/addon-a11y": "^5.3.17",
+    "@storybook/addon-actions": "^5.3.17",
     "@storybook/addon-console": "^1.2.1",
-    "@storybook/addon-contexts": "^5.3.14",
-    "@storybook/addon-links": "^5.3.14",
-    "@storybook/addon-viewport": "^5.3.14",
-    "@storybook/addons": "^5.3.14",
-    "@storybook/react": "^5.3.14",
+    "@storybook/addon-contexts": "^5.3.17",
+    "@storybook/addon-links": "^5.3.17",
+    "@storybook/addon-viewport": "^5.3.17",
+    "@storybook/addons": "^5.3.17",
+    "@storybook/react": "^5.3.17",
     "markdown-to-jsx": "^6.11.0",
     "react-element-to-jsx-string": "^14.3.1"
   },
   "devDependencies": {
-    "@airbnb/config-babel": "^3.0.0",
-    "@airbnb/config-eslint": "^3.0.0",
-    "@airbnb/config-jest": "^3.0.0",
-    "@airbnb/config-prettier": "^3.0.0",
-    "@airbnb/config-typescript": "^3.0.0",
-    "@airbnb/nimbus": "^3.0.0",
+    "@airbnb/config-babel": "^3.1.0",
+    "@airbnb/config-eslint": "^3.1.0",
+    "@airbnb/config-jest": "^3.0.1",
+    "@airbnb/config-prettier": "^3.1.0",
+    "@airbnb/config-typescript": "^3.0.1",
+    "@airbnb/nimbus": "^3.1.1",
     "@types/airbnb-prop-types": "^2.13.1",
     "@types/enzyme": "^3.10.5",
     "@types/filesize": "^5.0.0",
-    "@types/gh-pages": "^2.0.1",
+    "@types/gh-pages": "^2.2.0",
     "@types/google.analytics": "0.0.40",
     "@types/hoist-non-react-statics": "^3.3.1",
-    "@types/jest": "^25.1.3",
-    "@types/jscodeshift": "^0.6.3",
+    "@types/jest": "^25.1.4",
+    "@types/jscodeshift": "^0.7.0",
     "@types/lodash": "^4.14.149",
-    "@types/luxon": "^1.21.0",
+    "@types/luxon": "^1.22.0",
     "@types/node-fetch": "^2.5.5",
     "@types/prop-types": "^15.7.3",
-    "@types/react": "^16.9.23",
+    "@types/react": "^16.9.25",
     "@types/react-dom": "^16.9.5",
     "@types/react-virtualized": "^9.21.8",
     "@types/shallowequal": "^1.1.1",
     "@types/svgo": "^1.3.1",
-    "@types/uuid": "^7.0.0",
-    "babel-loader": "^8.0.6",
-    "emojibase-test-utils": "^4.2.1",
+    "@types/uuid": "^7.0.2",
+    "babel-loader": "^8.1.0",
+    "emojibase-test-utils": "^5.0.1",
     "enzyme": "^3.11.0",
     "enzyme-adapter-react-16": "^1.15.2",
     "enzyme-to-json": "^3.4.4",
-    "eslint-plugin-rut": "^1.0.0",
+    "eslint-plugin-rut": "^1.0.1",
     "fast-glob": "^3.1.1",
     "filesize": "^6.1.0",
     "full-icu": "^1.3.1",
     "gh-pages": "^2.2.0",
     "happo-plugin-storybook": "^2.5.3",
-    "happo.io": "^5.1.5",
-    "jest-rut": "^1.0.0",
+    "happo.io": "^5.2.0",
+    "jest-rut": "^1.0.1",
     "lerna": "^3.20.2",
     "moment": "^2.24.0",
-    "react": "^16.13.0",
-    "react-docgen-typescript-loader": "^3.6.0",
-    "react-dom": "^16.13.0",
+    "react": "^16.13.1",
+    "react-docgen-typescript-loader": "^3.7.1",
+    "react-dom": "^16.13.1",
     "rimraf": "^3.0.1",
-    "rut-dom": "^1.0.0",
+    "rut-dom": "^1.0.1",
     "svgo": "^1.3.2",
-    "ts-node": "^8.6.2",
-    "url-loader": "^3.0.0"
+    "ts-node": "^8.8.1",
+    "url-loader": "^4.0.0"
   },
   "resolutions": {
     "jsdom": "^15.0.0"

diff --git a/packages/apollo/package.json b/packages/apollo/package.json
@@ -31,7 +31,7 @@
     "graphql-tag": "^2.10.3",
     "react": "^16.13.0",
     "react-apollo": "^3.1.3",
-    "react-test-renderer": "^16.13.0"
+    "react-test-renderer": "^16.13.1"
   },
   "dependencies": {
     "@types/lodash": "*",

diff --git a/packages/apollo/src/components/Mutation/story.tsx b/packages/apollo/src/components/Mutation/story.tsx
@@ -82,7 +82,7 @@ export function executeAGraphQlMutationAndHandleTheResponseWhenReceived() {
   return (
     <MockedProvider mocks={[mock]} addTypename={false}>
       <Mutation mutation={MUTATION} variables={variables}>
-        {updateUser => <UpdateButton onUpdate={updateUser} />}
+        {(updateUser) => <UpdateButton onUpdate={updateUser} />}
       </Mutation>
     </MockedProvider>
   );
@@ -96,7 +96,7 @@ export function customLoadingComponent() {
   return (
     <MockedProvider mocks={[loadingMock]} addTypename={false}>
       <Mutation mutation={MUTATION} variables={variables} loading={<Shimmer />}>
-        {updateUser => <UpdateButton onUpdate={updateUser} />}
+        {(updateUser) => <UpdateButton onUpdate={updateUser} />}
       </Mutation>
     </MockedProvider>
   );
@@ -109,8 +109,8 @@ customLoadingComponent.story = {
 export function customErrorComponent() {
   return (
     <MockedProvider mocks={[errorMock]} addTypename={false}>
-      <Mutation mutation={MUTATION} error={error => <ErrorMessage error={error} />}>
-        {updateUser => <UpdateButton onUpdate={updateUser} />}
+      <Mutation mutation={MUTATION} error={(error) => <ErrorMessage error={error} />}>
+        {(updateUser) => <UpdateButton onUpdate={updateUser} />}
       </Mutation>
     </MockedProvider>
   );

diff --git a/packages/apollo/src/components/Query/story.tsx b/packages/apollo/src/components/Query/story.tsx
@@ -60,7 +60,7 @@ export function executeAGraphQlQueryAndRenderTheResponseWhenReceived() {
   return (
     <MockedProvider mocks={[mock]} addTypename={false}>
       <Query<{ user: User }> query={QUERY} variables={{ id: 123 }}>
-        {data => data && <div>Loaded user: {data.user.name}</div>}
+        {(data) => data && <div>Loaded user: {data.user.name}</div>}
       </Query>
     </MockedProvider>
   );
@@ -87,7 +87,7 @@ customLoadingComponent.story = {
 export function customErrorComponent() {
   return (
     <MockedProvider mocks={[errorMock]} addTypename={false}>
-      <Query query={QUERY} error={error => <ErrorMessage error={error} />}>
+      <Query query={QUERY} error={(error) => <ErrorMessage error={error} />}>
         {() => null}
       </Query>
     </MockedProvider>

diff --git a/packages/apollo/src/index.ts b/packages/apollo/src/index.ts
@@ -55,7 +55,7 @@ class Apollo {
       name: Core.settings.name,
       resolvers,
       typeDefs,
-      version: pkg.version,
+      version: (pkg as { version: string }).version,
     });
 
     if (__DEV__) {

diff --git a/packages/apollo/src/updaters/removeFromList.ts b/packages/apollo/src/updaters/removeFromList.ts
@@ -29,7 +29,7 @@ export default function removeFromList<Result, Vars = {}>(
     set(
       nextResult,
       listPath,
-      list.filter(item => item[idName] !== id),
+      list.filter((item) => (item as { [key: string]: unknown })[idName] !== id),
     );
 
     cache.writeQuery({

diff --git a/packages/apollo/test/components/Query.test.tsx b/packages/apollo/test/components/Query.test.tsx
@@ -220,7 +220,7 @@ describe('Query', () => {
 
       mount(
         <Query query={QUERY}>
-          {data => {
+          {(data) => {
             expect(data).toBeNull();
 
             return null;

diff --git a/packages/app-shell/src/components/Toasts/index.tsx b/packages/app-shell/src/components/Toasts/index.tsx
@@ -35,7 +35,7 @@ export default function Toasts() {
 
   return (
     <div className={cx(styles.toasts)}>
-      {toasts.map(toast => (
+      {toasts.map((toast) => (
         <Toast
           {...toast.props}
           key={toast.id}

diff --git a/packages/app-shell/src/composers/connectToApp.tsx b/packages/app-shell/src/composers/connectToApp.tsx
@@ -79,7 +79,7 @@ export default function connectToApp(scope: string) /* infer */ {
 
     function ConnectToAppWrapper(props: Props) {
       return (
-        <AppContext.Consumer>{app => <ConnectToApp {...props} app={app} />}</AppContext.Consumer>
+        <AppContext.Consumer>{(app) => <ConnectToApp {...props} app={app} />}</AppContext.Consumer>
       );
     }
 

diff --git a/packages/app-shell/src/index.tsx b/packages/app-shell/src/index.tsx
@@ -43,7 +43,7 @@ export class AppShell extends React.Component<AppShellProps, AppShellState> {
   addBreadcrumb = (label: string, props: Breadcrumb['props'] = {}) => {
     const id = uuid();
 
-    this.setState(prevState => ({
+    this.setState((prevState) => ({
       breadcrumbs: [
         ...prevState.breadcrumbs,
         {
@@ -60,7 +60,7 @@ export class AppShell extends React.Component<AppShellProps, AppShellState> {
   addPageData = (data: object, customID: string = '') => {
     const id = customID || uuid();
 
-    this.setState(prevState => ({
+    this.setState((prevState) => ({
       data: {
         ...prevState.data,
         [id]: data,
@@ -73,9 +73,9 @@ export class AppShell extends React.Component<AppShellProps, AppShellState> {
   addToast = (message: string | Error, type: ToastType, props: Toast['props'] = {}) => {
     const id = props.id || uuid();
 
-    this.setState(prevState => ({
+    this.setState((prevState) => ({
       toasts: [
-        ...prevState.toasts.filter(toast => toast.id !== id),
+        ...prevState.toasts.filter((toast) => toast.id !== id),
         {
           id,
           message,
@@ -101,13 +101,13 @@ export class AppShell extends React.Component<AppShellProps, AppShellState> {
     this.addToast(message, 'danger', props);
 
   removeBreadcrumb = (id: string) => {
-    this.setState(prevState => ({
-      breadcrumbs: prevState.breadcrumbs.filter(crumb => crumb.id !== id),
+    this.setState((prevState) => ({
+      breadcrumbs: prevState.breadcrumbs.filter((crumb) => crumb.id !== id),
     }));
   };
 
   removePageData = (id: string) => {
-    this.setState(prevState => {
+    this.setState((prevState) => {
       const data = { ...prevState.data };
 
       delete data[id];
@@ -117,8 +117,8 @@ export class AppShell extends React.Component<AppShellProps, AppShellState> {
   };
 
   removeToast = (id: string) => {
-    this.setState(prevState => ({
-      toasts: prevState.toasts.filter(toast => toast.id !== id),
+    this.setState((prevState) => ({
+      toasts: prevState.toasts.filter((toast) => toast.id !== id),
     }));
   };
 

diff --git a/packages/composer/src/Composer.story.tsx b/packages/composer/src/Composer.story.tsx
@@ -89,7 +89,7 @@ export const suggestions: { [phrase: string]: SuggestionConfig[] } = {
 };
 
 export function loadSuggestions(phrase: string): Promise<SuggestionConfig[]> {
-  return new Promise(resolve => {
+  return new Promise((resolve) => {
     setTimeout(
       () => {
         const key = phrase.toLowerCase();

diff --git a/packages/composer/src/components/Actions/index.tsx b/packages/composer/src/components/Actions/index.tsx
@@ -51,7 +51,7 @@ export default function Actions({ actions, endAlign, noWritingModes }: ActionsPr
             </Row>
 
             {acts
-              .filter(action => (action.condition ? action.condition(context) : true))
+              .filter((action) => (action.condition ? action.condition(context) : true))
               .map((action, i) => {
                 const Icon = action.icon;
                 const onClick = () => {

diff --git a/packages/composer/src/components/Composer.tsx b/packages/composer/src/components/Composer.tsx
@@ -126,7 +126,7 @@ export default function Composer({
   );
 
   const handleSetMenu = useCallback<Context['setMenu']>(
-    nextMenu => {
+    (nextMenu) => {
       setMenu(nextMenu);
 
       // Always focus the input when a menu is opened.

diff --git a/packages/composer/src/components/Emojis/index.tsx b/packages/composer/src/components/Emojis/index.tsx
@@ -32,7 +32,7 @@ export default function Emojis({ internal = false, startAlign = false }: EmojisP
   const handleSelect = useCallback(
     (emoji: CanonicalEmoji) => {
       // istanbul ignore next
-      setData('value', value => `${value} ${emoji.unicode}`);
+      setData('value', (value) => `${value} ${emoji.unicode}`);
     },
     [setData],
   );

diff --git a/packages/composer/src/components/Footer/index.tsx b/packages/composer/src/components/Footer/index.tsx
@@ -14,7 +14,7 @@ export default function Footer() {
   const [styles, cx] = useStyles(footerStyleSheet);
 
   // Select active hotkeys for the current view
-  const tips = Array.from(hotkeys.values()).filter(hotkey => hotkey.condition(context));
+  const tips = Array.from(hotkeys.values()).filter((hotkey) => hotkey.condition(context));
 
   // Sort hotkeys by order
   tips.sort((a, b) => a.order! - b.order!);
@@ -25,7 +25,7 @@ export default function Footer() {
 
   return (
     <footer className={cx(styles.footer)}>
-      {tips.map(tip => (
+      {tips.map((tip) => (
         <Tip key={tip.name || tip.combo}>
           <Mark>
             {tip.combo.split('+').map((symbol, i) => {

diff --git a/packages/composer/src/components/Input/InlineInput.tsx b/packages/composer/src/components/Input/InlineInput.tsx
@@ -48,7 +48,7 @@ export default function InlineInput({ label, name, value }: InlineInputProps) {
           prefix={<Prefix small>{textLabel}</Prefix>}
           suffix={<Suffix small>{editButton}</Suffix>}
           value={value}
-          onChange={nextValue => {
+          onChange={(nextValue) => {
             context.setData(name, nextValue);
           }}
         />

diff --git a/packages/composer/src/components/Input/index.tsx b/packages/composer/src/components/Input/index.tsx
@@ -83,7 +83,9 @@ export default function Input({
           context,
         );
       } catch (error) {
-        context.setError(error.message);
+        if (error instanceof Error) {
+          context.setError(error.message);
+        }
       }
     },
     [onChange, context],
@@ -119,7 +121,9 @@ export default function Input({
         );
       }
     } catch (error) {
-      context.setError(error.message);
+      if (error instanceof Error) {
+        context.setError(error.message);
+      }
     }
   }, [blocked, onSubmit, context]);
 
@@ -162,7 +166,7 @@ export default function Input({
         </section>
 
         <textarea
-          ref={element => {
+          ref={(element) => {
             passThroughRef(ref, element);
             passThroughRef(propagateRef, element);
           }}

diff --git a/packages/composer/src/components/Menu/ToggleButton.tsx b/packages/composer/src/components/Menu/ToggleButton.tsx
@@ -14,7 +14,7 @@ export type ToggleButtonProps = {
 export default function ToggleButton({ accessibilityLabel, icon, menu }: ToggleButtonProps) {
   const { setMenu } = useContext(ComposerContext);
   const handleToggle = useCallback(() => {
-    setMenu(activeMenu => (activeMenu === menu ? '' : menu));
+    setMenu((activeMenu) => (activeMenu === menu ? '' : menu));
   }, [setMenu, menu]);
 
   return (