@openeventkit/event-site 2.1.50 → 2.1.52

package/gatsby-node.js

@@ -454,6 +454,7 @@ exports.createPages = async ({ actions, graphql }) => {
           }
           frontmatter {
             templateKey
+            slug
           }
           internal {
             contentFilePath
@@ -471,17 +472,33 @@ exports.createPages = async ({ actions, graphql }) => {
   const nodes = result.data.allMdx.nodes;
 
   nodes.forEach((node) => {
-    const { id, fields: { slug }, frontmatter: { templateKey }, internal: { contentFilePath } } = node;
+    const { id, fields: { slug }, frontmatter: { templateKey, slug: frontmatterSlug }, internal: { contentFilePath } } = node;
     const template = require.resolve(`./src/templates/${String(templateKey)}`);
-    // remove content pages namespace from path
-    const path = slug.replace(`${CONTENT_PAGES_PATH_NAME}`, "/");
+    // use frontmatter slug if set, otherwise derive from filename
+    const pagePath = frontmatterSlug
+      ? `/${frontmatterSlug.replace(/^\/+/, '')}/`
+      : slug.replace(`/${CONTENT_PAGES_PATH_NAME}`, "");
     const page = {
-      path: path,
+      path: pagePath,
       component: `${template}?__contentFilePath=${contentFilePath}`,
       context: { id }
     };
     createPage(page);
   });
+
+  // Conditionally create /register page based on registrationMode
+  if (fs.existsSync(SITE_SETTINGS_FILE_PATH)) {
+    const siteSettings = JSON.parse(fs.readFileSync(SITE_SETTINGS_FILE_PATH));
+    const { REGISTRATION_MODE } = require('./src/utils/registrationConstants');
+    const registrationMode = siteSettings.registration?.registrationMode;
+    if (registrationMode === REGISTRATION_MODE.standalone) {
+      createPage({
+        path: '/register/',
+        component: require.resolve('./src/templates/register-page.js'),
+        context: {}
+      });
+    }
+  }
 };
 
 exports.onCreatePage = async ({ page, actions }) => {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openeventkit/event-site",
   "description": "Event Site",
-  "version": "2.1.50",
+  "version": "2.1.52",
   "author": "Tipit LLC",
   "dependencies": {
     "@emotion/server": "^11.11.0",
@@ -55,7 +55,7 @@
     "font-awesome": "^4.7.0",
     "formik": "^2.4.6",
     "fs-extra": "^11.3.0",
-    "full-schedule-widget": "3.1.2-beta.1",
+    "full-schedule-widget": "3.1.3",
     "gatsby": "^5.13.5",
     "gatsby-alias-imports": "^1.0.6",
     "gatsby-plugin-decap-cms": "^4.0.4",
@@ -89,7 +89,7 @@
     "moment-timezone": "^0.5.31",
     "my-orders-tickets-widget": "1.0.10",
     "object.assign": "^4.1.5",
-    "openstack-uicore-foundation": "4.2.16",
+    "openstack-uicore-foundation": "4.2.29",
     "path-browserify": "^1.0.1",
     "prop-types": "^15.6.0",
     "react": "^18.2.0",
@@ -131,11 +131,12 @@
     "slick-carousel": "^1.8.1",
     "smoothscroll-polyfill": "^0.4.4",
     "socket.io-client": "^4.5.2",
+    "spark-md5": "^3.0.2",
     "speakers-widget": "4.0.2",
     "stream-browserify": "^3.0.0",
     "stream-chat": "^2.7.2",
     "stream-chat-react": "3.1.7",
-    "summit-registration-lite": "6.0.8",
+    "summit-registration-lite": "7.0.2",
     "superagent": "8.0.9",
     "sweetalert2": "^11.11.1",
     "upcoming-events-widget": "3.0.7",

package/src/actions/event-actions.js

@@ -4,7 +4,6 @@ import {
     stopLoading,
     startLoading,
 } from 'openstack-uicore-foundation/lib/utils/actions';
-import { clearAccessToken } from 'openstack-uicore-foundation/lib/security/methods';
 import { getAccessTokenSafely } from '../utils/loginUtils';
 
 import { customErrorHandler } from '../utils/customErrorHandler';
@@ -72,7 +71,6 @@ export const getEventById = (
         dispatch(stopLoading());
         dispatch(createAction(GET_EVENT_DATA_ERROR)(e));
         console.log('ERROR: ', e);
-        clearAccessToken();
         return (e);
     });
 };

package/src/actions/extra-questions-actions.js

@@ -1,7 +1,3 @@
-import {
-    getAccessToken,
-    clearAccessToken,
-} from 'openstack-uicore-foundation/lib/security/methods';
 
 import {
     getRequest,
@@ -44,7 +40,6 @@ export const getAttendeeData = (attendeeId) => async (dispatch, getState) => {
       .catch((e) => {
         dispatch(stopLoading());
         console.log('ERROR: ', e);
-        clearAccessToken();
         return (e);
       });
   }

package/src/actions/presentation-actions.js

@@ -7,7 +7,6 @@ import {
 
 import {
   getAccessToken,
-  clearAccessToken,
 } from 'openstack-uicore-foundation/lib/security/methods';
 
 import { customErrorHandler } from '../utils/customErrorHandler';
@@ -76,7 +75,6 @@ export const getAllVoteablePresentations = (page = 1, perPage = PresentationsDef
   }).catch(e => {
      console.log('ERROR: ', e);
     dispatch(stopLoading());
-    clearAccessToken();
     return (e);
   });
 }
@@ -105,7 +103,6 @@ export const getVoteablePresentations = (page = 1, perPage = PresentationsDefaul
     { page }
   )(params)(dispatch).catch(e => {
     console.log('ERROR: ', e);
-    clearAccessToken();
     return (e);
   });
 };
