@codecademy/brand 3.14.0-alpha.0674fecdc1.0 → 3.14.0-alpha.21505a76bc.0

package/dist/GlobalHeader/index.js

@@ -3,18 +3,13 @@ import { useTheme } from '@emotion/react';
 import * as React from 'react';
 import { useCallback, useMemo } from 'react';
 import { AppHeader, AppHeaderMobile, isAppHeaderItemWithHref } from '..';
-import { GlobalHeaderDynamicDataContext, GlobalHeaderItemClickContext } from './context';
+import { GlobalHeaderDynamicDataContext, GlobalHeaderItemClickContext, HeaderDisplayContext } from './context';
 import { anonDefaultHeaderItems, anonDefaultMobileHeaderItems, anonLandingHeaderItems, anonLandingMobileHeaderItems, anonLoginHeaderItems, anonLoginMobileHeaderItems, anonSignupHeaderItems, anonSignupMobileHeaderItems, enterpriseHeaderItems, enterpriseMobileHeaderItems, freeHeaderItems, freeMobileHeaderItems, loadingHeaderItems, loadingMobileHeaderItems, proHeaderItems, proMobileHeaderItems, simpleBootcampHeaderItems, simpleBootcampMobileHeaderItems, simpleHeaderItems, simpleMobileHeaderItems, teamsHeaderItems, teamsMobileHeaderItems } from './GlobalHeaderVariants';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export * from './types';
 export const LiveLearningHubContext = /*#__PURE__*/React.createContext(false);
-export const HeaderQuizContext = /*#__PURE__*/React.createContext({
-  showOnboardingQuiz: false,
-  showSortingQuiz: false
-});
 export const GlobalNavRedesignContext = /*#__PURE__*/React.createContext(false);
 export const BlpHeroExperimentContext = /*#__PURE__*/React.createContext(false);
-export const RevampedBlpExperimentContext = /*#__PURE__*/React.createContext(false);
 
 // Overloading getAppHeaderItems function to return different types based on mobile parameter
 
