364c3a8252
* Add logic to subscribe button that shows login modal if user is not logged in Pass in userstatus to CommentSubscription Remove logic that loads comment subscription button for logged-in users only * Modify test to account for new userStatus input in CommentSubscription * Change UserStatus to isLoggedIn Add propType to isLoggedIn Remove preventDefault from click event * Fix indentation and input on commentSubscription test Create new isLoggedIn variable that returns boolean Replace all instances of userStatus to isLoggedIn Create test for showLoginModal when subscribing
67 lines
2 KiB
JavaScript
67 lines
2 KiB
JavaScript
import { h, render } from 'preact';
|
|
import { Snackbar, addSnackbarItem } from '../Snackbar';
|
|
import { addFullScreenModeControl } from '../utilities/codeFullscreenModeSwitcher';
|
|
|
|
const fullscreenActionElements = document.getElementsByClassName(
|
|
'js-fullscreen-code-action',
|
|
);
|
|
|
|
if (fullscreenActionElements) {
|
|
addFullScreenModeControl(fullscreenActionElements);
|
|
}
|
|
|
|
// The Snackbar for the article page
|
|
const snackZone = document.getElementById('snack-zone');
|
|
|
|
if (snackZone) {
|
|
render(<Snackbar lifespan="3" />, snackZone);
|
|
}
|
|
|
|
// eslint-disable-next-line no-restricted-globals
|
|
top.addSnackbarItem = addSnackbarItem;
|
|
|
|
const userDataIntervalID = setInterval(async () => {
|
|
const { user = null, userStatus } = document.body.dataset;
|
|
|
|
clearInterval(userDataIntervalID);
|
|
const root = document.getElementById('comment-subscription');
|
|
const isLoggedIn = (userStatus === "logged-in");
|
|
|
|
try {
|
|
const {
|
|
getCommentSubscriptionStatus,
|
|
setCommentSubscriptionStatus,
|
|
CommentSubscription,
|
|
} = await import('../CommentSubscription');
|
|
|
|
const { articleId } = document.getElementById('article-body').dataset;
|
|
|
|
let subscriptionType = 'not_subscribed';
|
|
|
|
if (isLoggedIn && user !== null) {
|
|
({ config: subscriptionType } = await getCommentSubscriptionStatus(
|
|
articleId,
|
|
));
|
|
}
|
|
|
|
const subscriptionRequestHandler = async (type) => {
|
|
const message = await setCommentSubscriptionStatus(articleId, type);
|
|
|
|
addSnackbarItem({ message, addCloseButton: true });
|
|
};
|
|
|
|
render(
|
|
<CommentSubscription
|
|
subscriptionType={subscriptionType}
|
|
positionType="static"
|
|
onSubscribe={subscriptionRequestHandler}
|
|
onUnsubscribe={subscriptionRequestHandler}
|
|
isLoggedIn={isLoggedIn}
|
|
/>,
|
|
root,
|
|
);
|
|
} catch (e) {
|
|
document.getElementById('comment-subscription').innerHTML =
|
|
'<p className="color-accent-danger">Unable to load Comment Subscription component.<br />Try refreshing the page.</p>';
|
|
}
|
|
});
|