diff --git a/app/soapbox/components/account.tsx b/app/soapbox/components/account.tsx index 4fd4d4218e..47dc5d769b 100644 --- a/app/soapbox/components/account.tsx +++ b/app/soapbox/components/account.tsx @@ -119,7 +119,7 @@ const Account = ({ ); } - const LinkEl = showProfileHoverCard ? Link : 'div'; + const LinkEl: any = showProfileHoverCard ? Link : 'div'; return (
@@ -132,7 +132,7 @@ const Account = ({ event.stopPropagation()} + onClick={(event: React.MouseEvent) => event.stopPropagation()} > @@ -146,7 +146,7 @@ const Account = ({ event.stopPropagation()} + onClick={(event: React.MouseEvent) => event.stopPropagation()} >
= React.forwardRef((props, ref: React.ForwardedRef): JSX.Element => { - const { backHref, children, label, history, transparent = false, withHeader = true } = props; + const { backHref, children, label, transparent = false, withHeader = true } = props; + + const history = useHistory(); const handleBackClick = () => { if (backHref) { @@ -57,4 +59,4 @@ const Column: React.FC = React.forwardRef((props, ref: React.ForwardedR ); }); -export default withRouter(Column); +export default Column; diff --git a/app/soapbox/components/ui/tabs/tabs.tsx b/app/soapbox/components/ui/tabs/tabs.tsx index bbb43267d5..ad82f7a7a1 100644 --- a/app/soapbox/components/ui/tabs/tabs.tsx +++ b/app/soapbox/components/ui/tabs/tabs.tsx @@ -7,7 +7,7 @@ import { } from '@reach/tabs'; import classNames from 'classnames'; import * as React from 'react'; -import { RouteComponentProps, withRouter } from 'react-router-dom'; +import { useHistory } from 'react-router-dom'; import './tabs.css'; @@ -87,14 +87,16 @@ type Item = { action?: () => void, name: string } -interface ITabs extends RouteComponentProps { +interface ITabs { items: Item[], activeItem: string, } -const Tabs = ({ items, activeItem, history }: ITabs) => { +const Tabs = ({ items, activeItem }: ITabs) => { const defaultIndex = items.findIndex(({ name }) => name === activeItem); + const history = useHistory(); + const onChange = (selectedIndex: number) => { const item = items[selectedIndex]; @@ -130,4 +132,4 @@ const Tabs = ({ items, activeItem, history }: ITabs) => { ); }; -export default withRouter(Tabs); +export default Tabs; diff --git a/app/soapbox/features/account/components/header.js b/app/soapbox/features/account/components/header.js index 7446898300..42fcad65d7 100644 Binary files a/app/soapbox/features/account/components/header.js and b/app/soapbox/features/account/components/header.js differ diff --git a/app/soapbox/features/compose/components/search.tsx b/app/soapbox/features/compose/components/search.tsx index 10e1ebc6b9..791aa0dbfc 100644 --- a/app/soapbox/features/compose/components/search.tsx +++ b/app/soapbox/features/compose/components/search.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import InlineSVG from 'react-inlinesvg'; import { defineMessages, useIntl } from 'react-intl'; import { useDispatch } from 'react-redux'; -import { RouteComponentProps, withRouter } from 'react-router-dom'; +import { useHistory } from 'react-router-dom'; import AutosuggestAccountInput from 'soapbox/components/autosuggest_account_input'; import { useAppSelector } from 'soapbox/hooks'; @@ -32,7 +32,7 @@ function redirectToAccount(accountId: number, routerHistory: any) { }; } -interface ISearch extends RouteComponentProps { +interface ISearch { autoFocus?: boolean, autoSubmit?: boolean, autosuggest?: boolean, @@ -44,11 +44,11 @@ const Search = (props: ISearch) => { autoFocus = false, autoSubmit = false, autosuggest = false, - history, openInRoute = false, } = props; const dispatch = useDispatch(); + const history = useHistory(); const intl = useIntl(); const value = useAppSelector((state) => state.search.get('value')); @@ -156,4 +156,4 @@ const Search = (props: ISearch) => { ); }; -export default withRouter(Search); +export default Search; diff --git a/app/soapbox/features/developers/developers_menu.js b/app/soapbox/features/developers/developers_menu.js index 919208c848..79227fb44e 100644 Binary files a/app/soapbox/features/developers/developers_menu.js and b/app/soapbox/features/developers/developers_menu.js differ diff --git a/app/soapbox/features/notifications/components/notification.js b/app/soapbox/features/notifications/components/notification.js index d399cdcf47..3c5462ce3b 100644 Binary files a/app/soapbox/features/notifications/components/notification.js and b/app/soapbox/features/notifications/components/notification.js differ diff --git a/app/soapbox/features/preferences/index.tsx b/app/soapbox/features/preferences/index.tsx index a770fb7768..df0d206394 100644 --- a/app/soapbox/features/preferences/index.tsx +++ b/app/soapbox/features/preferences/index.tsx @@ -111,11 +111,17 @@ const Preferences = () => { return (
- }> + } + hint={} + > - }> + } + hint={} + > diff --git a/app/soapbox/features/settings/index.js b/app/soapbox/features/settings/index.js index 237b385637..f78cddad7d 100644 Binary files a/app/soapbox/features/settings/index.js and b/app/soapbox/features/settings/index.js differ diff --git a/app/soapbox/features/settings/media_display.js b/app/soapbox/features/settings/media_display.js index 3302fa803d..0ce0eb51a7 100644 Binary files a/app/soapbox/features/settings/media_display.js and b/app/soapbox/features/settings/media_display.js differ diff --git a/app/soapbox/features/ui/components/profile-dropdown.tsx b/app/soapbox/features/ui/components/profile-dropdown.tsx index b2aa85e7a4..43f31cfa3c 100644 --- a/app/soapbox/features/ui/components/profile-dropdown.tsx +++ b/app/soapbox/features/ui/components/profile-dropdown.tsx @@ -2,6 +2,7 @@ import throttle from 'lodash/throttle'; import React from 'react'; import { defineMessages, useIntl } from 'react-intl'; import { useDispatch } from 'react-redux'; +import { Link } from 'react-router-dom'; import { logOut, switchAccount } from 'soapbox/actions/auth'; import { fetchOwnAccounts } from 'soapbox/actions/auth'; @@ -42,16 +43,13 @@ const ProfileDropdown: React.FC = ({ account, children }) => { const isCurrentAccountStaff = isStaff(currentAccount) || false; const otherAccounts = useAppSelector((state) => authUsers.map((authUser: any) => getAccount(state, authUser.get('id')))); - const handleLogOut = (event: React.MouseEvent) => { - event.preventDefault(); - + const handleLogOut = () => { dispatch(logOut(intl)); }; const handleSwitchAccount = (account: AccountEntity) => { - return (event: React.MouseEvent) => { + return () => { dispatch(switchAccount(account.id)); - event.preventDefault(); }; }; @@ -115,7 +113,7 @@ const ProfileDropdown: React.FC = ({ account, children }) => { return ; } else { const Comp: any = menuItem.action ? MenuItem : MenuLink; - const itemProps = menuItem.action ? { onSelect: menuItem.action } : { href: menuItem.to }; + const itemProps = menuItem.action ? { onSelect: menuItem.action } : { to: menuItem.to, as: Link }; return ( diff --git a/app/soapbox/features/verification/email_passthru.js b/app/soapbox/features/verification/email_passthru.js index 8bf6fecb9d..dac2cc3bda 100644 Binary files a/app/soapbox/features/verification/email_passthru.js and b/app/soapbox/features/verification/email_passthru.js differ diff --git a/app/soapbox/locales/en.json b/app/soapbox/locales/en.json index b3d3d18ad4..ea087e446c 100644 --- a/app/soapbox/locales/en.json +++ b/app/soapbox/locales/en.json @@ -713,6 +713,7 @@ "preferences.fields.system_font_label": "Use system's default font", "preferences.fields.underline_links_label": "Always underline links in posts", "preferences.fields.unfollow_modal_label": "Show confirmation dialog before unfollowing someone", + "preferences.hints.feed": "In your home feed", "preferences.hints.content_type_markdown": "Warning: experimental!", "preferences.hints.demetricator": "Decrease social media anxiety by hiding all numbers from the site.", "preferences.hints.halloween": "Beware: SPOOKY! Supports light/dark toggle.", diff --git a/package.json b/package.json index 1167ab31f6..f4baa47fc8 100644 --- a/package.json +++ b/package.json @@ -70,7 +70,7 @@ "@types/escape-html": "^1.0.1", "@types/http-link-header": "^1.0.3", "@types/lodash": "^4.14.180", - "@types/react-router-dom": "^4.2.6", + "@types/react-router-dom": "^5.3.3", "@types/uuid": "^8.3.4", "array-includes": "^3.0.3", "autoprefixer": "^10.4.2", diff --git a/yarn.lock b/yarn.lock index a660a31f82..8cb374efb8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1148,13 +1148,6 @@ dependencies: regenerator-runtime "^0.13.4" -"@babel/runtime@^7.7.6": - version "7.17.2" - resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.2.tgz#66f68591605e59da47523c631416b18508779941" - integrity sha512-hzeyJyMA1YGdJTuWU0e/j4wKXrU4OMFvY2MSlaI9B7VQb0r5cxTE3EAIS2Q7Tn2RIcDkRvTA/v2JsAEhxe99uw== - dependencies: - regenerator-runtime "^0.13.4" - "@babel/template@7", "@babel/template@^7.16.7": version "7.16.7" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.16.7.tgz#8d126c8701fde4d66b264b3eba3d96f07666d155" @@ -1989,13 +1982,6 @@ dependencies: "@types/node" "*" -"@types/history@*": - version "5.0.0" - resolved "https://registry.yarnpkg.com/@types/history/-/history-5.0.0.tgz#29f919f0c8e302763798118f45b19cab4a886f14" - integrity sha512-hy8b7Y1J8OGe6LbAjj3xniQrj3v6lsivCcrmf4TzSgPzLkhIeKgc5IZnT7ReIqmEuodjfO8EYAuoFvIrHi/+jQ== - dependencies: - history "*" - "@types/history@^4.7.11": version "4.7.11" resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.11.tgz#56588b17ae8f50c53983a524fc3cc47437969d64" @@ -2119,12 +2105,12 @@ hoist-non-react-statics "^3.3.0" redux "^4.0.0" -"@types/react-router-dom@^4.2.6": - version "4.3.5" - resolved "https://registry.yarnpkg.com/@types/react-router-dom/-/react-router-dom-4.3.5.tgz#72f229967690c890d00f96e6b85e9ee5780db31f" - integrity sha512-eFajSUASYbPHg2BDM1G8Btx+YqGgvROPIg6sBhl3O4kbDdYXdFdfrgQFf/pcBuQVObjfT9AL/dd15jilR5DIEA== +"@types/react-router-dom@^5.3.3": + version "5.3.3" + resolved "https://registry.yarnpkg.com/@types/react-router-dom/-/react-router-dom-5.3.3.tgz#e9d6b4a66fcdbd651a5f106c2656a30088cc1e83" + integrity sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw== dependencies: - "@types/history" "*" + "@types/history" "^4.7.11" "@types/react" "*" "@types/react-router" "*" @@ -5367,13 +5353,6 @@ hex-color-regex@^1.1.0: resolved "https://registry.yarnpkg.com/hex-color-regex/-/hex-color-regex-1.1.0.tgz#4c06fccb4602fe2602b3c93df82d7e7dbf1a8a8e" integrity sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ== -history@*: - version "5.3.0" - resolved "https://registry.yarnpkg.com/history/-/history-5.3.0.tgz#1548abaa245ba47992f063a0783db91ef201c73b" - integrity sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ== - dependencies: - "@babel/runtime" "^7.7.6" - history@^4.10.1, history@^4.9.0: version "4.10.1" resolved "https://registry.yarnpkg.com/history/-/history-4.10.1.tgz#33371a65e3a83b267434e2b3f3b1b4c58aad4cf3"