@planningcenter/topbar 12.0.0-rc.0 → 12.1.0-rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/topbar.js CHANGED
@@ -964,8 +964,8 @@ const AppsProvider = ({
964
964
  const notificationsEnabled = !window.notificationsDisabled;
965
965
  const organizationTimeZone = ((_k = (_j = topbarResponse === null || topbarResponse === void 0 ? void 0 : topbarResponse.data) === null || _j === void 0 ? void 0 : _j.attributes) === null || _k === void 0 ? void 0 : _k.org_time_zone) || "America/Los_Angeles";
966
966
  const algoliaSearchAuth = {
967
- algoliaApplicationId: (_m = (_l = topbarResponse === null || topbarResponse === void 0 ? void 0 : topbarResponse.data) === null || _l === void 0 ? void 0 : _l.attributes) === null || _m === void 0 ? void 0 : _m.algolia_application_identifier,
968
- algoliaSearchOnlyApiKey: (_p = (_o = topbarResponse === null || topbarResponse === void 0 ? void 0 : topbarResponse.data) === null || _o === void 0 ? void 0 : _o.attributes) === null || _p === void 0 ? void 0 : _p.algolia_search_key
967
+ algoliaApplicationId: (_m = (_l = topbarResponse === null || topbarResponse === void 0 ? void 0 : topbarResponse.data) === null || _l === void 0 ? void 0 : _l.attributes) === null || _m === void 0 ? void 0 : _m.algolia_help_center_application_identifier,
968
+ algoliaSearchOnlyApiKey: (_p = (_o = topbarResponse === null || topbarResponse === void 0 ? void 0 : topbarResponse.data) === null || _o === void 0 ? void 0 : _o.attributes) === null || _p === void 0 ? void 0 : _p.algolia_help_center_search_key
969
969
  };
970
970
  const joltPromise = React.useMemo(() => {
971
971
  return resolveJoltPromise({
@@ -3478,40 +3478,44 @@ function buildPicobotSrc(origin, path) {
3478
3478
  return fragment ? `${base}#${fragment}` : base;
3479
3479
  }
3480
3480
 
3481
- const handleSearchSelect = (hit, indexName) => {
3482
- const appName = indexName.split("_")[1];
3483
- const zendeskUrl = `https://${appName}.zendesk.com/hc/${hit.locale.locale}/articles/${hit.id}`;
3484
- const newTab = window.open(zendeskUrl, "_blank");
3481
+ // The article heading lives in the deepest populated hierarchy level (lvl0 is
3482
+ // always "Planning Center").
3483
+ const hitTitle = hierarchy => (hierarchy === null || hierarchy === void 0 ? void 0 : hierarchy.lvl6) || (hierarchy === null || hierarchy === void 0 ? void 0 : hierarchy.lvl5) || (hierarchy === null || hierarchy === void 0 ? void 0 : hierarchy.lvl4) || (hierarchy === null || hierarchy === void 0 ? void 0 : hierarchy.lvl3) || (hierarchy === null || hierarchy === void 0 ? void 0 : hierarchy.lvl2) || (hierarchy === null || hierarchy === void 0 ? void 0 : hierarchy.lvl1) || (hierarchy === null || hierarchy === void 0 ? void 0 : hierarchy.lvl0) || "";
3484
+ const handleSearchSelect = hit => {
3485
+ // `url` is always absolute (it is also the basis of objectID), so open it
3486
+ // directly. Bail out defensively if a record somehow arrives without one.
3487
+ if (!(hit === null || hit === void 0 ? void 0 : hit.url)) return;
3488
+ const newTab = window.open(hit.url, "_blank");
3485
3489
  if (newTab) {
3486
3490
  newTab.focus();
3487
3491
  }
3488
3492
  };
3493
+ // Mirrors @planningcenter/tapestry-react's Logo registry.
3494
+ const VALID_LOGO_NAMES = new Set(["api", "calendar", "check-ins", "church-center", "giving", "groups", "headcounts", "home", "login", "music-stand", "people", "planning-center", "publishing", "registrations", "services"]);
3489
3495
  const HeadingIcon = ({
3490
- sectionName,
3491
- currentAppName
3496
+ currentAppName,
3497
+ product
3492
3498
  }) => {
3493
- const lowerCaseSectionName = sectionName.toLowerCase();
3494
- if (lowerCaseSectionName === "account information" || lowerCaseSectionName === "recent updates") {
3495
- return /*#__PURE__*/React.createElement(tapestryReact.Icon, {
3496
- name: lowerCaseSectionName === "account information" ? "general.cogPerson" : "general.outlinedGenericFile",
3497
- color: "foregroundSecondary"
3498
- });
3499
- } else if (currentAppName === "Accounts") {
3499
+ const appName = product || currentAppName;
3500
+ if (!appName) return null;
3501
+ const logoName = appName.toLowerCase().replace(/\s+/g, "-");
3502
+ // Accounts has no tapestry Logo, so use the cog icon
3503
+ if (logoName === "accounts") {
3500
3504
  return /*#__PURE__*/React.createElement(tapestryReact.Icon, {
3501
3505
  name: "general.cog",
3502
3506
  color: "foregroundSecondary"
3503
3507
  });
3504
- } else {
3505
- return /*#__PURE__*/React.createElement(tapestryReact.StackView, {
3506
- width: 2,
3507
- height: 2
3508
- }, /*#__PURE__*/React.createElement(tapestryReact.Logo, {
3509
- name: currentAppName.toLowerCase().replace(/[\s]/, "-"),
3510
- size: "sm",
3511
- theme: "color",
3512
- markOnly: true
3513
- }));
3514
3508
  }
3509
+ if (!VALID_LOGO_NAMES.has(logoName)) return null;
3510
+ return /*#__PURE__*/React.createElement(tapestryReact.StackView, {
3511
+ width: 2,
3512
+ height: 2
3513
+ }, /*#__PURE__*/React.createElement(tapestryReact.Logo, {
3514
+ name: logoName,
3515
+ size: "sm",
3516
+ theme: "color",
3517
+ markOnly: true
3518
+ }));
3515
3519
  };
3516
3520
  const HitResult = ({
3517
3521
  hit,
@@ -3526,11 +3530,10 @@ const HitResult = ({
3526
3530
  color: "neutralDarker",
3527
3531
  size: 4,
3528
3532
  whiteSpace: "normal"
3529
- }, hit.title));
3533
+ }, hitTitle(hit.hierarchy)));
3530
3534
  };
3531
3535
  const CustomSearchBox = ({
3532
- currentAppName,
3533
- indexName
3536
+ currentAppName
3534
3537
  }) => {
3535
3538
  const {
3536
3539
  query,
@@ -3541,7 +3544,10 @@ const CustomSearchBox = ({
3541
3544
  results
3542
3545
  } = reactInstantsearchCore.useHits();
3543
3546
  const groups = results === null || results === void 0 ? void 0 : results.hits.reduce((acc, hit) => {
3544
- const key = hit.category.title;
3547
+ // A result with no url can't be opened, so don't render it at all.
3548
+ if (!hit.url) return acc;
3549
+ // Fall back so a record without a product never yields an "undefined" heading.
3550
+ const key = hit.product || currentAppName || "Other";
3545
3551
  if (!acc[key]) {
3546
3552
  acc[key] = [];
3547
3553
  }
@@ -3563,7 +3569,7 @@ const CustomSearchBox = ({
3563
3569
  name: "general.search"
3564
3570
  }),
3565
3571
  onChange: e => setQuery(e.target.value),
3566
- onSelect: selectedValue => handleSearchSelect(selectedValue, indexName),
3572
+ onSelect: selectedValue => handleSearchSelect(selectedValue),
3567
3573
  placement: "bottom-start"
3568
3574
  }, !hits.length && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(tapestryReact.StackView, {
3569
3575
  axis: "horizontal",
@@ -3575,7 +3581,7 @@ const CustomSearchBox = ({
3575
3581
  size: 4,
3576
3582
  whiteSpace: "normal"
3577
3583
  }, "No results match your search")))), groups && Object.keys(groups).map(key => {
3578
- const hits = groups[key];
3584
+ const groupHits = groups[key];
3579
3585
  return /*#__PURE__*/React.createElement(React.Fragment, {
3580
3586
  key: key
3581
3587
  }, resultIndex > 0 && /*#__PURE__*/React.createElement(tapestryReact.Divider, {
@@ -3588,12 +3594,12 @@ const CustomSearchBox = ({
3588
3594
  paddingVertical: 1
3589
3595
  }, /*#__PURE__*/React.createElement(HeadingIcon, {
3590
3596
  currentAppName: currentAppName,
3591
- sectionName: key
3597
+ product: key
3592
3598
  }), /*#__PURE__*/React.createElement(tapestryReact.Text, {
3593
3599
  size: 5,
3594
3600
  color: "foregroundSecondary",
3595
3601
  fontWeight: 500
3596
- }, key)), hits.map(hit => (/*#__PURE__*/React.createElement(HitResult, {
3602
+ }, key)), groupHits.map(hit => (/*#__PURE__*/React.createElement(HitResult, {
3597
3603
  key: hit.objectID,
3598
3604
  hit: hit,
3599
3605
  index: resultIndex++
@@ -3601,8 +3607,8 @@ const CustomSearchBox = ({
3601
3607
  })));
3602
3608
  };
3603
3609
 
3610
+ const HELP_CENTER_INDEX = "help_center_english";
3604
3611
  const DocumentationSearch = ({
3605
- indexName,
3606
3612
  currentAppName
3607
3613
  }) => {
3608
3614
  const {
@@ -3613,13 +3619,13 @@ const DocumentationSearch = ({
3613
3619
  } = useStore();
3614
3620
  const searchClient = algoliasearch(algoliaApplicationId, algoliaSearchOnlyApiKey);
3615
3621
  return /*#__PURE__*/React.createElement(reactInstantsearchCore.InstantSearch, {
3616
- indexName: indexName,
3622
+ indexName: HELP_CENTER_INDEX,
3617
3623
  searchClient: searchClient
3618
3624
  }, /*#__PURE__*/React.createElement(reactInstantsearchCore.Configure, {
3619
- hitsPerPage: 5
3625
+ hitsPerPage: 5,
3626
+ optionalFilters: currentAppName ? [`product:${currentAppName}`] : undefined
3620
3627
  }), /*#__PURE__*/React.createElement(CustomSearchBox, {
3621
- currentAppName: currentAppName,
3622
- indexName: indexName
3628
+ currentAppName: currentAppName
3623
3629
  }));
3624
3630
  };
3625
3631
 
@@ -3730,9 +3736,6 @@ function HelpdeskComponent({
3730
3736
  properties: {
3731
3737
  currentAppName: {
3732
3738
  type: String
3733
- },
3734
- indexName: {
3735
- type: String
3736
3739
  }
3737
3740
  }
3738
3741
  },