From 54149cf77a6fb0c5cf9bfc86d2dc5fa1cebdc55f Mon Sep 17 00:00:00 2001 From: Charles Garrett Date: Tue, 12 Sep 2023 10:10:45 -0400 Subject: [PATCH 001/142] fix: update to wallet supported method: verifyOwner --- src/components/vm/VmInitializer.tsx | 15 +++------------ 1 file changed, 3 insertions(+), 12 deletions(-) diff --git a/src/components/vm/VmInitializer.tsx b/src/components/vm/VmInitializer.tsx index 354d5e158..9defd79bb 100644 --- a/src/components/vm/VmInitializer.tsx +++ b/src/components/vm/VmInitializer.tsx @@ -127,20 +127,11 @@ export default function VmInitializer() { }); if (signedMessage) { - const verifiedSignature = wallet.verifySignature({ - message, - nonce, - recipient, - publicKey: signedMessage.publicKey, - signature: signedMessage.signature, - }); - const verifiedFullKeyBelongsToUser = await wallet.verifyFullKeyBelongsToUser({ - publicKey: signedMessage.publicKey, - accountId: signedMessage.accountId, - network: wallet.selector.options.network, + const verifiedFullKeyBelongsToUser = await wallet.verifyOwner({ + message: signedMessage, }); - if (verifiedFullKeyBelongsToUser && verifiedSignature) { + if (verifiedFullKeyBelongsToUser) { alert(`Successfully verify signed message: '${message}': \n ${JSON.stringify(signedMessage)}`); } else { alert(`Failed to verify signed message '${message}': \n ${JSON.stringify(signedMessage)}`); From b41a496530278286e081d78c7f3136d4aaa04977 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:43:00 +0200 Subject: [PATCH 002/142] Create setProcessSuccess function --- src/utils/notifications.ts | 20 +++++++++++++------- 1 file changed, 13 insertions(+), 7 deletions(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 90f2d7432..4b84fc468 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -1,5 +1,6 @@ const applicationServerKey = ''; const HOST = '/subscriptions/create'; +const NOTIFICATIONS_STORAGE = 'push-notifications-v0'; export const isNotificationSupported = () => typeof window !== 'undefined' && 'Notification' in window; @@ -31,11 +32,16 @@ export const handleTurnOn = async (accountId: string) => { return; } - await handleRequestPermission(); - await registerServiceWorker(); - const subscription = await handlePushManagerSubscribe(); - await sendToPushServer({ - subscription, - accountId, - }); +}; + +const setProcessSuccess = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + permission: true, + subscribeStarted: false, + subscribeError: '', + }), + ); }; From bc2df8ee846832235d84a989bf4aa73844055226 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:43:20 +0200 Subject: [PATCH 003/142] Create setProcessError function --- src/utils/notifications.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 4b84fc468..1b3727534 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -45,3 +45,15 @@ const setProcessSuccess = () => { }), ); }; + +const setProcessError = (error) => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + permission: false, + subscribeStarted: false, + subscribeError: error, + }), + ); +}; From 06d8c26705457b071c860fe5d4ed25400231b50b Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:43:34 +0200 Subject: [PATCH 004/142] Create setProcessEnded function --- src/utils/notifications.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 1b3727534..a9c1f7098 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -57,3 +57,13 @@ const setProcessError = (error) => { }), ); }; + +const setProcessEnded = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + subscribeStarted: false, + }), + ); +}; From 1cff2ee0c9c06ca49cbd6dfc8163d1afbbdc748c Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:43:48 +0200 Subject: [PATCH 005/142] Create setProcessStarted function --- src/utils/notifications.ts | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index a9c1f7098..19f7b32b5 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -67,3 +67,14 @@ const setProcessEnded = () => { }), ); }; + +const setProcessStarted = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + permission: false, + subscribeStarted: true, + }), + ); +}; From d73b8384cce99e381cb5831aec42f221b9f4398b Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:44:05 +0200 Subject: [PATCH 006/142] Create setNotificationsSessionStorage function --- src/utils/notifications.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 19f7b32b5..7ef2fc125 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -78,3 +78,15 @@ const setProcessStarted = () => { }), ); }; + +export const setNotificationsSessionStorage = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + isNotificationSupported: isNotificationSupported(), + isPushManagerSupported: isPushManagerSupported(), + isPermisionGranted: isPermisionGranted(), + }), + ); +}; From c0f459ef68fba620ac800cca6cae4680280ba98f Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:44:18 +0200 Subject: [PATCH 007/142] Create handleOnCancel function --- src/utils/notifications.ts | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 7ef2fc125..108bb536f 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -90,3 +90,14 @@ export const setNotificationsSessionStorage = () => { }), ); }; + +export const handleOnCancel = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + showOnTS: Date.now() + 86400000, // 14 days + notNowTS: Date.now(), + }), + ); +}; From 8593e48d52daa6c7e3e09cef23532d24957eb921 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:44:47 +0200 Subject: [PATCH 008/142] Create getNotificationLocalStorage and showNotificationModal functions --- src/utils/notifications.ts | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 108bb536f..5b2f85f1b 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -101,3 +101,19 @@ export const handleOnCancel = () => { }), ); }; + +const getNotificationLocalStorage = () => JSON.parse(localStorage.getItem(NOTIFICATIONS_STORAGE) || '{}'); + +export const showNotificationModal = () => { + if (isPermisionGranted()) { + return false; + } + + const state = getNotificationLocalStorage(); + + if ((isLocalStorageSupported() && !state.showOnTS) || state.showOnTS < Date.now()) { + return true; + } + + return false; +}; From 7e0718c64bc9f7fc5eb099a254dad77d3d7216a4 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:45:55 +0200 Subject: [PATCH 009/142] Implement handleTurnOn logic --- src/utils/notifications.ts | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 5b2f85f1b..fb3516b03 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -32,6 +32,13 @@ export const handleTurnOn = async (accountId: string) => { return; } + await handleRequestPermission(); + await registerServiceWorker(); + const subscription = await handlePushManagerSubscribe(); + await sendToPushServer({ + subscription, + accountId, + }); }; const setProcessSuccess = () => { From e102e036b946f08e646fa7c6592f2212dbdc7b71 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:46:22 +0200 Subject: [PATCH 010/142] Handle error and subscription state --- src/utils/notifications.ts | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index fb3516b03..36c3900dd 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -27,11 +27,14 @@ const sendToPushServer = (subscriptionData: object) => body: JSON.stringify(subscriptionData), }); -export const handleTurnOn = async (accountId: string) => { +export const handleTurnOn = async (accountId: string, hideModal) => { if (!isNotificationSupported() && !isPushManagerSupported() && isPermisionGranted()) { return; } + try { + setProcessStarted(); + await handleRequestPermission(); await registerServiceWorker(); const subscription = await handlePushManagerSubscribe(); @@ -39,6 +42,14 @@ export const handleTurnOn = async (accountId: string) => { subscription, accountId, }); + + setProcessSuccess(); + } catch (error) { + setProcessError(error); + } finally { + hideModal(); + setProcessEnded(); + } }; const setProcessSuccess = () => { From 18f887c6907b4aa8f21685616e348aa7cb16a92b Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 16:46:40 +0200 Subject: [PATCH 011/142] Create isLocalStorageSupported function --- src/utils/notifications.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 36c3900dd..022589e94 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -6,7 +6,9 @@ export const isNotificationSupported = () => typeof window !== 'undefined' && 'N export const isPushManagerSupported = () => typeof window !== 'undefined' && 'PushManager' in window; -export const isPermisionGranted = () => Notification.permission === 'granted'; +export const isPermisionGranted = () => typeof Notification !== 'undefined' && Notification.permission === 'granted'; + +export const isLocalStorageSupported = () => typeof localStorage !== 'undefined'; const handleRequestPermission = () => Notification.requestPermission(); From 4712e7afef7165bee4ca75252f01def317f54a61 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 17:00:20 +0200 Subject: [PATCH 012/142] Create notifications local storage file --- src/utils/notificationsLocalStorage.ts | 62 ++++++++++++++++++++++++++ 1 file changed, 62 insertions(+) create mode 100644 src/utils/notificationsLocalStorage.ts diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts new file mode 100644 index 000000000..805355d63 --- /dev/null +++ b/src/utils/notificationsLocalStorage.ts @@ -0,0 +1,62 @@ +import { isNotificationSupported, isPermisionGranted, isPushManagerSupported } from './notificationsHelpers'; + +export const NOTIFICATIONS_STORAGE = 'push-notifications-v0'; + +export const setProcessSuccess = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + permission: true, + subscribeStarted: false, + subscribeError: '', + }), + ); +}; + +export const setProcessError = (error: unknown) => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + permission: false, + subscribeStarted: false, + subscribeError: error, + }), + ); +}; + +export const setProcessEnded = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + subscribeStarted: false, + }), + ); +}; + +export const setProcessStarted = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + permission: false, + subscribeStarted: true, + }), + ); +}; + +export const setNotificationsSessionStorage = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + isNotificationSupported: isNotificationSupported(), + isPushManagerSupported: isPushManagerSupported(), + isPermisionGranted: isPermisionGranted(), + }), + ); +}; + +export const getNotificationLocalStorage = () => JSON.parse(localStorage.getItem(NOTIFICATIONS_STORAGE) || '{}'); From a868fece18bbeba90a2115bc5f7bc6fa88a6ed67 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 17:00:25 +0200 Subject: [PATCH 013/142] Create notifications helpers file --- src/utils/notificationsHelpers.ts | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 src/utils/notificationsHelpers.ts diff --git a/src/utils/notificationsHelpers.ts b/src/utils/notificationsHelpers.ts new file mode 100644 index 000000000..d877cbfe4 --- /dev/null +++ b/src/utils/notificationsHelpers.ts @@ -0,0 +1,7 @@ +export const isNotificationSupported = () => typeof window !== 'undefined' && 'Notification' in window; + +export const isPushManagerSupported = () => typeof window !== 'undefined' && 'PushManager' in window; + +export const isPermisionGranted = () => typeof Notification !== 'undefined' && Notification.permission === 'granted'; + +export const isLocalStorageSupported = () => typeof localStorage !== 'undefined'; From fb2fc549d22476a56543663b9a268b50fd4be00b Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 17:01:54 +0200 Subject: [PATCH 014/142] Refactor notifications utils --- src/utils/notifications.ts | 85 +++++++------------------------------- 1 file changed, 16 insertions(+), 69 deletions(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 022589e94..5766efda7 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -1,14 +1,20 @@ +import { + isLocalStorageSupported, + isNotificationSupported, + isPermisionGranted, + isPushManagerSupported, +} from './notificationsHelpers'; +import { + getNotificationLocalStorage, + NOTIFICATIONS_STORAGE, + setProcessEnded, + setProcessError, + setProcessStarted, + setProcessSuccess, +} from './notificationsLocalStorage'; + const applicationServerKey = ''; const HOST = '/subscriptions/create'; -const NOTIFICATIONS_STORAGE = 'push-notifications-v0'; - -export const isNotificationSupported = () => typeof window !== 'undefined' && 'Notification' in window; - -export const isPushManagerSupported = () => typeof window !== 'undefined' && 'PushManager' in window; - -export const isPermisionGranted = () => typeof Notification !== 'undefined' && Notification.permission === 'granted'; - -export const isLocalStorageSupported = () => typeof localStorage !== 'undefined'; const handleRequestPermission = () => Notification.requestPermission(); @@ -46,7 +52,7 @@ export const handleTurnOn = async (accountId: string, hideModal) => { }); setProcessSuccess(); - } catch (error) { + } catch (error: unknown) { setProcessError(error); } finally { hideModal(); @@ -54,63 +60,6 @@ export const handleTurnOn = async (accountId: string, hideModal) => { } }; -const setProcessSuccess = () => { - localStorage.setItem( - NOTIFICATIONS_STORAGE, - JSON.stringify({ - ...getNotificationLocalStorage(), - permission: true, - subscribeStarted: false, - subscribeError: '', - }), - ); -}; - -const setProcessError = (error) => { - localStorage.setItem( - NOTIFICATIONS_STORAGE, - JSON.stringify({ - ...getNotificationLocalStorage(), - permission: false, - subscribeStarted: false, - subscribeError: error, - }), - ); -}; - -const setProcessEnded = () => { - localStorage.setItem( - NOTIFICATIONS_STORAGE, - JSON.stringify({ - ...getNotificationLocalStorage(), - subscribeStarted: false, - }), - ); -}; - -const setProcessStarted = () => { - localStorage.setItem( - NOTIFICATIONS_STORAGE, - JSON.stringify({ - ...getNotificationLocalStorage(), - permission: false, - subscribeStarted: true, - }), - ); -}; - -export const setNotificationsSessionStorage = () => { - localStorage.setItem( - NOTIFICATIONS_STORAGE, - JSON.stringify({ - ...getNotificationLocalStorage(), - isNotificationSupported: isNotificationSupported(), - isPushManagerSupported: isPushManagerSupported(), - isPermisionGranted: isPermisionGranted(), - }), - ); -}; - export const handleOnCancel = () => { localStorage.setItem( NOTIFICATIONS_STORAGE, @@ -122,8 +71,6 @@ export const handleOnCancel = () => { ); }; -const getNotificationLocalStorage = () => JSON.parse(localStorage.getItem(NOTIFICATIONS_STORAGE) || '{}'); - export const showNotificationModal = () => { if (isPermisionGranted()) { return false; From 880e47555729360d4e855fbe50e2f3ee6d4730fe Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 17:08:10 +0200 Subject: [PATCH 015/142] Fix type --- src/utils/notifications.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 5766efda7..1d5df5ac5 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -35,7 +35,7 @@ const sendToPushServer = (subscriptionData: object) => body: JSON.stringify(subscriptionData), }); -export const handleTurnOn = async (accountId: string, hideModal) => { +export const handleTurnOn = async (accountId: string, hideModal: () => void) => { if (!isNotificationSupported() && !isPushManagerSupported() && isPermisionGranted()) { return; } From e1281e95e67ea0180b51aa90dbfaedcabe69f16b Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 17:36:12 +0200 Subject: [PATCH 016/142] Set browser settings in local storage --- src/pages/_app.tsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 2341d512c..152c8dbdd 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -19,6 +19,7 @@ import { useHashUrlBackwardsCompatibility } from '@/hooks/useHashUrlBackwardsCom import { usePageAnalytics } from '@/hooks/usePageAnalytics'; import { useAuthStore } from '@/stores/auth'; import { init as initializeAnalytics } from '@/utils/analytics'; +import { setNotificationsSessionStorage } from '@/utils/notificationsLocalStorage'; import type { NextPageWithLayout } from '@/utils/types'; import { styleZendesk } from '@/utils/zendesk'; @@ -40,6 +41,10 @@ export default function App({ Component, pageProps }: AppPropsWithLayout) { const authStore = useAuthStore(); const componentSrc = router.query; + useEffect(() => { + setNotificationsSessionStorage(); + }, []); + useEffect(() => { initializeAnalytics(); }, []); From 146164a318e3dc9bc0c814127f8103d7f2525e43 Mon Sep 17 00:00:00 2001 From: Evgeny Kuzyakov Date: Thu, 14 Sep 2023 09:49:57 -0700 Subject: [PATCH 017/142] chore: Bump VM version to 2.4.1 --- package.json | 2 +- pnpm-lock.yaml | 63 +++++++++++++++++++++++++++++++++++--------------- 2 files changed, 46 insertions(+), 19 deletions(-) diff --git a/package.json b/package.json index 8da1c3ec8..62457c4e7 100644 --- a/package.json +++ b/package.json @@ -55,7 +55,7 @@ "local-storage": "^2.0.0", "lodash": "^4.17.21", "near-api-js": "2.1.3", - "near-social-vm": "github:NearSocial/VM#2.3.2", + "near-social-vm": "github:NearSocial/VM#2.4.1", "next": "13.3.4", "prettier": "^2.7.1", "react": "18.2.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 38ad2d719..8c613023d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,5 +1,9 @@ lockfileVersion: '6.0' +settings: + autoInstallPeers: true + excludeLinksFromLockfile: false + dependencies: '@braintree/sanitize-url': specifier: 6.0.0 @@ -122,8 +126,8 @@ dependencies: specifier: 2.1.3 version: 2.1.3 near-social-vm: - specifier: github:NearSocial/VM#2.3.2 - version: github.com/NearSocial/VM/901945dddea1e9e81f42e9d60b00ac9d3c1e9909(@popperjs/core@2.11.8)(@types/react-dom@18.2.1)(@types/react@18.2.0)(near-api-js@2.1.3)(prop-types@15.8.1)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0) + specifier: github:NearSocial/VM#2.4.1 + version: github.com/NearSocial/VM/8cdb3193c614bb64eb6a97c1cfd246e749ab17a1(@popperjs/core@2.11.8)(@types/react-dom@18.2.1)(@types/react@18.2.0)(near-api-js@2.1.3)(prop-types@15.8.1)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0) next: specifier: 13.3.4 version: 13.3.4(react-dom@18.2.0)(react@18.2.0) @@ -4625,7 +4629,6 @@ packages: typescript: 5.0.4 transitivePeerDependencies: - supports-color - dev: true /@typescript-eslint/scope-manager@5.59.5: resolution: {integrity: sha512-jVecWwnkX6ZgutF+DovbBJirZcAxgxC0EOHYt/niMROf8p4PwxxG32Qdhj/iIQQIuOflLjNkxoXyArkcIP7C3A==} @@ -4640,7 +4643,6 @@ packages: dependencies: '@typescript-eslint/types': 5.62.0 '@typescript-eslint/visitor-keys': 5.62.0 - dev: true /@typescript-eslint/type-utils@5.59.5(eslint@8.39.0)(typescript@5.0.4): resolution: {integrity: sha512-4eyhS7oGym67/pSxA2mmNq7X164oqDYNnZCUayBwJZIRVvKpBCMBzFnFxjeoDeShjtO6RQBHBuwybuX3POnDqg==} @@ -4669,7 +4671,6 @@ packages: /@typescript-eslint/types@5.62.0: resolution: {integrity: sha512-87NVngcbVXUahrRTqIK27gD2t5Cu1yuCXxbLcFtCzZGlfyVWWh8mLHkoxzjsB6DDNnvdL+fW8MiwPEJyGJQDgQ==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} - dev: true /@typescript-eslint/typescript-estree@5.59.5(typescript@5.0.4): resolution: {integrity: sha512-+XXdLN2CZLZcD/mO7mQtJMvCkzRfmODbeSKuMY/yXbGkzvA9rJyDY5qDYNoiz2kP/dmyAxXquL2BvLQLJFPQIg==} @@ -4710,7 +4711,6 @@ packages: typescript: 5.0.4 transitivePeerDependencies: - supports-color - dev: true /@typescript-eslint/utils@5.59.5(eslint@8.39.0)(typescript@5.0.4): resolution: {integrity: sha512-sCEHOiw+RbyTii9c3/qN74hYDPNORb8yWCoPLmB7BIflhplJ65u2PBpdRla12e3SSTJ2erRkPjz7ngLHhUegxA==} @@ -4745,7 +4745,6 @@ packages: dependencies: '@typescript-eslint/types': 5.62.0 eslint-visitor-keys: 3.4.3 - dev: true /@walletconnect/browser-utils@1.8.0: resolution: {integrity: sha512-Wcqqx+wjxIo9fv6eBUFHPsW1y/bGWWRboni5dfD8PtOmrihrEpOCmvRJe4rfl7xgJW8Ea9UqKEaq0bIRLHlK4A==} @@ -6349,7 +6348,7 @@ packages: eslint: 8.39.0 eslint-import-resolver-node: 0.3.7 eslint-import-resolver-typescript: 3.5.5(@typescript-eslint/parser@5.59.5)(eslint-import-resolver-node@0.3.7)(eslint-plugin-import@2.27.5)(eslint@8.39.0) - eslint-plugin-import: 2.27.5(@typescript-eslint/parser@5.59.5)(eslint-import-resolver-typescript@3.5.5)(eslint@8.39.0) + eslint-plugin-import: 2.27.5(@typescript-eslint/parser@5.62.0)(eslint@8.39.0) eslint-plugin-jsx-a11y: 6.7.1(eslint@8.39.0) eslint-plugin-react: 7.32.2(eslint@8.39.0) eslint-plugin-react-hooks: 4.6.0(eslint@8.39.0) @@ -6389,7 +6388,7 @@ packages: enhanced-resolve: 5.14.0 eslint: 8.39.0 eslint-module-utils: 2.8.0(@typescript-eslint/parser@5.59.5)(eslint-import-resolver-node@0.3.7)(eslint-import-resolver-typescript@3.5.5)(eslint@8.39.0) - eslint-plugin-import: 2.27.5(@typescript-eslint/parser@5.59.5)(eslint-import-resolver-typescript@3.5.5)(eslint@8.39.0) + eslint-plugin-import: 2.27.5(@typescript-eslint/parser@5.62.0)(eslint@8.39.0) get-tsconfig: 4.5.0 globby: 13.1.4 is-core-module: 2.12.0 @@ -6432,7 +6431,36 @@ packages: - supports-color dev: false - /eslint-plugin-import@2.27.5(@typescript-eslint/parser@5.59.5)(eslint-import-resolver-typescript@3.5.5)(eslint@8.39.0): + /eslint-module-utils@2.8.0(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-node@0.3.7)(eslint@8.39.0): + resolution: {integrity: sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==} + engines: {node: '>=4'} + peerDependencies: + '@typescript-eslint/parser': '*' + eslint: '*' + eslint-import-resolver-node: '*' + eslint-import-resolver-typescript: '*' + eslint-import-resolver-webpack: '*' + peerDependenciesMeta: + '@typescript-eslint/parser': + optional: true + eslint: + optional: true + eslint-import-resolver-node: + optional: true + eslint-import-resolver-typescript: + optional: true + eslint-import-resolver-webpack: + optional: true + dependencies: + '@typescript-eslint/parser': 5.62.0(eslint@8.39.0)(typescript@5.0.4) + debug: 3.2.7 + eslint: 8.39.0 + eslint-import-resolver-node: 0.3.7 + transitivePeerDependencies: + - supports-color + dev: false + + /eslint-plugin-import@2.27.5(@typescript-eslint/parser@5.62.0)(eslint@8.39.0): resolution: {integrity: sha512-LmEt3GVofgiGuiE+ORpnvP+kAm3h6MLZJ4Q5HCyHADofsb4VzXFsRiWj3c0OFiV+3DWFh0qg3v9gcPlfc3zRow==} engines: {node: '>=4'} peerDependencies: @@ -6442,7 +6470,7 @@ packages: '@typescript-eslint/parser': optional: true dependencies: - '@typescript-eslint/parser': 5.59.5(eslint@8.39.0)(typescript@5.0.4) + '@typescript-eslint/parser': 5.62.0(eslint@8.39.0)(typescript@5.0.4) array-includes: 3.1.6 array.prototype.flat: 1.3.1 array.prototype.flatmap: 1.3.1 @@ -6450,7 +6478,7 @@ packages: doctrine: 2.1.0 eslint: 8.39.0 eslint-import-resolver-node: 0.3.7 - eslint-module-utils: 2.8.0(@typescript-eslint/parser@5.59.5)(eslint-import-resolver-node@0.3.7)(eslint-import-resolver-typescript@3.5.5)(eslint@8.39.0) + eslint-module-utils: 2.8.0(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-node@0.3.7)(eslint@8.39.0) has: 1.0.3 is-core-module: 2.12.0 is-glob: 4.0.3 @@ -6553,7 +6581,6 @@ packages: /eslint-visitor-keys@3.4.3: resolution: {integrity: sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} - dev: true /eslint@8.39.0: resolution: {integrity: sha512-mwiok6cy7KTW7rBpo05k6+p4YVZByLNjAZ/ACB9DRCu4YDRwjXI01tWHp6KAUWelsBetTxKK/2sHB0vdS8Z2Og==} @@ -8707,6 +8734,7 @@ packages: /node-gyp-build-optional-packages@5.0.3: resolution: {integrity: sha512-k75jcVzk5wnnc/FMxsf4udAoTEUv2jY3ycfdSd3yWu6Cnd1oee6/CfZJApyscA4FJOmdoixWwiwOyf16RzD5JA==} hasBin: true + requiresBuild: true dev: false optional: true @@ -9717,7 +9745,6 @@ packages: hasBin: true dependencies: lru-cache: 6.0.0 - dev: true /set-blocking@2.0.0: resolution: {integrity: sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==} @@ -10709,11 +10736,11 @@ packages: resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==} dev: false - github.com/NearSocial/VM/901945dddea1e9e81f42e9d60b00ac9d3c1e9909(@popperjs/core@2.11.8)(@types/react-dom@18.2.1)(@types/react@18.2.0)(near-api-js@2.1.3)(prop-types@15.8.1)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0): - resolution: {tarball: https://codeload.github.com/NearSocial/VM/tar.gz/901945dddea1e9e81f42e9d60b00ac9d3c1e9909} - id: github.com/NearSocial/VM/901945dddea1e9e81f42e9d60b00ac9d3c1e9909 + github.com/NearSocial/VM/8cdb3193c614bb64eb6a97c1cfd246e749ab17a1(@popperjs/core@2.11.8)(@types/react-dom@18.2.1)(@types/react@18.2.0)(near-api-js@2.1.3)(prop-types@15.8.1)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0): + resolution: {tarball: https://codeload.github.com/NearSocial/VM/tar.gz/8cdb3193c614bb64eb6a97c1cfd246e749ab17a1} + id: github.com/NearSocial/VM/8cdb3193c614bb64eb6a97c1cfd246e749ab17a1 name: near-social-vm - version: 2.3.2 + version: 2.4.1 peerDependencies: near-api-js: 2.1.3 react: ^18.2.0 From 440979341419f6902ec936629009027561eaebfc Mon Sep 17 00:00:00 2001 From: Isha <131987812+Ishatt@users.noreply.github.com> Date: Mon, 18 Sep 2023 10:48:05 -0400 Subject: [PATCH 018/142] Create main.yml Move to next sprint --- .github/workflows/main.yml | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) create mode 100644 .github/workflows/main.yml diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml new file mode 100644 index 000000000..8a0c8d1d9 --- /dev/null +++ b/.github/workflows/main.yml @@ -0,0 +1,20 @@ +on: + schedule: + # Runs "at 05:00, only on Sunday" + - cron: '0 5 * * 1' + +jobs: + move-to-next-iteration: + name: Move to next iteration + runs-on: ubuntu-latest + + steps: + - uses: blombard/move-to-next-iteration@master + with: + owner: near + number: 92 + token: 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 + iteration-field: sprint + iteration: last + new-iteration: current + statuses: No status,Selected,Blocked,In Progress,review From 2300ebff15342454bb3d3f9c216753f9c68c3e38 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 17:15:50 +0200 Subject: [PATCH 019/142] Handle show modal state --- src/pages/index.tsx | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 8d83490ef..33013d8ee 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -10,6 +10,7 @@ import { useBosComponents } from '@/hooks/useBosComponents'; import { useDefaultLayout } from '@/hooks/useLayout'; import { useAuthStore } from '@/stores/auth'; import { useCurrentComponentStore } from '@/stores/current-component'; +import { handleOnCancel, handleTurnOn, showNotificationModal } from '@/utils/notifications'; import type { NextPageWithLayout } from '@/utils/types'; const LS_ACCOUNT_ID = 'near-social-vm:v01::accountId:'; @@ -22,6 +23,16 @@ const HomePage: NextPageWithLayout = () => { const setComponentSrc = useCurrentComponentStore((store) => store.setSrc); const authStore = useAuthStore(); const [componentProps, setComponentProps] = useState>({}); + const [showNotificationModalState, setShowNotificationModalState] = useState(false); + const accountId = useAuthStore((store) => store.accountId); + + useEffect(() => { + if (!signedIn) { + return; + } + + setShowNotificationModalState(showNotificationModal()); + }, [signedIn]); useEffect(() => { const optimisticAccountId = window.localStorage.getItem(LS_ACCOUNT_ID); From 063b8037d1a4a443958dc2ae993e036193a09c32 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 17:16:26 +0200 Subject: [PATCH 020/142] Show notifications modal --- src/pages/index.tsx | 30 +++++++++++++++++++++--------- 1 file changed, 21 insertions(+), 9 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 33013d8ee..3fb88ccd8 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -69,15 +69,27 @@ const HomePage: NextPageWithLayout = () => { if (signedIn || signedInOptimistic) { return ( - + <> + + + ); } From 9fce09690f0a92e5aaef1c000255d3aa14e0f70c Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 17:16:48 +0200 Subject: [PATCH 021/142] handleTurnOn --- src/pages/index.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 3fb88ccd8..1a05fa667 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -74,6 +74,10 @@ const HomePage: NextPageWithLayout = () => { src="near/widget/NearOrg.Notifications.NotificationAlert" props={{ open: showNotificationModalState, + handleTurnOn: () => + handleTurnOn(accountId, () => { + setShowNotificationModalState(false); + }), isNotificationSupported, isPermisionGranted, isPushManagerSupported, From 36a8d66165e3bc07ab390fa4c9e6df238c1d92c8 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 13 Sep 2023 17:17:19 +0200 Subject: [PATCH 022/142] handleOnCancel --- src/pages/index.tsx | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 1a05fa667..aa6a3c006 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -6,11 +6,14 @@ import { openToast } from '@/components/lib/Toast'; import { MetaTags } from '@/components/MetaTags'; import { ComponentWrapperPage } from '@/components/near-org/ComponentWrapperPage'; import { NearOrgHomePage } from '@/components/near-org/NearOrg.HomePage'; +import { VmComponent } from '@/components/vm/VmComponent'; import { useBosComponents } from '@/hooks/useBosComponents'; import { useDefaultLayout } from '@/hooks/useLayout'; import { useAuthStore } from '@/stores/auth'; import { useCurrentComponentStore } from '@/stores/current-component'; import { handleOnCancel, handleTurnOn, showNotificationModal } from '@/utils/notifications'; +import { isNotificationSupported, isPermisionGranted, isPushManagerSupported } from '@/utils/notificationsHelpers'; +import { setNotificationsSessionStorage } from '@/utils/notificationsLocalStorage'; import type { NextPageWithLayout } from '@/utils/types'; const LS_ACCOUNT_ID = 'near-social-vm:v01::accountId:'; @@ -78,6 +81,10 @@ const HomePage: NextPageWithLayout = () => { handleTurnOn(accountId, () => { setShowNotificationModalState(false); }), + handleOnCancel: () => { + handleOnCancel(); + setShowNotificationModalState(false); + }, isNotificationSupported, isPermisionGranted, isPushManagerSupported, From 320699c83ddd04abd6ed619d275e4ddc5b944b9c Mon Sep 17 00:00:00 2001 From: Marcin Bodnar <36210360+marcinbodnar@users.noreply.github.com> Date: Mon, 18 Sep 2023 17:50:19 +0200 Subject: [PATCH 023/142] Update src/pages/index.tsx Co-authored-by: Dmitriy <34593263+shelegdmitriy@users.noreply.github.com> --- src/pages/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index aa6a3c006..345575ba4 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -74,7 +74,7 @@ const HomePage: NextPageWithLayout = () => { return ( <> From 7734c411a6677120c170248b276e4e7bc1ba916c Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 21:59:43 +0200 Subject: [PATCH 024/142] Add install and ecticagte event listeners --- public/service-worker.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index e69de29bb..7815dcd90 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -0,0 +1,5 @@ + +self.addEventListener('install', (event) => console.log('SW - installing in progress.', event)); + +self.addEventListener('activate', (event) => console.log('SW - activateing in progress.', event)); + From 2ebd3f74259b0f4a864b8ca7c04e8f002fe94651 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:00:05 +0200 Subject: [PATCH 025/142] Create getOptions function --- public/service-worker.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 7815dcd90..05b7edfff 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -3,3 +3,13 @@ self.addEventListener('install', (event) => console.log('SW - installing in prog self.addEventListener('activate', (event) => console.log('SW - activateing in progress.', event)); + +const getOptions = ({ path, id }) => ({ + body: '', + icon: './favicon.png', + tag: id, + timestamp: Date.now(), + data: { + path, // TODO: at this step change to full url + }, +}); From 3158be3647e840da546df08055f1a88701d45872 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:00:46 +0200 Subject: [PATCH 026/142] Create notification schema for like --- public/service-worker.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 05b7edfff..6637de7d1 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -3,6 +3,15 @@ self.addEventListener('install', (event) => console.log('SW - installing in prog self.addEventListener('activate', (event) => console.log('SW - activateing in progress.', event)); +const NOTIFICATIONS_SCHEMA = { + like: { + title: (accountId) => `${accountId} liked your post`, + options: (props) => ({ + ...getOptions(props), + // optional + }), + }, +}; const getOptions = ({ path, id }) => ({ body: '', From b725473c3e4e1b7f134bcdb68428e8ef54ce33fd Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:00:56 +0200 Subject: [PATCH 027/142] Create notification schema for fork --- public/service-worker.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 6637de7d1..06d6cb67c 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -11,6 +11,13 @@ const NOTIFICATIONS_SCHEMA = { // optional }), }, + fork: { + title: (accountId) => `${accountId} forked your component`, + options: (props) => ({ + ...getOptions(props), + // optional + }), + }, }; const getOptions = ({ path, id }) => ({ From 4efc3db80acd63f1ba2c533620d6e511add1f36c Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:01:12 +0200 Subject: [PATCH 028/142] Create notification schema for replyComponent --- public/service-worker.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 06d6cb67c..0a6e5e6c8 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -18,6 +18,13 @@ const NOTIFICATIONS_SCHEMA = { // optional }), }, + replyComponent: { + title: (accountId) => `${accountId} replied to discussion on your component`, + options: (props) => ({ + ...getOptions(props), + // optional + }), + }, }; const getOptions = ({ path, id }) => ({ From 30983435627dcb4f1298e78b36e5f2e2344597a8 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:01:24 +0200 Subject: [PATCH 029/142] Create notification schema for follow --- public/service-worker.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 0a6e5e6c8..c8b08e7e5 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -25,6 +25,13 @@ const NOTIFICATIONS_SCHEMA = { // optional }), }, + follow: { + title: (accountId) => `${accountId} followed you`, + options: (props) => ({ + ...getOptions(props), + // optional + }), + }, }; const getOptions = ({ path, id }) => ({ From ba5f737e512442685c8682b06ee3c6386c189d31 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:01:36 +0200 Subject: [PATCH 030/142] Create notification schema for unfollow --- public/service-worker.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index c8b08e7e5..0df9324c9 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -32,6 +32,13 @@ const NOTIFICATIONS_SCHEMA = { // optional }), }, + unfollow: { + title: (accountId) => `${accountId} unfollowed you`, + options: (props) => ({ + ...getOptions(props), + // optional + }), + }, }; const getOptions = ({ path, id }) => ({ From e0365f9e13352cf7043581e589a88c242c319613 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:01:45 +0200 Subject: [PATCH 031/142] Create notification schema for replyPost --- public/service-worker.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 0df9324c9..23e0c0ac9 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -39,6 +39,13 @@ const NOTIFICATIONS_SCHEMA = { // optional }), }, + replyPost: { + title: (accountId) => `${accountId} replied to your post`, + options: (props) => ({ + ...getOptions(props), + // optional + }), + }, }; const getOptions = ({ path, id }) => ({ From 041c782b0c4279a91b4ae3eb859111b751d2e6d9 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:01:56 +0200 Subject: [PATCH 032/142] Create notification schema for mention --- public/service-worker.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 23e0c0ac9..bce5793ac 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -46,6 +46,13 @@ const NOTIFICATIONS_SCHEMA = { // optional }), }, + mention: { + title: (accountId) => `${accountId} mentioned you in their post`, + options: (props) => ({ + ...getOptions(props), + // optional + }), + }, }; const getOptions = ({ path, id }) => ({ From 1e2483ea4abd8393514dc8ca9baab5ccf7927462 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:02:04 +0200 Subject: [PATCH 033/142] Create notification schema for poke --- public/service-worker.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index bce5793ac..178b30465 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -53,6 +53,13 @@ const NOTIFICATIONS_SCHEMA = { // optional }), }, + poke: { + title: (accountId) => `${accountId} poked you`, + options: (props) => ({ + ...getOptions(props), + // optional + }), + }, }; const getOptions = ({ path, id }) => ({ From 39e6e07c9da9dffcf11bf9f849d01745401dadc4 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:02:29 +0200 Subject: [PATCH 034/142] Implement getNotificationTitle function --- public/service-worker.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 178b30465..7187f2edd 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -71,3 +71,7 @@ const getOptions = ({ path, id }) => ({ path, // TODO: at this step change to full url }, }); + +const getNotificationTitle = ({ accountId, notificationType }) => { + return NOTIFICATIONS_SCHEMA[notificationType].title(accountId); +}; From 1583cd9dba88cc97bbdec05a204746baf69f0c8d Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:02:40 +0200 Subject: [PATCH 035/142] Implement getNotificationOptions function --- public/service-worker.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 7187f2edd..148ccbe7e 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -75,3 +75,7 @@ const getOptions = ({ path, id }) => ({ const getNotificationTitle = ({ accountId, notificationType }) => { return NOTIFICATIONS_SCHEMA[notificationType].title(accountId); }; + +const getNotificationOptions = ({ notificationType, ...rest }) => { + return NOTIFICATIONS_SCHEMA[notificationType].options({ ...rest }); +}; From 9698f1ee55fe4f16f31d40eec154494ca96ea044 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:03:17 +0200 Subject: [PATCH 036/142] Implement handlePushEvent function --- public/service-worker.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 148ccbe7e..8edfb5657 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -72,6 +72,20 @@ const getOptions = ({ path, id }) => ({ }, }); +// Add error handling if data will not match +function handlePushEvent(event) { + console.log('SW - push event received', event); + + const notificationText = event.data.text(); + + const { initiatedBy = '', valueType = '', path = '', id = '' } = JSON.parse(notificationText); + + const title = getNotificationTitle({ accountId: initiatedBy, notificationType: valueType }); + const options = getNotificationOptions({ path, id, notificationType: valueType }); + + event.waitUntil(self.registration.showNotification(title, options)); +} + const getNotificationTitle = ({ accountId, notificationType }) => { return NOTIFICATIONS_SCHEMA[notificationType].title(accountId); }; From e0ae96f3f7f8193cb279029032e574b007f56550 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:03:35 +0200 Subject: [PATCH 037/142] Add push event listener --- public/service-worker.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 8edfb5657..c900f24a5 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -3,6 +3,8 @@ self.addEventListener('install', (event) => console.log('SW - installing in prog self.addEventListener('activate', (event) => console.log('SW - activateing in progress.', event)); +self.addEventListener('push', handlePushEvent); + const NOTIFICATIONS_SCHEMA = { like: { title: (accountId) => `${accountId} liked your post`, From c1ba337194aa1c62d6cf02163e46541b06a8ca3c Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:03:56 +0200 Subject: [PATCH 038/142] Implement handlePushClick function --- public/service-worker.js | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index c900f24a5..9c1c0d754 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -88,6 +88,27 @@ function handlePushEvent(event) { event.waitUntil(self.registration.showNotification(title, options)); } +const handlePushClick = (event) => { + console.log('SW - click event received', event); + + const { notification } = event; + + notification.close(); + + event.waitUntil( + clients + .matchAll({ + type: 'window', + }) + .then((clientList) => { + for (const client of clientList) { + if (client.url === '/' && 'focus' in client) return client.focus(); + } + if (clients.openWindow) return clients.openWindow(notification.data.path); + }), + ); +}; + const getNotificationTitle = ({ accountId, notificationType }) => { return NOTIFICATIONS_SCHEMA[notificationType].title(accountId); }; From b2fb644cb6227d5f61ac12aa85c820b6b3e43830 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 14 Sep 2023 22:04:09 +0200 Subject: [PATCH 039/142] Add click event listener --- public/service-worker.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/public/service-worker.js b/public/service-worker.js index 9c1c0d754..da34a4038 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -5,6 +5,8 @@ self.addEventListener('activate', (event) => console.log('SW - activateing in pr self.addEventListener('push', handlePushEvent); +self.addEventListener('notificationclick', handlePushClick); + const NOTIFICATIONS_SCHEMA = { like: { title: (accountId) => `${accountId} liked your post`, From df3ab5e3b1eff478d12a8085786b4b6b357d948e Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 15 Sep 2023 15:47:41 +0200 Subject: [PATCH 040/142] Refactor --- public/service-worker.js | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/public/service-worker.js b/public/service-worker.js index da34a4038..6c5abf5d7 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -1,12 +1,3 @@ - -self.addEventListener('install', (event) => console.log('SW - installing in progress.', event)); - -self.addEventListener('activate', (event) => console.log('SW - activateing in progress.', event)); - -self.addEventListener('push', handlePushEvent); - -self.addEventListener('notificationclick', handlePushClick); - const NOTIFICATIONS_SCHEMA = { like: { title: (accountId) => `${accountId} liked your post`, @@ -118,3 +109,11 @@ const getNotificationTitle = ({ accountId, notificationType }) => { const getNotificationOptions = ({ notificationType, ...rest }) => { return NOTIFICATIONS_SCHEMA[notificationType].options({ ...rest }); }; + +self.addEventListener('install', (event) => console.log('SW - installing in progress.', event)); + +self.addEventListener('activate', (event) => console.log('SW - activateing in progress.', event)); + +self.addEventListener('push', handlePushEvent); + +self.addEventListener('notificationclick', handlePushClick); From e1e10b0ff8303f1c79f93e75cc0bea4e2965a4b6 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Mon, 18 Sep 2023 18:11:34 +0200 Subject: [PATCH 041/142] Fix components source --- src/data/bos-components.ts | 15 ++++++++++++--- src/pages/index.tsx | 2 +- 2 files changed, 13 insertions(+), 4 deletions(-) diff --git a/src/data/bos-components.ts b/src/data/bos-components.ts index 1e26d04a2..cdf66f1d2 100644 --- a/src/data/bos-components.ts +++ b/src/data/bos-components.ts @@ -21,9 +21,12 @@ type NetworkComponents = { homePage: string; learningLinks: string; usePage: string; + notifications: { + page: string; + alert: string; + }; }; notificationButton: string; - notificationsPage: string; peoplePage: string; profileImage: string; profileInlineBlock: string; @@ -64,9 +67,12 @@ export const componentsByNetworkId: Record { return ( <> From bf31784286553ca2abafabb7751a2a909aa442b1 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Mon, 18 Sep 2023 18:29:01 +0200 Subject: [PATCH 042/142] Disable showing the modal --- src/pages/index.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index a7abc3917..1b6a75eae 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -34,7 +34,8 @@ const HomePage: NextPageWithLayout = () => { return; } - setShowNotificationModalState(showNotificationModal()); + // disable while waiting for proper conditions for new and existing users + // setShowNotificationModalState(showNotificationModal()); }, [signedIn]); useEffect(() => { From 3baada3e0019711dc7de8aae817877d9e12872be Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Mon, 18 Sep 2023 19:31:47 +0200 Subject: [PATCH 043/142] host and key --- src/utils/notifications.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 1d5df5ac5..5c9cd9098 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -13,8 +13,8 @@ import { setProcessSuccess, } from './notificationsLocalStorage'; -const applicationServerKey = ''; -const HOST = '/subscriptions/create'; +const applicationServerKey = 'BH_QFHjBU9x3VlmE9_XM4Awhm5vj2wF9WNQIz5wdlO6hc5anwEHLu6NLW521kCom7o9xChL5xvwTsHLK4dZpVVc'; +const HOST = 'https://notification-server-mainnet-7tk2cmmtcq-ew.a.run.app/subscriptions/create'; const handleRequestPermission = () => Notification.requestPermission(); From 244de70c5a4e30085d10a8d31ba90afffed8d972 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Mon, 18 Sep 2023 19:33:19 +0200 Subject: [PATCH 044/142] Refactor subscription object --- src/utils/notifications.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 5c9cd9098..0bad180f7 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -31,6 +31,9 @@ const handlePushManagerSubscribe = async () => { const sendToPushServer = (subscriptionData: object) => fetch(HOST, { + headers: { + 'Content-Type': 'application/json', + }, method: 'POST', body: JSON.stringify(subscriptionData), }); @@ -47,7 +50,7 @@ export const handleTurnOn = async (accountId: string, hideModal: () => void) => await registerServiceWorker(); const subscription = await handlePushManagerSubscribe(); await sendToPushServer({ - subscription, + PushSubscriptionObject: subscription, accountId, }); From ae0df8691d595d77fb3e1218a278ef6e148e7a43 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Mon, 18 Sep 2023 20:46:29 +0200 Subject: [PATCH 045/142] Refactor subscription object --- src/utils/notifications.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 0bad180f7..8288ba02a 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -50,7 +50,7 @@ export const handleTurnOn = async (accountId: string, hideModal: () => void) => await registerServiceWorker(); const subscription = await handlePushManagerSubscribe(); await sendToPushServer({ - PushSubscriptionObject: subscription, + subscription, accountId, }); From 466cd47b2f32435dbda6b0f00c7e588aa60e008c Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 19 Sep 2023 19:00:26 +0200 Subject: [PATCH 046/142] Implement setClearData function --- src/utils/notificationsLocalStorage.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index 805355d63..32e6c7e59 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -47,6 +47,10 @@ export const setProcessStarted = () => { ); }; +export const setClearData = () => { + localStorage.setItem(NOTIFICATIONS_STORAGE, JSON.stringify({})); +}; + export const setNotificationsSessionStorage = () => { localStorage.setItem( NOTIFICATIONS_STORAGE, From e04bc8a0740d7492858c77d694bc041f1ef07c3d Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 19 Sep 2023 19:00:36 +0200 Subject: [PATCH 047/142] refactor getNotificationLocalStorage --- src/utils/notificationsLocalStorage.ts | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index 32e6c7e59..cf24f7146 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -1,4 +1,9 @@ -import { isNotificationSupported, isPermisionGranted, isPushManagerSupported } from './notificationsHelpers'; +import { + isLocalStorageSupported, + isNotificationSupported, + isPermisionGranted, + isPushManagerSupported, +} from './notificationsHelpers'; export const NOTIFICATIONS_STORAGE = 'push-notifications-v0'; @@ -63,4 +68,5 @@ export const setNotificationsSessionStorage = () => { ); }; -export const getNotificationLocalStorage = () => JSON.parse(localStorage.getItem(NOTIFICATIONS_STORAGE) || '{}'); +export const getNotificationLocalStorage = () => + isLocalStorageSupported() && JSON.parse(localStorage.getItem(NOTIFICATIONS_STORAGE) || '{}'); From ec4b8a6f8202f1581e3d4de1c0c11033bca6d644 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 19 Sep 2023 19:01:51 +0200 Subject: [PATCH 048/142] Implement unregisterServiceWorker --- src/utils/notifications.ts | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 8288ba02a..98a6884c7 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -20,6 +20,13 @@ const handleRequestPermission = () => Notification.requestPermission(); const registerServiceWorker = () => navigator.serviceWorker.register('/service-worker.js'); +const unregisterServiceWorker = async () => { + const registrations = await navigator.serviceWorker.getRegistrations(); + for (const registration of registrations) { + await registration.unregister(); + } +}; + const handlePushManagerSubscribe = async () => { const serviceWorker = await navigator.serviceWorker.ready; From b1529898886c03ce54f36fb72e3b33702bf4e12e Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 19 Sep 2023 19:02:11 +0200 Subject: [PATCH 049/142] refactor sendToPushServer --- src/utils/notifications.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 98a6884c7..ee630a438 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -14,7 +14,7 @@ import { } from './notificationsLocalStorage'; const applicationServerKey = 'BH_QFHjBU9x3VlmE9_XM4Awhm5vj2wF9WNQIz5wdlO6hc5anwEHLu6NLW521kCom7o9xChL5xvwTsHLK4dZpVVc'; -const HOST = 'https://notification-server-mainnet-7tk2cmmtcq-ew.a.run.app/subscriptions/create'; +const HOST = 'https://notification-server-mainnet-7tk2cmmtcq-ew.a.run.app'; const handleRequestPermission = () => Notification.requestPermission(); @@ -37,7 +37,7 @@ const handlePushManagerSubscribe = async () => { }; const sendToPushServer = (subscriptionData: object) => - fetch(HOST, { + fetch(`${HOST}/subscriptions/create`, { headers: { 'Content-Type': 'application/json', }, From 1af972418e6cd5d746f7695c26c07efd44e45c8a Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 19 Sep 2023 19:02:24 +0200 Subject: [PATCH 050/142] Implement pushServerUnsubscribe --- src/utils/notifications.ts | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index ee630a438..a1851d159 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -45,6 +45,15 @@ const sendToPushServer = (subscriptionData: object) => body: JSON.stringify(subscriptionData), }); +const pushServerUnsubscribe = (subscription: any) => + fetch(`${HOST}/subscriptions/delete`, { + headers: { + 'Content-Type': 'application/json', + }, + method: 'POST', + body: JSON.stringify({ endpoint: subscription?.endpoint }), + }); + export const handleTurnOn = async (accountId: string, hideModal: () => void) => { if (!isNotificationSupported() && !isPushManagerSupported() && isPermisionGranted()) { return; From 026d87fd4e56d866134ce891833303bdb788a1d7 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 19 Sep 2023 19:02:35 +0200 Subject: [PATCH 051/142] refactor showNotificationModal permission --- src/utils/notifications.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index a1851d159..44c87f79d 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -91,7 +91,7 @@ export const handleOnCancel = () => { }; export const showNotificationModal = () => { - if (isPermisionGranted()) { + if (isPermisionGranted() && getNotificationLocalStorage()?.permission) { return false; } From 8e235e7cb870b15e384f8949eae2bb90fbcef60b Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 19 Sep 2023 19:02:48 +0200 Subject: [PATCH 052/142] implement handlePushManagerUnsubscribe --- src/utils/notifications.ts | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 44c87f79d..e87e27a25 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -7,6 +7,7 @@ import { import { getNotificationLocalStorage, NOTIFICATIONS_STORAGE, + setClearData, setProcessEnded, setProcessError, setProcessStarted, @@ -36,6 +37,20 @@ const handlePushManagerSubscribe = async () => { }); }; +export const handlePushManagerUnsubscribe = async () => { + const serviceWorker = await navigator.serviceWorker.ready; + const subscription = await serviceWorker.pushManager.getSubscription(); + + try { + setClearData(); + await pushServerUnsubscribe(subscription); + await unregisterServiceWorker(); + await subscription?.unsubscribe(); + } catch (error) { + // TODO: handle + } +}; + const sendToPushServer = (subscriptionData: object) => fetch(`${HOST}/subscriptions/create`, { headers: { From b5e80332d494531922ab0fc55a97a725a9498811 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 11:54:51 +0200 Subject: [PATCH 053/142] refactor handlePushManagerUnsubscribe --- src/utils/notifications.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index e87e27a25..cdbd4b28c 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -37,7 +37,7 @@ const handlePushManagerSubscribe = async () => { }); }; -export const handlePushManagerUnsubscribe = async () => { +export const handlePushManagerUnsubscribe = async (hide: () => void) => { const serviceWorker = await navigator.serviceWorker.ready; const subscription = await serviceWorker.pushManager.getSubscription(); @@ -48,6 +48,8 @@ export const handlePushManagerUnsubscribe = async () => { await subscription?.unsubscribe(); } catch (error) { // TODO: handle + } finally { + hide(); } }; From 70076ff278821b709dbd3e2dfab2f093d8ecbed3 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 11:55:07 +0200 Subject: [PATCH 054/142] Implement handleOnCancelBanner --- src/utils/notifications.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index cdbd4b28c..6c83ba4f9 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -103,6 +103,16 @@ export const handleOnCancel = () => { ...getNotificationLocalStorage(), showOnTS: Date.now() + 86400000, // 14 days notNowTS: Date.now(), + bannerNotNowTS: undefined, + }), + ); +}; +export const handleOnCancelBanner = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + bannerNotNowTS: Date.now(), }), ); }; From a5a37b92e118d0f0961afaae4052eefd912535be Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 11:58:51 +0200 Subject: [PATCH 055/142] implement setHandleOnCancel --- src/utils/notificationsLocalStorage.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index cf24f7146..cd6ca5053 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -7,6 +7,18 @@ import { export const NOTIFICATIONS_STORAGE = 'push-notifications-v0'; +export const setHandleOnCancel = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + showOnTS: Date.now() + 86400000, // 14 days + notNowTS: Date.now(), + bannerNotNowTS: undefined, + }), + ); +}; + export const setProcessSuccess = () => { localStorage.setItem( NOTIFICATIONS_STORAGE, From 7f8158bbf16ffa2f88330b586dbc862b65d0b428 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 11:59:50 +0200 Subject: [PATCH 056/142] implement setHandleOnCancelBanner --- src/utils/notificationsLocalStorage.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index cd6ca5053..bcdc1158b 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -19,6 +19,16 @@ export const setHandleOnCancel = () => { ); }; +export const setHandleOnCancelBanner = () => { + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorage(), + bannerNotNowTS: Date.now(), + }), + ); +}; + export const setProcessSuccess = () => { localStorage.setItem( NOTIFICATIONS_STORAGE, From 05085cbca83eaf2bd2ed4d4de1f863dbf1f8807a Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 12:05:05 +0200 Subject: [PATCH 057/142] refactor notifications utils --- src/utils/notifications.ts | 21 ++++----------------- 1 file changed, 4 insertions(+), 17 deletions(-) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 6c83ba4f9..8ceee0547 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -6,8 +6,9 @@ import { } from './notificationsHelpers'; import { getNotificationLocalStorage, - NOTIFICATIONS_STORAGE, setClearData, + setHandleOnCancel, + setHandleOnCancelBanner, setProcessEnded, setProcessError, setProcessStarted, @@ -97,24 +98,10 @@ export const handleTurnOn = async (accountId: string, hideModal: () => void) => }; export const handleOnCancel = () => { - localStorage.setItem( - NOTIFICATIONS_STORAGE, - JSON.stringify({ - ...getNotificationLocalStorage(), - showOnTS: Date.now() + 86400000, // 14 days - notNowTS: Date.now(), - bannerNotNowTS: undefined, - }), - ); + setHandleOnCancel(); }; export const handleOnCancelBanner = () => { - localStorage.setItem( - NOTIFICATIONS_STORAGE, - JSON.stringify({ - ...getNotificationLocalStorage(), - bannerNotNowTS: Date.now(), - }), - ); + setHandleOnCancelBanner(); }; export const showNotificationModal = () => { From 81eded072827fa38263a992b9c0119a70f8d3ee1 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 12:06:14 +0200 Subject: [PATCH 058/142] Add settings component --- src/data/bos-components.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/data/bos-components.ts b/src/data/bos-components.ts index cdf66f1d2..528ca6ac6 100644 --- a/src/data/bos-components.ts +++ b/src/data/bos-components.ts @@ -24,6 +24,7 @@ type NetworkComponents = { notifications: { page: string; alert: string; + settings: string; }; }; notificationButton: string; @@ -70,6 +71,7 @@ export const componentsByNetworkId: Record Date: Wed, 20 Sep 2023 12:06:34 +0200 Subject: [PATCH 059/142] Set permission granted --- src/utils/notificationsLocalStorage.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index bcdc1158b..4a19f1ef9 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -37,6 +37,7 @@ export const setProcessSuccess = () => { permission: true, subscribeStarted: false, subscribeError: '', + isPermisionGranted: true, }), ); }; From bd81e302d131531ff743e37fb3c983c37b8af7c7 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 12:08:29 +0200 Subject: [PATCH 060/142] Create notifications page --- src/pages/notifications-settings.tsx | 33 ++++++++++++++++++++++++++++ 1 file changed, 33 insertions(+) create mode 100644 src/pages/notifications-settings.tsx diff --git a/src/pages/notifications-settings.tsx b/src/pages/notifications-settings.tsx new file mode 100644 index 000000000..34fe737b4 --- /dev/null +++ b/src/pages/notifications-settings.tsx @@ -0,0 +1,33 @@ +import { ComponentWrapperPage } from '@/components/near-org/ComponentWrapperPage'; +import { useBosComponents } from '@/hooks/useBosComponents'; +import { useDefaultLayout } from '@/hooks/useLayout'; +import { useAuthStore } from '@/stores/auth'; +import { + handleOnCancel, + handleOnCancelBanner, + handlePushManagerUnsubscribe, + handleTurnOn, +} from '@/utils/notifications'; +import { + isLocalStorageSupported, + isNotificationSupported, + isPermisionGranted, + isPushManagerSupported, +} from '@/utils/notificationsHelpers'; +import { getNotificationLocalStorage } from '@/utils/notificationsLocalStorage'; +import type { NextPageWithLayout } from '@/utils/types'; + +const NotificationsSettingsPage: NextPageWithLayout = () => { + const components = useBosComponents(); + const accountId = useAuthStore((store) => store.accountId); + + return ( + + ); +}; + +NotificationsSettingsPage.getLayout = useDefaultLayout; + +export default NotificationsSettingsPage; From e1b3435136aa503f361146f1a8af469b7081c831 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 12:08:46 +0200 Subject: [PATCH 061/142] Pass props to settings component --- src/pages/notifications-settings.tsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/pages/notifications-settings.tsx b/src/pages/notifications-settings.tsx index 34fe737b4..0b2ea827d 100644 --- a/src/pages/notifications-settings.tsx +++ b/src/pages/notifications-settings.tsx @@ -24,6 +24,20 @@ const NotificationsSettingsPage: NextPageWithLayout = () => { return ( ); }; From 479647e91c95fc5f6d39afb4fe85e45ea2adfcd1 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 12:09:15 +0200 Subject: [PATCH 062/142] Create notifications settings page --- src/pages/notifications.tsx | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) create mode 100644 src/pages/notifications.tsx diff --git a/src/pages/notifications.tsx b/src/pages/notifications.tsx new file mode 100644 index 000000000..056a0f500 --- /dev/null +++ b/src/pages/notifications.tsx @@ -0,0 +1,28 @@ +import { ComponentWrapperPage } from '@/components/near-org/ComponentWrapperPage'; +import { useBosComponents } from '@/hooks/useBosComponents'; +import { useDefaultLayout } from '@/hooks/useLayout'; +import { useAuthStore } from '@/stores/auth'; +import { handleOnCancel, handleOnCancelBanner, handleTurnOn } from '@/utils/notifications'; +import { + isLocalStorageSupported, + isNotificationSupported, + isPermisionGranted, + isPushManagerSupported, +} from '@/utils/notificationsHelpers'; +import { getNotificationLocalStorage } from '@/utils/notificationsLocalStorage'; +import type { NextPageWithLayout } from '@/utils/types'; + +const NotificationsPage: NextPageWithLayout = () => { + const components = useBosComponents(); + const accountId = useAuthStore((store) => store.accountId); + + return ( + + ); +}; + +NotificationsPage.getLayout = useDefaultLayout; + +export default NotificationsPage; From 7d0a96045d0a5d01e789a1c1eaa49e092d3d87eb Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 12:09:54 +0200 Subject: [PATCH 063/142] Pass props to notifications component --- src/pages/notifications.tsx | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/src/pages/notifications.tsx b/src/pages/notifications.tsx index 056a0f500..d5a8b1e50 100644 --- a/src/pages/notifications.tsx +++ b/src/pages/notifications.tsx @@ -19,6 +19,19 @@ const NotificationsPage: NextPageWithLayout = () => { return ( ); }; From a8b046d7aa02fea739882666b934a64d8a9c0e03 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Wed, 20 Sep 2023 14:47:48 +0200 Subject: [PATCH 064/142] Update bos-components --- src/data/bos-components.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/data/bos-components.ts b/src/data/bos-components.ts index 528ca6ac6..abc53612f 100644 --- a/src/data/bos-components.ts +++ b/src/data/bos-components.ts @@ -25,6 +25,7 @@ type NetworkComponents = { page: string; alert: string; settings: string; + button: string; }; }; notificationButton: string; @@ -72,6 +73,7 @@ export const componentsByNetworkId: Record Date: Wed, 20 Sep 2023 14:48:25 +0200 Subject: [PATCH 065/142] New notifications button --- .../navigation/NotificationButton.tsx | 59 +++++++------------ 1 file changed, 21 insertions(+), 38 deletions(-) diff --git a/src/components/navigation/NotificationButton.tsx b/src/components/navigation/NotificationButton.tsx index 4f6ac735f..a7f6756b1 100644 --- a/src/components/navigation/NotificationButton.tsx +++ b/src/components/navigation/NotificationButton.tsx @@ -1,49 +1,32 @@ import React from 'react'; -import styled from 'styled-components'; import { VmComponent } from '@/components/vm/VmComponent'; import { useBosComponents } from '@/hooks/useBosComponents'; - -const StyledNotificationButton = styled.div` - margin: 0 15px; - border: 0.5px solid #e3e3e0; - background-color: #f3f3f2; - height: 46px; - width: 46px; - border-radius: 50%; - - > div, - a { - width: 100%; - height: 100%; - } - - a { - color: #1b1b18 !important; - background-color: #f3f3f2 !important; - display: flex; - align-items: center; - justify-content: center; - - i { - font-size: 18px !important; - } - } - - :hover { - a, - i { - color: white; - } - } -`; +import { handleOnCancel, handleOnCancelBanner, handleTurnOn } from '@/utils/notifications'; +import { + isLocalStorageSupported, + isNotificationSupported, + isPermisionGranted, + isPushManagerSupported, +} from '@/utils/notificationsHelpers'; +import { getNotificationLocalStorage } from '@/utils/notificationsLocalStorage'; export function NotificationButton() { const components = useBosComponents(); return ( - - - + ); } From c356ab89e952116d6b73eeb83b03520bc434afbd Mon Sep 17 00:00:00 2001 From: Dmitriy <34593263+shelegdmitriy@users.noreply.github.com> Date: Wed, 20 Sep 2023 16:26:35 +0300 Subject: [PATCH 066/142] Show notiication modal for new users (#551) * Show notiication modal for new users * Show notiication modal for existing users --- src/pages/index.tsx | 59 +++++++++++++++++++++++++++++++++------------ src/utils/types.ts | 12 +++++++++ 2 files changed, 56 insertions(+), 15 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 1b6a75eae..56f6fc8e9 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,6 +1,6 @@ import { isPassKeyAvailable } from '@near-js/biometric-ed25519'; import { useRouter } from 'next/router'; -import { useEffect, useState } from 'react'; +import { useCallback, useEffect, useMemo, useState } from 'react'; import { openToast } from '@/components/lib/Toast'; import { MetaTags } from '@/components/MetaTags'; @@ -13,8 +13,8 @@ import { useAuthStore } from '@/stores/auth'; import { useCurrentComponentStore } from '@/stores/current-component'; import { handleOnCancel, handleTurnOn, showNotificationModal } from '@/utils/notifications'; import { isNotificationSupported, isPermisionGranted, isPushManagerSupported } from '@/utils/notificationsHelpers'; -import { setNotificationsSessionStorage } from '@/utils/notificationsLocalStorage'; -import type { NextPageWithLayout } from '@/utils/types'; +import { setNotificationsSessionStorage, getNotificationLocalStorage } from '@/utils/notificationsLocalStorage'; +import type { NextPageWithLayout, TosData } from '@/utils/types'; const LS_ACCOUNT_ID = 'near-social-vm:v01::accountId:'; @@ -28,15 +28,48 @@ const HomePage: NextPageWithLayout = () => { const [componentProps, setComponentProps] = useState>({}); const [showNotificationModalState, setShowNotificationModalState] = useState(false); const accountId = useAuthStore((store) => store.accountId); + const [tosData, setTosData] = useState(null); + const cacheTosData = useMemo(() => tosData, [tosData?.latestTosVersion]); + + const handleModalCloseOnEsc = useCallback(() => { + setShowNotificationModalState(false); + }, []); + + const turnNotificationsOn = useCallback( + () => + handleTurnOn(accountId, () => { + setShowNotificationModalState(false); + }), + [], + ); + + const pauseNotifications = useCallback(() => { + handleOnCancel(); + setShowNotificationModalState(false); + }, []); + + const checkNotificationModal = useCallback(() => { + if (tosData && tosData.agreementsForUser.length > 0) { + // show notification modal for new users + const tosAccepted = + tosData.agreementsForUser[tosData.agreementsForUser.length - 1].value === tosData.latestTosVersion; + // check if user has already turned on notifications + const { showOnTS } = getNotificationLocalStorage(); + + if ((tosAccepted && !showOnTS) || (tosAccepted && showOnTS < Date.now())) { + setTimeout(() => { + setShowNotificationModalState(showNotificationModal()); + }, 10000); + } + } + }, [cacheTosData]); useEffect(() => { if (!signedIn) { return; } - - // disable while waiting for proper conditions for new and existing users - // setShowNotificationModalState(showNotificationModal()); - }, [signedIn]); + checkNotificationModal(); + }, [signedIn, cacheTosData]); useEffect(() => { const optimisticAccountId = window.localStorage.getItem(LS_ACCOUNT_ID); @@ -78,18 +111,13 @@ const HomePage: NextPageWithLayout = () => { src={components.nearOrg.notifications.alert} props={{ open: showNotificationModalState, - handleTurnOn: () => - handleTurnOn(accountId, () => { - setShowNotificationModalState(false); - }), - handleOnCancel: () => { - handleOnCancel(); - setShowNotificationModalState(false); - }, + handleTurnOn: turnNotificationsOn, + handleOnCancel: pauseNotifications, isNotificationSupported, isPermisionGranted, isPushManagerSupported, setNotificationsSessionStorage, + onOpenChange: handleModalCloseOnEsc, }} /> { targetProps: componentProps, targetComponent: components.default, tosName: components.tosContent, + recordToC: setTosData, }} /> diff --git a/src/utils/types.ts b/src/utils/types.ts index 0e71fba94..04138b1d8 100644 --- a/src/utils/types.ts +++ b/src/utils/types.ts @@ -32,6 +32,18 @@ type ProductionNetwork = { }; }; +export interface TosData { + showTos: boolean; + agreementsForUser: UserTosAgreement[]; + latestTosVersion: number; +} + +type UserTosAgreement = { + accountId: string; + blockHeight: number; + value: number; +}; + // type DevelopmentNetwork = { // networkId: 'localnet'; // viewAccountId: string; From 09bb02e6d067a7db0d3ccc466d55c98cbc1b9431 Mon Sep 17 00:00:00 2001 From: Marcin Bodnar <36210360+marcinbodnar@users.noreply.github.com> Date: Wed, 20 Sep 2023 15:31:03 +0200 Subject: [PATCH 067/142] Revert "Show notiication modal for new users (#551)" This reverts commit c356ab89e952116d6b73eeb83b03520bc434afbd. --- src/pages/index.tsx | 59 ++++++++++++--------------------------------- src/utils/types.ts | 12 --------- 2 files changed, 15 insertions(+), 56 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 56f6fc8e9..1b6a75eae 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,6 +1,6 @@ import { isPassKeyAvailable } from '@near-js/biometric-ed25519'; import { useRouter } from 'next/router'; -import { useCallback, useEffect, useMemo, useState } from 'react'; +import { useEffect, useState } from 'react'; import { openToast } from '@/components/lib/Toast'; import { MetaTags } from '@/components/MetaTags'; @@ -13,8 +13,8 @@ import { useAuthStore } from '@/stores/auth'; import { useCurrentComponentStore } from '@/stores/current-component'; import { handleOnCancel, handleTurnOn, showNotificationModal } from '@/utils/notifications'; import { isNotificationSupported, isPermisionGranted, isPushManagerSupported } from '@/utils/notificationsHelpers'; -import { setNotificationsSessionStorage, getNotificationLocalStorage } from '@/utils/notificationsLocalStorage'; -import type { NextPageWithLayout, TosData } from '@/utils/types'; +import { setNotificationsSessionStorage } from '@/utils/notificationsLocalStorage'; +import type { NextPageWithLayout } from '@/utils/types'; const LS_ACCOUNT_ID = 'near-social-vm:v01::accountId:'; @@ -28,48 +28,15 @@ const HomePage: NextPageWithLayout = () => { const [componentProps, setComponentProps] = useState>({}); const [showNotificationModalState, setShowNotificationModalState] = useState(false); const accountId = useAuthStore((store) => store.accountId); - const [tosData, setTosData] = useState(null); - const cacheTosData = useMemo(() => tosData, [tosData?.latestTosVersion]); - - const handleModalCloseOnEsc = useCallback(() => { - setShowNotificationModalState(false); - }, []); - - const turnNotificationsOn = useCallback( - () => - handleTurnOn(accountId, () => { - setShowNotificationModalState(false); - }), - [], - ); - - const pauseNotifications = useCallback(() => { - handleOnCancel(); - setShowNotificationModalState(false); - }, []); - - const checkNotificationModal = useCallback(() => { - if (tosData && tosData.agreementsForUser.length > 0) { - // show notification modal for new users - const tosAccepted = - tosData.agreementsForUser[tosData.agreementsForUser.length - 1].value === tosData.latestTosVersion; - // check if user has already turned on notifications - const { showOnTS } = getNotificationLocalStorage(); - - if ((tosAccepted && !showOnTS) || (tosAccepted && showOnTS < Date.now())) { - setTimeout(() => { - setShowNotificationModalState(showNotificationModal()); - }, 10000); - } - } - }, [cacheTosData]); useEffect(() => { if (!signedIn) { return; } - checkNotificationModal(); - }, [signedIn, cacheTosData]); + + // disable while waiting for proper conditions for new and existing users + // setShowNotificationModalState(showNotificationModal()); + }, [signedIn]); useEffect(() => { const optimisticAccountId = window.localStorage.getItem(LS_ACCOUNT_ID); @@ -111,13 +78,18 @@ const HomePage: NextPageWithLayout = () => { src={components.nearOrg.notifications.alert} props={{ open: showNotificationModalState, - handleTurnOn: turnNotificationsOn, - handleOnCancel: pauseNotifications, + handleTurnOn: () => + handleTurnOn(accountId, () => { + setShowNotificationModalState(false); + }), + handleOnCancel: () => { + handleOnCancel(); + setShowNotificationModalState(false); + }, isNotificationSupported, isPermisionGranted, isPushManagerSupported, setNotificationsSessionStorage, - onOpenChange: handleModalCloseOnEsc, }} /> { targetProps: componentProps, targetComponent: components.default, tosName: components.tosContent, - recordToC: setTosData, }} /> diff --git a/src/utils/types.ts b/src/utils/types.ts index 04138b1d8..0e71fba94 100644 --- a/src/utils/types.ts +++ b/src/utils/types.ts @@ -32,18 +32,6 @@ type ProductionNetwork = { }; }; -export interface TosData { - showTos: boolean; - agreementsForUser: UserTosAgreement[]; - latestTosVersion: number; -} - -type UserTosAgreement = { - accountId: string; - blockHeight: number; - value: number; -}; - // type DevelopmentNetwork = { // networkId: 'localnet'; // viewAccountId: string; From 34392c1808c79a297896fba7c27dcdfb7b1f1046 Mon Sep 17 00:00:00 2001 From: Charles Garrett Date: Wed, 20 Sep 2023 12:01:31 -0400 Subject: [PATCH 068/142] chore: give workflow a descriptive name --- .github/workflows/{main.yml => update-sprint-board.yml} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename .github/workflows/{main.yml => update-sprint-board.yml} (100%) diff --git a/.github/workflows/main.yml b/.github/workflows/update-sprint-board.yml similarity index 100% rename from .github/workflows/main.yml rename to .github/workflows/update-sprint-board.yml From d9275f0542eea7d39e19475049fffe5c3c9c7018 Mon Sep 17 00:00:00 2001 From: Dmitriy Date: Wed, 20 Sep 2023 19:42:19 +0300 Subject: [PATCH 069/142] Bump VM version to 2.4.2 --- package.json | 2 +- pnpm-lock.yaml | 104 ++++++++++++++++++++++++++++++++++--------------- 2 files changed, 73 insertions(+), 33 deletions(-) diff --git a/package.json b/package.json index 62457c4e7..f400ffccd 100644 --- a/package.json +++ b/package.json @@ -55,7 +55,7 @@ "local-storage": "^2.0.0", "lodash": "^4.17.21", "near-api-js": "2.1.3", - "near-social-vm": "github:NearSocial/VM#2.4.1", + "near-social-vm": "github:NearSocial/VM#2.4.2", "next": "13.3.4", "prettier": "^2.7.1", "react": "18.2.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 8c613023d..b605455bf 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -13,7 +13,7 @@ dependencies: version: 1.2.3(@near-js/accounts@0.1.4)(@near-js/crypto@0.0.4)(@near-js/keystores-browser@0.0.4)(@near-js/keystores-node@0.0.4)(@near-js/keystores@0.0.4)(@near-js/transactions@0.2.1)(@near-js/types@0.0.4)(@near-js/utils@0.0.4)(@near-js/wallet-account@0.0.6)(@near-wallet-selector/core@8.5.1)(@types/react@18.2.0)(near-api-js@2.1.3)(react-dom@18.2.0)(react@18.2.0) '@monaco-editor/react': specifier: ^4.4.6 - version: 4.5.1(monaco-editor@0.41.0)(react-dom@18.2.0)(react@18.2.0) + version: 4.5.1(monaco-editor@0.43.0)(react-dom@18.2.0)(react@18.2.0) '@near-js/biometric-ed25519': specifier: 0.3.0 version: 0.3.0 @@ -126,8 +126,8 @@ dependencies: specifier: 2.1.3 version: 2.1.3 near-social-vm: - specifier: github:NearSocial/VM#2.4.1 - version: github.com/NearSocial/VM/8cdb3193c614bb64eb6a97c1cfd246e749ab17a1(@popperjs/core@2.11.8)(@types/react-dom@18.2.1)(@types/react@18.2.0)(near-api-js@2.1.3)(prop-types@15.8.1)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0) + specifier: github:NearSocial/VM#2.4.2 + version: github.com/NearSocial/VM/a6ed652ff5ea296321e8a0eba09239da160cfa7b(@popperjs/core@2.11.8)(@types/react-dom@18.2.1)(@types/react@18.2.0)(near-api-js@2.1.3)(prop-types@15.8.1)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0) next: specifier: 13.3.4 version: 13.3.4(react-dom@18.2.0)(react@18.2.0) @@ -1595,10 +1595,10 @@ packages: resolution: {integrity: sha512-buc8BXHmG9l82+OQXOFU3Kr2XQx9ys01U/Q9HMIrZ300iLc8HLMgh7dcCqgYzAzf4BkoQvDcXf5Y+CuEZ5JBYg==} dev: false - /@floating-ui/core@1.4.1: - resolution: {integrity: sha512-jk3WqquEJRlcyu7997NtR5PibI+y5bi+LS3hPmguVClypenMsCY3CBa3LAQnozRCtCrYWSEtAdiskpamuJRFOQ==} + /@floating-ui/core@1.5.0: + resolution: {integrity: sha512-kK1h4m36DQ0UHGj5Ah4db7R0rHemTqqO0QLvUqi1/mUUp3LuAWbWxdxSIf/XsnH9VS6rRVPLJCncjRzUvyCLXg==} dependencies: - '@floating-ui/utils': 0.1.1 + '@floating-ui/utils': 0.1.4 dev: false /@floating-ui/dom@0.5.4: @@ -1607,11 +1607,11 @@ packages: '@floating-ui/core': 0.7.3 dev: false - /@floating-ui/dom@1.5.1: - resolution: {integrity: sha512-KwvVcPSXg6mQygvA1TjbN/gh///36kKtllIF8SUm0qpFj8+rvYrpvlYdL1JoA71SHpDqgSSdGOSoQ0Mp3uY5aw==} + /@floating-ui/dom@1.5.3: + resolution: {integrity: sha512-ClAbQnEqJAKCJOEbbLo5IUlZHkNszqhuxS4fHAVxRPXPya6Ysf2G8KypnYcOTpx6I8xcgF9bbHb6g/2KpbV8qA==} dependencies: - '@floating-ui/core': 1.4.1 - '@floating-ui/utils': 0.1.1 + '@floating-ui/core': 1.5.0 + '@floating-ui/utils': 0.1.4 dev: false /@floating-ui/react-dom@0.7.2(@types/react@18.2.0)(react-dom@18.2.0)(react@18.2.0): @@ -1634,13 +1634,13 @@ packages: react: '>=16.8.0' react-dom: '>=16.8.0' dependencies: - '@floating-ui/dom': 1.5.1 + '@floating-ui/dom': 1.5.3 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) dev: false - /@floating-ui/utils@0.1.1: - resolution: {integrity: sha512-m0G6wlnhm/AX0H12IOWtK8gASEMffnX08RtKkCgTdHb9JpHKGloI7icFfLg9ZmQeavcvR0PKmzxClyuFPSjKWw==} + /@floating-ui/utils@0.1.4: + resolution: {integrity: sha512-qprfWkn82Iw821mcKofJ5Pk9wgioHicxcQMxx+5zt5GSKoqdWvgG5AxVmpmUUjzTLPVSH5auBrhI93Deayn/DA==} dev: false /@formatjs/ecma402-abstract@1.11.4: @@ -1913,24 +1913,24 @@ packages: query-string: 7.1.3 dev: false - /@monaco-editor/loader@1.3.3(monaco-editor@0.41.0): + /@monaco-editor/loader@1.3.3(monaco-editor@0.43.0): resolution: {integrity: sha512-6KKF4CTzcJiS8BJwtxtfyYt9shBiEv32ateQ9T4UVogwn4HM/uPo9iJd2Dmbkpz8CM6Y0PDUpjnZzCwC+eYo2Q==} peerDependencies: monaco-editor: '>= 0.21.0 < 1' dependencies: - monaco-editor: 0.41.0 + monaco-editor: 0.43.0 state-local: 1.0.7 dev: false - /@monaco-editor/react@4.5.1(monaco-editor@0.41.0)(react-dom@18.2.0)(react@18.2.0): + /@monaco-editor/react@4.5.1(monaco-editor@0.43.0)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-NNDFdP+2HojtNhCkRfE6/D6ro6pBNihaOzMbGK84lNWzRu+CfBjwzGt4jmnqimLuqp5yE5viHS2vi+QOAnD5FQ==} peerDependencies: monaco-editor: '>= 0.25.0 < 1' react: ^16.8.0 || ^17.0.0 || ^18.0.0 react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 dependencies: - '@monaco-editor/loader': 1.3.3(monaco-editor@0.41.0) - monaco-editor: 0.41.0 + '@monaco-editor/loader': 1.3.3(monaco-editor@0.43.0) + monaco-editor: 0.43.0 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) dev: false @@ -4454,8 +4454,8 @@ packages: resolution: {integrity: sha512-LG4opVs2ANWZ1TJoKc937iMmNstM/d0ae1vNbnBvBhqCSezgVUOzcLCqbI5elV8Vy6WKwKjaqR+zO9VKirBBCA==} dev: false - /@types/hast@2.3.5: - resolution: {integrity: sha512-SvQi0L/lNpThgPoleH53cdjB3y9zpLlVjRbqB3rH8hx1jiRSBGAhyjV3H+URFjNVRqt2EdYNrbZE5IsGlNfpRg==} + /@types/hast@2.3.6: + resolution: {integrity: sha512-47rJE80oqPmFdVDCD7IheXBrVdwuBgsYwoczFvKmwfo2Mzsnt+V9OONsYauFmICb6lQPpCuXYJWejBNs4pDJRg==} dependencies: '@types/unist': 2.0.8 dev: false @@ -6025,7 +6025,7 @@ packages: object-is: 1.1.5 object-keys: 1.1.1 object.assign: 4.1.4 - regexp.prototype.flags: 1.5.0 + regexp.prototype.flags: 1.5.1 side-channel: 1.0.4 which-boxed-primitive: 1.0.2 which-collection: 1.0.1 @@ -6058,6 +6058,15 @@ packages: titleize: 3.0.0 dev: false + /define-data-property@1.1.0: + resolution: {integrity: sha512-UzGwzcjyv3OtAvolTj1GoyNYzfFR+iqbGjcnBEENZVCpM4/Ng1yhGNvS3lR/xDS74Tb2wGG9WzNSNIOS9UVb2g==} + engines: {node: '>= 0.4'} + dependencies: + get-intrinsic: 1.2.1 + gopd: 1.0.1 + has-property-descriptors: 1.0.0 + dev: false + /define-lazy-prop@3.0.0: resolution: {integrity: sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg==} engines: {node: '>=12'} @@ -6071,6 +6080,15 @@ packages: object-keys: 1.1.1 dev: false + /define-properties@1.2.1: + resolution: {integrity: sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==} + engines: {node: '>= 0.4'} + dependencies: + define-data-property: 1.1.0 + has-property-descriptors: 1.0.0 + object-keys: 1.1.1 + dev: false + /depd@1.1.2: resolution: {integrity: sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ==} engines: {node: '>= 0.6'} @@ -7242,7 +7260,7 @@ packages: /hastscript@6.0.0: resolution: {integrity: sha512-nDM6bvd7lIqDUiYEiu5Sl/+6ReP0BMk/2f4U/Rooccxkj0P5nm+acM5PrGJ/t5I8qPGiqZSE6hVAwZEdZIvP4w==} dependencies: - '@types/hast': 2.3.5 + '@types/hast': 2.3.6 comma-separated-tokens: 1.0.8 hast-util-parse-selector: 2.2.5 property-information: 5.6.0 @@ -7798,6 +7816,10 @@ packages: resolution: {integrity: sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==} dev: false + /lodash.clonedeep@4.5.0: + resolution: {integrity: sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==} + dev: false + /lodash.debounce@4.0.8: resolution: {integrity: sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==} dev: false @@ -8007,7 +8029,7 @@ packages: /mdast-util-to-hast@11.3.0: resolution: {integrity: sha512-4o3Cli3hXPmm1LhB+6rqhfsIUBjnKFlIUZvudaermXB+4/KONdd/W4saWWkC+LBLbPMqhFSSTSRgafHsT5fVJw==} dependencies: - '@types/hast': 2.3.5 + '@types/hast': 2.3.6 '@types/mdast': 3.0.12 '@types/mdurl': 1.0.2 mdast-util-definitions: 5.1.2 @@ -8533,8 +8555,8 @@ packages: minimist: 1.2.8 dev: false - /monaco-editor@0.41.0: - resolution: {integrity: sha512-1o4olnZJsiLmv5pwLEAmzHTE/5geLKQ07BrGxlF4Ri/AXAc2yyDGZwHjiTqD8D/ROKUZmwMA28A+yEowLNOEcA==} + /monaco-editor@0.43.0: + resolution: {integrity: sha512-cnoqwQi/9fml2Szamv1XbSJieGJ1Dc8tENVMD26Kcfl7xGQWp7OBKMjlwKVGYFJ3/AXJjSOGvcqK7Ry/j9BM1Q==} dev: false /motion@10.16.2: @@ -9336,7 +9358,7 @@ packages: '@types/react': '>=16' react: '>=16' dependencies: - '@types/hast': 2.3.5 + '@types/hast': 2.3.6 '@types/react': 18.2.0 '@types/unist': 2.0.8 comma-separated-tokens: 2.0.3 @@ -9534,6 +9556,15 @@ packages: functions-have-names: 1.2.3 dev: false + /regexp.prototype.flags@1.5.1: + resolution: {integrity: sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==} + engines: {node: '>= 0.4'} + dependencies: + call-bind: 1.0.2 + define-properties: 1.2.1 + set-function-name: 2.0.1 + dev: false + /remark-gfm@3.0.1: resolution: {integrity: sha512-lEFDoi2PICJyNrACFOfDD3JlLkuSbOa5Wd8EPt06HUdptv8Gn0bxYTdbU/XXQ3swAPkEaGxxPN9cbnMHvVu1Ig==} dependencies: @@ -9568,7 +9599,7 @@ packages: /remark-rehype@9.1.0: resolution: {integrity: sha512-oLa6YmgAYg19zb0ZrBACh40hpBLteYROaPLhBXzLgjqyHQrN+gVP9N/FJvfzuNNuzCutktkroXEZBrxAxKhh7Q==} dependencies: - '@types/hast': 2.3.5 + '@types/hast': 2.3.6 '@types/mdast': 3.0.12 mdast-util-to-hast: 11.3.0 unified: 10.1.2 @@ -9750,6 +9781,15 @@ packages: resolution: {integrity: sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==} dev: false + /set-function-name@2.0.1: + resolution: {integrity: sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==} + engines: {node: '>= 0.4'} + dependencies: + define-data-property: 1.1.0 + functions-have-names: 1.2.3 + has-property-descriptors: 1.0.0 + dev: false + /setprototypeof@1.2.0: resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==} dev: false @@ -10736,11 +10776,11 @@ packages: resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==} dev: false - github.com/NearSocial/VM/8cdb3193c614bb64eb6a97c1cfd246e749ab17a1(@popperjs/core@2.11.8)(@types/react-dom@18.2.1)(@types/react@18.2.0)(near-api-js@2.1.3)(prop-types@15.8.1)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0): - resolution: {tarball: https://codeload.github.com/NearSocial/VM/tar.gz/8cdb3193c614bb64eb6a97c1cfd246e749ab17a1} - id: github.com/NearSocial/VM/8cdb3193c614bb64eb6a97c1cfd246e749ab17a1 + github.com/NearSocial/VM/a6ed652ff5ea296321e8a0eba09239da160cfa7b(@popperjs/core@2.11.8)(@types/react-dom@18.2.1)(@types/react@18.2.0)(near-api-js@2.1.3)(prop-types@15.8.1)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0): + resolution: {tarball: https://codeload.github.com/NearSocial/VM/tar.gz/a6ed652ff5ea296321e8a0eba09239da160cfa7b} + id: github.com/NearSocial/VM/a6ed652ff5ea296321e8a0eba09239da160cfa7b name: near-social-vm - version: 2.4.1 + version: 2.4.2 peerDependencies: near-api-js: 2.1.3 react: ^18.2.0 @@ -10787,7 +10827,7 @@ packages: idb: 7.1.1 iframe-resizer-react: 1.1.0(prop-types@15.8.1)(react-dom@18.2.0)(react@18.2.0) local-storage: 2.0.0 - lodash: 4.17.21 + lodash.clonedeep: 4.5.0 mdast-util-find-and-replace: 2.2.2 nanoid: 4.0.2 near-api-js: 2.1.3 From a7a6ed8f25aadf09953c1918fcc7ccb31e1a3f3b Mon Sep 17 00:00:00 2001 From: Charles Garrett Date: Wed, 20 Sep 2023 13:46:55 -0400 Subject: [PATCH 070/142] update icon for secondary focus area --- .github/ISSUE_TEMPLATE/secondary-focus-area.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/ISSUE_TEMPLATE/secondary-focus-area.md b/.github/ISSUE_TEMPLATE/secondary-focus-area.md index 3f5339308..96a7074ea 100644 --- a/.github/ISSUE_TEMPLATE/secondary-focus-area.md +++ b/.github/ISSUE_TEMPLATE/secondary-focus-area.md @@ -2,7 +2,7 @@ name: Secondary Focus Area about: This issue serves to help us propose and organize support for impactful work, as a secondary priority to epics & planned roadmap items -title: "\U0001F3AF [Secondary Focus Area] " +title: "\U0001F525 [Secondary Focus Area] " labels: '' assignees: '' From 985b81c1cb8d226f964fe73aa74aeafcf9a142f9 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 21 Sep 2023 21:21:49 +0200 Subject: [PATCH 071/142] Implement getPath function --- public/service-worker.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/public/service-worker.js b/public/service-worker.js index 6c5abf5d7..67f4a976c 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -67,7 +67,10 @@ const getOptions = ({ path, id }) => ({ }, }); -// Add error handling if data will not match +const getPath = ({ path }) => { + return `http://near.org/notifications/${path || ''}`; +}; + function handlePushEvent(event) { console.log('SW - push event received', event); From e15c6e9cb72fa1b0f9b0bd9026badf85d7cd1c5d Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 21 Sep 2023 21:22:06 +0200 Subject: [PATCH 072/142] Handle getPath in getOptions --- public/service-worker.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/service-worker.js b/public/service-worker.js index 67f4a976c..4713c4a52 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -63,7 +63,7 @@ const getOptions = ({ path, id }) => ({ tag: id, timestamp: Date.now(), data: { - path, // TODO: at this step change to full url + path: getPath({}), }, }); From 4a72227107c79a9ccd8b88be22c0a8a481f1d2c7 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Thu, 21 Sep 2023 21:22:30 +0200 Subject: [PATCH 073/142] Cleanup and comments --- public/service-worker.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/public/service-worker.js b/public/service-worker.js index 4713c4a52..efa0b5317 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -67,10 +67,13 @@ const getOptions = ({ path, id }) => ({ }, }); +// TODO: handle beta.near.org version redirection +// TODO: improve by redirecting to events path const getPath = ({ path }) => { return `http://near.org/notifications/${path || ''}`; }; +// TODO: Add error handling if data will not match function handlePushEvent(event) { console.log('SW - push event received', event); @@ -110,7 +113,7 @@ const getNotificationTitle = ({ accountId, notificationType }) => { }; const getNotificationOptions = ({ notificationType, ...rest }) => { - return NOTIFICATIONS_SCHEMA[notificationType].options({ ...rest }); + return NOTIFICATIONS_SCHEMA[notificationType].options(rest); }; self.addEventListener('install', (event) => console.log('SW - installing in progress.', event)); From e9aa635fc63be0b79100edd26370e6edd578eeb0 Mon Sep 17 00:00:00 2001 From: Dmitriy <34593263+shelegdmitriy@users.noreply.github.com> Date: Fri, 22 Sep 2023 19:25:48 +0300 Subject: [PATCH 074/142] Hide notifications preview on mobile (#594) * Hide notifications preview on mobile * Fix notification button alignment on mobile --- .../navigation/NotificationButton.tsx | 7 ++++++- src/components/navigation/mobile/MenuLeft.tsx | 17 +++++------------ 2 files changed, 11 insertions(+), 13 deletions(-) diff --git a/src/components/navigation/NotificationButton.tsx b/src/components/navigation/NotificationButton.tsx index a7f6756b1..8eff08edf 100644 --- a/src/components/navigation/NotificationButton.tsx +++ b/src/components/navigation/NotificationButton.tsx @@ -11,7 +11,11 @@ import { } from '@/utils/notificationsHelpers'; import { getNotificationLocalStorage } from '@/utils/notificationsLocalStorage'; -export function NotificationButton() { +type Props = { + mobileView?: boolean; +}; + +export function NotificationButton(props: Props) { const components = useBosComponents(); return ( @@ -26,6 +30,7 @@ export function NotificationButton() { getNotificationLocalStorage, handleOnCancelBanner, handleTurnOn, + mobileView: props.mobileView ?? false, }} /> ); diff --git a/src/components/navigation/mobile/MenuLeft.tsx b/src/components/navigation/mobile/MenuLeft.tsx index 69fd47aa1..f3e97ae2c 100644 --- a/src/components/navigation/mobile/MenuLeft.tsx +++ b/src/components/navigation/mobile/MenuLeft.tsx @@ -93,20 +93,13 @@ const StyledMenu = styled.div` margin-top: auto; display: flex; - .nav-notification-button { - margin: 0; - min-width: 46px; - min-height: 46px; - margin-right: 20px; - - a { + & > div { + &:first-child { + margin: 0 20px 0 0; min-width: 46px; min-height: 46px; } - } - - > div { - :nth-child(2) { + &:nth-child(2) { width: fill-available; > button { width: 100%; @@ -182,7 +175,7 @@ export function MenuLeft(props: Props) { )} {signedIn && (
- +
)} From bdff31ff7cab6150f4e012f90b83fdbfe44f8bd9 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 18:35:58 +0200 Subject: [PATCH 075/142] Redirect to beta.near.org --- public/service-worker.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/public/service-worker.js b/public/service-worker.js index efa0b5317..c5d97858f 100644 --- a/public/service-worker.js +++ b/public/service-worker.js @@ -67,10 +67,10 @@ const getOptions = ({ path, id }) => ({ }, }); -// TODO: handle beta.near.org version redirection +// TODO: handle beta.near.org and near.org version redirection // TODO: improve by redirecting to events path const getPath = ({ path }) => { - return `http://near.org/notifications/${path || ''}`; + return `http://beta.near.org/notifications/${path || ''}`; }; // TODO: Add error handling if data will not match From 832b7092c302d43d837d9d1910c0ba8d1fa7a564 Mon Sep 17 00:00:00 2001 From: Dmitriy Date: Tue, 19 Sep 2023 21:50:38 +0300 Subject: [PATCH 076/142] Show notiication modal for new users --- src/pages/index.tsx | 59 +++++++++++++++++++++++++++++++++------------ src/utils/types.ts | 12 +++++++++ 2 files changed, 56 insertions(+), 15 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 1b6a75eae..a54491245 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,6 +1,6 @@ import { isPassKeyAvailable } from '@near-js/biometric-ed25519'; import { useRouter } from 'next/router'; -import { useEffect, useState } from 'react'; +import { useCallback, useEffect, useMemo, useState } from 'react'; import { openToast } from '@/components/lib/Toast'; import { MetaTags } from '@/components/MetaTags'; @@ -13,8 +13,8 @@ import { useAuthStore } from '@/stores/auth'; import { useCurrentComponentStore } from '@/stores/current-component'; import { handleOnCancel, handleTurnOn, showNotificationModal } from '@/utils/notifications'; import { isNotificationSupported, isPermisionGranted, isPushManagerSupported } from '@/utils/notificationsHelpers'; -import { setNotificationsSessionStorage } from '@/utils/notificationsLocalStorage'; -import type { NextPageWithLayout } from '@/utils/types'; +import { setNotificationsSessionStorage, getNotificationLocalStorage } from '@/utils/notificationsLocalStorage'; +import type { NextPageWithLayout, TosData } from '@/utils/types'; const LS_ACCOUNT_ID = 'near-social-vm:v01::accountId:'; @@ -28,15 +28,48 @@ const HomePage: NextPageWithLayout = () => { const [componentProps, setComponentProps] = useState>({}); const [showNotificationModalState, setShowNotificationModalState] = useState(false); const accountId = useAuthStore((store) => store.accountId); + const [tosData, setTosData] = useState(null); + const cacheTosData = useMemo(() => tosData, [tosData?.latestTosVersion]); + + const handleModalCloseOnEsc = useCallback(() => { + setShowNotificationModalState(false); + }, []); + + const turnNotificationsOn = useCallback( + () => + handleTurnOn(accountId, () => { + setShowNotificationModalState(false); + }), + [], + ); + + const pauseNotifications = useCallback(() => { + handleOnCancel(); + setShowNotificationModalState(false); + }, []); + + const checkNotificationModal = useCallback(() => { + if (tosData && tosData.agreementsForUser.length > 0) { + // show notification modal for new users + const tosAccepted = + tosData.agreementsForUser[tosData.agreementsForUser.length - 1].value === tosData.latestTosVersion; + // check if user has already turned on notifications + const { permission } = getNotificationLocalStorage(); + + if (tosAccepted && !permission) { + setTimeout(() => { + setShowNotificationModalState(showNotificationModal()); + }, 5000); + } + } + }, [cacheTosData]); useEffect(() => { if (!signedIn) { return; } - - // disable while waiting for proper conditions for new and existing users - // setShowNotificationModalState(showNotificationModal()); - }, [signedIn]); + checkNotificationModal(); + }, [signedIn, cacheTosData]); useEffect(() => { const optimisticAccountId = window.localStorage.getItem(LS_ACCOUNT_ID); @@ -78,18 +111,13 @@ const HomePage: NextPageWithLayout = () => { src={components.nearOrg.notifications.alert} props={{ open: showNotificationModalState, - handleTurnOn: () => - handleTurnOn(accountId, () => { - setShowNotificationModalState(false); - }), - handleOnCancel: () => { - handleOnCancel(); - setShowNotificationModalState(false); - }, + handleTurnOn: turnNotificationsOn, + handleOnCancel: pauseNotifications, isNotificationSupported, isPermisionGranted, isPushManagerSupported, setNotificationsSessionStorage, + onOpenChange: handleModalCloseOnEsc, }} /> { targetProps: componentProps, targetComponent: components.default, tosName: components.tosContent, + recordToC: setTosData, }} /> diff --git a/src/utils/types.ts b/src/utils/types.ts index 0e71fba94..04138b1d8 100644 --- a/src/utils/types.ts +++ b/src/utils/types.ts @@ -32,6 +32,18 @@ type ProductionNetwork = { }; }; +export interface TosData { + showTos: boolean; + agreementsForUser: UserTosAgreement[]; + latestTosVersion: number; +} + +type UserTosAgreement = { + accountId: string; + blockHeight: number; + value: number; +}; + // type DevelopmentNetwork = { // networkId: 'localnet'; // viewAccountId: string; From d53ecdf1734be0ae292653972a5d7dae0aedf89e Mon Sep 17 00:00:00 2001 From: Dmitriy Date: Wed, 20 Sep 2023 14:45:26 +0300 Subject: [PATCH 077/142] Show notiication modal for existing users --- src/pages/index.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index a54491245..56f6fc8e9 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -54,12 +54,12 @@ const HomePage: NextPageWithLayout = () => { const tosAccepted = tosData.agreementsForUser[tosData.agreementsForUser.length - 1].value === tosData.latestTosVersion; // check if user has already turned on notifications - const { permission } = getNotificationLocalStorage(); + const { showOnTS } = getNotificationLocalStorage(); - if (tosAccepted && !permission) { + if ((tosAccepted && !showOnTS) || (tosAccepted && showOnTS < Date.now())) { setTimeout(() => { setShowNotificationModalState(showNotificationModal()); - }, 5000); + }, 10000); } } }, [cacheTosData]); From 62996ebde41888552e21e7ec1c60ab0c15727313 Mon Sep 17 00:00:00 2001 From: Charles Garrett Date: Mon, 25 Sep 2023 09:53:59 -0400 Subject: [PATCH 078/142] update token for sprint workflow --- .github/workflows/update-sprint-board.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/update-sprint-board.yml b/.github/workflows/update-sprint-board.yml index 8a0c8d1d9..2fa65ff39 100644 --- a/.github/workflows/update-sprint-board.yml +++ b/.github/workflows/update-sprint-board.yml @@ -13,7 +13,7 @@ jobs: with: owner: near number: 92 - token: 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 + token: ${{ secrets.GITHUB_TOKEN }} iteration-field: sprint iteration: last new-iteration: current From 87605c36e3795b25acd76586cb246b89a31b1874 Mon Sep 17 00:00:00 2001 From: Charles Garrett Date: Mon, 25 Sep 2023 09:59:29 -0400 Subject: [PATCH 079/142] Update update-sprint-board.yml --- .github/workflows/update-sprint-board.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/update-sprint-board.yml b/.github/workflows/update-sprint-board.yml index 2fa65ff39..487969476 100644 --- a/.github/workflows/update-sprint-board.yml +++ b/.github/workflows/update-sprint-board.yml @@ -1,7 +1,7 @@ on: schedule: # Runs "at 05:00, only on Sunday" - - cron: '0 5 * * 1' + - cron: '0 15 * * 2' jobs: move-to-next-iteration: From 1a77e40d9186bb7847cbac9adae98e036ec4c5ed Mon Sep 17 00:00:00 2001 From: Charles Garrett Date: Mon, 25 Sep 2023 10:00:40 -0400 Subject: [PATCH 080/142] run every 5 mins for testing update-sprint-board.yml --- .github/workflows/update-sprint-board.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/update-sprint-board.yml b/.github/workflows/update-sprint-board.yml index 487969476..7fdbc32c1 100644 --- a/.github/workflows/update-sprint-board.yml +++ b/.github/workflows/update-sprint-board.yml @@ -1,7 +1,7 @@ on: schedule: # Runs "at 05:00, only on Sunday" - - cron: '0 15 * * 2' + - cron: '*/5 * * * *' jobs: move-to-next-iteration: From 51a8d01ba0e4c465018d88214a883e0083852d26 Mon Sep 17 00:00:00 2001 From: Charles Garrett Date: Mon, 25 Sep 2023 10:20:17 -0400 Subject: [PATCH 081/142] Update update-sprint-board secret --- .github/workflows/update-sprint-board.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/update-sprint-board.yml b/.github/workflows/update-sprint-board.yml index 7fdbc32c1..d7402d7a9 100644 --- a/.github/workflows/update-sprint-board.yml +++ b/.github/workflows/update-sprint-board.yml @@ -13,7 +13,7 @@ jobs: with: owner: near number: 92 - token: ${{ secrets.GITHUB_TOKEN }} + token: ${{ secrets.CG_PROJECT_WORKFLOW_SECRET }} iteration-field: sprint iteration: last new-iteration: current From e905b75baf1946007f3baecb65c9c8c03345823d Mon Sep 17 00:00:00 2001 From: Charles Garrett Date: Mon, 25 Sep 2023 10:58:05 -0400 Subject: [PATCH 082/142] set schedule --- .github/workflows/update-sprint-board.yml | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/.github/workflows/update-sprint-board.yml b/.github/workflows/update-sprint-board.yml index d7402d7a9..3801fc5bf 100644 --- a/.github/workflows/update-sprint-board.yml +++ b/.github/workflows/update-sprint-board.yml @@ -1,7 +1,7 @@ on: schedule: - # Runs "at 05:00, only on Sunday" - - cron: '*/5 * * * *' + # Runs "at 05:00, only on Monday" + - cron: '0 5 * * 1' jobs: move-to-next-iteration: @@ -17,4 +17,4 @@ jobs: iteration-field: sprint iteration: last new-iteration: current - statuses: No status,Selected,Blocked,In Progress,review + statuses: No status,Selected,Blocked,In Progress,In Review,To Do From b340a7b205fc607140c12f2469ce6ee0d09f0df2 Mon Sep 17 00:00:00 2001 From: Caleb Jacob Date: Mon, 25 Sep 2023 10:00:25 -0600 Subject: [PATCH 083/142] Fix image display in global search type ahead dropdown --- .../navigation/desktop/DesktopNavigation.tsx | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/navigation/desktop/DesktopNavigation.tsx b/src/components/navigation/desktop/DesktopNavigation.tsx index 10521a2fb..776008db7 100644 --- a/src/components/navigation/desktop/DesktopNavigation.tsx +++ b/src/components/navigation/desktop/DesktopNavigation.tsx @@ -83,14 +83,14 @@ const StyledNavigation = styled.div` color: #9ba1a6; } } + } - img { - position: absolute; - right: 16px; - top: 10px; - width: 20px; - height: 20px; - } + .return-icon-image { + position: absolute; + right: 16px; + top: 10px; + width: 20px; + height: 20px; } .right-side-actions { @@ -198,7 +198,7 @@ export const DesktopNavigation = () => { )} - {searchIsFocused && Return} + {searchIsFocused && Return}
From f82f214f30fd65e784ac3700d6495c4752bc2a98 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:30:23 +0200 Subject: [PATCH 084/142] Implement getNotificationLocalStorage by accountId --- src/utils/notificationsLocalStorage.ts | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index 4a19f1ef9..dd239644c 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -93,3 +93,14 @@ export const setNotificationsSessionStorage = () => { export const getNotificationLocalStorage = () => isLocalStorageSupported() && JSON.parse(localStorage.getItem(NOTIFICATIONS_STORAGE) || '{}'); + +export const getNotificationLocalStorage = () => { + if (!isLocalStorageSupported()) { + return; + } + + const accountIdLS = getLSAccountId(); + + const notificationsLS = isLocalStorageSupported() && JSON.parse(localStorage.getItem(NOTIFICATIONS_STORAGE) || '{}'); + return notificationsLS[accountIdLS]; +}; From 2a0b7fa0a4a9de37c7d7c176b2995ba9dd3254df Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:30:39 +0200 Subject: [PATCH 085/142] Implement getLSAccountId --- src/utils/notificationsLocalStorage.ts | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index dd239644c..3a9819b8a 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -6,6 +6,14 @@ import { } from './notificationsHelpers'; export const NOTIFICATIONS_STORAGE = 'push-notifications-v0'; +const LS_ACCOUNT_ID = 'near-social-vm:v01::accountId:'; + +// sprawdzam +// near-social-vm:v01::accountId: + +const getLSAccountId = (): string => { + return localStorage.getItem(LS_ACCOUNT_ID) || ''; +}; export const setHandleOnCancel = () => { localStorage.setItem( From b3c251332e375cc139d0ef8ad124d3a13e08949e Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:30:49 +0200 Subject: [PATCH 086/142] Refactor setHandleOnCancel --- src/utils/notificationsLocalStorage.ts | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index 3a9819b8a..cd4ec0da0 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -16,10 +16,19 @@ const getLSAccountId = (): string => { }; export const setHandleOnCancel = () => { + const accountIdLS = getLSAccountId(); + const localStorageByAccountId = getNotificationLocalStorage(); + localStorage.setItem( NOTIFICATIONS_STORAGE, JSON.stringify({ - ...getNotificationLocalStorage(), + ...getNotificationLocalStorageFull(), + [accountIdLS]: { + ...localStorageByAccountId, + showOnTS: Date.now() + 86400000, // 14 days + notNowTS: Date.now(), + bannerNotNowTS: undefined, + }, showOnTS: Date.now() + 86400000, // 14 days notNowTS: Date.now(), bannerNotNowTS: undefined, From d04fddc1eff5f3bbaf58558948ddf897f6096eb2 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:31:07 +0200 Subject: [PATCH 087/142] Refactor setHandleOnCancelBanner --- src/utils/notificationsLocalStorage.ts | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index cd4ec0da0..2f4c66705 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -8,9 +8,6 @@ import { export const NOTIFICATIONS_STORAGE = 'push-notifications-v0'; const LS_ACCOUNT_ID = 'near-social-vm:v01::accountId:'; -// sprawdzam -// near-social-vm:v01::accountId: - const getLSAccountId = (): string => { return localStorage.getItem(LS_ACCOUNT_ID) || ''; }; @@ -37,10 +34,17 @@ export const setHandleOnCancel = () => { }; export const setHandleOnCancelBanner = () => { + const accountIdLS = getLSAccountId(); + const localStorageByAccountId = getNotificationLocalStorage(); + localStorage.setItem( NOTIFICATIONS_STORAGE, JSON.stringify({ - ...getNotificationLocalStorage(), + ...getNotificationLocalStorageFull(), + [accountIdLS]: { + ...localStorageByAccountId, + bannerNotNowTS: Date.now(), + }, bannerNotNowTS: Date.now(), }), ); From 6c78bd8a7a34999051d5ad098ca7deed45900d09 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:31:17 +0200 Subject: [PATCH 088/142] Refactor setProcessSuccess --- src/utils/notificationsLocalStorage.ts | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index 2f4c66705..00c40059a 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -51,10 +51,20 @@ export const setHandleOnCancelBanner = () => { }; export const setProcessSuccess = () => { + const accountIdLS = getLSAccountId(); + const localStorageByAccountId = getNotificationLocalStorage(); + localStorage.setItem( NOTIFICATIONS_STORAGE, JSON.stringify({ - ...getNotificationLocalStorage(), + ...getNotificationLocalStorageFull(), + [accountIdLS]: { + ...localStorageByAccountId, + permission: true, + subscribeStarted: false, + subscribeError: '', + isPermisionGranted: true, + }, permission: true, subscribeStarted: false, subscribeError: '', From 3b09762e678757e4a028dd0810b7a6669c8e4fc4 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:31:27 +0200 Subject: [PATCH 089/142] Refactor setProcessError --- src/utils/notificationsLocalStorage.ts | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index 00c40059a..f230f4453 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -74,10 +74,19 @@ export const setProcessSuccess = () => { }; export const setProcessError = (error: unknown) => { + const accountIdLS = getLSAccountId(); + const localStorageByAccountId = getNotificationLocalStorage(); + localStorage.setItem( NOTIFICATIONS_STORAGE, JSON.stringify({ - ...getNotificationLocalStorage(), + ...getNotificationLocalStorageFull(), + [accountIdLS]: { + ...localStorageByAccountId, + permission: false, + subscribeStarted: false, + subscribeError: error, + }, permission: false, subscribeStarted: false, subscribeError: error, From ff944d59234409dee89e1cb39a73d22100cdfce2 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:31:37 +0200 Subject: [PATCH 090/142] Refactor setProcessEnded --- src/utils/notificationsLocalStorage.ts | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index f230f4453..81b9d9222 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -95,10 +95,17 @@ export const setProcessError = (error: unknown) => { }; export const setProcessEnded = () => { + const accountIdLS = getLSAccountId(); + const localStorageByAccountId = getNotificationLocalStorage(); + localStorage.setItem( NOTIFICATIONS_STORAGE, JSON.stringify({ - ...getNotificationLocalStorage(), + ...getNotificationLocalStorageFull(), + [accountIdLS]: { + ...localStorageByAccountId, + subscribeStarted: false, + }, subscribeStarted: false, }), ); From c3c0d92a766a4ebbba5aa93b192f298efabb36b9 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:31:48 +0200 Subject: [PATCH 091/142] Refactor setProcessStarted --- src/utils/notificationsLocalStorage.ts | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index 81b9d9222..db7ff0b81 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -112,10 +112,18 @@ export const setProcessEnded = () => { }; export const setProcessStarted = () => { + const accountIdLS = getLSAccountId(); + const localStorageByAccountId = getNotificationLocalStorage(); + localStorage.setItem( NOTIFICATIONS_STORAGE, JSON.stringify({ - ...getNotificationLocalStorage(), + ...getNotificationLocalStorageFull(), + [accountIdLS]: { + ...localStorageByAccountId, + permission: false, + subscribeStarted: true, + }, permission: false, subscribeStarted: true, }), From 5986661907e4283d0509e96edb8d7652265ef0cc Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:32:00 +0200 Subject: [PATCH 092/142] Refactor setClearData --- src/utils/notificationsLocalStorage.ts | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index db7ff0b81..e282d6e1e 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -131,7 +131,15 @@ export const setProcessStarted = () => { }; export const setClearData = () => { - localStorage.setItem(NOTIFICATIONS_STORAGE, JSON.stringify({})); + const accountIdLS = getLSAccountId(); + + localStorage.setItem( + NOTIFICATIONS_STORAGE, + JSON.stringify({ + ...getNotificationLocalStorageFull(), + [accountIdLS]: {}, + }), + ); }; export const setNotificationsSessionStorage = () => { From d4397d7cc684d6f0c6b0c461f4486feb0eebc5bd Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Fri, 22 Sep 2023 20:32:28 +0200 Subject: [PATCH 093/142] Refactor setNotificationsSessionStorage --- src/utils/notificationsLocalStorage.ts | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index e282d6e1e..e6375f95e 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -143,10 +143,19 @@ export const setClearData = () => { }; export const setNotificationsSessionStorage = () => { + const accountIdLS = getLSAccountId(); + const localStorageByAccountId = getNotificationLocalStorage(); + localStorage.setItem( NOTIFICATIONS_STORAGE, JSON.stringify({ - ...getNotificationLocalStorage(), + ...getNotificationLocalStorageFull(), + [accountIdLS]: { + ...localStorageByAccountId, + isNotificationSupported: isNotificationSupported(), + isPushManagerSupported: isPushManagerSupported(), + isPermisionGranted: isPermisionGranted(), + }, isNotificationSupported: isNotificationSupported(), isPushManagerSupported: isPushManagerSupported(), isPermisionGranted: isPermisionGranted(), @@ -154,7 +163,7 @@ export const setNotificationsSessionStorage = () => { ); }; -export const getNotificationLocalStorage = () => +export const getNotificationLocalStorageFull = () => isLocalStorageSupported() && JSON.parse(localStorage.getItem(NOTIFICATIONS_STORAGE) || '{}'); export const getNotificationLocalStorage = () => { From 49dea50dcd80cf7149446e5bbc22b2c22a6629f4 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 26 Sep 2023 19:02:03 +0200 Subject: [PATCH 094/142] Fix --- src/pages/index.tsx | 2 +- src/utils/notificationsLocalStorage.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 56f6fc8e9..ec65c5ff1 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -54,7 +54,7 @@ const HomePage: NextPageWithLayout = () => { const tosAccepted = tosData.agreementsForUser[tosData.agreementsForUser.length - 1].value === tosData.latestTosVersion; // check if user has already turned on notifications - const { showOnTS } = getNotificationLocalStorage(); + const { showOnTS } = getNotificationLocalStorage() || {}; if ((tosAccepted && !showOnTS) || (tosAccepted && showOnTS < Date.now())) { setTimeout(() => { diff --git a/src/utils/notificationsLocalStorage.ts b/src/utils/notificationsLocalStorage.ts index e6375f95e..d307e9b8f 100644 --- a/src/utils/notificationsLocalStorage.ts +++ b/src/utils/notificationsLocalStorage.ts @@ -168,7 +168,7 @@ export const getNotificationLocalStorageFull = () => export const getNotificationLocalStorage = () => { if (!isLocalStorageSupported()) { - return; + return {}; } const accountIdLS = getLSAccountId(); From 29dce18ace2c082b5751a4a3c2aff6d04cd08736 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 26 Sep 2023 20:25:23 +0200 Subject: [PATCH 095/142] Create isIOS function --- src/utils/notifications.ts | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index 8ceee0547..651f08a9a 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -18,6 +18,17 @@ import { const applicationServerKey = 'BH_QFHjBU9x3VlmE9_XM4Awhm5vj2wF9WNQIz5wdlO6hc5anwEHLu6NLW521kCom7o9xChL5xvwTsHLK4dZpVVc'; const HOST = 'https://notification-server-mainnet-7tk2cmmtcq-ew.a.run.app'; +// Will be used for error handling in future works +const isIOS = () => { + const browserInfo = navigator.userAgent.toLowerCase(); + + return ( + browserInfo.match('iphone') || + browserInfo.match('ipad') || + ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) + ); +}; + const handleRequestPermission = () => Notification.requestPermission(); const registerServiceWorker = () => navigator.serviceWorker.register('/service-worker.js'); From 05b35e38871b39f3c0eb6e518ca10841e378fd5a Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 26 Sep 2023 20:27:44 +0200 Subject: [PATCH 096/142] web manifest --- public/site.webmanifest | 8 ++++++++ 1 file changed, 8 insertions(+) create mode 100644 public/site.webmanifest diff --git a/public/site.webmanifest b/public/site.webmanifest new file mode 100644 index 000000000..f52e42873 --- /dev/null +++ b/public/site.webmanifest @@ -0,0 +1,8 @@ +{ + "name": "NEAR | The OS for an Open Web", + "short_name": "NEAR isn't just a Layer 1 blockchain — it's the Blockchain Operating System for an Open Web.", + "icons": [], + "theme_color": "#ffffff", + "background_color": "#ffffff", + "display": "standalone" +} From f3f99a6378dc0456c1b5e4d00746ba676f55d180 Mon Sep 17 00:00:00 2001 From: marcinbodnar Date: Tue, 26 Sep 2023 20:27:55 +0200 Subject: [PATCH 097/142] Link --- src/pages/_app.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 152c8dbdd..693ea6db1 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -83,6 +83,7 @@ export default function App({ Component, pageProps }: AppPropsWithLayout) { <> + Date: Tue, 26 Sep 2023 16:25:33 -0400 Subject: [PATCH 098/142] Update shortname and name per creative guidelines --- public/site.webmanifest | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/public/site.webmanifest b/public/site.webmanifest index f52e42873..cbf188eac 100644 --- a/public/site.webmanifest +++ b/public/site.webmanifest @@ -1,6 +1,6 @@ { - "name": "NEAR | The OS for an Open Web", - "short_name": "NEAR isn't just a Layer 1 blockchain — it's the Blockchain Operating System for an Open Web.", + "name": "NEAR isn't just a Layer 1 blockchain — it's the platform for an Open Web.", + "short_name": "NEAR", "icons": [], "theme_color": "#ffffff", "background_color": "#ffffff", From fcab38f79f334460184c5e770b52a2589f041113 Mon Sep 17 00:00:00 2001 From: Caleb Jacob Date: Wed, 27 Sep 2023 17:00:31 -0600 Subject: [PATCH 099/142] Implement new desktop header design --- .../navigation/NotificationButton.tsx | 35 +- .../navigation/desktop/DesktopNavigation.tsx | 217 ++++--- .../navigation/desktop/MainNavigationMenu.tsx | 571 ++++-------------- src/components/navigation/org-links.ts | 174 ++++++ 4 files changed, 410 insertions(+), 587 deletions(-) diff --git a/src/components/navigation/NotificationButton.tsx b/src/components/navigation/NotificationButton.tsx index 8eff08edf..5e27e60f3 100644 --- a/src/components/navigation/NotificationButton.tsx +++ b/src/components/navigation/NotificationButton.tsx @@ -1,4 +1,5 @@ import React from 'react'; +import styled from 'styled-components'; import { VmComponent } from '@/components/vm/VmComponent'; import { useBosComponents } from '@/hooks/useBosComponents'; @@ -15,23 +16,29 @@ type Props = { mobileView?: boolean; }; +const Wrapper = styled.div` + margin: 0 -1rem; +`; + export function NotificationButton(props: Props) { const components = useBosComponents(); return ( - + + + ); } diff --git a/src/components/navigation/desktop/DesktopNavigation.tsx b/src/components/navigation/desktop/DesktopNavigation.tsx index 776008db7..c44b7a4b9 100644 --- a/src/components/navigation/desktop/DesktopNavigation.tsx +++ b/src/components/navigation/desktop/DesktopNavigation.tsx @@ -1,6 +1,7 @@ import Image from 'next/image'; import Link from 'next/link'; import { useRouter } from 'next/router'; +import type { FormEvent } from 'react'; import { useEffect, useRef, useState } from 'react'; import styled from 'styled-components'; @@ -10,7 +11,6 @@ import { useSignInRedirect } from '@/hooks/useSignInRedirect'; import { useAuthStore } from '@/stores/auth'; import { recordEvent } from '@/utils/analytics'; -import LogoBlack from '../icons/logo-black.svg'; import NearLogotype from '../icons/near-logotype.svg'; import ReturnIconImage from '../icons/return.svg'; import SearchIconImage from '../icons/search.svg'; @@ -19,87 +19,76 @@ import { MainNavigationMenu } from './MainNavigationMenu'; import { TypeAheadDropdown } from './TypeAheadDropdown'; import { UserDropdownMenu } from './UserDropdownMenu'; -const StyledNavigation = styled.div` +const Wrapper = styled.div<{ + scrolled?: boolean; +}>` + --nav-height: 75px; z-index: 1000; position: sticky; top: 0; left: 0; right: 0; background-color: white; - padding-top: 16px; - padding-bottom: 16px; + height: var(--nav-height); + box-shadow: ${(p) => (p.scrolled ? '0 1px 0 var(--sand6)' : 'none')}; +`; - &.border-bottom { - border-bottom: 1px solid #e3e3e0; - } +const Container = styled.div` + display: flex; + align-items: center; + justify-content: center; + height: 100%; + margin: 0 auto; +`; - a { - :hover { - text-decoration: none; - cursor: pointer; - } - } +const Logo = styled.a` + text-decoration: none; + cursor: pointer; img { width: 110px; - &.logo-only { - width: 27px; - height: 27px; - } - } - - .container-wrapper { - display: flex; - align-items: center; - justify-content: center; } +`; - nav { - margin: 0 auto; - } - - .form-wrapper { - position: relative; - z-index: 10; - - input { - background-repeat: no-repeat; - border-radius: 50px; - padding: 7px 25px 7px 44px; - background-position: 12px 8px; - border: 1px solid #e3e3e0; - background-color: white; - font-size: 16px; - margin-left: 30px; - width: 200px; - - :focus { - outline: 0; - border: 1px solid #6d62d4; - box-shadow: 0px 0px 0px 4px #cbc7f4; - } - - ::placeholder { - color: #9ba1a6; +const Search = styled.div` + position: relative; + z-index: 10; + + input { + background-repeat: no-repeat; + border-radius: 50px; + padding: 7px 25px 7px 44px; + background-position: 12px 8px; + border: 1px solid var(--sand6); + background-color: white; + font-size: 16px; + margin-left: 30px; + width: 200px; + transition: all 200ms; + + :focus { + outline: 0; + border-color: var(--violet8); + box-shadow: 0px 0px 0px 4px var(--violet4); + + & ~ img { + opacity: 1; } } - } - .return-icon-image { - position: absolute; - right: 16px; - top: 10px; - width: 20px; - height: 20px; - } + ::placeholder { + color: #9ba1a6; + } - .right-side-actions { - display: flex; - align-items: center; - margin-left: auto; - position: relative; - z-index: 10; - gap: 10px; + & ~ img { + position: absolute; + right: 16px; + top: 10px; + width: 20px; + height: 20px; + opacity: 0; + transition: all 200ms; + } } `; @@ -110,6 +99,15 @@ const TypeAheadDropdownContainer = styled.div` margin-top: 10px; `; +const Actions = styled.div` + display: flex; + align-items: center; + margin-left: auto; + position: relative; + z-index: 10; + gap: 10px; +`; + export const DesktopNavigation = () => { const [scrolled, setScrolled] = useState(false); const router = useRouter(); @@ -122,17 +120,6 @@ export const DesktopNavigation = () => { const signedIn = useAuthStore((store) => store.signedIn); const { requestAuthentication } = useSignInRedirect(); - const setSearchIsFocused = (isFocused: boolean) => { - if (isFocused) { - _setSearchIsFocused(true); - clearTimeout(searchFocusTimeout.current); - } else { - searchFocusTimeout.current = setTimeout(() => { - _setSearchIsFocused(false); - }, 100); - } - }; - useEffect(() => { const handleScroll = () => { if (window.scrollY > 0) { @@ -149,36 +136,44 @@ export const DesktopNavigation = () => { }; }, []); - function handleSignIn() { + const setSearchIsFocused = (isFocused: boolean) => { + if (isFocused) { + _setSearchIsFocused(true); + clearTimeout(searchFocusTimeout.current); + } else { + searchFocusTimeout.current = setTimeout(() => { + _setSearchIsFocused(false); + }, 100); + } + }; + + const handleSignIn = () => { requestAuthentication(); - } + }; - function handleCreateAccount() { + const handleCreateAccount = () => { requestAuthentication(true); - } + }; + + const handleSearchSubmit = (e: FormEvent) => { + e.preventDefault(); + router.push(`/${components.search.indexPage}?term=${encodeURIComponent(searchTerm)}`); + setSearchIsFocused(false); + }; return ( - -
- - NEAR + + + + + NEAR + -
-
{ - e.preventDefault(); - router.push(`/${components.search.indexPage}?term=${encodeURIComponent(searchTerm)}`); - setSearchIsFocused(false); - }} - > + + { setSearchIsFocused(true); @@ -190,6 +185,7 @@ export const DesktopNavigation = () => { onChange={(e) => setSearchTerm(e.target.value)} ref={searchRef} /> + Return {showTypeAheadDropdown && ( @@ -197,25 +193,24 @@ export const DesktopNavigation = () => { )} +
- {searchIsFocused && Return} -
-
- {!signedIn && ( - <> -
-
- + + + ); }; diff --git a/src/components/navigation/desktop/MainNavigationMenu.tsx b/src/components/navigation/desktop/MainNavigationMenu.tsx index b50f0491c..3fa5d5000 100644 --- a/src/components/navigation/desktop/MainNavigationMenu.tsx +++ b/src/components/navigation/desktop/MainNavigationMenu.tsx @@ -1,506 +1,153 @@ import * as NavigationMenu from '@radix-ui/react-navigation-menu'; -import classNames from 'classnames'; import Link from 'next/link'; -import type { ReactNode } from 'react'; -import { forwardRef } from 'react'; import styled from 'styled-components'; -import { useAuthStore } from '@/stores/auth'; import { recordMouseEnter } from '@/utils/analytics'; -import { CurrentComponent } from '../CurrentComponent'; -import { navLinkData } from '../org-links'; +import { navCategories } from '../org-links'; const Wrapper = styled.div` - .NavigationMenuRoot { - display: flex; - align-items: center; - } - - .NavigationMenuList { - display: flex; - justify-content: center; - background-color: white; - padding: 4px; - border-radius: 6px; - list-style: none; - margin: 0; - } - - .NavigationMenuTrigger, - .NavigationMenuLink { - all: unset; - padding: 8px 14px; - outline: none; - user-select: none; - font-weight: 600; - line-height: 1; - border-radius: 4px; - font-size: 14px; - color: #1b1b18; - } - .NavigationMenuTrigger:focus, - .NavigationMenuLink:focus { - color: #6d62d4; - } - .NavigationMenuTrigger:hover, - .NavigationMenuLink:hover { - color: #6d62d4; - } - - .NavigationMenuTrigger { - display: flex; - align-items: center; - justify-content: space-between; - gap: 2px; - } - - .NavigationMenuLink { - display: block; - text-decoration: none; - font-size: 14px; - line-height: 1; - font-weight: 600; - } - - .NavigationMenuContent { - position: absolute; - top: 0; - left: 0; - width: 100%; - animation-duration: 250ms; - animation-timing-function: ease; - } - - .NavigationMenuContent .current-component { - margin: 10px 0 10px 10px; - } - - .develop { - display: flex; - } - - .develop div { - flex: 1; - } - - .develop .one { - display: flex; - flex-direction: column; - flex: 1; - } - - .NavigationMenuContent[data-motion='from-start'] { - animation-name: enterFromLeft; - } - .NavigationMenuContent[data-motion='from-end'] { - animation-name: enterFromRight; - } - .NavigationMenuContent[data-motion='to-start'] { - animation-name: exitToLeft; - } - .NavigationMenuContent[data-motion='to-end'] { - animation-name: exitToRight; - } - @media only screen and (min-width: 600px) { - .NavigationMenuContent { - width: auto; - } - } - - .NavigationMenuIndicator { - display: flex; - align-items: flex-end; - justify-content: center; - height: 10px; - top: 100%; - overflow: hidden; - z-index: 1; - transition: width, transform 250ms ease; - } - .NavigationMenuIndicator[data-state='visible'] { - animation: fadeIn 200ms ease; - } - .NavigationMenuIndicator[data-state='hidden'] { - animation: fadeOut 200ms ease; - } - - .NavigationMenuViewport { - position: relative; - transform-origin: top center; - margin-top: 10px; - width: 100%; - background-color: white; - border-radius: 6px; - overflow: hidden; - box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.06), 0px 4px 8px rgba(0, 0, 0, 0.06); - height: var(--radix-navigation-menu-viewport-height); - transition: width, height, 300ms ease; - } - .NavigationMenuViewport[data-state='open'] { - animation: scaleIn 200ms ease; - } - .NavigationMenuViewport[data-state='closed'] { - animation: scaleOut 200ms ease; - } - @media only screen and (min-width: 600px) { - .NavigationMenuViewport { - width: var(--radix-navigation-menu-viewport-width); - } - } - - .List { - display: grid; - padding: 22px; - margin: 0; - column-gap: 10px; - list-style: none; - } - @media only screen and (min-width: 600px) { - .List.one { - width: 500px; - grid-template-columns: 0.75fr 1fr; - } - .List.two { - width: 400px; - grid-auto-flow: column; - grid-template-rows: repeat(3, 1fr); - } - } - - .ListItemLink { - display: block; - outline: none; - text-decoration: none; - user-select: none; - padding: 16px 8px 4px 8px; - padding-left: 55px; - border-radius: 6px; - font-size: 15px; - line-height: 1; - position: relative; - } - .ListItemLink i { - position: absolute; - top: 50%; - left: 16px; - transform: translateY(-50%); - font-size: 22px; - color: #706f6c; - } - - .ListItemLink:hover { - text-decoration: none; - background-color: #f3f3f2; - } + position: relative; + display: flex; + justify-content: center; + z-index: 1; + flex-grow: 1; + height: var(--nav-height); +`; - .ListItemHeading { - font-weight: 500; - line-height: 1.2; - margin-bottom: 5px; - color: #1b1b18; - } +const NavRoot = styled(NavigationMenu.Root)` + height: 100%; - .ListItemText { - line-height: 1.4; - font-weight: initial; - color: #868682; - } - - .Callout { - display: flex; - justify-content: flex-end; - flex-direction: column; - width: 100%; + > div { height: 100%; - border-radius: 6px; - padding: 25px; - text-decoration: none; - outline: none; - user-select: none; } +`; - .CalloutHeading { - color: white; - font-size: 18px; - font-weight: 500; - line-height: 1.2; - margin-top: 16px; - margin-bottom: 7px; - } +const NavList = styled(NavigationMenu.List)` + display: flex; + justify-content: center; + list-style: none; + margin: 0; + padding: 0; + height: 100%; +`; - .CalloutText { - font-size: 14px; - line-height: 1.3; - } +const NavItem = styled(NavigationMenu.Item)` + position: relative; + height: 100%; +`; - .ViewportPosition { - position: absolute; - display: flex; - justify-content: center; - width: 100%; - top: 100%; - left: 0; - perspective: 2000px; - } +const NavTrigger = styled(NavigationMenu.Trigger)` + all: unset; + font: var(--text-s); + color: var(--sand12); + font-weight: 600; + padding: 0 1rem; + height: 100%; + display: flex; + align-items: center; +`; - @keyframes enterFromRight { - from { - opacity: 0; - transform: translateX(200px); - } - to { - opacity: 1; - transform: translateX(0); - } - } +const NavContent = styled(NavigationMenu.Content)` + display: grid; + grid-template-columns: 1fr 1fr; + position: absolute; + top: 100%; + left: 0; + padding: 16px 0; + transform-origin: center top; + animation: fadeIn 200ms; + background: var(--white); + box-shadow: 0 2px 20px rgba(0, 0, 0, 0.2); + clip-path: inset(0px -100px -100px -100px); - @keyframes enterFromLeft { + @keyframes fadeIn { from { opacity: 0; - transform: translateX(-200px); + transform: scale(1, 0.5); } to { opacity: 1; - transform: translateX(0); + transform: scale(1, 1); } } +`; - @keyframes exitToRight { - from { - opacity: 1; - transform: translateX(0); - } - to { - opacity: 0; - transform: translateX(200px); - } +const NavLink = styled(NavigationMenu.Link)` + display: inline-block; + min-width: 120px; + padding: 8px 0; + font: var(--text-s); + color: var(--sand10); + transition: color 200ms; + white-space: nowrap; + + &:hover, + &:focus, + &:active { + color: var(--sand12); + text-decoration: none; + outline: none; } - @keyframes exitToLeft { - from { - opacity: 1; - transform: translateX(0); - } - to { - opacity: 0; - transform: translateX(-200px); - } + &:focus { + text-decoration: underline; } +`; - @keyframes scaleIn { - from { - opacity: 0; - transform: rotateX(-30deg) scale(0.9); - } - to { - opacity: 1; - transform: rotateX(0deg) scale(1); - } - } +const Section = styled.div` + display: flex; + flex-direction: column; + padding: 24px 24px 0; - @keyframes scaleOut { - from { - opacity: 1; - transform: rotateX(0deg) scale(1); - } - to { - opacity: 0; - transform: rotateX(-10deg) scale(0.95); - } + &:nth-child(1), + &:nth-child(2) { + padding-top: 0; } - @keyframes fadeIn { - from { - opacity: 0; - } - to { - opacity: 1; - } + &:nth-child(odd) { + border-right: 1px solid var(--sand4); } - @keyframes fadeOut { - from { - opacity: 1; - } - to { - opacity: 0; - } + &:first-child:last-child { + border-right: none; } `; -const ListItem = forwardRef< - HTMLAnchorElement, - { className?: string; children: ReactNode; title: string; route?: string; href?: string } ->(({ className, children, title, ...props }, forwardedRef) => { - if (props.route) { - return ( -
  • - - -
    {title}
    -

    {children}

    - -     -
    • - ); - } else { - return ( -
  • - - -
    {title}
    -

    {children}

    -     -     -
    • - ); - } -}); -ListItem.displayName = 'ListItem'; +const SectionTitle = styled.p` + font: var(--text-s); + color: var(--sand12); + font-weight: 600; + padding: 8px 0; + margin: 0; +`; export const MainNavigationMenu = () => { - const signedIn = useAuthStore((store) => store.signedIn); - return ( - - - {signedIn && ( - - - - Home - - - - )} - - - Discover - - -
      - - - {navLinkData.components.description} - - - - {navLinkData.applications.description} - - - - {navLinkData.gateways.description} - -
    -     -     - - - - Develop - - - -
      - - - {navLinkData.sandbox.description} - - - - {navLinkData.documentation.description} - - - - {navLinkData.tutorials.description} - -
    -     -     - - - - Connect - - -
      - - - {navLinkData.people.description} - - - - {navLinkData.ecosystem.description} - - - - {navLinkData.events.description} - -
    -     -     - - - - Solutions - - -
      - - - {navLinkData.developers.description} - - - - {navLinkData.founders.description} - - - - {navLinkData.earlyAdopters.description} - -
    -     -     - - - - More - - -
      - - - {navLinkData.about.description} - - - - {navLinkData.news.description} - - - - {navLinkData.learn.description} - -
    -     -     - - -
    - - - -
    - -
    - + + + {navCategories.map((category) => ( + + {category.title} + + + {category.sections.map((section) => ( +
    + {section.title && {section.title}} + + {section.links.map((link) => ( + + {link.title} + + ))} +
    + ))} +     +     + ))} +     +     ); }; diff --git a/src/components/navigation/org-links.ts b/src/components/navigation/org-links.ts index 1a46ffb22..e0b4bfae9 100644 --- a/src/components/navigation/org-links.ts +++ b/src/components/navigation/org-links.ts @@ -1,3 +1,177 @@ +export const navCategories = [ + { + title: 'Platform', + sections: [ + { + title: 'Blockchain OS', + links: [ + { + title: 'Decentralized Front-Ends', + url: 'https://docs.near.org/bos/components', + }, + { + title: 'Decentralized Hosting', + url: 'https://docs.near.org/bos/tutorial/bos-gateway', + }, + { + title: 'Data Platform', + url: 'https://docs.near.org/concepts/data-flow/data-storage', + }, + { + title: 'Fast Auth', + url: 'https://docs.near.org/tools/fastauth-sdk', + }, + { + title: 'Near Protocol', + url: 'https://docs.near.org/concepts/web3/near', + }, + ], + }, + { + title: 'Discover', + links: [ + { + title: 'Applications', + url: '/applications', + }, + { + title: 'Gateways', + url: 'https://near.org/gateways', + }, + ], + }, + ], + }, + + { + title: 'Developers', + sections: [ + { + title: 'Resources', + links: [ + { + title: 'Documentation', + url: 'https://docs.near.org', + }, + { + title: 'Sandbox', + url: '/sandbox', + }, + { + title: 'Tutorials', + url: 'https://docs.near.org/bos/tutorial/quickstart', + }, + { + title: 'GitHub', + url: 'https://github.com/near', + }, + ], + }, + { + title: 'Discover', + links: [ + { + title: 'Components', + url: '/components', + }, + { + title: 'Standards & Proposals', + url: 'https://github.com/near/NEPs', + }, + ], + }, + { + title: 'Tools', + links: [ + { + title: 'VS Code Extension', + url: 'https://docs.near.org/bos/dev/vscode', + }, + { + title: 'BOS Loader', + url: 'https://docs.near.org/bos/dev/bos-loader', + }, + { + title: 'APIs', + url: 'https://docs.near.org/bos/api/home', + }, + { + title: 'SDKs', + url: 'https://docs.near.org/sdk/welcome', + }, + { + title: 'Command Line Tools', + url: 'https://github.com/bos-cli-rs/bos-cli-rs', + }, + { + title: 'View All', + url: 'https://docs.near.org/tools/welcome', + }, + ], + }, + ], + }, + + { + title: 'Community', + sections: [ + { + title: 'Ecosystem', + links: [ + { + title: 'Overview', + url: '/ecosystem', + }, + { + title: 'News', + url: 'https://near.org/nearweekapp.near/widget/nearweek-news', + }, + { + title: 'Events', + url: '/events', + }, + ], + }, + { + title: 'Discover', + links: [ + { + title: 'People', + url: '/people', + }, + ], + }, + ], + }, + + { + title: 'About', + sections: [ + { + title: null, + links: [ + { + title: 'Learn', + url: '/learn', + }, + { + title: 'Blog', + url: '/blog', + }, + { + title: 'Careers', + url: 'https://careers.near.org/jobs', + }, + { + title: 'Contact Us', + url: 'https://pages.near.org/about/contact-us/', + }, + ], + }, + ], + }, +]; + export const navLinkData = { components: { title: 'Components', From 4e5910d937a4b569f83121dd333e217bb47f79ab Mon Sep 17 00:00:00 2001 From: Caleb Jacob Date: Thu, 28 Sep 2023 13:11:26 -0600 Subject: [PATCH 100/142] Implement new mobile header design, desktop fixes --- src/components/banners/NearconBanner.tsx | 13 +- src/components/layouts/DefaultLayout.tsx | 2 - src/components/navigation/Navigation.tsx | 4 +- .../{desktop => }/UserDropdownMenu.tsx | 42 ++- .../navigation/desktop/DesktopNavigation.tsx | 119 +++--- .../navigation/desktop/MainNavigationMenu.tsx | 73 ++-- .../icons/{logo-black.svg => near-icon.svg} | 0 .../{near-logotype.svg => near-logo.svg} | 0 .../navigation/mobile/AccordionMenu.tsx | 354 +++++------------- src/components/navigation/mobile/Menu.tsx | 135 +++++++ src/components/navigation/mobile/MenuLeft.tsx | 186 --------- .../navigation/mobile/MobileNavigation.tsx | 145 ++++++- .../navigation/mobile/TopNavigation.tsx | 184 --------- ...{org-links.ts => navigation-categories.ts} | 80 +--- 14 files changed, 508 insertions(+), 829 deletions(-) rename src/components/navigation/{desktop => }/UserDropdownMenu.tsx (89%) rename src/components/navigation/icons/{logo-black.svg => near-icon.svg} (100%) rename src/components/navigation/icons/{near-logotype.svg => near-logo.svg} (100%) create mode 100644 src/components/navigation/mobile/Menu.tsx delete mode 100644 src/components/navigation/mobile/MenuLeft.tsx delete mode 100644 src/components/navigation/mobile/TopNavigation.tsx rename src/components/navigation/{org-links.ts => navigation-categories.ts} (62%) diff --git a/src/components/banners/NearconBanner.tsx b/src/components/banners/NearconBanner.tsx index 68d947a7f..58e5dd126 100644 --- a/src/components/banners/NearconBanner.tsx +++ b/src/components/banners/NearconBanner.tsx @@ -7,6 +7,10 @@ import { Button } from '@/components/lib/Button'; import { useBanner } from '@/hooks/useBanner'; import { useCurrentComponentStore } from '@/stores/current-component'; +type Props = { + inline?: boolean; +}; + type FlexProps = { gap?: string; alignItems?: string; @@ -15,8 +19,11 @@ type FlexProps = { wrap?: string; }; -const Wrapper = styled.div` +const Wrapper = styled.div<{ + inline?: boolean; +}>` background: #00ec97; + border-radius: ${(p) => (p.inline ? '5px' : 0)}; .banner-button { font-size: 14px; @@ -65,7 +72,7 @@ const Flex = styled.div` } `; -export const NearconBanner = () => { +export const NearconBanner = (props: Props) => { const [isBannerVisible, setBanners] = useBanner(); const componentSrc = useCurrentComponentStore(); const isNearconWidget = componentSrc && componentSrc.src?.includes('nearcon23.near/widget/Index'); @@ -77,7 +84,7 @@ export const NearconBanner = () => { if (!isBannerVisible || isNearconWidget) return null; return ( - + nearcon-banner diff --git a/src/components/layouts/DefaultLayout.tsx b/src/components/layouts/DefaultLayout.tsx index c0294ca50..806ffeead 100644 --- a/src/components/layouts/DefaultLayout.tsx +++ b/src/components/layouts/DefaultLayout.tsx @@ -1,6 +1,5 @@ import type { ReactNode } from 'react'; -import { NearconBanner } from '../banners/NearconBanner'; import { BosLoaderBanner } from '../BosLoaderBanner'; import { Navigation } from '../navigation/Navigation'; @@ -11,7 +10,6 @@ interface Props { export function DefaultLayout({ children }: Props) { return ( <> - diff --git a/src/components/navigation/Navigation.tsx b/src/components/navigation/Navigation.tsx index 49391c527..24904f607 100644 --- a/src/components/navigation/Navigation.tsx +++ b/src/components/navigation/Navigation.tsx @@ -7,11 +7,11 @@ export const Navigation = () => { const [matches, setMatches] = useState(true); useEffect(() => { - setMatches(window.matchMedia('(min-width: 1025px)').matches); + setMatches(window.matchMedia('(min-width: 1100px)').matches); }, []); useEffect(() => { - window.matchMedia('(min-width: 1025px)').addEventListener('change', (e) => setMatches(e.matches)); + window.matchMedia('(min-width: 1100px)').addEventListener('change', (e) => setMatches(e.matches)); }, []); return ( diff --git a/src/components/navigation/desktop/UserDropdownMenu.tsx b/src/components/navigation/UserDropdownMenu.tsx similarity index 89% rename from src/components/navigation/desktop/UserDropdownMenu.tsx rename to src/components/navigation/UserDropdownMenu.tsx index 860b21ae8..d7b397e49 100644 --- a/src/components/navigation/desktop/UserDropdownMenu.tsx +++ b/src/components/navigation/UserDropdownMenu.tsx @@ -8,14 +8,23 @@ import { useBosComponents } from '@/hooks/useBosComponents'; import { useAuthStore } from '@/stores/auth'; import { useVmStore } from '@/stores/vm'; -const StyledDropdown = styled.div` +const Wrapper = styled.div` > button { all: unset; display: flex; align-items: center; border-radius: 50px; - background-color: #161615; + background-color: var(--sand12); padding: 4px; + transition: all 200ms; + + &:hover { + background-color: var(--black); + } + + &:focus { + box-shadow: 0 0 0 4px var(--violet4); + } } .d-inline-block { width: unset !important; @@ -53,11 +62,10 @@ const StyledDropdown = styled.div` } .DropdownMenuContent { - min-width: 220px; background-color: #161615; border-radius: 6px; margin-top: 11px; - padding: 5px; + padding: 12px; box-shadow: 0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2); animation-duration: 600ms; animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1); @@ -85,9 +93,8 @@ const StyledDropdown = styled.div` border-radius: 3px; display: flex; align-items: center; - padding: 10px; + padding: 12px; position: relative; - padding-left: 25px; user-select: none; outline: none; } @@ -145,6 +152,25 @@ const StyledDropdown = styled.div` transform: translateX(0); } } + + @media (max-width: 800px) { + .profile-info, + .ph { + display: none; + } + + > button { + background: var(--sand6); + padding: 1px; + } + + .d-inline-block { + img { + width: 43px !important; + height: 43px !important; + } + } + } `; export const UserDropdownMenu = () => { @@ -161,7 +187,7 @@ export const UserDropdownMenu = () => { }, [near]); return ( - + { - + ); }; diff --git a/src/components/navigation/desktop/DesktopNavigation.tsx b/src/components/navigation/desktop/DesktopNavigation.tsx index c44b7a4b9..6fa363372 100644 --- a/src/components/navigation/desktop/DesktopNavigation.tsx +++ b/src/components/navigation/desktop/DesktopNavigation.tsx @@ -5,19 +5,20 @@ import type { FormEvent } from 'react'; import { useEffect, useRef, useState } from 'react'; import styled from 'styled-components'; +import { NearconBanner } from '@/components/banners/NearconBanner'; import { Button } from '@/components/lib/Button'; import { useBosComponents } from '@/hooks/useBosComponents'; import { useSignInRedirect } from '@/hooks/useSignInRedirect'; import { useAuthStore } from '@/stores/auth'; import { recordEvent } from '@/utils/analytics'; -import NearLogotype from '../icons/near-logotype.svg'; +import NearLogo from '../icons/near-logo.svg'; import ReturnIconImage from '../icons/return.svg'; import SearchIconImage from '../icons/search.svg'; import { NotificationButton } from '../NotificationButton'; +import { UserDropdownMenu } from '../UserDropdownMenu'; import { MainNavigationMenu } from './MainNavigationMenu'; import { TypeAheadDropdown } from './TypeAheadDropdown'; -import { UserDropdownMenu } from './UserDropdownMenu'; const Wrapper = styled.div<{ scrolled?: boolean; @@ -44,6 +45,14 @@ const Container = styled.div` const Logo = styled.a` text-decoration: none; cursor: pointer; + outline: none; + margin-right: auto; + transition: all 200ms; + + &:hover, + &:focus { + opacity: 0.5; + } img { width: 110px; @@ -69,7 +78,7 @@ const Search = styled.div` :focus { outline: 0; border-color: var(--violet8); - box-shadow: 0px 0px 0px 4px var(--violet4); + box-shadow: 0 0 0 4px var(--violet4); & ~ img { opacity: 1; @@ -162,55 +171,59 @@ export const DesktopNavigation = () => { }; return ( - - - - - NEAR - - - - -
    - { - setSearchIsFocused(true); - recordEvent('click-navigation-search'); - }} - onBlur={() => { - setSearchIsFocused(false); - }} - onChange={(e) => setSearchTerm(e.target.value)} - ref={searchRef} - /> - Return -
    - - {showTypeAheadDropdown && ( - - - - )} -     - - - - - {signedIn ? ( - <> - - - - ) : ( - <> - - - - {!signedIn && ( -
    -
    - )} - {signedIn && ( -
    - - -
    - )} -
    -
    - - ); -} diff --git a/src/components/navigation/mobile/MobileNavigation.tsx b/src/components/navigation/mobile/MobileNavigation.tsx index 8d1a13a54..904dc1bb0 100644 --- a/src/components/navigation/mobile/MobileNavigation.tsx +++ b/src/components/navigation/mobile/MobileNavigation.tsx @@ -1,28 +1,137 @@ -import { useCallback, useState } from 'react'; +import Image from 'next/image'; +import Link from 'next/link'; +import { useState } from 'react'; +import styled from 'styled-components'; -import { useScrollBlock } from '@/hooks/useScrollBlock'; +import { Button } from '@/components/lib/Button'; +import { useSignInRedirect } from '@/hooks/useSignInRedirect'; +import { useAuthStore } from '@/stores/auth'; -import { MenuLeft } from './MenuLeft'; -import { TopNavigation } from './TopNavigation'; +import NearIcon from '../icons/near-icon.svg'; +import { NotificationButton } from '../NotificationButton'; +import { UserDropdownMenu } from '../UserDropdownMenu'; +import { Menu } from './Menu'; + +const Wrapper = styled.div` + --nav-height: 72px; + position: sticky; + top: 0; + left: 0; + right: 0; + z-index: 10000; +`; + +const Navigation = styled.div` + height: var(--nav-height); + padding: 0 24px; + display: flex; + align-items: center; + gap: 24px; + background-color: white; + box-shadow: 0 1px 0 var(--sand6); + position: relative; + z-index: 10005; +`; + +const Logo = styled.a` + text-decoration: none; + cursor: pointer; + outline: none; + margin-right: auto; + transition: all 200ms; + + &:hover, + &:focus { + opacity: 0.5; + } + + img { + height: 32px; + width: 32px; + } +`; + +const MenuButton = styled.button` + all: unset; + display: flex; + width: 32px; + height: 100%; + align-items: center; + justify-content: center; + transition: all 200ms; + color: var(--sand12); + + i { + font-size: 32px; + line-height: 32px; + } + + &:hover, + &:focus { + opacity: 0.5; + } +`; + +const Actions = styled.div` + display: flex; + align-items: center; + margin-left: auto; + position: relative; + z-index: 10; + gap: 10px; +`; export const MobileNavigation = () => { - const [showLeftMenu, setShowLeftMenu] = useState(false); - const [blockScroll, allowScroll] = useScrollBlock(); + const [menuIsVisible, setMenuIsVisible] = useState(false); + const signedIn = useAuthStore((store) => store.signedIn); + const { requestAuthentication } = useSignInRedirect(); + + const handleCreateAccount = () => { + requestAuthentication(true); + }; + + const closeMenu = () => { + setMenuIsVisible(false); + }; - const closeMenu = useCallback(() => { - setShowLeftMenu(false); - allowScroll(); - }, [allowScroll]); + const openMenu = () => { + setMenuIsVisible(true); + }; - const openLeftMenu = useCallback(() => { - setShowLeftMenu(true); - blockScroll(); - }, [blockScroll]); + const toggleMenu = () => { + if (menuIsVisible) { + closeMenu(); + } else { + openMenu(); + } + }; return ( - <> - - - + + + + + NEAR + + + + + {signedIn ? ( + <> + + + + ) : ( + - )} - - - NEAR logo - - - {!signedIn && ( - <> -