@@ -138,7 +135,6 @@ export const getPresentationById = (presentationId) => async (dispatch) => {
     console.log('ERROR: ', e);
     dispatch(stopLoading());
     dispatch(createAction(GET_PRESENTATION_DETAILS_ERROR)(e));
-    clearAccessToken();
     return Promise.reject(e);
   });
 };
@@ -174,7 +170,6 @@ export const getRecommendedPresentations = (trackGroups) => async (dispatch) =>
   }).catch(e => {
     console.log('ERROR: ', e);
     dispatch(stopLoading());
-    clearAccessToken();
     return (e);
   });
 };

package/src/actions/summit-actions.js

@@ -1,7 +1,3 @@
-import {
-    getAccessToken,
-    clearAccessToken,
-} from 'openstack-uicore-foundation/lib/security/methods';
 
 import {
     getRequest,
@@ -43,7 +39,6 @@ export const getExtraQuestions = (attendeeId = null) => async (dispatch, getStat
         dispatch(stopLoading());
     }).catch(e => {
         console.log('ERROR: ', e);
-        clearAccessToken();
         dispatch(stopLoading());
         return Promise.reject(e);
     });

package/src/actions/user-actions.js

@@ -12,7 +12,6 @@ import {
 import { putOnLocalStorage, getFromLocalStorage } from 'openstack-uicore-foundation/lib/utils/methods';
 
 import {
-    clearAccessToken,
     passwordlessLogin,
     initLogOut
 } from 'openstack-uicore-foundation/lib/security/methods';
@@ -94,7 +93,6 @@ export const getDisqusSSO = (shortName) => async (dispatch, getState) => {
         .catch(e => {
             console.log('ERROR: ', e);
             Sentry.captureException(e)
-            clearAccessToken();
             return Promise.reject(e);
         });
 }
@@ -128,9 +126,11 @@ export const getUserProfile = () => async (dispatch) => {
     }).catch((e) => {
         console.log('ERROR: ', e);
         dispatch(createAction(STOP_LOADING_PROFILE)());
-        clearAccessToken();
-        alertWarning('Error', "There was an error at Login Flow. Please retry.");
-        initLogOut();
+        if (e?.status === 401) {
+            initLogOut();
+        } else {
+            alertWarning('Error', "There was an error at Login Flow. Please retry.");
+        }
         return (e);
     });
 }
@@ -158,7 +158,6 @@ export const getIDPProfile = () => async (dispatch) => {
         .catch((e) => {
             console.log('ERROR: ', e);
             dispatch(createAction(STOP_LOADING_IDP_PROFILE)())
-            clearAccessToken();
             return (e);
         });
 }
