diff --git a/.storybook/main.ts b/.storybook/main.ts deleted file mode 100644 index bb4c1d2326..0000000000 --- a/.storybook/main.ts +++ /dev/null @@ -1,43 +0,0 @@ -import sharedConfig from '../webpack/shared'; - -import type { StorybookConfig } from '@storybook/core-common'; - -const config: StorybookConfig = { - stories: [ - '../stories/**/*.stories.mdx', - '../stories/**/*.stories.@(js|jsx|ts|tsx)' - ], - addons: [ - '@storybook/addon-links', - '@storybook/addon-essentials', - '@storybook/addon-interactions', - 'storybook-react-intl', - { - name: '@storybook/addon-postcss', - options: { - postcssLoaderOptions: { - implementation: require('postcss'), - }, - }, - }, - ], - framework: '@storybook/react', - core: { - builder: '@storybook/builder-webpack5', - }, - webpackFinal: async (config) => { - config.resolve!.alias = { - ...sharedConfig.resolve!.alias, - ...config.resolve!.alias, - }; - - config.resolve!.modules = [ - ...sharedConfig.resolve!.modules!, - ...config.resolve!.modules!, - ]; - - return config; - }, -}; - -export default config; \ No newline at end of file diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx deleted file mode 100644 index df2195f0c5..0000000000 --- a/.storybook/preview.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import '../app/styles/tailwind.css'; -import '../stories/theme.css'; - -import { addDecorator, Story } from '@storybook/react'; -import { IntlProvider } from 'react-intl'; -import React from 'react'; - -const withProvider = (Story: Story) => ( - -); - -addDecorator(withProvider); - -export const parameters = { - actions: { argTypesRegex: '^on[A-Z].*' }, - controls: { - matchers: { - color: /(background|color)$/i, - date: /Date$/, - }, - }, -}; diff --git a/CHANGELOG.md b/CHANGELOG.md index 43ca09934f..e5cd615cd6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -23,6 +23,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - UI: unified design of "approve" and "reject" buttons in follow requests and waitlist. - UI: added sticky column header. - UI: add specific zones the user can drag-and-drop files. +- UI: disable toast notifications for API errors. ### Fixed - Posts: fixed emojis being cut off in reactions modal. diff --git a/app/soapbox/entity-store/hooks/useEntity.ts b/app/soapbox/entity-store/hooks/useEntity.ts index b9b9f001f9..14c84382c6 100644 --- a/app/soapbox/entity-store/hooks/useEntity.ts +++ b/app/soapbox/entity-store/hooks/useEntity.ts @@ -51,7 +51,7 @@ function useEntity( }; useEffect(() => { - if (!isEnabled) return; + if (!isEnabled || error) return; if (!entity || opts.refetch) { fetchEntity(); } diff --git a/app/soapbox/middleware/errors.ts b/app/soapbox/middleware/errors.ts deleted file mode 100644 index 9e423a6853..0000000000 --- a/app/soapbox/middleware/errors.ts +++ /dev/null @@ -1,33 +0,0 @@ -import toast from 'soapbox/toast'; - -import type { AnyAction } from 'redux'; -import type { ThunkMiddleware } from 'redux-thunk'; - -/** Whether the action is considered a failure. */ -const isFailType = (type: string): boolean => type.endsWith('_FAIL'); - -/** Whether the action is a failure to fetch from browser storage. */ -const isRememberFailType = (type: string): boolean => type.endsWith('_REMEMBER_FAIL'); - -/** Whether the error contains an Axios response. */ -const hasResponse = (error: any): boolean => Boolean(error && error.response); - -/** Don't show 401's. */ -const authorized = (error: any): boolean => error?.response?.status !== 401; - -/** Whether the error should be shown to the user. */ -const shouldShowError = ({ type, skipAlert, error }: AnyAction): boolean => { - return !skipAlert && hasResponse(error) && authorized(error) && isFailType(type) && !isRememberFailType(type); -}; - -/** Middleware to display Redux errors to the user. */ -const errorsMiddleware = (): ThunkMiddleware => - () => next => action => { - if (shouldShowError(action)) { - toast.showAlertForError(action.error); - } - - return next(action); - }; - -export default errorsMiddleware; diff --git a/app/soapbox/store.ts b/app/soapbox/store.ts index 8aeb0a791b..9b0136a000 100644 --- a/app/soapbox/store.ts +++ b/app/soapbox/store.ts @@ -1,7 +1,6 @@ import { configureStore } from '@reduxjs/toolkit'; import thunk, { ThunkDispatch } from 'redux-thunk'; -import errorsMiddleware from './middleware/errors'; import soundsMiddleware from './middleware/sounds'; import appReducer from './reducers'; @@ -11,7 +10,6 @@ export const store = configureStore({ reducer: appReducer, middleware: [ thunk, - errorsMiddleware(), soundsMiddleware(), ], devTools: true, diff --git a/package.json b/package.json index f4e6027883..afe01b4732 100644 --- a/package.json +++ b/package.json @@ -28,9 +28,7 @@ "lint": "${npm_execpath} run lint:js && ${npm_execpath} run lint:sass", "lint:js": "npx eslint --ext .js,.jsx,.cjs,.mjs,.ts,.tsx . --cache", "lint:sass": "npx stylelint app/styles/**/*.scss", - "prepare": "husky install", - "storybook": "start-storybook -p 6006", - "build-storybook": "build-storybook" + "prepare": "husky install" }, "license": "AGPL-3.0-or-later", "browserslist": [ @@ -199,15 +197,6 @@ "@gitbeaker/node": "^35.8.0", "@jedmao/redux-mock-store": "^3.0.5", "@pmmmwh/react-refresh-webpack-plugin": "^0.5.10", - "@storybook/addon-actions": "^6.5.16", - "@storybook/addon-essentials": "^6.5.16", - "@storybook/addon-interactions": "^6.5.16", - "@storybook/addon-links": "^6.5.16", - "@storybook/addon-postcss": "^2.0.0", - "@storybook/builder-webpack5": "^6.5.16", - "@storybook/manager-webpack5": "^6.5.16", - "@storybook/react": "^6.5.16", - "@storybook/testing-library": "^0.0.13", "@tailwindcss/aspect-ratio": "^0.4.2", "@testing-library/jest-dom": "^5.16.5", "@testing-library/react-hooks": "^8.0.1", @@ -236,7 +225,6 @@ "raf": "^3.4.1", "react-intl-translations-manager": "^5.0.3", "react-refresh": "^0.14.0", - "storybook-react-intl": "^1.1.1", "stylelint": "^14.0.0", "stylelint-config-standard-scss": "^6.1.0", "tailwindcss": "^3.3.1", diff --git a/stories/Button.stories.tsx b/stories/Button.stories.tsx deleted file mode 100644 index 796d17e96a..0000000000 --- a/stories/Button.stories.tsx +++ /dev/null @@ -1,48 +0,0 @@ -import { ComponentStory, ComponentMeta } from '@storybook/react'; -import React from 'react'; - -import { Button } from 'soapbox/components/ui'; - -// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export -export default { - title: 'UI/Button', - component: Button, - // More on argTypes: https://storybook.js.org/docs/react/api/argtypes - argTypes: { - text: { type: 'string', defaultValue: 'Button' }, - theme: { defaultValue: 'primary' }, - size: { defaultValue: 'md' }, - disabled: { defaultValue: false }, - block: { defaultValue: false }, - children: { table: { disable: true } }, - className: { table: { disable: true } }, - type: { table: { disable: true } }, - to: { table: { disable: true } }, - icon: { table: { disable: true } }, - onClick: { table: { disable: true } }, - }, -} as ComponentMeta; - -// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args -const Template: ComponentStory = (args) =>