From 9fd322ec9a519a28cd44ac0d2f2d0eb9b13eb533 Mon Sep 17 00:00:00 2001 From: Myzel394 <50424412+Myzel394@users.noreply.github.com> Date: Thu, 24 Nov 2022 14:33:26 +0100 Subject: [PATCH] current stand --- public/locales/en-US/translation.json | 6 ++ src/AuthContext/AuthContextProvider.tsx | 29 ++++++-- .../PasswordShareConfirmationDialog.tsx | 69 +++++++++++++++++++ src/components/ExtensionalSignalHandler.tsx | 2 +- 4 files changed, 100 insertions(+), 6 deletions(-) create mode 100644 src/AuthContext/PasswordShareConfirmationDialog.tsx diff --git a/public/locales/en-US/translation.json b/public/locales/en-US/translation.json index c4f3fbb..2ce596c 100644 --- a/public/locales/en-US/translation.json +++ b/public/locales/en-US/translation.json @@ -331,6 +331,12 @@ "title": "Are you sure you want to leave?", "description": "You have unsaved changes. If you leave, your changes will be lost.", "continueLabel": "Leave" + }, + "passwordShareConfirmationDialog": { + "title": "Share Password?", + "description": "An extension is asking for your password. Do you want to share it? Only continue if you initiated this action.", + "warning": "THIS WILL SHARE YOUR PASSWORD WITH THE EXTENSION. ALL YOUR DATA CAN BE DECRYPTED USING IT. ONLY CONTINUE IF YOU TRUST THE EXTENSION AND IF YOU INITIATED THE REQUEST.", + "continueAction": "Share Password" } }, diff --git a/src/AuthContext/AuthContextProvider.tsx b/src/AuthContext/AuthContextProvider.tsx index 44a68e2..1a88cd0 100644 --- a/src/AuthContext/AuthContextProvider.tsx +++ b/src/AuthContext/AuthContextProvider.tsx @@ -1,17 +1,19 @@ -import {ReactElement, ReactNode, useCallback, useEffect, useMemo} from "react" -import {useLocalStorage} from "react-use" +import {ReactElement, ReactNode, useCallback, useEffect, useMemo, useState} from "react" +import {useLocalStorage, useSessionStorage} from "react-use" import {AxiosError} from "axios" import {decrypt, readMessage, readPrivateKey} from "openpgp" import {useNavigate} from "react-router-dom" import {useMutation} from "@tanstack/react-query" +import {Dialog} from "@mui/material" +import AuthContext, {AuthContextType, EncryptionStatus} from "./AuthContext" + import {ServerUser, User} from "~/server-types" import {REFRESH_TOKEN_URL, RefreshTokenResult, logout as logoutUser, refreshToken} from "~/apis" import {client} from "~/constants/axios-client" import {decryptString, encryptString} from "~/utils" - -import AuthContext, {AuthContextType, EncryptionStatus} from "./AuthContext" +import PasswordShareConfirmationDialog from "~/AuthContext/PasswordShareConfirmationDialog" export interface AuthContextProviderProps { children: ReactNode @@ -22,6 +24,12 @@ export default function AuthContextProvider({children}: AuthContextProviderProps onError: () => logout(false), }) + const [askForPassword, setAskForPassword] = useState(false) + const [doNotAskForPassword, setDoNotAskForPassword] = useSessionStorage( + "do-not-ask-again-for-password", + false, + ) + const [decryptionPassword, setDecryptionPassword] = useLocalStorage( "_global-context-auth-decryption-password", null, @@ -190,5 +198,16 @@ export default function AuthContextProvider({children}: AuthContextProviderProps return () => client.interceptors.response.eject(interceptor) }, [logout, refresh]) - return {children} + // Handle extension password request + + return ( + <> + {children} + setAskForPassword(false)} + /> + + ) } diff --git a/src/AuthContext/PasswordShareConfirmationDialog.tsx b/src/AuthContext/PasswordShareConfirmationDialog.tsx new file mode 100644 index 0000000..856ec5b --- /dev/null +++ b/src/AuthContext/PasswordShareConfirmationDialog.tsx @@ -0,0 +1,69 @@ +import {ReactElement, useMemo, useState} from "react" +import {useTranslation} from "react-i18next" +import {TiCancel} from "react-icons/ti" + +import { + Alert, + Button, + Checkbox, + Dialog, + DialogActions, + DialogContent, + DialogContentText, + DialogTitle, + FormControlLabel, +} from "@mui/material" + +export interface PasswordShareConfirmationDialogProps { + open: boolean + onShare: (doNotAskAgain: boolean) => void + onClose: () => void +} + +export default function PasswordShareConfirmationDialog({ + open, + onShare, + onClose, +}: PasswordShareConfirmationDialogProps): ReactElement { + const [doNotAskAgain, setDoNotAskAgain] = useState(false) + const askAmount = useMemo( + () => Number(sessionStorage.getItem("password-share-ask-amount") || 0) + 1, + [], + ) + const {t} = useTranslation() + + return ( + + {t("components.passwordShareConfirmationDialog.title")} + + + {t("components.passwordShareConfirmationDialog.description")} + + + {t("components.passwordShareConfirmationDialog.warning")} + + {askAmount > 1 && ( + + setDoNotAskAgain(event.target.value as any as boolean) + } + /> + } + label={t("components.passwordShareConfirmationDialog.doNotAskAgain")} + /> + )} + + + + + + + ) +} diff --git a/src/components/ExtensionalSignalHandler.tsx b/src/components/ExtensionalSignalHandler.tsx index 8f7fa45..e717802 100644 --- a/src/components/ExtensionalSignalHandler.tsx +++ b/src/components/ExtensionalSignalHandler.tsx @@ -1,5 +1,6 @@ import {ReactElement, useContext} from "react" +import {useEffectOnce} from "react-use" import AuthContext from "~/AuthContext/AuthContext" export default function ExtensionSignalHandler(): ReactElement { @@ -7,7 +8,6 @@ export default function ExtensionSignalHandler(): ReactElement { const appDomain = import.meta.env.VITE_SERVER_BASE_URL const instanceData = { appDomain, - isAuthenticated: Boolean(user), } return (