@@ -212,7 +211,6 @@ export const scanBadge = (sponsorId) => async (dispatch) => {
         .catch(e => {
             console.log('ERROR: ', e);
             dispatch(createAction(SCAN_BADGE_ERROR)(e));
-            clearAccessToken();
             return (e);
         });
 }
@@ -335,7 +333,9 @@ export const castPresentationVote = (presentation) => async (dispatch, getState)
 
     const errorHandler = (err) => (dispatch, state) => {
         const {status, response: {text}} = err;
-        if (status === 412) {
+        if (status === 401) {
+            expiredToken(err);
+        } else if (status === 412) {
             if (text.includes('already vote')) {
                 // 'confirm' as local vote
                 dispatch(createAction(TOGGLE_PRESENTATION_VOTE)({presentation, isVoted: true}));
@@ -363,7 +363,6 @@ export const castPresentationVote = (presentation) => async (dispatch, getState)
         {presentation}
     )(params)(dispatch).catch((e) => {
         console.log('ERROR: ', e);
-        clearAccessToken();
         // need to revert button state
         // first 'confirm' as local vote
         dispatch(createAction(TOGGLE_PRESENTATION_VOTE)({presentation, isVoted: true}));
@@ -387,7 +386,9 @@ export const uncastPresentationVote = (presentation) => async (dispatch, getStat
 
     const errorHandler = (err) => (dispatch, state) => {
         const {status, response: {text}} = err;
-        if (status === 412 && text.includes('Vote not found')) {
+        if (status === 401) {
+            expiredToken(err);
+        } else if (status === 412 && text.includes('Vote not found')) {
             // tried removing a vote not longer present in api
             // confirming removal
             dispatch(createAction(TOGGLE_PRESENTATION_VOTE)({presentation, isVoted: false}));
@@ -405,7 +406,6 @@ export const uncastPresentationVote = (presentation) => async (dispatch, getStat
         {presentation}
     )(params)(dispatch).catch((e) => {
         console.log('ERROR: ', e);
-        clearAccessToken();
         return e;
     });
 };
@@ -436,7 +436,6 @@ export const updateProfilePicture = (pic) => async (dispatch) => {
         .catch((e) => {
             console.log('ERROR: ', e);
             dispatch(createAction(STOP_LOADING_IDP_PROFILE)())
-            clearAccessToken();
             return e;
         });
 }
@@ -466,7 +465,6 @@ export const updateProfile = (profile) => async (dispatch) => {
         .catch((e) => {
             console.log('ERROR: ', e);
             dispatch(createAction(STOP_LOADING_IDP_PROFILE)());
-            clearAccessToken();
             return e;
         });
 }
@@ -497,7 +495,6 @@ export const updatePassword = (password) => async (dispatch) => {
         .catch((e) => {
             console.log('ERROR: ', e);
             dispatch(createAction(STOP_LOADING_IDP_PROFILE)())
-            clearAccessToken();
             return e;
         });
 }
@@ -542,7 +539,6 @@ export const saveAttendeeQuestions = (values, ticketId = null) => async (dispatc
     }).catch(e => {
         dispatch(stopLoading());
         alertWarning('Error', "Error saving your Attendee info. Please retry.");
-        clearAccessToken();
         return e;
     });
 };
@@ -581,7 +577,6 @@ export const getScheduleSyncLink = () => async (dispatch) => {
         customErrorHandler,
     )(params)(dispatch).catch((e) => {
         console.log('ERROR: ', e);
-        clearAccessToken();
         return e;
     });
 };
@@ -636,7 +631,6 @@ export const doVirtualCheckIn = (attendee) => async (dispatch, getState) => {
         voidErrorHandler
     )(params)(dispatch).catch((e) => {
         console.log('ERROR: ', e);
-        clearAccessToken();
         return e;
     });
 };

package/src/cms/config/collections/configurationsCollection/siteSettings/index.js

@@ -24,6 +24,7 @@ import {
 } from "@utils/envVariables";
 
 import { mapObjectToSelectOptions } from "../../../utils";
+import { REGISTRATION_MODE } from "@utils/registrationConstants";
 
 const FONT_FORMATS = {
   truetype: "ttf",
@@ -179,6 +180,26 @@ const siteSettings = {
         })
       ]
     }),
+    objectField({
+      label: "Registration",
+      name: "registration",
+      fields: [
+        selectField({
+          label: "Registration Mode",
+          name: "registrationMode",
+          default: REGISTRATION_MODE.modal,
+          required: false,
+          options: mapObjectToSelectOptions(REGISTRATION_MODE),
+          hint: "MODAL: opens the registration form as a popup overlay. STANDALONE: redirects to a dedicated registration page. LINK: redirects to the URL specified in Registration Link, which can be an internal content page with an embedded registration form or an external URL."
+        }),
+        stringField({
+          label: "Registration Link",
+          name: "registrationLink",
+          required: false,
+          hint: "Only used when Registration Mode is LINK. Use a relative path (e.g. /my-page) for an internal page, or a full URL (e.g. https://example.com) for an external site. To embed the registration form in a content page, add the <RegistrationForm /> shortcode in the page body."
+        })
+      ]
+    }),
     objectField({
       label: "IDP Logo",
       name: "idpLogo",

package/src/cms/config/collections/configurationsCollection/siteSettings/typeDefs.js

@@ -43,12 +43,17 @@ module.exports = `
     providerLogo: File @fileByRelativePath
     providerLogoSize: Float
   }
+  type Registration {
+    registrationMode: String
+    registrationLink: String
+  }
   type MaintenanceMode {
     enabled: Boolean
     title: String
     subtitle: String
   }
   type SiteSettingsJson implements Node {
+    registration: Registration
     siteMetadata: SiteMetadata
     favicon: Favicon
     siteFont: SiteFont

package/src/cms/config/collections/contentPagesCollection/index.js

@@ -11,6 +11,9 @@ import { CONTENT_PAGES_DIR_PATH } from "@utils/filePath";
 import { USER_REQUIREMENTS } from "@utils/pageAccessConstants";
 
 import { mapObjectToSelectOptions } from "../../utils";
+import shortcodes from "../../../../templates/content-page/shortcodes";
+
+const shortcodesHint = `Available shortcodes: ${Object.keys(shortcodes).map(name => `<${name} />`).join(", ")}`;
 
 const contentPagesCollection = {
   ...collectionDefaults({
@@ -33,6 +36,12 @@ const contentPagesCollection = {
       label: "Title",
       name: "title"
     }),
+    stringField({
+      label: "Slug",
+      name: "slug",
+      required: false,
+      hint: "URL path for this page (e.g. registration). Leave empty to use the default path based on the title. Changing this will change the page URL."
+    }),
     selectField({
       label: "User Requirement",
       name: "userRequirement",
@@ -42,7 +51,8 @@ const contentPagesCollection = {
     }),
     markdownField({
       label: "Body",
-      name: "body"
+      name: "body",
+      hint: shortcodesHint
     })
   ]
 };

package/src/cms/config/collections/contentPagesCollection/typeDefs.js

@@ -6,6 +6,7 @@ module.exports = `
   type MdxFrontmatter {
     templateKey: String
     title: String
+    slug: String
     userRequirement: String
   }
   type Mdx {

package/src/cms/config/collections/defaultPagesCollection/marketingPage/index.js

@@ -78,12 +78,8 @@ const marketingPage = {
                 booleanField({
                   label: "Display",
                   name: "display",
-                  required: false
-                }),
-                stringField({
-                  label: "External Registration Link",
-                  name: "externalRegistrationLink",
-                  required: false
+                  required: false,
+                  hint: "Show or hide the register button on the hero. To change the register button behavior (open registration popup, navigate to standalone registration page, or redirect to an internal page or external URL), go to Site Settings > Registration."
                 }),
               ]
             }),

package/src/cms/config/collections/defaultPagesCollection/marketingPage/typeDefs.js

@@ -45,7 +45,6 @@ module.exports = `
   type MarketingPageHeroRegistrationButton {
     text: String
     display: Boolean
-    externalRegistrationLink: String
   }
   type MarketingPageHeroLoginButton {
     text: String

package/src/cms/preview-templates/ContentPagePreview.js

@@ -6,6 +6,7 @@ import Mdx from "../../components/Mdx";
 
 // function to transform content by replacing relative image URLs with absolute ones
 const transformContent = (mdx, getAsset) => {
+    if (!mdx) return "";
     // regex to identify Markdown image tags ![alt](url)
     const imageRegex = /!\[([^\]]*)\]\(([^)]+)\)/g;
 
@@ -21,9 +22,19 @@ const transformContent = (mdx, getAsset) => {
     });
 };
 
+// Override shortcodes that require Redux/Gatsby context with placeholders for CMS preview
+const previewShortcodes = {
+    ...shortcodes,
+    RegistrationForm: () => (
+        <div style={{ border: '2px dashed #ccc', padding: '2rem', textAlign: 'center', margin: '1rem 0' }}>
+            <p style={{ fontSize: '1.2rem', color: '#666' }}>Registration Form Widget (preview not available)</p>
+        </div>
+    )
+};
+
 // function to render transformed content with Mdx
 const renderContent = (mdx, getAsset) => (
-    <Mdx shortcodes={shortcodes} content={transformContent(mdx, getAsset)}/>
+    <Mdx shortcodes={previewShortcodes} content={transformContent(mdx, getAsset)}/>
 );
 
 const ContentPagePreview = ({ entry, getAsset }) => {

package/src/components/AuthComponent.js

@@ -12,7 +12,8 @@ import { getThirdPartyProviders } from "../actions/base-actions";
 // these two libraries are client-side only
 import LoginComponent from "summit-registration-lite/dist/components/login";
 import PasswordlessLoginComponent from "summit-registration-lite/dist/components/login-passwordless";
-import "summit-registration-lite/dist/index.css";
+import "summit-registration-lite/dist/components/login.css";
+import "summit-registration-lite/dist/components/login-passwordless.css";
 import IconButton from "./IconButton";
 import Link from "./Link";
 

package/src/components/MarketingHero/MainColumn.js

@@ -1,20 +1,32 @@
 import * as React from "react";
 import { getSrc } from "gatsby-plugin-image";
 import AuthComponent from "../AuthComponent";
-import RegistrationLiteComponent from "../RegistrationLiteComponent";
+import RegistrationModalComponent from "../RegistrationModalComponent";
+import RegisterButton from "../RegisterButton";
+import { REGISTRATION_MODE } from "@utils/registrationConstants";
+import useSiteSettings from "@utils/useSiteSettings";
 
 import styles from "./styles.module.scss";
 
-const ButtonGroup = ({ location, registerButton, loginButton }) => (
-  <>
-    {registerButton?.display && (
-      <span className={styles.link}>
-        <RegistrationLiteComponent location={location} />
-      </span>
-    )}
-    {loginButton?.display && <AuthComponent location={location} />}
-  </>
-);
+const ButtonGroup = ({ location, registerButton, loginButton }) => {
+  const siteSettings = useSiteSettings();
+  const mode = siteSettings?.registration?.registrationMode || REGISTRATION_MODE.modal;
+  return (
+    <>
+      {registerButton?.display && (mode === REGISTRATION_MODE.standalone || mode === REGISTRATION_MODE.link) && (
+        <span className={styles.link}>
+          <RegisterButton />
+        </span>
+      )}
+      {registerButton?.display && mode === REGISTRATION_MODE.modal && (
+        <span className={styles.link}>
+          <RegistrationModalComponent location={location} />
+        </span>
+      )}
+      {loginButton?.display && <AuthComponent location={location} />}
+    </>
+  );
+};
 
 const MainColumn = ({ location, title, subTitle, date, time, buttons, backgroundSrc, fullWidth }) => {
   const backgroundImageStyle = backgroundSrc

package/src/components/RegisterButton.js

@@ -0,0 +1,59 @@
+import React from "react";
+import PropTypes from "prop-types";
+import { navigate } from "gatsby";
+import { connect } from "react-redux";
+
+import IconButton from "./IconButton";
+import iconButtonStyles from "./IconButton/styles.module.scss";
+import { REGISTRATION_MODE } from "@utils/registrationConstants";
+import useSiteSettings from "@utils/useSiteSettings";
+
+const RegisterButton = ({
+   marketingPageSettings,
+   children,
+}) => {
+    const siteSettings = useSiteSettings();
+    const registration = siteSettings?.registration;
+    const mode = registration?.registrationMode || REGISTRATION_MODE.modal;
+
+    const handleClick = () => {
+        if (mode === REGISTRATION_MODE.link && registration?.registrationLink) {
+            const url = registration.registrationLink;
+            const isInternal = /^\/(?!\/)/.test(url);
+            if (isInternal) {
+                navigate(url);
+            } else {
+                window.location = url;
+            }
+            return;
+        }
+        navigate("/register");
+    }
+
+    const { registerButton } = marketingPageSettings.hero.buttons;
+
+    if (children) {
+        return React.cloneElement(children, { onClick: handleClick });
+    }
+
+    if (!registerButton.display) return null;
+
+    return (
+        <IconButton
+            className={iconButtonStyles.register}
+            iconClass="fa fa-2x fa-edit"
+            buttonText={registerButton.text}
+            onClick={handleClick}
+        />
+    );
+};
+
+RegisterButton.propTypes = {
+    children: PropTypes.node,
+};
+
+const mapStateToProps = ({ settingState }) => ({
+    marketingPageSettings: settingState.marketingPageSettings
+});
+
+export default connect(mapStateToProps)(RegisterButton);

package/src/components/RegistrationFormShortcode.js

@@ -0,0 +1,82 @@
+import React from "react";
+import { connect } from "react-redux";
+import { navigate } from "gatsby";
+import * as Sentry from "@sentry/react";
+import NoSsr from "@mui/material/NoSsr";
+
+import { SentryFallbackFunction } from "./SentryErrorComponent";
+import RegistrationForm from "summit-registration-lite/dist/components/registration-form";
+import "summit-registration-lite/dist/components/registration-form.css";
+
+import { setPasswordlessLogin, setUserOrder, checkOrderData, getUserProfile, checkRequireExtraQuestionsByAttendee } from "../actions/user-actions";
+import { getThirdPartyProviders } from "../actions/base-actions";
+import { getExtraQuestions } from "../actions/summit-actions";
+
+import useRegistrationWidgetProps from "@utils/useRegistrationWidgetProps";
+
+const RegistrationFormShortcode = ({
+    summit,
+    userProfile,
+    idpProfile,
+    colorSettings,
+    attendee,
+    availableThirdPartyProviders,
+    allowsNativeAuth,
+    allowsOtpAuth,
+    loadingProfile,
+    loadingIDP,
+    setPasswordlessLogin,
+    setUserOrder,
+    checkOrderData,
+    getUserProfile,
+    getThirdPartyProviders,
+    getExtraQuestions,
+    checkRequireExtraQuestionsByAttendee
+}) => {
+    const backUrl = typeof window !== 'undefined' ? window.location.pathname : '/';
+
+    const widgetProps = useRegistrationWidgetProps({
+        summit, userProfile, idpProfile, attendee, colorSettings,
+        loadingProfile, loadingIDP, availableThirdPartyProviders,
+        allowsNativeAuth, allowsOtpAuth,
+        setPasswordlessLogin, setUserOrder, checkOrderData,
+        getThirdPartyProviders, getExtraQuestions, checkRequireExtraQuestionsByAttendee,
+        backUrl,
+        closeWidget: () => navigate("/"),
+    });
+
+    if (!summit) return null;
+
+    return (
+        <NoSsr>
+            <Sentry.ErrorBoundary fallback={SentryFallbackFunction({componentName: "Registration Form"})}>
+                <div className="summit-registration-lite">
+                    <RegistrationForm {...widgetProps} />
+                </div>
+            </Sentry.ErrorBoundary>
+        </NoSsr>
+    );
+};
+
+const mapStateToProps = ({ userState, summitState, settingState }) => ({
+    loadingProfile: userState.loading,
+    loadingIDP: userState.loadingIDP,
+    userProfile: userState.userProfile,
+    idpProfile: userState.idpProfile,
+    attendee: userState.attendee,
+    availableThirdPartyProviders: summitState.third_party_providers,
+    allowsNativeAuth: summitState.allows_native_auth,
+    allowsOtpAuth: summitState.allows_otp_auth,
+    summit: summitState.summit,
+    colorSettings: settingState.colorSettings,
+});
+
+export default connect(mapStateToProps, {
+    setPasswordlessLogin,
+    setUserOrder,
+    checkOrderData,
+    getUserProfile,
+    getThirdPartyProviders,
+    getExtraQuestions,
+    checkRequireExtraQuestionsByAttendee
+})(RegistrationFormShortcode);