From bb39e332be5efb4071abed44f90a9a5d87f03729 Mon Sep 17 00:00:00 2001 From: barshathakuri Date: Wed, 11 Dec 2024 14:04:59 +0545 Subject: [PATCH] Remove resources page summary --- src/App/redirects/AlertDetailsRedirect.tsx | 34 ++++++ src/App/redirects/UnsubscribeRedirect.tsx | 136 +++++++++++++++++++++ src/App/routes/index.tsx | 31 +++++ src/views/Activation/i18n.json | 9 +- src/views/Home/i18n.json | 2 +- src/views/Home/index.tsx | 11 +- src/views/RecoverAccount/index.tsx | 2 +- src/views/RecoverAccountConfirm/index.tsx | 1 + src/views/Register/index.tsx | 6 + src/views/Resources/index.tsx | 3 +- 10 files changed, 225 insertions(+), 10 deletions(-) create mode 100644 src/App/redirects/AlertDetailsRedirect.tsx create mode 100644 src/App/redirects/UnsubscribeRedirect.tsx diff --git a/src/App/redirects/AlertDetailsRedirect.tsx b/src/App/redirects/AlertDetailsRedirect.tsx new file mode 100644 index 00000000..898dcb7b --- /dev/null +++ b/src/App/redirects/AlertDetailsRedirect.tsx @@ -0,0 +1,34 @@ +import { + generatePath, + useNavigate, + useParams, +} from 'react-router-dom'; + +import routes from '#routes'; + +interface AlertDetailsParams { + alertId: string | undefined; + [key: string]: string | undefined; +} + +// eslint-disable-next-line import/prefer-default-export +export function Component() { + const { alertId } = useParams(); + const navigate = useNavigate(); + + const alertDetailsLink = (alertId) ? ({ + pathname: (generatePath( + routes.alertDetails.absolutePath, + { alertId }, + )), + }) + : routes.pageNotFound.path; + + if (alertDetailsLink) { + navigate(alertDetailsLink); + } + + return null; +} + +Component.displayName = 'AlertDetailsRedirect'; diff --git a/src/App/redirects/UnsubscribeRedirect.tsx b/src/App/redirects/UnsubscribeRedirect.tsx new file mode 100644 index 00000000..730aac7d --- /dev/null +++ b/src/App/redirects/UnsubscribeRedirect.tsx @@ -0,0 +1,136 @@ +import { + useCallback, + useEffect, +} from 'react'; +import { + generatePath, + useNavigate, + useParams, +} from 'react-router-dom'; +import { + gql, + useMutation, + useQuery, +} from '@apollo/client'; + +import { + AlertSubscriptionsUnsubscribeQuery, + AlertSubscriptionsUnsubscribeQueryVariables, + UnsubscriptionMutation, + UnsubscriptionMutationVariables, +} from '#generated/types/graphql'; +import routes from '#routes'; + +const ALERT_SUBSCRIPTIONS = gql` + query AlertSubscriptionsUnsubscribe { + private { + id + userAlertSubscriptions { + items { + id + name + isActive + filterAlertAdmin1s + filterAlertCountryId + } + } + } + } +`; + +const UPDATE_SUBSCRIPTION = gql` + mutation Unsubscription( + $subscriptionId: ID!, + $data: UserAlertSubscriptionInput!, + ) { + private { + updateUserAlertSubscription( + id: $subscriptionId, + data: $data, + ) { + errors + ok + result { + id + name + isActive + } + } + } + } +`; + +interface UnsubscribeParams { + subscriptionId: string | undefined; + token: string | undefined; + [key: string]: string | undefined; +} + +// eslint-disable-next-line import/prefer-default-export +export function Component() { + const { subscriptionId, token } = useParams(); + const navigate = useNavigate(); + + const { + data: alertSubscriptions, + } = useQuery< + AlertSubscriptionsUnsubscribeQuery, + AlertSubscriptionsUnsubscribeQueryVariables + >( + ALERT_SUBSCRIPTIONS, + ); + + const [ + triggerSubscriptionUpdate, + ] = useMutation< + UnsubscriptionMutation, + UnsubscriptionMutationVariables + >( + UPDATE_SUBSCRIPTION, + ); + + const data = alertSubscriptions?.private?.userAlertSubscriptions?.items; + + const handleUnsubscribe = useCallback((id: string) => { + const selectedSubscriptionDetails = data?.find( + (sub) => sub.id === id, + ); + + triggerSubscriptionUpdate({ + variables: { + subscriptionId: id, + data: { + isActive: false, + filterAlertAdmin1s: selectedSubscriptionDetails?.filterAlertAdmin1s ?? [], + filterAlertCountry: selectedSubscriptionDetails?.filterAlertCountryId ?? '', + name: selectedSubscriptionDetails?.name ?? '', + }, + }, + }); + }, [ + data, + triggerSubscriptionUpdate, + ]); + + useEffect(() => { + if (subscriptionId) { + handleUnsubscribe(subscriptionId); + } + }, [ + handleUnsubscribe, + subscriptionId, + ]); + + const UnsubscribeLink = (subscriptionId && token) ? ({ + pathname: (generatePath(routes.subscriptionDetail.absolutePath, { subscriptionId, token })), + }) + : routes.pageNotFound.path; + + if (UnsubscribeLink) { + navigate(UnsubscribeLink); + } + + return null; +} + +Component.displayName = 'UnsubscribeRedirect'; diff --git a/src/App/routes/index.tsx b/src/App/routes/index.tsx index e1f22676..f3e38919 100644 --- a/src/App/routes/index.tsx +++ b/src/App/routes/index.tsx @@ -188,6 +188,20 @@ const alertDetails = customWrapRoute({ }, }); +const alertDetailRedirect = customWrapRoute({ + parent: rootLayout, + path: 'permalink/alert-details/:alertId', + component: { + render: () => import('../redirects/AlertDetailsRedirect.tsx'), + props: {}, + }, + wrapperComponent: Auth, + context: { + title: 'Alert Details', + visibility: 'anything', + }, +}); + const allSourcesFeeds = customWrapRoute({ parent: rootLayout, path: 'feeds', @@ -311,6 +325,7 @@ const resetPasswordRedirect = customWrapRoute({ visibility: 'is-not-authenticated', }, }); + const activation = customWrapRoute({ parent: rootLayout, path: 'activation/:userId/:token', @@ -339,6 +354,20 @@ const activationRedirect = customWrapRoute({ }, }); +const unSubscribeRedirect = customWrapRoute({ + parent: rootLayout, + path: 'permalink/unsubscribe-user-alert-subscription/:subscriptionsId', + component: { + render: () => import('../redirects/UnsubscribeRedirect.tsx'), + props: {}, + }, + wrapperComponent: Auth, + context: { + title: 'Unsubscribe Redirect', + visibility: 'anything', + }, +}); + const wrappedRoutes = { rootLayout, homeLayout, @@ -363,6 +392,8 @@ const wrappedRoutes = { resetPasswordRedirect, activationRedirect, activation, + alertDetailRedirect, + unSubscribeRedirect, }; export const unwrappedRoutes = unwrapRoute(Object.values(wrappedRoutes)); diff --git a/src/views/Activation/i18n.json b/src/views/Activation/i18n.json index c09a861b..688ed505 100644 --- a/src/views/Activation/i18n.json +++ b/src/views/Activation/i18n.json @@ -1,9 +1,8 @@ { "namespace": "activation", "strings": { - "activationSuccessMessage":"Your account has been successfully activated!", - "goToLogin":"Go to Login", - "activationFailMessage":"An error occurred during activation. Please try again." + "activationSuccessMessage": "Your account has been successfully activated!", + "goToLogin": "Go to Login", + "activationFailMessage": "This account has already been activated." } -} - +} \ No newline at end of file diff --git a/src/views/Home/i18n.json b/src/views/Home/i18n.json index 8eea42b3..69886b63 100644 --- a/src/views/Home/i18n.json +++ b/src/views/Home/i18n.json @@ -10,7 +10,7 @@ "addSubscriptionDescription": "With real-time monitoring of potential risks and emergency events, receive timely and accurate alerts.", "useApi": "Use API to rebroadcast CAP alerts", "useApiDescription": "With simple yet powerful API endpoints, you can tailor the alerts to suit your users' needs.", - "alertNewSubscription": "Subscribe Alerts ", + "alertNewSubscription": "Subscribe to Alerts ", "alertApiReference": "API Reference" } } diff --git a/src/views/Home/index.tsx b/src/views/Home/index.tsx index 9ae2e002..d3eb2e3f 100644 --- a/src/views/Home/index.tsx +++ b/src/views/Home/index.tsx @@ -27,6 +27,7 @@ import { AlertFilter, CountryDetailQuery, } from '#generated/types/graphql'; +import useAuth from '#hooks/domain/useAuth'; import useUrlSearchState from '#hooks/useUrlSearchState'; import NewSubscriptionModal from '#views/NewSubscriptionModal'; @@ -86,6 +87,7 @@ const filterKeys: CombinedAlertFilterKey[] = ['country', 'admin1', 'region', 'ur // eslint-disable-next-line import/prefer-default-export export function Component() { const strings = useTranslation(i18n); + const { isAuthenticated } = useAuth(); const [ filters, @@ -266,7 +268,7 @@ export function Component() { heading={strings.addSubscription} headerDescription={strings.addSubscriptionDescription} withInternalPadding - footerContent={( + footerContent={isAuthenticated ? ( + ) : ( + + {strings.alertNewSubscription} + )} /> - ); } @@ -183,6 +182,7 @@ export function Component() { name="captcha" onChange={setFieldValue} onError={onCaptchaError} + error={fieldError?.captcha} />