diff --git a/src/constants/dialogs.ts b/src/constants/dialogs.ts
index 6ed34ec..c624182 100644
--- a/src/constants/dialogs.ts
+++ b/src/constants/dialogs.ts
@@ -11,6 +11,7 @@ export enum DialogTypes {
ExternalNavKeplr = 'ExternalNavKeplr',
MnemonicExport = 'MnemonicExport',
MobileSignIn = 'MobileSignIn',
+ MobileDownload = 'MobileDownload',
Onboarding = 'Onboarding',
OrderDetails = 'OrderDetails',
Preferences = 'Preferences',
diff --git a/src/layout/DialogManager.tsx b/src/layout/DialogManager.tsx
index 4c5ec7e..cef213e 100644
--- a/src/layout/DialogManager.tsx
+++ b/src/layout/DialogManager.tsx
@@ -31,6 +31,7 @@ import { FillDetailsDialog } from '@/views/dialogs/DetailsDialog/FillDetailsDial
import { NewMarketMessageDetailsDialog } from '@/views/dialogs/NewMarketMessageDetailsDialog';
import { NewMarketAgreementDialog } from '@/views/dialogs/NewMarketAgreementDialog';
import { ExternalNavStrideDialog } from '@/views/dialogs/ExternalNavStrideDialog';
+import { MobileDownloadDialog } from '@/views/dialogs/MobileDownloadDialog';
export const DialogManager = () => {
const dispatch = useDispatch();
@@ -63,6 +64,7 @@ export const DialogManager = () => {
[DialogTypes.ExternalNavStride]: ,
[DialogTypes.MnemonicExport]: ,
[DialogTypes.MobileSignIn]: ,
+ [DialogTypes.MobileDownload]: ,
[DialogTypes.Onboarding]: ,
[DialogTypes.OrderDetails]: ,
[DialogTypes.Preferences]: ,
diff --git a/src/views/dialogs/MobileDownloadDialog.tsx b/src/views/dialogs/MobileDownloadDialog.tsx
new file mode 100644
index 0000000..d567aaf
--- /dev/null
+++ b/src/views/dialogs/MobileDownloadDialog.tsx
@@ -0,0 +1,112 @@
+import styled, { AnyStyledComponent, css } from 'styled-components';
+
+import { layoutMixins } from '@/styles/layoutMixins';
+
+import { Dialog } from '@/components/Dialog';
+import { QrCode } from '@/components/QrCode';
+
+type ElementProps = {
+ setIsOpen: (open: boolean) => void;
+};
+
+
+const MobileQrCode = ({
+ url,
+}: {
+ url: string;
+}) => {
+ return (
+
+
+
+ );
+};
+
+export const MobileDownloadDialog = ({ setIsOpen }: ElementProps) => {
+ const encryptionKey = "hello world!";
+
+ const content = (
+ <>
+
+ >
+ );
+
+ return (
+
+ );
+};
+
+const Styled: Record = {};
+
+Styled.Content = styled.div`
+ ${layoutMixins.column}
+ gap: 1rem;
+
+ strong {
+ font-weight: 900;
+ color: var(--color-text-2);
+ }
+
+ footer {
+ ${layoutMixins.row}
+ justify-content: space-between;
+
+ svg {
+ width: auto;
+ }
+ }
+`;
+
+Styled.WaitingSpan = styled.span`
+ strong {
+ color: var(--color-warning);
+ }
+`;
+
+Styled.QrCodeContainer = styled.figure<{ isShowing: boolean }>`
+ ${layoutMixins.stack}
+
+ overflow: hidden;
+ border-radius: 0.75em;
+
+ cursor: pointer;
+
+ transition: 0.2s;
+
+ &:hover {
+ filter: brightness(var(--hover-filter-base));
+ }
+
+ > * {
+ position: relative;
+ transition: 0.16s;
+ }
+
+ > :first-child {
+ pointer-events: none;
+
+ ${({ isShowing }) =>
+ !isShowing &&
+ css`
+ filter: blur(1rem) brightness(1.4);
+ will-change: filter;
+ `}
+ }
+
+ > span {
+ place-self: center;
+
+ font-size: 1.4em;
+ color: var(--color-text-2);
+
+ ${({ isShowing }) =>
+ isShowing &&
+ css`
+ opacity: 0;
+ `}
+ }
+`;
diff --git a/src/views/menus/AccountMenu.tsx b/src/views/menus/AccountMenu.tsx
index f40b2b4..7991776 100644
--- a/src/views/menus/AccountMenu.tsx
+++ b/src/views/menus/AccountMenu.tsx
@@ -41,6 +41,14 @@ import { isTruthy } from '@/lib/isTruthy';
import { truncateAddress } from '@/lib/wallet';
import { MustBigNumber } from '@/lib/numbers';
+function getOS() {
+ var uA = navigator.userAgent;
+ if ((/iPad|iPhone|iPod/.test(uA)) || (uA.includes('Mac') && 'ontouchend' in document)) return 'iOS';
+
+ var i, os = ['Windows', 'Android', 'Unix', 'Mac', 'Linux', 'BlackBerry'];
+ for (i = 0; i < os.length; i++) if (new RegExp(os[i],'i').test(uA)) return os[i];
+}
+
export const AccountMenu = () => {
const stringGetter = useStringGetter();
const { mintscanBase } = useURLConfigs();
@@ -60,6 +68,13 @@ export const AccountMenu = () => {
dispatch(openDialog({ type: DialogTypes.Onboarding }));
};
+ // const appStoreUrl = document.querySelector('meta[name="app-store-url"]')?.getAttribute('content');
+ // const googlePlayUrl = document.querySelector('meta[name="google-play-url"]')?.getAttribute('content');
+ const appStoreUrl = "http://example.com";
+ const googlePlayUrl = "http://example.com";
+ const os = getOS();
+
+
return onboardingState === OnboardingState.Disconnected ? (
) : (
@@ -189,6 +204,29 @@ export const AccountMenu = () => {
label: stringGetter({ key: STRING_KEYS.DISPLAY_SETTINGS }),
onSelect: () => dispatch(openDialog({ type: DialogTypes.DisplaySettings })),
},
+ ...((appStoreUrl && os != 'Android') || (googlePlayUrl && os != 'iOS')
+ ? [
+ {
+ value: 'MobileDownload',
+ icon: ,
+ label: "Download Mobile App",
+ onSelect: () => {
+ switch (os) {
+ case 'iOS':
+ window.open(appStoreUrl, '_blank');
+ break;
+
+ case 'Android':
+ window.open(googlePlayUrl, '_blank');
+
+ default:
+ dispatch(openDialog({ type: DialogTypes.MobileDownload }));
+ break;
+ }
+ },
+ },
+ ]
+ : []),
...(onboardingState === OnboardingState.AccountConnected && hdKey
? [
{