Skip to content

Commit

Permalink
Merge pull request #88 from Portkey-Wallet/feature/guardians-without-…
Browse files Browse the repository at this point in the history
…portkey-bot

Support tg webapp
  • Loading branch information
peony111 authored May 13, 2024
2 parents 7589a52 + 6a51f65 commit 2e13857
Show file tree
Hide file tree
Showing 47 changed files with 3,476 additions and 145 deletions.
13 changes: 13 additions & 0 deletions .env
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,22 @@ NEXT_PUBLIC_APP_APPLE_REDIRECT_URI=https://did-portkey.portkey.finance/api/app/A
# NEXT_PUBLIC_APP_MAINNET_SERVICE=https://did-portkey.portkey.finance
# NEXT_PUBLIC_APP_TESTNET_SERVICE=https://did-portkey-test.portkey.finance

# v2 test4
# NEXT_PUBLIC_APP_MAINNET_SERVICE=http://localhost:3002
#https://test4-applesign-v2.portkey.finance
# NEXT_PUBLIC_APP_TESTNET_SERVICE=http://localhost:3002
# NEXT_PUBLIC_APP_MAINNET_CONNECT=http://localhost:3002
# NEXT_PUBLIC_APP_TESTNET_CONNECT=http://localhost:3002
# NEXT_PUBLIC_APP_MAINNET_GRAPHQL=http://192.168.67.214:8083/AElfIndexer_DApp/PortKeyIndexerCASchema/graphql
# NEXT_PUBLIC_APP_TESTNET_GRAPHQL=http://192.168.67.214:8083/AElfIndexer_DApp/PortKeyIndexerCASchema/graphql

# v2
NEXT_PUBLIC_APP_MAINNET_SERVICE=https://aa-portkey.portkey.finance
NEXT_PUBLIC_APP_TESTNET_SERVICE=https://aa-portkey-test.portkey.finance
NEXT_PUBLIC_APP_MAINNET_CONNECT=https://auth-aa-portkey.portkey.finance
NEXT_PUBLIC_APP_TESTNET_CONNECT=https://auth-aa-portkey-test.portkey.finance
NEXT_PUBLIC_APP_MAINNET_GRAPHQL=https://dapp-aa-portkey.portkey.finance/Portkey_V2_DID/PortKeyIndexerCASchema/graphql
NEXT_PUBLIC_APP_TESTNET_GRAPHQL=https://dapp-aa-portkey-test.portkey.finance/Portkey_V2_DID/PortKeyIndexerCASchema/graphql

NEXT_PUBLIC_APP_APPLE_REDIRECT_URI_V2 = https://aa-portkey.portkey.finance/api/app/appleAuth/unifyReceive
# NEXT_PUBLIC_APP_APPLE_REDIRECT_URI_V2 = https://aa-portkey-test.portkey.finance/api/app/appleAuth/unifyReceive
4 changes: 4 additions & 0 deletions _env_mainnet
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@ NEXT_PUBLIC_APP_APPLE_REDIRECT_URI=https://did-portkey.portkey.finance/api/app/A

NEXT_PUBLIC_APP_MAINNET_SERVICE=https://aa-portkey.portkey.finance
NEXT_PUBLIC_APP_TESTNET_SERVICE=https://aa-portkey-test.portkey.finance
NEXT_PUBLIC_APP_MAINNET_CONNECT=https://auth-aa-portkey.portkey.finance
NEXT_PUBLIC_APP_TESTNET_CONNECT=https://auth-aa-portkey-test.portkey.finance
NEXT_PUBLIC_APP_MAINNET_GRAPHQL=https://dapp-aa-portkey.portkey.finance/Portkey_V2_DID/PortKeyIndexerCASchema/graphql
NEXT_PUBLIC_APP_TESTNET_GRAPHQL=https://dapp-aa-portkey-test.portkey.finance/Portkey_V2_DID/PortKeyIndexerCASchema/graphql

NEXT_PUBLIC_APP_TWITTER_CLIENT_ID=N3BDSzBMalRSd1NaTzhETjZKNzY6MTpjaQ

Expand Down
5 changes: 5 additions & 0 deletions _env_testnet
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,11 @@ NEXT_PUBLIC_APP_APPLE_REDIRECT_URI=https://did-portkey-test.portkey.finance/api/

