Skip to content

Commit

Permalink
Cancel any action and remove any toast on logout (#2075)
Browse files Browse the repository at this point in the history 
* add remove all notif and cleanup unneeded deps

* for storage

* Apply suggestions from code review

* Update packages/files-ui/src/Components/Layouts/AppNav.tsx
  • Loading branch information
@Tbaut
Tbaut authored Apr 6, 2022
1 parent 4892472 commit 5b84894
Show file tree
Hide file tree
Showing 9 changed files with 27 additions and 37 deletions.
5 changes: 1 addition & 4 deletions packages/common-components/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,8 +37,7 @@
"@material-ui/styles": ">4.0.0",
"formik": "^2.2.5",
"react": ">16.8.0",
"react-dom": ">16.8.0",
"react-toast-notifications": ">2.4.0"
"react-dom": ">16.8.0"
},
"devDependencies": {
"@babel/core": "^7.12.10",
Expand All @@ -56,15 +55,13 @@
"@svgr/webpack": "^5.5.0",
"@types/react-blockies": "^1.4.0",
"@types/react-router-dom": "^5.1.6",
"@types/react-toast-notifications": "^2.4.0",
"babel-loader": "8.1.0",
"fork-ts-checker-webpack-plugin": "^6.0.5",
"formik": "^2.2.5",
"react": "16.14.0",
"react-blockies": "^1.4.1",
"react-dom": "16.14.0",
"react-router-dom": "^5.2.0",
"react-toast-notifications": "^2.4.0",
"rollup": "2.34.2",
"rollup-plugin-peer-deps-external": "^2.2.4",
"rollup-plugin-postcss": "^3.1.8",
Expand Down
1 change: 0 additions & 1 deletion packages/common-components/rollup.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,6 @@ export default {
"react-dom",
"@material-ui/styles",
"formik",
"react-toast-notifications",
"@chainsafe/common-theme"
]
}
19 changes: 14 additions & 5 deletions packages/common-components/src/Toasts/ToastContext.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,12 +88,11 @@ interface ToastContext {
addToast: (toastParams: ToastParams) => string
updateToast: (toastId: string, toastParams: ToastParams, startDismissal?: boolean) => void
removeToast: (toastId: string) => void
removeAllToasts: () => void
toasts: Toast[]
}

const ToastContext = React.createContext<ToastContext | undefined>(
undefined
)
const ToastContext = React.createContext<ToastContext | undefined>(undefined)

const ToastProvider = ({
children,
Expand All @@ -111,6 +110,16 @@ const ToastProvider = ({
setToastQueue(toasts.current)
}, [toasts])

const removeAllToasts = useCallback(() => {
// cancel any pending progress such as upload/downloads etc..
toasts.current.forEach((toast) => {
toast.onProgressCancel && toast.onProgressCancel()
})

toasts.current = []
setToastQueue(toasts.current)
}, [toasts])

const addToast = useCallback((toastParams: ToastParams) => {
const id = uuidv4()
toasts.current = [
Expand Down Expand Up @@ -159,6 +168,7 @@ const ToastProvider = ({
addToast,
updateToast,
removeToast,
removeAllToasts,
toasts: toastQueue
}}
>
Expand All @@ -184,8 +194,7 @@ const ToastProvider = ({
))}
</div>
)
))
}
))}
{children}
</ToastContext.Provider>
)
Expand Down
2 changes: 0 additions & 2 deletions packages/files-ui/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,6 @@
"react-pdf": "5.3.0",
"react-scripts": "3.4.4",
"react-swipeable": "^6.0.1",
"react-toast-notifications": "^2.4.0",
"react-qr-code": "2.0.3",
"react-zoom-pan-pinch": "^1.6.1",
"remark-gfm": "^1.0.0",
Expand All @@ -74,7 +73,6 @@
"@types/react-beforeunload": "^2.1.0",
"@types/react-dom": "^16.9.10",
"@types/react-pdf": "^5.0.0",
"@types/react-toast-notifications": "^2.4.0",
"@types/yup": "^0.29.9",
"@types/zxcvbn": "^4.4.0",
"babel-plugin-macros": "^2.8.0",
Expand Down
7 changes: 5 additions & 2 deletions packages/files-ui/src/Components/Layouts/AppNav.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@ import {
UserShareSvg,
MenuDropdown,
ScrollbarWrapper,
useLocation
useLocation,
useToasts
} from "@chainsafe/common-components"
import { ROUTE_LINKS } from "../FilesRoutes"
import { Trans } from "@lingui/macro"
Expand Down Expand Up @@ -260,11 +261,13 @@ const AppNav = ({ navOpen, setNavOpen }: IAppNav) => {
const { publicKey, isNewDevice, shouldInitializeAccount, logout } = useThresholdKey()
const { removeUser, getProfileTitle, profile } = useUser()
const location = useLocation()
const { removeAllToasts } = useToasts()

const signOut = useCallback(() => {
logout()
removeUser()
}, [logout, removeUser])
removeAllToasts()
}, [logout, removeAllToasts, removeUser])

