diff --git a/src/pages/connections/useConnections.tsx b/src/pages/connections/useConnections.tsx
index 0ebd895ac..56b00271e 100644
--- a/src/pages/connections/useConnections.tsx
+++ b/src/pages/connections/useConnections.tsx
@@ -13,7 +13,8 @@ export const useConnections = () => {
{ label: translate('connect-title'), content:
},
{ label: translate('connect-followings'), content:
},
{ label: translate('connect-followers'), content:
},
- { label: translate('connect-requests'), content:
},
+ { label: translate('connect-received-requests'), content:
},
+ { label: translate('connect-sent-requests'), content:
},
{ label: translate('connect-blocked'), content:
},
];
diff --git a/src/pages/error/fallback/fallback.module.scss b/src/pages/error/fallback/fallback.module.scss
new file mode 100644
index 000000000..1f8d27c38
--- /dev/null
+++ b/src/pages/error/fallback/fallback.module.scss
@@ -0,0 +1,34 @@
+@import 'src/styles/constants/_primitives.scss';
+
+.container {
+ position: fixed;
+ width: 100vw;
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ gap: 1.5rem;
+ padding: 3rem 1.5rem;
+ text-align: center;
+
+ .error {
+ &__code {
+ font-size: 80px;
+ font-weight: 800;
+ color: $color-error-600;
+ }
+
+ &__msg {
+ font-size: 48px;
+ font-weight: 600;
+ color: $color-grey-900;
+ }
+
+ &__details {
+ font-size: 24px;
+ color: $color-grey-700;
+ margin-bottom: 1rem;
+ }
+ }
+}
diff --git a/src/pages/fallback/fallback.services.ts b/src/pages/error/fallback/fallback.services.ts
similarity index 100%
rename from src/pages/fallback/fallback.services.ts
rename to src/pages/error/fallback/fallback.services.ts
diff --git a/src/pages/error/fallback/fallback.tsx b/src/pages/error/fallback/fallback.tsx
new file mode 100644
index 000000000..8ac6f49c4
--- /dev/null
+++ b/src/pages/error/fallback/fallback.tsx
@@ -0,0 +1,30 @@
+import { useNavigate } from 'react-router-dom';
+import { translate } from 'src/core/utils';
+import { Button } from 'src/modules/general/components/Button';
+
+import styles from './fallback.module.scss';
+
+const FallBack = () => {
+ const navigate = useNavigate();
+ const flag = 'refreshed';
+ const refreshed = sessionStorage.getItem(flag);
+
+ if (!refreshed) {
+ sessionStorage.setItem(flag, `${new Date().getTime()}`);
+ window.location.reload();
+ return <>;
+ }
+
+ return (
+
+
500
+
{translate('general-error-internal.header')}
+
{translate('general-error-internal.subheader')}
+
+
+ );
+};
+
+export default FallBack;
diff --git a/src/pages/error/notFound/index.module.scss b/src/pages/error/notFound/index.module.scss
new file mode 100644
index 000000000..34f287a90
--- /dev/null
+++ b/src/pages/error/notFound/index.module.scss
@@ -0,0 +1,30 @@
+@import 'src/styles/constants/_primitives.scss';
+
+.container {
+ height: 100vh;
+ width: 100vw;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ gap: 1.5rem;
+ padding: 3rem 1.5rem;
+ text-align: center;
+
+ .header {
+ font-size: 3rem;
+ font-weight: 800;
+ color: $color-primary-700;
+ }
+
+ .subheader {
+ font-size: 1rem;
+ color: $color-grey-700;
+ margin-bottom: 1rem;
+ }
+
+ .brand {
+ font-weight: 600;
+ color: $color-grey-900;
+ }
+}
diff --git a/src/pages/error/notFound/index.tsx b/src/pages/error/notFound/index.tsx
new file mode 100644
index 000000000..e000882a0
--- /dev/null
+++ b/src/pages/error/notFound/index.tsx
@@ -0,0 +1,22 @@
+import { useNavigate } from 'react-router-dom';
+import { translate } from 'src/core/utils';
+import { Button } from 'src/modules/general/components/Button';
+
+import styles from './index.module.scss';
+
+export const NotFound = () => {
+ const navigate = useNavigate();
+
+ return (
+
+
{translate('general-error-not-found.header')}
+
+ {translate('general-error-not-found.subheader')}
+ {'Socious'}.
+
+
+
+ );
+};
diff --git a/src/pages/fallback/fallback.module.scss b/src/pages/fallback/fallback.module.scss
deleted file mode 100644
index e78212092..000000000
--- a/src/pages/fallback/fallback.module.scss
+++ /dev/null
@@ -1,39 +0,0 @@
-.container {
- position: fixed;
- width: 100vw;
- height: 100vh;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
-}
-.errorCode {
- font-size: 5rem;
- font-weight: 800;
- color: var(--color-error-01);
-}
-.errorMsg {
- text-align: center;
- font-size: var(--font-size-xl);
- color: var(--color-black-01);
-}
-.errorDetails {
- text-align: center;
- font-size: var(--font-size-l);
- color: var(--color-black-01);
- margin-top: 1rem;
-}
-.buttonContainer {
- width: 100%;
- display: flex;
- align-items: center;
- justify-content: center;
- margin-top: 1rem;
-}
-.button {
- width: 100%;
- margin: auto;
-}
-.link {
- color: var(--color-white);
-}
diff --git a/src/pages/fallback/fallback.tsx b/src/pages/fallback/fallback.tsx
deleted file mode 100644
index 7cb108779..000000000
--- a/src/pages/fallback/fallback.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import { Button } from 'src/modules/general/components/Button';
-
-import css from './fallback.module.scss';
-
-const FallBack = () => {
- const flag = 'refreshed';
- const refreshed = sessionStorage.getItem(flag);
-
- if (!refreshed) {
- sessionStorage.setItem(flag, `${new Date().getTime()}`);
- window.location.reload();
- return <>;
- }
-
- return (
-
-
500
-
Internal Server Error
-
We apologize for the inconvenience. Please try again later
-
-
- );
-};
-
-export default FallBack;
diff --git a/src/pages/intro/useIntro.tsx b/src/pages/intro/useIntro.tsx
index 764fd6483..bf4059f74 100644
--- a/src/pages/intro/useIntro.tsx
+++ b/src/pages/intro/useIntro.tsx
@@ -1,17 +1,54 @@
-import { useState } from 'react';
+import { App } from '@capacitor/app';
+import { Browser } from '@capacitor/browser';
+import { Capacitor } from '@capacitor/core';
+import { useState, useEffect } from 'react';
import { useSelector } from 'react-redux';
+import { useNavigate } from 'react-router-dom';
import { config } from 'src/config';
import { getAuthUrlAdaptor } from 'src/core/adaptors';
import { RootState } from 'src/store';
export const useIntro = () => {
+ const platform = Capacitor.getPlatform();
+
const status = useSelector((state: RootState) => state.identity.status);
const [selectedOnboarding, setSelectedOnboarding] = useState<'user' | 'organization'>('user');
+ const navigate = useNavigate();
+
+ useEffect(() => {
+ let listener: any;
+
+ const setupListener = async () => {
+ listener = await App.addListener('appUrlOpen', async data => {
+ const url = data.url;
+
+ if (url.includes('oauth/socious')) {
+ await Browser.close();
+
+ const urlObj = new URL(url);
+ const path = urlObj.pathname + urlObj.search;
+
+ navigate(path);
+ }
+ });
+ };
+
+ platform !== 'web' && setupListener();
+
+ return () => {
+ if (listener) {
+ listener.remove();
+ }
+ };
+ }, [navigate]);
const onContinue = async () => {
const { error, data } = await getAuthUrlAdaptor(config.appBaseURL + 'oauth/socious');
if (error) return;
- if (data) window.location.href = data.url;
+ if (data) {
+ if (platform === 'web') window.location.href = data.url;
+ else await Browser.open({ url: data.url });
+ }
};
return {
diff --git a/src/pages/oauth/socious.tsx b/src/pages/oauth/socious.tsx
index 8ccd20d2d..e313557b7 100644
--- a/src/pages/oauth/socious.tsx
+++ b/src/pages/oauth/socious.tsx
@@ -1,3 +1,4 @@
+import { Capacitor } from '@capacitor/core';
import { useEffect } from 'react';
import { useNavigate, useSearchParams } from 'react-router-dom';
import { config } from 'src/config';
@@ -11,6 +12,7 @@ export const SociousID = () => {
const [searchParams] = useSearchParams();
const code = searchParams.get('code');
const identityId = searchParams.get('identity_id');
+ const platform = Capacitor.getPlatform();
const fetchAuthURL = async () => {
const { error, data } = await getAuthUrlAdaptor(config.appBaseURL + 'oauth/socious');
@@ -57,7 +59,7 @@ export const SociousID = () => {
const redirectToAuthURL = async () => {
const authURL = await fetchAuthURL();
- if (authURL) {
+ if (authURL && platform === 'web') {
window.location.href = authURL;
}
};
diff --git a/src/pages/refer/index.tsx b/src/pages/refer/index.tsx
index bbb8bc564..4a65d4583 100644
--- a/src/pages/refer/index.tsx
+++ b/src/pages/refer/index.tsx
@@ -20,15 +20,15 @@ export const Refer = () => {
verificationStatus === 'PENDING' && type === 'organizations' ? (
) : (
)
@@ -36,15 +36,15 @@ export const Refer = () => {
!hideVerifyBanner && (
)
@@ -52,19 +52,19 @@ export const Refer = () => {
- {translate('referral-header')}
+ {translate('refer-header')}
- {translate('referral-title')}
+ {translate('refer-title')}
- {translate('referral-subtitle')}
+ {translate('refer-subtitle')}
{
+ const navigate = useNavigate();
+ const [searchParams] = useSearchParams();
+ const code = searchParams.get('code');
+ const referredBy = searchParams.get('referred_by') || '';
+ const identityId = searchParams.get('identity_id');
+
+ const fetchAuthURL = async () => {
+ const { error, data } = await getAuthUrlAdaptor(config.appBaseURL + '/oauth/socious');
+ if (error) return;
+ else if (data) return data.url;
+ };
+
+ async function onLoginSucceed(loginRes: AuthRes) {
+ await setAuthParams(loginRes, true);
+ if (typeof identityId === 'string') switchAccount(identityId);
+ navigate('/');
+ return loginRes;
+ }
+
+ useEffect(() => {
+ const handleSociousOauth = async (authCode: string) => {
+ const { error, data } = await sociousOauthAdaptor(authCode);
+ if (error) navigate('/intro');
+ else if (data) onLoginSucceed(data);
+ };
+
+ const redirectToAuthURL = async () => {
+ const authURL = await fetchAuthURL();
+ if (authURL) {
+ const url = new URL(authURL);
+ url.searchParams.set('auth_mode', 'register');
+ url.searchParams.set('referred_by', referredBy);
+ window.location.href = url.toString();
+ }
+ };
+
+ if (!code) {
+ redirectToAuthURL();
+ return;
+ }
+
+ handleSociousOauth(code);
+ }, [code]);
+
+ return (
+
+
+
+
{translate('refer-invited')}
+
+ @{referredBy}
+
+ {translate('refer-who-invited')}
+
+ {translate('refer-register')}
+
+
+
+ {translate('refer-redirect')}
+
+
+
+ );
+};
diff --git a/src/pages/userProfile/index.tsx b/src/pages/userProfile/index.tsx
index 4c4bb3d22..00e51acee 100644
--- a/src/pages/userProfile/index.tsx
+++ b/src/pages/userProfile/index.tsx
@@ -6,11 +6,11 @@ import css from './userProfile.module.scss';
import { useUserProfile } from './useUserProfile';
export const UserProfile = () => {
- const { tabs, activeTabIndex } = useUserProfile();
+ const { tabs, activeTabIndex, userTags } = useUserProfile();
return (
-
+
diff --git a/src/pages/userProfile/useUserProfile.tsx b/src/pages/userProfile/useUserProfile.tsx
index bcd81b6ec..04be31541 100644
--- a/src/pages/userProfile/useUserProfile.tsx
+++ b/src/pages/userProfile/useUserProfile.tsx
@@ -10,8 +10,9 @@ import { setIdentity, setIdentityType } from 'src/store/reducers/profile.reducer
export const useUserProfile = () => {
const { hash } = useLocation();
const dispatch = useDispatch();
- const { user } = useLoaderData() as {
+ const { user, userTags } = useLoaderData() as {
user: UserProfile;
+ userTags: string[];
};
dispatch(setIdentity(user));
@@ -30,5 +31,5 @@ export const useUserProfile = () => {
'#services': 1,
};
- return { tabs, activeTabIndex: activeTabIndex[hash] || 0 };
+ return { tabs, activeTabIndex: activeTabIndex[hash] || 0, userTags };
};
diff --git a/src/store/index.ts b/src/store/index.ts
index 2bcdc97f4..59cce42c0 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -8,6 +8,7 @@ import { linkedInSlice } from './reducers/linkedin.reducer';
import { profileSlice } from './reducers/profile.reducer';
import { skillsSlice } from './reducers/skills.reducer';
import { spinnerSlice } from './reducers/spinner.reducer';
+import { walletSlice } from './reducers/wallet.reducer';
const store = configureStore({
reducer: {
@@ -19,11 +20,13 @@ const store = configureStore({
skills: skillsSlice.reducer,
events: eventsSlice.reducer,
linkedin: linkedInSlice.reducer,
+ wallet: walletSlice.reducer,
},
middleware: getDefaultMiddleware => {
return getDefaultMiddleware({
serializableCheck: {
- ignoredActions: ['modals/openModal'],
+ ignoredActions: ['modals/openModal', 'wallet/setWalletState'],
+ ignoredPaths: ['wallet.wallet', 'wallet.walletProvider'],
},
});
},
diff --git a/src/store/reducers/wallet.reducer.ts b/src/store/reducers/wallet.reducer.ts
new file mode 100644
index 000000000..b8eb34a15
--- /dev/null
+++ b/src/store/reducers/wallet.reducer.ts
@@ -0,0 +1,46 @@
+import { BrowserWallet } from '@meshsdk/core';
+import { createSlice, PayloadAction } from '@reduxjs/toolkit';
+import { BrowserProvider, Eip1193Provider, JsonRpcSigner } from 'ethers';
+
+export type WalletState = {
+ wallet: any | null;
+ walletProvider: Eip1193Provider | BrowserWallet | null;
+ provider: BrowserProvider | null;
+ signer: JsonRpcSigner | null;
+ account: string;
+ chainId: number | null;
+ connected: boolean;
+ network: any;
+ networkName: string;
+ testnet: boolean;
+ balance: { symbol: string; value: number } | null;
+};
+
+const initialState: WalletState = {
+ wallet: null,
+ walletProvider: null,
+ provider: null,
+ signer: null,
+ account: '',
+ chainId: null,
+ connected: false,
+ network: null,
+ networkName: '',
+ testnet: false,
+ balance: null,
+};
+
+export const walletSlice = createSlice({
+ name: 'wallet',
+ initialState,
+ reducers: {
+ setWalletState(state, action: PayloadAction
>) {
+ return { ...state, ...action.payload };
+ },
+ resetWalletState() {
+ return initialState;
+ },
+ },
+});
+
+export const { setWalletState, resetWalletState } = walletSlice.actions;
diff --git a/tsconfig.json b/tsconfig.json
index ada16f581..5d0699278 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -19,7 +19,15 @@
"noEmit": true,
"jsx": "react-jsx"
},
- "include": ["cypress", "src", "**/*.ts", "**/*.tsx", "tailwind.config.js", "postcss.config.js"],
+ "include": [
+ "cypress",
+ "src",
+ "**/*.ts",
+ "**/*.tsx",
+ "tailwind.config.js",
+ "postcss.config.js",
+ "generate-languages.js"
+ ],
"typesOnlyInclude": ["**/*.d.ts", "tailwind.config.js", "postcss.config.js"],
"exclude": ["node_modules", "vite.config.ts"],
"references": [{ "path": "./tsconfig.node.json" }]