Skip to content

Commit

Permalink
Merge branch 'master' into dependabot/npm_and_yarn/react-content-load…
Browse files Browse the repository at this point in the history 
…er-7.0.0
  • Loading branch information
@NguyenBao10
NguyenBao10 authored May 2, 2024
2 parents ab8e94f + 648c465 commit b03fb51
Show file tree
Hide file tree
Showing 10 changed files with 129 additions and 49 deletions.
23 changes: 18 additions & 5 deletions src/AnalyticsNext/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,29 +11,42 @@ const ConsentComponentCustom = dynamic(() => import('../Components/ConsentCustom
interface AnalyticsNext {
router: NextRouter;
attributes: any;
customLayout?: boolean;
oldLayout?: boolean;
loginApp?: any;
isLoggedApp?: boolean;
children?: ReactNode;
}

const AnalyticsNext = ({ router, attributes, customLayout = false, children }: AnalyticsNext) => {
const AnalyticsNext = ({
router,
attributes,
oldLayout = false,
loginApp,
isLoggedApp,
children,
}: AnalyticsNext) => {
return (
<>
<AnalyticsContextProvider>
<AnalyticsHandle router={router} attributes={attributes}>
{children}
{process.env.NEXT_PUBLIC_DISABLE_ANALYTICS_CONSENT !== 'true' && (
<>
{customLayout ? (
<ConsentComponentCustom
{oldLayout ? (
<ConsentComponent
endpoint={process.env.NEXT_PUBLIC_ENDPOINT_ANALYTICS_URL}
networkEnv={process.env.NEXT_PUBLIC_CONCORDIUM_NETWORK}
aesirXEndpoint={process.env.NEXT_PUBLIC_ENDPOINT_URL ?? 'https://api.aesirx.io'}
loginApp={loginApp}
isLoggedApp={isLoggedApp}
/>
) : (
<ConsentComponent
<ConsentComponentCustom
endpoint={process.env.NEXT_PUBLIC_ENDPOINT_ANALYTICS_URL}
networkEnv={process.env.NEXT_PUBLIC_CONCORDIUM_NETWORK}
aesirXEndpoint={process.env.NEXT_PUBLIC_ENDPOINT_URL ?? 'https://api.aesirx.io'}
loginApp={loginApp}
isLoggedApp={isLoggedApp}
/>
)}
</>
Expand Down
22 changes: 16 additions & 6 deletions src/AnalyticsReact/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,25 +4,35 @@ import AnalyticsContextProvider from '../utils/AnalyticsContextProvider';
import AnalyticsHandle from './handle';

const ConsentComponent = React.lazy(() => import('../Components/Consent'));
const ConsentComponentCustom = React.lazy(() => import('../Components/ConsentCustom'));

interface AnalyticsReact {
location: { search: string; pathname: string };
history: { replace: (_: object) => void };
children?: ReactNode;
oldLayout?: boolean;
}

const AnalyticsReact = ({ location, history, children }: AnalyticsReact) => {
const AnalyticsReact = ({ location, history, oldLayout = false, children }: AnalyticsReact) => {
return (
<AnalyticsContextProvider>
<AnalyticsHandle location={location} history={history}>
{children}
{process.env.REACT_APP_DISABLE_ANALYTICS_CONSENT !== 'true' && (
<Suspense fallback={<></>}>
<ConsentComponent
endpoint={process.env.REACT_APP_ENDPOINT_ANALYTICS_URL}
networkEnv={process.env.REACT_APP_CONCORDIUM_NETWORK}
aesirXEndpoint={process.env.REACT_APP_ENDPOINT_URL ?? 'https://api.aesirx.io'}
/>
{oldLayout ? (
<ConsentComponent
endpoint={process.env.REACT_APP_ENDPOINT_ANALYTICS_URL}
networkEnv={process.env.REACT_APP_CONCORDIUM_NETWORK}
aesirXEndpoint={process.env.REACT_APP_ENDPOINT_URL ?? 'https://api.aesirx.io'}
/>
) : (
<ConsentComponentCustom
endpoint={process.env.NEXT_PUBLIC_ENDPOINT_ANALYTICS_URL}
networkEnv={process.env.NEXT_PUBLIC_CONCORDIUM_NETWORK}
aesirXEndpoint={process.env.NEXT_PUBLIC_ENDPOINT_URL ?? 'https://api.aesirx.io'}
/>
)}
</Suspense>
)}
</AnalyticsHandle>
Expand Down
16 changes: 14 additions & 2 deletions src/Components/Consent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,14 +48,22 @@ interface WalletConnectionPropsExtends extends WalletConnectionProps {
endpoint: string;
aesirXEndpoint: string;
networkEnv?: string;
loginApp?: any;
isLoggedApp?: boolean;
}
const ConsentComponent = ({ endpoint, aesirXEndpoint, networkEnv }: any) => {
const ConsentComponent = ({ endpoint, aesirXEndpoint, networkEnv, loginApp, isLoggedApp }: any) => {
return (
<WithWalletConnector network={networkEnv === 'testnet' ? TESTNET : MAINNET}>
{(props) => (
<div className="aesirxconsent">
<SSOEthereumProvider>
<ConsentComponentApp {...props} endpoint={endpoint} aesirXEndpoint={aesirXEndpoint} />
<ConsentComponentApp
{...props}
endpoint={endpoint}
aesirXEndpoint={aesirXEndpoint}
loginApp={loginApp}
isLoggedApp={isLoggedApp}
/>
</SSOEthereumProvider>
</div>
)}
Expand All @@ -66,6 +74,8 @@ const ConsentComponentApp = (props: WalletConnectionPropsExtends) => {
const {
endpoint,
aesirXEndpoint,
loginApp,
isLoggedApp,
activeConnectorType,
activeConnector,
activeConnectorError,
Expand Down Expand Up @@ -227,6 +237,7 @@ const ConsentComponentApp = (props: WalletConnectionPropsExtends) => {
);
sessionStorage.setItem('aesirx-analytics-jwt', data?.jwt);
jwt = data?.jwt;
loginApp && !isLoggedApp && loginApp(data);
setLoadingCheckAccount(false);
}
} else {
Expand Down Expand Up @@ -398,6 +409,7 @@ const ConsentComponentApp = (props: WalletConnectionPropsExtends) => {
setLoading('done');
}
}
loginApp && !isLoggedApp && loginApp(response);
} catch (error) {
console.log(error);
setShow(false);
Expand Down
27 changes: 21 additions & 6 deletions src/Components/ConsentCustom.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,16 @@ interface WalletConnectionPropsExtends extends WalletConnectionProps {
endpoint: string;
aesirXEndpoint: string;
networkEnv?: string;
loginApp?: any;
isLoggedApp: boolean;
}
const ConsentComponentCustom = ({ endpoint, aesirXEndpoint, networkEnv }: any) => {
const ConsentComponentCustom = ({
endpoint,
aesirXEndpoint,
networkEnv,
loginApp,
isLoggedApp,
}: any) => {
return (
<WithWalletConnector network={networkEnv === 'testnet' ? TESTNET : MAINNET}>
{(props) => (
Expand All @@ -61,6 +69,8 @@ const ConsentComponentCustom = ({ endpoint, aesirXEndpoint, networkEnv }: any) =
{...props}
endpoint={endpoint}
aesirXEndpoint={aesirXEndpoint}
loginApp={loginApp}
isLoggedApp={isLoggedApp}
/>
</SSOEthereumProvider>
</div>
Expand All @@ -72,6 +82,8 @@ const ConsentComponentCustomApp = (props: WalletConnectionPropsExtends) => {
const {
endpoint,
aesirXEndpoint,
loginApp,
isLoggedApp,
activeConnectorType,
activeConnector,
activeConnectorError,
Expand Down Expand Up @@ -236,6 +248,7 @@ const ConsentComponentCustomApp = (props: WalletConnectionPropsExtends) => {
);
sessionStorage.setItem('aesirx-analytics-jwt', data?.jwt);
jwt = data?.jwt;
loginApp && !isLoggedApp && loginApp(data);
setLoadingCheckAccount(false);
}
} else {
Expand Down Expand Up @@ -407,6 +420,7 @@ const ConsentComponentCustomApp = (props: WalletConnectionPropsExtends) => {
setLoading('done');
}
}
loginApp && !isLoggedApp && loginApp(response);
} catch (error) {
console.log(error);
setShow(false);
Expand Down Expand Up @@ -741,6 +755,7 @@ const ConsentComponentCustomApp = (props: WalletConnectionPropsExtends) => {
/>
<div
className="minimize-shield"
ref={analyticsContext?.ref}
onClick={() => {
setShowExpandConsent(true);
sessionStorage.removeItem('aesirx-analytics-rejected');
Expand All @@ -760,7 +775,7 @@ const ConsentComponentCustomApp = (props: WalletConnectionPropsExtends) => {
<div className="bg-white rounded p-3 w-100">
{loading === 'done' ? (
<>
<p className="mb-3">{t('txt_upgrade_consent_text')}</p>
<p className="mb-2 mb-lg-3">{t('txt_upgrade_consent_text')}</p>
<p className="fw-semibold text-dark">{t('txt_your_current_level')}</p>
<ConsentLevelUprade
level={level}
Expand Down Expand Up @@ -889,14 +904,14 @@ const ConsentComponentCustomApp = (props: WalletConnectionPropsExtends) => {
onClick={() => {
setUpgradeLayout(true);
}}
className="d-flex align-items-center justify-content-center fs-14 w-100 me-3 mb-2 mb-lg-0 rounded-pill py-3 text-dark"
className="d-flex align-items-center justify-content-center fs-14 w-100 me-3 mb-2 mb-lg-0 rounded-pill py-2 py-lg-3 text-dark"
>
{t('txt_change_consent')}
</Button>{' '}
<Button
variant="outline-success"
onClick={handleNotAllow}
className="d-flex align-items-center justify-content-center fs-14 w-100 me-3 mb-2 mb-lg-0 rounded-pill py-3 text-dark"
className="d-flex align-items-center justify-content-center fs-14 w-100 me-3 mb-2 mb-lg-0 rounded-pill py-2 py-lg-3 text-dark"
>
{t('txt_reject_consent')}
</Button>
Expand All @@ -908,7 +923,7 @@ const ConsentComponentCustomApp = (props: WalletConnectionPropsExtends) => {
}`}
>
<SSOButton
className="btn btn-success text-white d-flex align-items-center justify-content-center loginSSO rounded-pill py-3 w-100"
className="btn btn-success text-white d-flex align-items-center justify-content-center loginSSO rounded-pill py-2 py-lg-3 w-100"
text={
<>
<img src={yes} className="me-1" />
Expand All @@ -926,7 +941,7 @@ const ConsentComponentCustomApp = (props: WalletConnectionPropsExtends) => {
<Button
variant="success"
onClick={handleAgree}
className="w-100 me-3 text-white d-flex align-items-center justify-content-center fs-14 rounded-pill py-3"
className="w-100 me-3 text-white d-flex align-items-center justify-content-center fs-14 rounded-pill py-2 py-lg-3"
>
{loadingCheckAccount ? (
<span
Expand Down
37 changes: 18 additions & 19 deletions src/Components/Terms.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,13 +77,12 @@ const TermsComponent = ({ children, level, handleLevel, isCustom = false }: any)
term.level === level && (
<Fragment key={key}>
<div
className={`rounded-top d-flex align-items-center justify-content-between p-3 fw-medium flex-wrap ${
isCustom ? 'py-3 px-4' : 'p-3 border-bottom bg-white'
className={`rounded-top d-flex align-items-center justify-content-between p-2 p-lg-3 fw-medium flex-wrap ${
isCustom
? 'py-2 py-lg-3 px-4 header-consent-bg'
: 'p-2 p-lg-3 border-bottom bg-white'
}`}
style={{
...(isCustom && {
backgroundColor: '#F8F9FD',
}),
...(isCustom && {
borderBottom: '1px solid #DEDEDE',
}),
Expand Down Expand Up @@ -116,31 +115,31 @@ const TermsComponent = ({ children, level, handleLevel, isCustom = false }: any)
)}
</div>
</div>
<div className={`p-3 ${isCustom ? 'pt-0' : ''} bg-white`}>
<div className={`pb-3 ${isCustom ? 'pt-0' : ''} bg-white`}>
{isCustom ? (
<>
<Tabs
id="consent_info_tab"
activeKey={activeTab}
onSelect={(k) => setActiveTab(k)}
className="mb-3 w-100 flex-nowrap consent_info_tab"
className="mb-2 mb-lg-3 w-100 flex-nowrap consent_info_tab"
>
<Tab eventKey="consent" title="Consent" className="w-100">
<p className="mb-3">{t('txt_consent_to_data')}</p>
<Tab eventKey="consent" title="Consent" className="w-100 px-3">
<p className="mb-2 mb-lg-3">{t('txt_consent_to_data')}</p>
<div className="d-flex align-items-center flex-wrap">
<div className="me-10px">{t('txt_ethical_compliant')}</div>
<div className="d-flex align-items-center">
<div className="item_compliant fw-semibold d-flex align-items-center text-dark">
<div className="item_compliant fw-semibold d-flex align-items-center">
<img src={check_line} width={24} height={24} />
GDPR
</div>
<div className="item_compliant fw-semibold d-flex align-items-center text-dark ms-10px">
<div className="item_compliant fw-semibold d-flex align-items-center ms-10px">
<img src={check_line} width={24} height={24} />
CCPA
</div>
</div>
</div>
<div className="fw-semibold mt-3 mb-0 text-dark">
<div className="fw-semibold mt-2 mt-lg-3 mb-0 text-dark">
{t('txt_your_current_level')}
</div>
<ConsentLevel
Expand All @@ -151,7 +150,7 @@ const TermsComponent = ({ children, level, handleLevel, isCustom = false }: any)
content_custom={t(term.content_custom)}
/>
</Tab>
<Tab eventKey="detail" title="Detail">
<Tab eventKey="detail" title="Detail" className="px-3">
<div className="about_section">
<div className="d-flex align-items-start">
<span>
Expand Down Expand Up @@ -229,7 +228,7 @@ const TermsComponent = ({ children, level, handleLevel, isCustom = false }: any)
/>
</div>
</Tab>
<Tab eventKey="about" title="About">
<Tab eventKey="about" title="About" className="px-3">
<div className="d-flex align-items-start">
<span>
<img src={check_circle} width={'14px'} height={'15px'} />
Expand Down Expand Up @@ -289,11 +288,11 @@ const TermsComponent = ({ children, level, handleLevel, isCustom = false }: any)
<div className="d-flex align-items-center mt-3 flex-wrap">
<div className="me-10px">{t('txt_ethical_compliant')}</div>
<div className="d-flex align-items-center">
<div className="item_compliant fw-semibold d-flex align-items-center text-dark">
<div className="item_compliant fw-semibold d-flex align-items-center">
<img src={check_line} width={24} height={24} />
GDPR
</div>
<div className="item_compliant fw-semibold d-flex align-items-center text-dark ms-10px">
<div className="item_compliant fw-semibold d-flex align-items-center ms-10px">
<img src={check_line} width={24} height={24} />
CCPA
</div>
Expand Down Expand Up @@ -331,7 +330,7 @@ const TermsComponent = ({ children, level, handleLevel, isCustom = false }: any)
</div>
{isCustom ? (
<div className="rounded-bottom position-relative overflow-hidden text-white bg-white">
<div className="position-relative p-3">
<div className="position-relative pt-2 pt-lg-3 p-3">
<div className="d-flex align-items-center justify-content-between flex-wrap">
{children}
</div>
Expand All @@ -344,7 +343,7 @@ const TermsComponent = ({ children, level, handleLevel, isCustom = false }: any)
className="position-absolute h-100 w-100 object-fit-cover lightning flash-effect"
src={bg}
/>
<div className="position-relative p-3">
<div className="position-relative pt-2 pt-lg-3 p-3">
{showReadmore && (
<>
<div className="mb-3">
Expand Down Expand Up @@ -372,7 +371,7 @@ const TermsComponent = ({ children, level, handleLevel, isCustom = false }: any)

const ConsentLevel = ({ level, tier, levelname, term_custom, content_custom }: any) => {
return (
<div className="consent_level mt-3">
<div className="consent_level mt-2 mt-lg-3">
<div className="d-flex align-items-center justify-content-between flex-wrap mb-2">
<div className="d-flex align-items-center">
<div className={`status-tier tier-${level} rounded-circle`}></div>
Expand Down
5 changes: 3 additions & 2 deletions src/Hooks/useConsentStatus.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,8 @@ const useConsentStatus = (endpoint?: string, props?: WalletConnectionProps) => {
if (
isDesktop &&
sessionStorage.getItem('aesirx-analytics-revoke') !== '1' &&
sessionStorage.getItem('aesirx-analytics-revoke') !== '2'
sessionStorage.getItem('aesirx-analytics-revoke') !== '2' &&
sessionStorage.getItem('aesirx-analytics-rejected') !== 'true'
) {
if (window['concordium']) {
const address = (await window['concordium']?.requestAccounts()) ?? [];
Expand All @@ -138,7 +139,7 @@ const useConsentStatus = (endpoint?: string, props?: WalletConnectionProps) => {
}
};
initConnector();
}, []);
}, [window['concordium']]);

useEffect(() => {
if (activeConnector) {
Expand Down
Loading

0 comments on commit b03fb51

Please sign in to comment.