64 lines
1.6 KiB
TypeScript
64 lines
1.6 KiB
TypeScript
import * as React from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import styled from "styled-components";
|
|
import { s } from "@shared/styles";
|
|
import Flex from "~/components/Flex";
|
|
import Heading from "~/components/Heading";
|
|
import PageTitle from "~/components/PageTitle";
|
|
import Text from "~/components/Text";
|
|
import useQuery from "~/hooks/useQuery";
|
|
|
|
const DesktopRedirect = () => {
|
|
const params = useQuery();
|
|
const token = params.get("token");
|
|
const { t } = useTranslation();
|
|
|
|
React.useEffect(() => {
|
|
if (token) {
|
|
window.open(
|
|
`outline://${window.location.host}/auth/redirect?token=${token}`,
|
|
"_self"
|
|
);
|
|
|
|
// Clean the url after a short delay so it's not possible to hit reload, re-using the transfer token
|
|
// will not work and changing the location immediately cancels the window.open call in Safari.
|
|
setTimeout(() => (window.location.search = ""), 500);
|
|
}
|
|
}, [token]);
|
|
|
|
return (
|
|
<Centered align="center" justify="center" column auto>
|
|
<PageTitle title={`${t("Signing in")}…`} />
|
|
<Heading centered>{t("Signing in")}…</Heading>
|
|
<Note>
|
|
{t(
|
|
"You can safely close this window once the Outline desktop app has opened"
|
|
)}
|
|
.
|
|
</Note>
|
|
</Centered>
|
|
);
|
|
};
|
|
|
|
const Note = styled(Text)`
|
|
color: ${s("textTertiary")};
|
|
text-align: center;
|
|
font-size: 14px;
|
|
margin-top: 8px;
|
|
|
|
em {
|
|
font-style: normal;
|
|
font-weight: 500;
|
|
}
|
|
`;
|
|
|
|
const Centered = styled(Flex)`
|
|
user-select: none;
|
|
width: 90vw;
|
|
height: 100%;
|
|
max-width: 320px;
|
|
margin: 0 auto;
|
|
`;
|
|
|
|
export default DesktopRedirect;
|