const handleOnClick = useCallback(() => {
if (!desktop && navOpen) {
Expand Down
4 changes: 1 addition & 3 deletions packages/files-ui/src/Contexts/NotificationsContext.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,7 @@ interface INotificationsContext {
removeNotification: (id: string) => void
}

const NotificationsContext = React.createContext<INotificationsContext | undefined>(
undefined
)
const NotificationsContext = React.createContext<INotificationsContext | undefined>(undefined)

const NotificationsProvider = ({ children }: NotificationsContextProps) => {
const [notifications, setNotifications] = useState<Notification[]>([])
Expand Down
2 changes: 0 additions & 2 deletions packages/storage-ui/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,6 @@
"react-pdf": "5.3.0",
"react-scripts": "3.4.4",
"react-swipeable": "^6.0.1",
"react-toast-notifications": "^2.4.0",
"react-use-hotjar": "1.0.8",
"react-zoom-pan-pinch": "^1.6.1",
"remark-gfm": "^1.0.0",
Expand All @@ -61,7 +60,6 @@
"@types/react-beforeunload": "^2.1.0",
"@types/react-dom": "^16.9.10",
"@types/react-pdf": "^5.0.0",
"@types/react-toast-notifications": "^2.4.0",
"@types/yup": "^0.29.9",
"@types/zxcvbn": "^4.4.0",
"babel-plugin-macros": "^2.8.0",
Expand Down
7 changes: 5 additions & 2 deletions packages/storage-ui/src/Components/Layouts/AppHeader.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ import {
HamburgerMenu,
MenuDropdown,
PowerDownSvg,
useHistory
useHistory,
useToasts
} from "@chainsafe/common-components"
import { ROUTE_LINKS } from "../StorageRoutes"
import { Trans } from "@lingui/macro"
Expand Down Expand Up @@ -177,13 +178,15 @@ const AppHeader = ({ navOpen, setNavOpen }: IAppHeader) => {
const { isLoggedIn, logout } = useStorageApi()
const { history } = useHistory()
const { getProfileTitle, profile } = useUser()
const { removeAllToasts } = useToasts()

const profileTitle = getProfileTitle()

const signOut = useCallback(async () => {
logout()
removeAllToasts()
history.replace("/", {})
}, [logout, history])
}, [logout, removeAllToasts, history])

return (
<header
Expand Down
17 changes: 1 addition & 16 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2108,7 +2108,7 @@
"@emotion/utils" "0.11.3"
"@emotion/weak-memoize" "0.2.5"

"@emotion/core@^10.0.14", "@emotion/core@^10.0.15", "@emotion/core@^10.0.20", "@emotion/core@^10.0.9":
"@emotion/core@^10.0.15", "@emotion/core@^10.0.20", "@emotion/core@^10.0.9":
version "10.0.35"
resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.0.35.tgz#513fcf2e22cd4dfe9d3894ed138c9d7a859af9b3"
integrity sha512-sH++vJCdk025fBlRZSAhkRlSUoqSqgCzYf5fMOmqqi3bM6how+sQpg3hkgJonj8GxXM4WbD7dRO+4tegDB9fUw==
Expand Down Expand Up @@ -6346,13 +6346,6 @@
dependencies:
"@types/react" "*"

"@types/react-toast-notifications@^2.4.0":
version "2.4.0"
resolved "https://registry.yarnpkg.com/@types/react-toast-notifications/-/react-toast-notifications-2.4.0.tgz#0ca0732cfae5a6ef5939a676fffac6e64c78bc25"
integrity sha512-nBI6gQ0E5gwi3IcTrVOR3oKoMGRfH1gK67kI6RIKUmiV5Sc3ZC/eymYBFt6iDo0dhlYET6kdtR0tcUh9h5L0sQ==
dependencies:
"@types/react" "*"

"@types/react-transition-group@*":
version "4.4.0"
resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-4.4.0.tgz#882839db465df1320e4753e6e9f70ca7e9b4d46d"
Expand Down Expand Up @@ -21376,14 +21369,6 @@ react-textarea-autosize@^8.1.1:
use-composed-ref "^1.0.0"
use-latest "^1.0.0"

react-toast-notifications@^2.4.0:
version "2.4.0"
resolved "https://registry.yarnpkg.com/react-toast-notifications/-/react-toast-notifications-2.4.0.tgz#6213730bd1fe158fc01aeef200687ea94c5c5b24"
integrity sha512-8tkrbNh7LxkiFmtqAL/AiI55efIeI+fBk3c6ImsiZ0VObb4yvOq0cqYuJHyUiv9fuD2aBxvXGVH+n4Snt8qoWA==
dependencies:
"@emotion/core" "^10.0.14"
react-transition-group "^4.3.0"

react-transition-group@^4.3.0:
version "4.4.1"
resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.1.tgz#63868f9325a38ea5ee9535d828327f85773345c9"
Expand Down

0 comments on commit 5b84894

Please sign in to comment.