NEXT_PUBLIC_APP_MAINNET_SERVICE=https://aa-portkey.portkey.finance
NEXT_PUBLIC_APP_TESTNET_SERVICE=https://aa-portkey-test.portkey.finance
NEXT_PUBLIC_APP_MAINNET_CONNECT=https://auth-aa-portkey.portkey.finance
NEXT_PUBLIC_APP_TESTNET_CONNECT=https://auth-aa-portkey-test.portkey.finance
NEXT_PUBLIC_APP_MAINNET_GRAPHQL=https://dapp-aa-portkey.portkey.finance/Portkey_V2_DID/PortKeyIndexerCASchema/graphql
NEXT_PUBLIC_APP_TESTNET_GRAPHQL=https://dapp-aa-portkey-test.portkey.finance/Portkey_V2_DID/PortKeyIndexerCASchema/graphql


NEXT_PUBLIC_APP_TWITTER_CLIENT_ID=N3BDSzBMalRSd1NaTzhETjZKNzY6MTpjaQ

Expand Down
11 changes: 9 additions & 2 deletions next.config.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,11 @@
const rewrites = require("./rewrites");

/** @type {import('next').NextConfig} */
const nextConfig = {}
const nextConfig = {
reactStrictMode: false,
async rewrites() {
return rewrites;
},
};

