@openeventkit/event-site 2.0.120 → 2.0.122

package/gatsby-browser.js

@@ -6,6 +6,7 @@ import KlaroProvider from "./src/utils/cookies/providers/KlaroProvider";
 import cookieServices from "./src/utils/cookies/services";
 import TagManager from "./src/utils/tag-manager/TagManager";
 import GoogleTagManagerProvider from "./src/utils/tag-manager/providers/GoogleTagManagerProvider";
+import { getEnvVariable, GOOGLE_TAGMANAGER_ID } from "@utils/envVariables";
 import smoothscroll from "smoothscroll-polyfill";
 import "what-input";
 
@@ -25,17 +26,19 @@ export const onClientEntry = () => {
   // smooth scroll polyfill needed for Safari
   smoothscroll.polyfill();
 
-  // Initialize TagManager and add GoogleTagManagerProvider
-  const tagManager = new TagManager();
-  const googleTagManagerProvider = new GoogleTagManagerProvider();
-  tagManager.addProvider(googleTagManagerProvider);
+  // show cookie consent only if google tag manager was deferred loaded
+  // see gatsby-google-tag-manager-plugin in gatsby-config
+  if (getEnvVariable(GOOGLE_TAGMANAGER_ID)) {
+    const tagManager = new TagManager();
+    const googleTagManagerProvider = new GoogleTagManagerProvider();
+    tagManager.addProvider(googleTagManagerProvider);
 
-  // Initialize Cookie Manager with Klaro provider
-  const klaroProvider = new KlaroProvider();
-  const cookieManager = new CookieManager(klaroProvider, cookieServices);
-  cookieManager.show();
+    const klaroProvider = new KlaroProvider();
+    const cookieManager = new CookieManager(klaroProvider, cookieServices);
+    cookieManager.show();
+  }
 
-  // Apply colors
+  // apply colors
   Object.entries(colors).forEach(([key, value]) => {
     document.documentElement.style.setProperty(`--${key}`, value);
     document.documentElement.style.setProperty(`--${key}50`, `${value}50`);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openeventkit/event-site",
   "description": "Event Site",
-  "version": "2.0.120",
+  "version": "2.0.122",
   "author": "Tipit LLC",
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.5.2",
@@ -21,14 +21,14 @@
     "@sentry/integrations": "^7.39.0",
     "@sentry/react": "^7.39.0",
     "@sentry/webpack-plugin": "^1.20.0",
-    "@supabase/supabase-js": "^1.35.6",
+    "@supabase/supabase-js": "2.45.1",
     "@types/googlemaps": "^3.39.9",
     "@types/markerclustererplus": "^2.1.33",
     "@types/react": "^16.9.42",
     "@vimeo/player": "^2.16.3",
     "ably": "^1.2.34",
     "assert": "^2.1.0",
-    "attendee-to-attendee-widget": "3.1.0",
+    "attendee-to-attendee-widget": "3.1.1-beta.29",
     "autoprefixer": "10.4.14",
     "awesome-bootstrap-checkbox": "^1.0.1",
     "axios": "^0.19.2",
@@ -128,7 +128,7 @@
     "stream-browserify": "^3.0.0",
     "stream-chat": "^2.7.2",
     "stream-chat-react": "3.1.7",
-    "summit-registration-lite": "5.0.36",
+    "summit-registration-lite": "5.0.37",
     "superagent": "8.0.9",
     "sweetalert2": "^9.17.0",
     "upcoming-events-widget": "3.0.5",

package/src/components/AttendeeToAttendeeWidgetComponent.js

@@ -59,7 +59,13 @@ const AttendeesWidgetComponent = ({ user, event, chatSettings }) => {
     linked_in_profile,
     twitter_name,
     wechat_user,
-    public_profile_show_fullname } = idpProfile || {};
+    public_profile_show_fullname,
+    public_profile_show_email,
+    public_profile_allow_chat_with_me,
+    public_profile_show_photo,
+    public_profile_show_social_media_info,
+    public_profile_show_bio
+  } = idpProfile || {};
 
   useEffect(() => {
     if (!user || !userProfile || !idpProfile) return;
@@ -127,6 +133,12 @@ const AttendeesWidgetComponent = ({ user, event, chatSettings }) => {
           .flatMap((st) => st.badge.features)
           .filter((v, i, a) => a.map((item) => item.id).indexOf(v.id) === i),
       bio: bio,
+      showEmail: public_profile_show_email === true,
+      allowChatWithMe: public_profile_allow_chat_with_me === true,
+      showFullName: public_profile_show_fullname === true,
+      showProfilePic: public_profile_show_photo === true,
+      showSocialInfo: public_profile_show_social_media_info === true,
+      showBio: public_profile_show_bio === true,
       hasPermission: (permission) => {
         const isAdmin =  groups &&
             groups.map((g) => g.slug).filter((g) => adminGroups.includes(g))
@@ -186,6 +198,20 @@ const mapState = ({ settingState }) => ({
 export const AttendeesWidget = connect(mapState)(AttendeesWidgetComponent);
 
 const AccessTracker = ({ user, isLoggedUser, summitPhase, chatSettings }) => {
+  const chatProps = {
+    streamApiKey: getEnvVariable(STREAM_IO_API_KEY),
+    apiBaseUrl: getEnvVariable(IDP_BASE_URL),
+    chatApiBaseUrl: getEnvVariable(CHAT_API_BASE_URL),
+    onAuthError: (err, res) => console.log(err),
+    openDir: "left",
+    activity: null,
+    getAccessToken: async () => {
+      const accessToken = await getAccessToken();
+      //console.log("AttendeesList->getAccessToken", accessToken);
+      return accessToken;
+    },
+  };
+  
   const trackerRef = useRef();
 
   const handleLogout = useCallback(() => {
@@ -237,11 +263,15 @@ const AccessTracker = ({ user, isLoggedUser, summitPhase, chatSettings }) => {
     wechat_user,
     public_profile_show_fullname,
     public_profile_show_email,
-    public_profile_allow_chat_with_me
+    public_profile_allow_chat_with_me,
+    public_profile_show_photo,
+    public_profile_show_social_media_info,
+    public_profile_show_bio
   } = user.idpProfile;
 
   const widgetProps = {
     user: {
+      id: sub,
       idpUserId: sub,
       fullName: public_profile_show_fullname ? `${given_name} ${family_name}` : `${given_name}`,
       email: email,
@@ -260,11 +290,17 @@ const AccessTracker = ({ user, isLoggedUser, summitPhase, chatSettings }) => {
           .flatMap((st) => st.badge.features)
           .filter((v, i, a) => a.map((item) => item.id).indexOf(v.id) === i),
       bio: bio,
-      showEmail: public_profile_show_email,
-      allowChatWithMe: public_profile_allow_chat_with_me ?? true
+      showEmail: public_profile_show_email === true,
+      allowChatWithMe: public_profile_allow_chat_with_me === true,
+      showFullName: public_profile_show_fullname === true,
+      showProfilePic: public_profile_show_photo === true,
+      showSocialInfo: public_profile_show_social_media_info === true,
+      showBio: public_profile_show_bio === true
     },
     summitId: parseInt(getEnvVariable(SUMMIT_ID)),
-    ...sbAuthProps,
+    keepAliveEnabled: true,
+    ...chatProps,
+    ...sbAuthProps
   };
 
   if (!chatSettings.enabled) return null;

package/src/templates/full-profile-page.js

@@ -16,6 +16,7 @@ import withOrchestra from "../utils/widgetOrchestra";
 import LiteScheduleComponent from '../components/LiteScheduleComponent'
 import ProfilePopupComponent from '../components/ProfilePopupComponent'
 import ChangePasswordComponent from '../components/ChangePasswordComponent';
+import AccessTracker from "../components/AttendeeToAttendeeWidgetComponent";
 
 import { updateProfilePicture, updateProfile, getIDPProfile, updatePassword } from '../actions/user-actions'
 
@@ -46,6 +47,10 @@ export const FullProfilePageTemplate = ({ user, getIDPProfile, updateProfile, up
     const [showFullName, setShowFullName] = useState(false);
     const [allowChatWithMe, setAllowChatWithMe] = useState(false)
     const [showEmail, setShowEmail] = useState(false);
+    const [showPicture, setShowPicture] = useState(false);
+    const [showBio, setShowBio] = useState(false);
+    const [showSocialMedia, setShowSocialMedia] = useState(false);
+    const [showTelephone, setShowTelephone] = useState(false);
     const [bio, setBio] = useState('');
     const [statementOfInterest, setStatementOfInterest] = useState('');
 
@@ -88,6 +93,10 @@ export const FullProfilePageTemplate = ({ user, getIDPProfile, updateProfile, up
             setShowFullName(user.idpProfile.public_profile_show_fullname);
             setAllowChatWithMe(user.idpProfile.public_profile_allow_chat_with_me);
             setShowEmail(user.idpProfile.public_profile_show_email);
+            setShowPicture(user.idpProfile.public_profile_show_photo);
+            setShowBio(user.idpProfile.public_profile_show_bio);
+            setShowSocialMedia(user.idpProfile.public_profile_show_social_media_info);
+            setShowTelephone(user.idpProfile.public_profile_show_telephone_number);
             setBio(user.idpProfile.bio || '');
             setStatementOfInterest(user.idpProfile.statement_of_interest || '');
             setAddress({
@@ -139,6 +148,10 @@ export const FullProfilePageTemplate = ({ user, getIDPProfile, updateProfile, up
                     public_profile_show_fullname: showFullName,
                     public_profile_allow_chat_with_me: allowChatWithMe,
                     public_profile_show_email: showEmail,
+                    public_profile_show_photo: showPicture,
+                    public_profile_show_bio: showBio,
+                    public_profile_show_social_media_info: showSocialMedia,
+                    public_profile_show_telephone_number: showTelephone,
                     bio: bio,
                     statement_of_interest: statementOfInterest,
                     address1: address.street,
@@ -204,6 +217,10 @@ export const FullProfilePageTemplate = ({ user, getIDPProfile, updateProfile, up
                 setShowFullName(user.idpProfile.public_profile_show_fullname);
                 setAllowChatWithMe(user.idpProfile.public_profile_allow_chat_with_me);
                 setShowEmail(user.idpProfile.public_profile_show_email);
+                setShowPicture(user.idpProfile.public_profile_show_photo);
+                setShowBio(user.idpProfile.public_profile_show_bio);
+                setShowSocialMedia(user.idpProfile.public_profile_show_social_media_info);
+                setShowTelephone(user.idpProfile.public_profile_show_telephone_number);
                 break;
             case 'bio':
                 setBio(user.idpProfile.bio || '');
@@ -423,20 +440,45 @@ export const FullProfilePageTemplate = ({ user, getIDPProfile, updateProfile, up
                                     </div>
                                 </div>
                             </div>
-                            <label className={styles.checkbox}>
-                                <input type="checkbox" checked={showFullName} onChange={e => setShowFullName(e.target.checked)} />
-                                Show full name on public profile
-                            </label>
-                            <br />
-                            <label className={styles.checkbox}>
-                                <input type="checkbox" checked={showEmail} onChange={e => setShowEmail(e.target.checked)} />
-                                Show email on public profile
-                            </label>
-                            <br />
-                            <label className={styles.checkbox}>
-                                <input type="checkbox" checked={allowChatWithMe} onChange={e => setAllowChatWithMe(e.target.checked)} />
-                                Allow people to chat with me?
-                            </label>
+                            <div className={`columns is-mobile`}>
+                                <div className={`column is-half`}>
+                                    <label className={styles.checkbox}>
+                                        <input type="checkbox" checked={showFullName} onChange={e => setShowFullName(e.target.checked)} />
+                                        Show full name on public profile
+                                    </label>
+                                    <br />
+                                    <label className={styles.checkbox}>
+                                        <input type="checkbox" checked={showEmail} onChange={e => setShowEmail(e.target.checked)} />
+                                        Show email on public profile
+                                    </label>
+                                    <br />
+                                    <label className={styles.checkbox}>
+                                        <input type="checkbox" checked={showTelephone} onChange={e => setShowTelephone(e.target.checked)} />
+                                        Show telephone number on public profile                                        
+                                    </label>
+                                    <br />
+                                    <label className={styles.checkbox}>
+                                        <input type="checkbox" checked={allowChatWithMe} onChange={e => setAllowChatWithMe(e.target.checked)} />
+                                        Allow people to chat with me?
+                                    </label>
+                                </div>
+                                <div className={`column is-half`}>
+                                    <label className={styles.checkbox}>
+                                        <input type="checkbox" checked={showPicture} onChange={e => setShowPicture(e.target.checked)} />
+                                        Show picture on public profile
+                                    </label>
+                                    <br />
+                                    <label className={styles.checkbox}>
+                                        <input type="checkbox" checked={showBio} onChange={e => setShowBio(e.target.checked)} />
+                                        Show bio on public profile
+                                    </label>
+                                    <br />
+                                    <label className={styles.checkbox}>
+                                        <input type="checkbox" checked={showSocialMedia} onChange={e => setShowSocialMedia(e.target.checked)} />
+                                        Show social media info on public profile
+                                    </label>
+                                </div>
+                            </div>
                             <div className={`columns is-mobile ${styles.buttons}`}>
                                 <div className={`column is-half`}>
                                     <button className={`button is-large ${styles.profileButton}`} onClick={() => discardChanges('profile')}>Discard</button>
@@ -602,6 +644,7 @@ export const FullProfilePageTemplate = ({ user, getIDPProfile, updateProfile, up
                     closePopup={() => handleTogglePopup(!showProfile)}
                 />
             }
+            <AccessTracker/>
         </React.Fragment>
     )
 };

package/src/utils/cookies/providers/KlaroProvider.js

@@ -32,8 +32,11 @@ class KlaroProvider extends CookieManagerProvider {
         },
         consentNotice: {
           description:
-            "Hi! Could we please enable cookies for anonymous {purposes} to improve your user experience?"
+            "Hi! We use cookies to give you the best online experience and analyze our website's performance by collecting anonymous user data, but only if you accept.",
+          learnMore: "Customize"
         },
+        decline: "No thanks",
+        ok: "Sure"
       }
     },
     services: services.map(service => ({