From 200a3ab1586cabf86b5a299603cf79d6f1fa7b7f Mon Sep 17 00:00:00 2001 From: softmarshmallow Date: Mon, 23 Aug 2021 00:01:17 +0900 Subject: [PATCH 01/10] add redirection uri --- app/lib/auth/README.md | 3 +++ app/lib/auth/index.ts | 8 +++++--- app/lib/pages/signin/index.tsx | 19 ++++++++++++++----- 3 files changed, 22 insertions(+), 8 deletions(-) create mode 100644 app/lib/auth/README.md diff --git a/app/lib/auth/README.md b/app/lib/auth/README.md new file mode 100644 index 00000000..91144c2a --- /dev/null +++ b/app/lib/auth/README.md @@ -0,0 +1,3 @@ +# First pary auth - do not modify under this directory unless you are a inside collaborator. + +> Cases for general contributing, you won't have to modify files under this directory. diff --git a/app/lib/auth/index.ts b/app/lib/auth/index.ts index 91d3d97b..0acdf4e3 100644 --- a/app/lib/auth/index.ts +++ b/app/lib/auth/index.ts @@ -5,7 +5,8 @@ import { AuthProxySessionStartRequest, AuthProxySessionStartResult, } from "@base-sdk-fp/auth"; -import { PluginSdk } from "@plugin-sdk/app"; +import { client_id } from "plugin-app"; + //#region export export * from "./storage"; //#endregion export @@ -17,8 +18,9 @@ const PROXY_AUTH_REQUEST_SECRET = function _make_request(): AuthProxySessionStartRequest { return { appId: "co.grida.assistant", - clientId: "", // todo + clientId: client_id, mode: ProxyAuthenticationMode.long_polling, + redirect_uri: "figma://", // TODO: change this scheme based on target platform. }; } @@ -46,5 +48,5 @@ export async function startAuthentication() { } export async function checkAuthSession() { - // + // TODO: } diff --git a/app/lib/pages/signin/index.tsx b/app/lib/pages/signin/index.tsx index b0740f2b..29d76a6c 100644 --- a/app/lib/pages/signin/index.tsx +++ b/app/lib/pages/signin/index.tsx @@ -24,6 +24,7 @@ import { Wrapper, } from "./style"; import { AuthProxySessionStartResult } from "@base-sdk-fp/auth"; +import { PluginSdk } from "@plugin-sdk/app"; // onClick={() => { // startAuthentication(); @@ -119,7 +120,7 @@ function Signin() { ) : ( {}} /> // TODO: provide callback state check & browser url. ) @@ -136,11 +137,19 @@ function Signin() { { - startAuthenticationSession().then((s) => { - setSessionInfo(s); - startAuthenticationWithSession(s); - }); setIsLoading(true); + startAuthenticationSession() + .then((s) => { + open(s.authUrl); // open browser initially. + setSessionInfo(s); + startAuthenticationWithSession(s); + }) + .catch((_) => { + PluginSdk.notify( + "please try again. (check your internet connection)" + ); + setIsLoading(true); + }); }} > {!isLoading ? "Sign in" : "Sign in ..."} From b4d7eb0b8e7682010a3cff2271310176e1363c9b Mon Sep 17 00:00:00 2001 From: softmarshmallow Date: Mon, 23 Aug 2021 00:01:44 +0900 Subject: [PATCH 02/10] update base-sdk-fp --- packages/base-sdk | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base-sdk b/packages/base-sdk index 7e57814d..da25f39b 160000 --- a/packages/base-sdk +++ b/packages/base-sdk @@ -1 +1 @@ -Subproject commit 7e57814d087c0da5945d79f5eba711318d97d7d3 +Subproject commit da25f39b69fd97f5cf72381ce762329e7a0d2085 From 5a31b25950d7cfe876be95a8fb9f8f6182c2f884 Mon Sep 17 00:00:00 2001 From: softmarshmallow Date: Mon, 23 Aug 2021 00:09:09 +0900 Subject: [PATCH 03/10] update base-sdk-fp --- packages/base-sdk | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base-sdk b/packages/base-sdk index da25f39b..3e15f563 160000 --- a/packages/base-sdk +++ b/packages/base-sdk @@ -1 +1 @@ -Subproject commit da25f39b69fd97f5cf72381ce762329e7a0d2085 +Subproject commit 3e15f563d951429d00cc775ed669459723bea870 From abd1c47d0bac904d66151d7ae01794aec08c8781 Mon Sep 17 00:00:00 2001 From: softmarshmallow Date: Mon, 23 Aug 2021 00:09:28 +0900 Subject: [PATCH 04/10] add failed start auth session handling --- app/lib/pages/signin/index.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/app/lib/pages/signin/index.tsx b/app/lib/pages/signin/index.tsx index 29d76a6c..3fe7e7de 100644 --- a/app/lib/pages/signin/index.tsx +++ b/app/lib/pages/signin/index.tsx @@ -145,10 +145,14 @@ function Signin() { startAuthenticationWithSession(s); }) .catch((_) => { + console.log( + "error occured while requesting proxy auth session start", + _ + ); PluginSdk.notify( "please try again. (check your internet connection)" ); - setIsLoading(true); + setIsLoading(false); }); }} > From 678381cbf9821c51d312301897f54407bc905bde Mon Sep 17 00:00:00 2001 From: softmarshmallow Date: Mon, 23 Aug 2021 00:14:19 +0900 Subject: [PATCH 05/10] update base-sdk --- packages/base-sdk | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base-sdk b/packages/base-sdk index 3e15f563..ce430171 160000 --- a/packages/base-sdk +++ b/packages/base-sdk @@ -1 +1 @@ -Subproject commit 3e15f563d951429d00cc775ed669459723bea870 +Subproject commit ce43017119c2eb84ada04b508b428b668e1b3d86 From 41f8ed086814f39533e502ad93dc29ca43be414a Mon Sep 17 00:00:00 2001 From: softmarshmallow Date: Mon, 23 Aug 2021 00:32:24 +0900 Subject: [PATCH 06/10] update with base-sdk (fixed long-polling check credential) --- packages/base-sdk | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base-sdk b/packages/base-sdk index ce430171..6c3e3029 160000 --- a/packages/base-sdk +++ b/packages/base-sdk @@ -1 +1 @@ -Subproject commit ce43017119c2eb84ada04b508b428b668e1b3d86 +Subproject commit 6c3e3029a2598afc4cfef24c4e7fce4c789f3bf1 From 112d53a9cc09e7aef560639f10c57e666097ce89 Mon Sep 17 00:00:00 2001 From: softmarshmallow Date: Mon, 23 Aug 2021 02:35:10 +0900 Subject: [PATCH 07/10] save auth result & stating --- app/lib/auth/index.ts | 13 +++++++++---- app/lib/pages/signin/index.tsx | 10 ++++++---- packages/base-sdk | 2 +- 3 files changed, 16 insertions(+), 9 deletions(-) diff --git a/app/lib/auth/index.ts b/app/lib/auth/index.ts index 0acdf4e3..61e97ab3 100644 --- a/app/lib/auth/index.ts +++ b/app/lib/auth/index.ts @@ -6,10 +6,7 @@ import { AuthProxySessionStartResult, } from "@base-sdk-fp/auth"; import { client_id } from "plugin-app"; - -//#region export -export * from "./storage"; -//#endregion export +import { AuthStorage } from "./storage"; const PROXY_AUTH_REQUEST_SECRET = process.env.GRIDA_FIRST_PARTY_PROXY_AUTH_REQUEST_TOTP_SECRET ?? @@ -39,6 +36,10 @@ export async function startAuthenticationWithSession( session, _make_request() ); + + AuthStorage.save(result.access_token); + // save result + return result; } @@ -47,6 +48,10 @@ export async function startAuthentication() { return await startAuthenticationWithSession(session); } +export async function isAuthenticated() { + return (await AuthStorage.get())?.length > 1; // using 1 (same as != undefined.) +} + export async function checkAuthSession() { // TODO: } diff --git a/app/lib/pages/signin/index.tsx b/app/lib/pages/signin/index.tsx index 3fe7e7de..fd5eb376 100644 --- a/app/lib/pages/signin/index.tsx +++ b/app/lib/pages/signin/index.tsx @@ -105,7 +105,7 @@ function FinishCheckingAuth(props: { username: string }) { function Signin() { const [isLoading, setIsLoading] = useState(false); - const [isAuthToken, setIsAuthToken] = useState(false); + const [isAuthenticated, setIsAuthenticated] = useState(false); const [sessionInfo, setSessionInfo] = useState(); const history = useHistory(); @@ -115,7 +115,7 @@ function Signin() { - {!isAuthToken ? ( + {!isAuthenticated ? ( !isLoading ? ( ) : ( @@ -128,7 +128,7 @@ function Signin() { // TODO: change with authenticated user name )} - {isAuthToken ? ( + {isAuthenticated ? ( <> Aaaallll Right ! @@ -142,7 +142,9 @@ function Signin() { .then((s) => { open(s.authUrl); // open browser initially. setSessionInfo(s); - startAuthenticationWithSession(s); + startAuthenticationWithSession(s).then((d) => { + setIsAuthenticated(true); + }); }) .catch((_) => { console.log( diff --git a/packages/base-sdk b/packages/base-sdk index 6c3e3029..083260ce 160000 --- a/packages/base-sdk +++ b/packages/base-sdk @@ -1 +1 @@ -Subproject commit 6c3e3029a2598afc4cfef24c4e7fce4c789f3bf1 +Subproject commit 083260ce82163916e796e417f8cb61cdf8766323 From c1d5eee62a7121e32cbd397735831b71f49dfd68 Mon Sep 17 00:00:00 2001 From: softmarshmallow Date: Mon, 23 Aug 2021 02:58:17 +0900 Subject: [PATCH 08/10] add re-chcecking option triggered by user interaction --- app/lib/auth/index.ts | 12 ++++++- app/lib/pages/signin/index.tsx | 62 +++++++++++++++++++++++++++------- packages/base-sdk | 2 +- 3 files changed, 62 insertions(+), 14 deletions(-) diff --git a/app/lib/auth/index.ts b/app/lib/auth/index.ts index 61e97ab3..5c4e0c69 100644 --- a/app/lib/auth/index.ts +++ b/app/lib/auth/index.ts @@ -52,6 +52,16 @@ export async function isAuthenticated() { return (await AuthStorage.get())?.length > 1; // using 1 (same as != undefined.) } -export async function checkAuthSession() { +export async function checkAuthSession(session: string): Promise { // TODO: + const res = await __auth_proxy.checkProxyAuthResult( + PROXY_AUTH_REQUEST_SECRET, + session + ); + + const success = res.success && res.access_token !== undefined; + if (success) { + AuthStorage.save(res.access_token); + } + return success; } diff --git a/app/lib/pages/signin/index.tsx b/app/lib/pages/signin/index.tsx index fd5eb376..c96c9449 100644 --- a/app/lib/pages/signin/index.tsx +++ b/app/lib/pages/signin/index.tsx @@ -3,7 +3,9 @@ import styled from "@emotion/styled"; import { startAuthenticationWithSession, startAuthenticationSession, + checkAuthSession, } from "../../auth"; +import { AuthProxySessionStartResult } from "@base-sdk-fp/auth"; import { BlackButton, ButtonStyle, @@ -23,7 +25,6 @@ import { Title, Wrapper, } from "./style"; -import { AuthProxySessionStartResult } from "@base-sdk-fp/auth"; import { PluginSdk } from "@plugin-sdk/app"; // onClick={() => { @@ -60,7 +61,11 @@ function InitialStateContent() { ); } -function LoadingContents(props: { authUrl: string; onCheckAuth: () => void }) { +function LoadingContents(props: { + authUrl: string; + onCheckAuth: () => void; + showUserOptions: boolean; +}) { return ( <> @@ -76,12 +81,16 @@ function LoadingContents(props: { authUrl: string; onCheckAuth: () => void }) { link below. </Contents> <LinkWrapper> - <LinkContents> - 👉 Let me in, I’ve completed all steps on the browser. - </LinkContents> - <LinkContents href={props.authUrl} target="_blank"> - 👉 Open the sign-in page again - </LinkContents> + {props.showUserOptions && ( + <> + <LinkContents> + 👉 Let me in, I’ve completed all steps on the browser. + </LinkContents> + <LinkContents href={props.authUrl} target="_blank"> + 👉 Open the sign-in page again + </LinkContents> + </> + )} </LinkWrapper> </> ); @@ -107,11 +116,16 @@ function Signin() { const [isLoading, setIsLoading] = useState<boolean>(false); const [isAuthenticated, setIsAuthenticated] = useState<boolean>(false); const [sessionInfo, setSessionInfo] = useState<AuthProxySessionStartResult>(); + const [sessionStarted, setSessionStarted] = useState<boolean>(false); const history = useHistory(); + const close = () => { + history.goBack(); + }; + return ( <Wrapper> - <BackIcon onClick={() => history.goBack()}> + <BackIcon onClick={close}> <LeftArrow /> </BackIcon> <Inner> @@ -121,8 +135,19 @@ function Signin() { ) : ( <LoadingContents authUrl={sessionInfo?.authUrl} - onCheckAuth={() => {}} - /> // TODO: provide callback state check & browser url. + showUserOptions={sessionStarted} + onCheckAuth={() => { + PluginSdk.notify( + "Checking if you signed in via browser..", + 1.5 + ); + checkAuthSession(sessionInfo.id).then((authenticated) => { + if (authenticated) { + setIsAuthenticated(true); + } + }); + }} + /> ) ) : ( <FinishCheckingAuth username="Universe" /> // TODO: change with authenticated user name @@ -130,16 +155,18 @@ function Signin() { <BtnWrapper> {isAuthenticated ? ( <> - <StyledButton>Aaaallll Right !</StyledButton> + <StyledButton onClick={close}>Aaaallll Right !</StyledButton> </> ) : ( <> <SignInBtn disabled={isLoading} onClick={() => { + setSessionStarted(false); // session is not yet started. (session start triggered.) setIsLoading(true); startAuthenticationSession() .then((s) => { + setSessionStarted(true); open(s.authUrl); // open browser initially. setSessionInfo(s); startAuthenticationWithSession(s).then((d) => { @@ -177,6 +204,17 @@ function Signin() { ); } +/** + * TODO: migrate this under base-sdk + */ +function fetchUserProfile(): { + id: string; + username: string; + email: string; +} { + return; +} + const StyledButton = styled.button` ${ButtonStyle} width: calc(100vw - 54px); diff --git a/packages/base-sdk b/packages/base-sdk index 083260ce..102de57b 160000 --- a/packages/base-sdk +++ b/packages/base-sdk @@ -1 +1 @@ -Subproject commit 083260ce82163916e796e417f8cb61cdf8766323 +Subproject commit 102de57ba4212c6808d5f51388e0880ae022cb04 From 788085cf964d41230ad9161a2b7c47e737c3cd7e Mon Sep 17 00:00:00 2001 From: softmarshmallow <woojoo@softmarshmallow.com> Date: Mon, 23 Aug 2021 03:01:49 +0900 Subject: [PATCH 09/10] rm static placeholder text (username) --- app/lib/pages/signin/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/lib/pages/signin/index.tsx b/app/lib/pages/signin/index.tsx index c96c9449..640fa61d 100644 --- a/app/lib/pages/signin/index.tsx +++ b/app/lib/pages/signin/index.tsx @@ -150,7 +150,7 @@ function Signin() { /> ) ) : ( - <FinishCheckingAuth username="Universe" /> // TODO: change with authenticated user name + <FinishCheckingAuth username="" /> // TODO: change with authenticated user name (use fetch user profile) )} <BtnWrapper> {isAuthenticated ? ( From ec056aa6a92b1b3b276fc55da3e2fdea62b69d4b Mon Sep 17 00:00:00 2001 From: softmarshmallow <woojoo@softmarshmallow.com> Date: Mon, 23 Aug 2021 03:07:04 +0900 Subject: [PATCH 10/10] rm static icon --- app/lib/pages/signin/signin-prompts.tsx | 20 ++------------------ 1 file changed, 2 insertions(+), 18 deletions(-) diff --git a/app/lib/pages/signin/signin-prompts.tsx b/app/lib/pages/signin/signin-prompts.tsx index 12634834..a025cc3a 100644 --- a/app/lib/pages/signin/signin-prompts.tsx +++ b/app/lib/pages/signin/signin-prompts.tsx @@ -3,6 +3,7 @@ import styled from "@emotion/styled"; import { BlackButton, WhtieButton } from "../../components/style/global-style"; import { useHistory } from "react-router"; import { startAuthentication } from "../../auth"; +import BackArrowIcon from "@assistant/icons/back-arrow"; import { BackIcon, BtnWrapper, @@ -15,30 +16,13 @@ import { Wrapper, } from "./style"; -function LeftArrow() { - return ( - <svg - width="24" - height="24" - viewBox="0 0 24 24" - fill="none" - xmlns="http://www.w3.org/2000/svg" - > - <path - d="M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z" - fill="black" - /> - </svg> - ); -} - function SigninPrompts() { const history = useHistory(); return ( <Wrapper> <BackIcon onClick={() => history.goBack()}> - <LeftArrow /> + <BackArrowIcon /> </BackIcon> <Inner> <Title>