module.exports = nextConfig
module.exports = nextConfig;
17 changes: 11 additions & 6 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,22 +9,27 @@
"lint": "next lint"
},
"dependencies": {
"@types/node": "20.2.3",
"@types/react": "18.2.6",
"@types/react-dom": "18.2.4",
"@portkey/did-ui-react": "^2.5.0-alpha.52",
"@portkey/onboarding": "^2.5.0-alpha.52",
"@portkey/utils": "^2.5.0-alpha.52",
"aelf-sdk": "^3.2.45-beta.1",
"autoprefixer": "10.4.14",
"clsx": "^1.2.1",
"eslint": "8.41.0",
"eslint-config-next": "13.4.3",
"lottie-web": "^5.11.0",
"next": "13.4.3",
"postcss": "8.4.23",
"query-string": "^7.1.1",
"react": "18.2.0",
"react-dom": "18.2.0",
"tailwindcss": "3.3.2",
"vconsole": "3.15.1",
"@portkey/onboarding": "1.4.0-alpha.3",
"@portkey/utils": "1.4.0-alpha.3",
"typescript": "5.0.4"
},
"devDependencies": {
"@types/node": "20.2.3",
"@types/react": "18.2.6",
"@types/react-dom": "18.2.4",
"vconsole": "3.15.1"
}
}
2 changes: 2 additions & 0 deletions postcss.config.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
module.exports = {
plugins: {
'postcss-import': {},
'tailwindcss/nesting': {},
tailwindcss: {},
autoprefixer: {},
},
Expand Down
37 changes: 37 additions & 0 deletions rewrites.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
module.exports = [
// test1
// { source: '/api/:path*', destination: 'http://192.168.66.240:5577/api/:path*' },
// { source: '/connect/:path*', destination: 'http://192.168.66.240:8080/connect/:path*' },

// // test2
// { source: '/api/:path*', destination: 'http://192.168.67.51:5577/api/:path*' },
// { source: '/connect/:path*', destination: 'http://192.168.67.51:8080/connect/:path*' },
// { source: '/graphql/:path*', destination: 'http://192.168.67.51:8083/AElfIndexer_DApp/PortKeyIndexerCASchema/graphql/:path*' },

// test3
// { source: '/api/:path*', destination: 'http://192.168.64.201:5001/api/:path*' },
// { source: '/connect/:path*', destination: 'http://192.168.64.201:8080/connect/:path*' },
// { source: '/graphql/:path*', destination: 'http://192.168.64.202:8083/AElfIndexer_DApp/PortKeyIndexerCASchema/graphql/:path*' },

// test4-v2
{ source: '/api/:path*', destination: 'http://192.168.66.117:5577/api/:path*' },
{ source: '/communication/:path*', destination: 'http://192.168.66.117:5577/communication/:path*' },
{ source: '/connect/:path*', destination: 'http://192.168.66.117:8080/connect/:path*' },
{
source: '/graphql/:path*',
destination: 'http://192.168.67.214:8083/AElfIndexer_DApp/PortKeyIndexerCASchema/graphql/:path*',
},

// mainnet
// { source: '/api/:path*', destination: 'https://aa-portkey.portkey.finance/api/:path*' },
// { source: '/connect/:path*', destination: 'https://auth-aa-portkey.portkey.finance/connect/:path*' },
// { source: '/graphql/:path*', destination: 'https://dapp-aa-portkey.portkey.finance/Portkey_V2_DID/PortKeyIndexerCASchema/graphql/:path*' },

// testnet
// { source: '/api/:path*', destination: 'https://aa-portkey-test.portkey.finance/api/:path*' },
// { source: '/connect/:path*', destination: 'https://auth-aa-portkey-test.portkey.finance/connect/:path*' },
// {
// source: '/graphql/:path*',
// destination: 'https://dapp-aa-portkey-test.portkey.finance/Portkey_V2_DID/PortKeyIndexerCASchema/graphql/:path*',
// },
];
38 changes: 34 additions & 4 deletions src/app/auth-callback/page.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,13 @@
"use client";
import React, { useCallback, useEffect, useState } from "react";
import Loading from "src/components/Loading";
import { SOCIAL_AUTH_SESSION_KEY } from "src/constants/social";
import { parseRedirectParams } from "src/utils/parseRedirectParams";
import {
CrossTabPushMessageType,
pushEncodeMessage,
} from "src/utils/crossTabMessagePush";
import "@portkey/did-ui-react/dist/assets/index.css";

export default function AuthCallback() {
const [error, setError] = useState<string>();
Expand All @@ -24,9 +30,32 @@ export default function AuthCallback() {
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

const getToken = useCallback(() => {
const postMessageByApi = useCallback(
async (storage: string, params: string) => {
return pushEncodeMessage(
storage,
CrossTabPushMessageType.onAuthStatusChanged,
params,
true
);
},
[]
);

const getToken = useCallback(async () => {
try {
const { token, provider, code, message } = parseRedirectParams();
const params = parseRedirectParams({ from: "openlogin" });

const { token, provider, code, message } = params;

const session = sessionStorage.getItem(SOCIAL_AUTH_SESSION_KEY);

const infoStr = JSON.stringify(params);

if (session) {
await postMessageByApi(session, infoStr);
return;
}

if (!window.opener?.postMessage)
throw "The current browser is abnormal or not supported";
Expand Down Expand Up @@ -54,11 +83,12 @@ export default function AuthCallback() {
window.removeEventListener("beforeunload", onCloseWindow);
window.close();
// eslint-disable-next-line react-hooks/exhaustive-deps
} catch (error) {
} catch (error: any) {
if (typeof error === "string") return setError(error);
if (typeof error.message === "string") return setError(error.message);
error && setError(JSON.stringify(error));
}
}, [onCloseWindow]);
}, [onCloseWindow, postMessageByApi]);

useEffect(() => {
getToken();
Expand Down
28 changes: 28 additions & 0 deletions src/app/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -24,3 +24,31 @@ body {
.bg-white {
background-color: #fff;
}

/* The purpose of using multiple class names is to increase style weight */
.common-prompt-modal.portkey-ant-modal-wrap.portkey-ui-wrapper {
.portkey-ant-modal-body {
padding: 24px 20px;
}
.portkey-ant-modal-confirm-btns {
display: none;
}
.common-prompt-modal-body {
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
.common-prompt-modal-title {
color: var(--portkey-ui-font-5);
font-size: 18px;
font-weight: 500;
line-height: 22px;
}
.common-prompt-modal-content {
color: var(--portkey-ui-font-8);
font-size: 16px;
line-height: 22px;
text-align: center;
}
}
}
18 changes: 18 additions & 0 deletions src/app/guardian/approval/index.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
.guardian-approval-container {
position: relative;
height: 100vh;
display: flex;
flex-direction: column;
}

.ui-guardian-approval-wrapper {
flex: 1;
.guardian-list-wrapper {
padding: 96px 24px 24px;
}
}

.loading-wrapper {
position: absolute;
top: 0;
}
140 changes: 140 additions & 0 deletions src/app/guardian/approval/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,140 @@
"use client";
import {
errorTip,
GuardianApproval as GuardianApprovalComponent,
handleErrorMessage,
PortkeyStyleProvider,
} from "@portkey/did-ui-react";
import type { ITelegramInfo, UserGuardianStatus } from "@portkey/did-ui-react";
import { OperationTypeEnum, GuardiansApproved } from "@portkey/services";
import { useCallback, useEffect, useMemo, useState } from "react";
import Loading from "src/components/Loading";
import { formatGuardianValue, getGuardianList } from "src/utils/guardians";
import { getOperationDetails } from "src/utils/manager";
import { useSearchParams } from "next/navigation";
import "@portkey/did-ui-react/dist/assets/index.css";
import "./index.css";
import { GuardianApprovalLocationState } from "src/types/guardians";
import { base64toJSON } from "src/utils";
import { DefaultGuardianApprovalLocationState } from "src/constants/guardians";
import {
CrossTabPushMessageType,
pushEncodeMessage,
} from "src/utils/crossTabMessagePush";
import PoweredFooter from "src/components/PoweredFooter";

export default function GuardianApproval() {
const searchParams = useSearchParams();

// search params
const b64Params = searchParams.get("b64Params") || "";
const pageInfo: GuardianApprovalLocationState = useMemo(() => {
try {
const data = base64toJSON(b64Params);
console.log(data, "b64Params===");
return data as GuardianApprovalLocationState;
} catch (error) {
return DefaultGuardianApprovalLocationState;
}
}, [b64Params]);
const operationType = useMemo(
() => Number(pageInfo.operationType) as OperationTypeEnum,
[pageInfo]
);
const sessionAuth = useMemo(
() =>
JSON.stringify({
loginId: pageInfo.loginId,
publicKey: pageInfo.publicKey,
serviceURI:
pageInfo.serviceURI || "https://aa-portkey-test.portkey.finance",
}),
[pageInfo.loginId, pageInfo.publicKey, pageInfo.serviceURI]
);

// page state
const [loading, setLoading] = useState(false);
const operationDetails = getOperationDetails(operationType);
const [guardianList, setGuardianList] = useState<UserGuardianStatus[]>();
const telegramInfo: ITelegramInfo = useMemo(() => {
return {
accessToken: pageInfo.telegramAuth,
userId: pageInfo.telegramUserId,
};
}, [pageInfo.telegramAuth, pageInfo.telegramUserId]);

const getData = useCallback(async () => {
setLoading(true);
try {
const _guardianList = await getGuardianList({
identifier: pageInfo.identifier,
caHash: pageInfo.caHash,
originChainId: pageInfo.originChainId,
});
_guardianList.reverse();
setGuardianList(_guardianList);
return _guardianList;
} catch (error) {
errorTip(
{
errorFields: "GetGuardianList",
error: handleErrorMessage(error),
},
pageInfo.isErrorTip
// onApprovalError
);
} finally {
setLoading(false);
}
}, [
pageInfo.caHash,
pageInfo.identifier,
pageInfo.isErrorTip,
pageInfo.originChainId,
]);

const onApprovalSuccess = useCallback(
async (approvalInfo: GuardiansApproved[]) => {
const formatGuardiansApproved = formatGuardianValue(approvalInfo);

// save data
// back dapp webapp to execute the next step of the process
if (sessionAuth) {
await pushEncodeMessage(
sessionAuth,
pageInfo.socketMethod ||
CrossTabPushMessageType.onGuardianApprovalResult,
JSON.stringify({ approvalInfo, formatGuardiansApproved }),
true
);
return;
}
},
[pageInfo.socketMethod, sessionAuth]
);

useEffect(() => {
getData();
}, [getData]);

return (
<PortkeyStyleProvider>
<div className="guardian-approval-container">
<GuardianApprovalComponent
// header={<BackHeaderForPage title={""} leftElement={""} />}
operationDetails={operationDetails}
originChainId={pageInfo.originChainId}
targetChainId={pageInfo.targetChainId}
guardianList={guardianList}
onConfirm={onApprovalSuccess}
// onError={onApprovalError}
networkType={pageInfo.networkType}
operationType={operationType}
telegramInfo={telegramInfo}
/>
<PoweredFooter />
<Loading loading={loading} />
</div>
</PortkeyStyleProvider>
);
}
Loading

0 comments on commit 2e13857

Please sign in to comment.