-
Notifications
You must be signed in to change notification settings - Fork 394
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Drop ENABLE_UPDATED_DAPP_CONNECTIONS feature flag
It is enabled and shall remain so!
- Loading branch information
1 parent
6b8e4b0
commit 8537e3e
Showing
15 changed files
with
65 additions
and
584 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,13 +1,5 @@ | ||
import React, { ReactElement, useState, useEffect, useCallback } from "react" | ||
import { browser } from "@tallyho/tally-background" | ||
import { PermissionRequest } from "@tallyho/provider-bridge-shared" | ||
import { selectAllowedPages } from "@tallyho/tally-background/redux-slices/selectors" | ||
import { | ||
FeatureFlags, | ||
isDisabled, | ||
isEnabled, | ||
} from "@tallyho/tally-background/features" | ||
import { denyOrRevokePermission } from "@tallyho/tally-background/redux-slices/dapp" | ||
import React, { ReactElement, useState } from "react" | ||
import { FeatureFlags, isDisabled } from "@tallyho/tally-background/features" | ||
import { useTranslation } from "react-i18next" | ||
import { setSelectedNetwork } from "@tallyho/tally-background/redux-slices/ui" | ||
import TopMenuProtocolSwitcher from "./TopMenuProtocolSwitcher" | ||
|
@@ -16,10 +8,9 @@ import TopMenuProfileButton from "./TopMenuProfileButton" | |
import BonusProgramModal from "../BonusProgram/BonusProgramModal" | ||
import AccountsNotificationPanel from "../AccountsNotificationPanel/AccountsNotificationPanel" | ||
import SharedSlideUpMenu from "../Shared/SharedSlideUpMenu" | ||
import TopMenuConnectedDAppInfo from "./TopMenuConnectedDAppInfo" | ||
import TopMenuProtocolList from "./TopMenuProtocolList" | ||
|
||
import { useBackgroundDispatch, useBackgroundSelector } from "../../hooks" | ||
import { useBackgroundDispatch } from "../../hooks" | ||
import DAppConnection from "../DAppConnection/DAppConnection" | ||
|
||
export default function TopMenu(): ReactElement { | ||
|
@@ -29,80 +20,10 @@ export default function TopMenu(): ReactElement { | |
const [isNotificationsOpen, setIsNotificationsOpen] = useState(false) | ||
const [isBonusProgramOpen, setIsBonusProgramOpen] = useState(false) | ||
|
||
const [isActiveDAppConnectionInfoOpen, setIsActiveDAppConnectionInfoOpen] = | ||
useState(false) | ||
|
||
const dispatch = useBackgroundDispatch() | ||
|
||
const [currentPermission, setCurrentPermission] = useState<PermissionRequest>( | ||
{} as PermissionRequest | ||
) | ||
const [isConnectedToDApp, setIsConnectedToDApp] = useState(false) | ||
const allowedPages = useBackgroundSelector((state) => | ||
selectAllowedPages(state) | ||
) | ||
|
||
const initPermissionAndOrigin = useCallback(async () => { | ||
const { url } = await browser.tabs | ||
.query({ | ||
active: true, | ||
lastFocusedWindow: true, | ||
}) | ||
.then((tabs) => | ||
tabs[0] ? tabs[0] : { url: "", favIconUrl: "", title: "" } | ||
) | ||
if (!url) return | ||
|
||
const { origin } = new URL(url) | ||
|
||
const allowPermission = allowedPages.find( | ||
(permission) => permission.origin === origin | ||
) | ||
|
||
if (allowPermission) { | ||
setCurrentPermission(allowPermission) | ||
setIsConnectedToDApp(true) | ||
} else { | ||
setIsConnectedToDApp(false) | ||
} | ||
}, [allowedPages, setCurrentPermission]) | ||
|
||
useEffect(() => { | ||
initPermissionAndOrigin() | ||
}, [initPermissionAndOrigin]) | ||
|
||
const deny = useCallback(async () => { | ||
if (typeof currentPermission !== "undefined") { | ||
// Deletes all permissions corresponding to the currently selected | ||
// account and origin | ||
await Promise.all( | ||
allowedPages.map(async (permission) => { | ||
if (permission.origin === currentPermission.origin) { | ||
return dispatch( | ||
denyOrRevokePermission({ ...permission, state: "deny" }) | ||
) | ||
} | ||
return undefined | ||
}) | ||
) | ||
} | ||
}, [dispatch, currentPermission, allowedPages]) | ||
|
||
return ( | ||
<> | ||
{isDisabled(FeatureFlags.ENABLE_UPDATED_DAPP_CONNECTIONS) && | ||
isActiveDAppConnectionInfoOpen ? ( | ||
<TopMenuConnectedDAppInfo | ||
title={currentPermission.title} | ||
url={currentPermission.origin} | ||
faviconUrl={currentPermission.faviconUrl} | ||
close={() => { | ||
setIsActiveDAppConnectionInfoOpen(false) | ||
}} | ||
disconnect={deny} | ||
isConnected={isConnectedToDApp} | ||
/> | ||
) : null} | ||
<BonusProgramModal | ||
isOpen={isBonusProgramOpen} | ||
onClose={() => { | ||
|
@@ -135,31 +56,10 @@ export default function TopMenu(): ReactElement { | |
onCurrentAddressChange={() => setIsNotificationsOpen(false)} | ||
/> | ||
</SharedSlideUpMenu> | ||
{isEnabled(FeatureFlags.ENABLE_UPDATED_DAPP_CONNECTIONS) && ( | ||
<DAppConnection /> | ||
)} | ||
<DAppConnection /> | ||
<nav> | ||
<TopMenuProtocolSwitcher onClick={() => setIsProtocolListOpen(true)} /> | ||
<div className="profile_group"> | ||
{isDisabled(FeatureFlags.ENABLE_UPDATED_DAPP_CONNECTIONS) && ( | ||
<button | ||
type="button" | ||
aria-label={t("showCurrentDappConnection")} | ||
className="connection_button" | ||
onClick={() => { | ||
setIsActiveDAppConnectionInfoOpen( | ||
!isActiveDAppConnectionInfoOpen | ||
) | ||
}} | ||
> | ||
{isEnabled(FeatureFlags.SUPPORT_WALLET_CONNECT) && | ||
isConnectedToDApp ? ( | ||
<div className="connected-wc" /> | ||
) : ( | ||
<div className="connection_img" /> | ||
)} | ||
</button> | ||
)} | ||
{isDisabled(FeatureFlags.HIDE_TOKEN_FEATURES) && ( | ||
<button | ||
type="button" | ||
|
@@ -203,30 +103,6 @@ export default function TopMenu(): ReactElement { | |
button:hover { | ||
background-color: var(--green-80); | ||
} | ||
.connection_button:hover .connection_img { | ||
background-color: var(--success); | ||
} | ||
.connection_button { | ||
width: 32px; | ||
height: 32px; | ||
} | ||
.connection_img { | ||
mask-image: url("./images/[email protected]"); | ||
mask-repeat: no-repeat; | ||
mask-position: center; | ||
mask-size: cover; | ||
mask-size: 35%; | ||
width: 32px; | ||
height: 32px; | ||
background-color: var( | ||
--${isConnectedToDApp ? "success" : "green-20"} | ||
); | ||
} | ||
.connected-wc { | ||
background: url("./images/connected-wc.svg") center / 24px no-repeat; | ||
width: 32px; | ||
height: 32px; | ||
} | ||
.gift_button { | ||
background: url("./images/[email protected]") center no-repeat; | ||
background-size: 24px 24px; | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
import { | ||
selectDefaultWallet, | ||
setNewDefaultWalletValue, | ||
setSnackbarMessage, | ||
} from "@tallyho/tally-background/redux-slices/ui" | ||
import React, { ReactElement } from "react" | ||
import { useTranslation } from "react-i18next" | ||
import { useDispatch } from "react-redux" | ||
import { useBackgroundSelector } from "../../hooks" | ||
import SharedToggleButton from "../Shared/SharedToggleButton" | ||
import SharedTooltip from "../Shared/SharedTooltip" | ||
|
||
export default function WalletDefaultToggle(): ReactElement { | ||
const { t } = useTranslation("translation", { | ||
keyPrefix: "wallet.defaultToggle", | ||
}) | ||
const dispatch = useDispatch() | ||
const isDefaultWallet = useBackgroundSelector(selectDefaultWallet) | ||
|
||
const toggleDefaultWallet = (defaultWalletValue: boolean) => { | ||
dispatch(setNewDefaultWalletValue(defaultWalletValue)) | ||
if (defaultWalletValue) { | ||
dispatch(setSnackbarMessage(t("snackbar"))) | ||
} | ||
} | ||
|
||
return ( | ||
<> | ||
<SharedTooltip width={200}>{t("tooltip")}</SharedTooltip> | ||
<div className="toggle"> | ||
<SharedToggleButton | ||
onChange={(toggleValue) => toggleDefaultWallet(toggleValue)} | ||
value={isDefaultWallet} | ||
/> | ||
</div> | ||
<style jsx>{` | ||
.toggle { | ||
margin-left: auto; | ||
} | ||
`}</style> | ||
</> | ||
) | ||
} |
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.