@@ -29,18 +24,18 @@ function getAppHeaderItems(props, mobile, dynamicDataLoading) {
     case 'anon':
       switch (props.variant) {
         case 'landing':
-          return mobile ? anonLandingMobileHeaderItems(hidePricing, props.user, props.isInRevampedBlpExperimentVariant) : anonLandingHeaderItems(hidePricing, props.user, props.isInRevampedBlpExperimentVariant);
+          return mobile ? anonLandingMobileHeaderItems(hidePricing, props.user) : anonLandingHeaderItems(hidePricing, props.user);
         case 'login':
-          return mobile ? anonLoginMobileHeaderItems(hidePricing, props.user, props.isInRevampedBlpExperimentVariant) : anonLoginHeaderItems(hidePricing, props.user, props.isInRevampedBlpExperimentVariant);
+          return mobile ? anonLoginMobileHeaderItems(hidePricing, props.user) : anonLoginHeaderItems(hidePricing, props.user);
         case 'signup':
-          return mobile ? anonSignupMobileHeaderItems(hidePricing, props.user, props.isInRevampedBlpExperimentVariant) : anonSignupHeaderItems(hidePricing, props.user, props.isInRevampedBlpExperimentVariant);
+          return mobile ? anonSignupMobileHeaderItems(hidePricing, props.user) : anonSignupHeaderItems(hidePricing, props.user);
         default:
-          return mobile ? anonDefaultMobileHeaderItems(hidePricing, props.user, props.isBlpHeroExperimentVariant, props.isInRevampedBlpExperimentVariant) : anonDefaultHeaderItems(hidePricing, props.user, props.isBlpHeroExperimentVariant, props.isInRevampedBlpExperimentVariant);
+          return mobile ? anonDefaultMobileHeaderItems(hidePricing, props.user, props.isBlpHeroExperimentVariant) : anonDefaultHeaderItems(hidePricing, props.user, props.isBlpHeroExperimentVariant);
       }
     case 'enterprise':
       return mobile ? enterpriseMobileHeaderItems(props.user, props) : enterpriseHeaderItems(props.user, props);
     case 'free':
-      return mobile ? freeMobileHeaderItems(props.user, hidePricing, props.isInRevampedBlpExperimentVariant) : freeHeaderItems(props.user, hidePricing, props.isInRevampedBlpExperimentVariant);
+      return mobile ? freeMobileHeaderItems(props.user, hidePricing) : freeHeaderItems(props.user, hidePricing);
     case 'pro':
       return mobile ? proMobileHeaderItems(props.user) : proHeaderItems(props.user);
     case 'teams':
@@ -68,63 +63,78 @@ export const GlobalHeader = props => {
   const hideNotification = props.type === 'loading' || props.type === 'enterprise' || props.type === 'simple' || props.type === 'bootcamp';
   const showOnboardingQuiz = props.type === 'anon' || (props.type === 'free' || props.type === 'pro') && !props.user.enrolledInTwoOrMoreContainers;
   const showSortingQuiz = (props.type === 'free' || props.type === 'pro') && props.user.enrolledInTwoOrMoreContainers;
-  return /*#__PURE__*/_jsx(HeaderQuizContext.Provider, {
+
+  // other header types are not part of the experiment
+  const getNarrowResourceDropdownPosition = headerType => {
+    if (headerType === 'free') return -14.5;
+    if (headerType === 'anon') return -9.5;
+    if (headerType === 'pro' || headerType === 'teams') return -19.5;
+    return 0;
+  };
+  const getWideResourceDropdownPosition = headerType => {
+    if (headerType === 'free') return -19.5;
+    if (headerType === 'anon') return -14.5;
+    if (headerType === 'pro' || headerType === 'teams') return -19.5;
+    return 0;
+  };
+  const narrowResourceDropdownPosition = getNarrowResourceDropdownPosition(props.type);
+  const wideResourceDropdownPosition = getWideResourceDropdownPosition(props.type);
+  return /*#__PURE__*/_jsx(HeaderDisplayContext.Provider, {
     value: {
       showOnboardingQuiz,
-      showSortingQuiz
+      showSortingQuiz,
+      narrowResourceDropdownPosition,
+      wideResourceDropdownPosition
     },
     children: /*#__PURE__*/_jsx(GlobalNavRedesignContext.Provider, {
       value: !!props.displayGlobalNavRedesign,
       children: /*#__PURE__*/_jsx(BlpHeroExperimentContext.Provider, {
         value: !!props.isBlpHeroExperimentVariant,
-        children: /*#__PURE__*/_jsx(RevampedBlpExperimentContext.Provider, {
-          value: !!props.isInRevampedBlpExperimentVariant,
-          children: /*#__PURE__*/_jsx(GlobalHeaderItemClickContext.Provider, {
-            value: {
-              globalHeaderItemClick: combinedAction
-            },
-            children: /*#__PURE__*/_jsx(GlobalHeaderDynamicDataContext.Provider, {
-              value: useMemo(() => ({
-                globalHeaderDynamicData: dynamicData ?? null
-              }), [dynamicData]),
-              children: /*#__PURE__*/_jsxs(Box, {
-                as: "header",
-                position: "sticky",
-                top: 0,
-                zIndex: theme.elements.headerZ,
-                overflow: {
-                  _: 'hidden',
-                  sm: 'visible'
-                } // Prevent tooltip overflow on mobile
-                ,
-                children: [/*#__PURE__*/_jsx(AppHeader, {
-                  action: combinedAction,
-                  items: getAppHeaderItems(props, false, dynamicDataLoading ?? false),
-                  search: props.search,
-                  ...(props.type === 'anon' ? {
-                    redirectParam: props.redirectParam
-                  } : hideNotification ? {} : {
-                    notifications: props.notifications
-                  }),
-                  hideRightButtonDefaults: hideNotification,
-                  isAnon: props.type === 'anon',
-                  isTeams: props.type === 'teams',
-                  type: hideNotification ? 'enterprise' : 'standard'
-                }), /*#__PURE__*/_jsx(AppHeaderMobile, {
-                  action: combinedAction,
-                  items: getAppHeaderItems(props, true, dynamicDataLoading ?? false),
-                  ...(props.type === 'anon' || hideNotification ? {} : {
-                    notifications: props.notifications
-                  }),
-                  search: props.search,
-                  redirectParam: props.type === 'anon' ? props.redirectParam : undefined,
-                  isEnterprise: props.type === 'enterprise',
-                  isAnon: props.type === 'anon',
-                  isSimple: props.type === 'simple',
-                  hideRightMenuButton: props.type === 'simple' || props.type === 'loading',
-                  navigationMenuFormattedLabel: props?.localizedLabels?.navigationMenuFormattedLabel
-                }), props.children]
-              })
+        children: /*#__PURE__*/_jsx(GlobalHeaderItemClickContext.Provider, {
+          value: {
+            globalHeaderItemClick: combinedAction
+          },
+          children: /*#__PURE__*/_jsx(GlobalHeaderDynamicDataContext.Provider, {
+            value: useMemo(() => ({
+              globalHeaderDynamicData: dynamicData ?? null
+            }), [dynamicData]),
+            children: /*#__PURE__*/_jsxs(Box, {
+              as: "header",
+              position: "sticky",
+              top: 0,
+              zIndex: theme.elements.headerZ,
+              overflow: {
+                _: 'hidden',
+                sm: 'visible'
+              } // Prevent tooltip overflow on mobile
+              ,
+              children: [/*#__PURE__*/_jsx(AppHeader, {
+                action: combinedAction,
+                items: getAppHeaderItems(props, false, dynamicDataLoading ?? false),
+                search: props.search,
+                ...(props.type === 'anon' ? {
+                  redirectParam: props.redirectParam
+                } : hideNotification ? {} : {
+                  notifications: props.notifications
+                }),
+                hideRightButtonDefaults: hideNotification,
+                isAnon: props.type === 'anon',
+                isTeams: props.type === 'teams',
+                type: hideNotification ? 'enterprise' : 'standard'
+              }), /*#__PURE__*/_jsx(AppHeaderMobile, {
+                action: combinedAction,
+                items: getAppHeaderItems(props, true, dynamicDataLoading ?? false),
+                ...(props.type === 'anon' || hideNotification ? {} : {
+                  notifications: props.notifications
+                }),
+                search: props.search,
+                redirectParam: props.type === 'anon' ? props.redirectParam : undefined,
+                isEnterprise: props.type === 'enterprise',
+                isAnon: props.type === 'anon',
+                isSimple: props.type === 'simple',
+                hideRightMenuButton: props.type === 'simple' || props.type === 'loading',
+                navigationMenuFormattedLabel: props?.localizedLabels?.navigationMenuFormattedLabel
+              }), props.children]
             })
           })
         })

package/dist/GlobalHeader/types.d.ts

@@ -33,7 +33,6 @@ interface BaseHeader extends WithChildrenProp, AppHeaderAction {
     search: AppHeaderSearch;
     displayGlobalNavRedesign?: boolean;
     isBlpHeroExperimentVariant?: boolean;
-    isInRevampedBlpExperimentVariant?: boolean;
     dynamicData?: GlobalHeaderDynamicData | null;
     dynamicDataLoading?: boolean;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@codecademy/brand",
   "description": "Brand component library for Codecademy",
-  "version": "3.14.0-alpha.0674fecdc1.0",
+  "version": "3.14.0-alpha.21505a76bc.0",
   "author": "Codecademy Engineering <dev@codecademy.com>",
   "dependencies": {
     "@emotion/is-prop-valid": "^1.2.1",