@bunnyapp/components 1.0.31 → 1.0.34

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.
Files changed (6) hide show
  1. package/dist/cjs/index.js +28 -23
  2. package/dist/cjs/src/hooks/usePaymentMethod.d.ts +1 -1
  3. package/dist/esm/index.js +28 -24
  4. package/dist/esm/src/hooks/usePaymentMethod.d.ts +1 -1
  5. package/dist/index.d.ts +1 -1
  6. package/package.json +4 -2
package/dist/cjs/index.js CHANGED
@@ -16,6 +16,7 @@ var reactStripeJs = require('@stripe/react-stripe-js');
16
16
  var pure = require('@stripe/stripe-js/pure');
17
17
  var lodash = require('lodash');
18
18
  var recharts = require('recharts');
19
+ var pluralize = require('pluralize');
19
20
 
20
21
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
21
22
 
@@ -41,6 +42,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
41
42
  var React__namespace = /*#__PURE__*/_interopNamespace(React);
42
43
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
43
44
  var theme__default = /*#__PURE__*/_interopDefaultLegacy(theme);
45
+ var pluralize__default = /*#__PURE__*/_interopDefaultLegacy(pluralize);
44
46
 
45
47
  function styleInject(css, ref) {
46
48
  if ( ref === void 0 ) ref = {};
@@ -1872,7 +1874,7 @@ function InvoicePDF(_a) {
1872
1874
  var paymentMethodsQuery = "query paymentMethods ($filter: String, $first: Int, $sort: String) {\n paymentMethods (filter: $filter, first: $first, sort: $sort) {\n nodes {\n id\n disabled\n pluginId\n accountId\n expirationDate\n plugin {\n guid\n id\n }\n state\n metadata {\n issuer\n identifier\n kind\n description\n icon\n }\n }\n }\n}";
1873
1875
  var usePaymentMethod = function (graphQLClient, entityId, token) {
1874
1876
  var result = reactQuery.useQuery({
1875
- queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey(token, entityId),
1877
+ queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey(entityId, token),
1876
1878
  queryFn: function () {
1877
1879
  return graphQLClient
1878
1880
  .request(paymentMethodsQuery, {
@@ -2724,7 +2726,7 @@ function useRemovePaymentMethod(paymentPlugins, token, apiHost, entityId, accoun
2724
2726
  })
2725
2727
  .then(function () {
2726
2728
  showSuccessNotification("Payment method was removed", "Success");
2727
- queryClient.setQueryData(common.QueryKeyFactory.default.accountPaymentMethodKey(token, entityId), null);
2729
+ queryClient.setQueryData(common.QueryKeyFactory.default.accountPaymentMethodKey(entityId, token), null);
2728
2730
  })
2729
2731
  .catch(function (error) {
2730
2732
  showErrorNotification(error.message, "Error removing payment method");
@@ -2791,7 +2793,7 @@ var PaymentForm = function (_a) {
2791
2793
  };
2792
2794
  var handleSavePaymentMethod = function () {
2793
2795
  queryClient.invalidateQueries({
2794
- queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey(token, entityId),
2796
+ queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey(entityId, token),
2795
2797
  });
2796
2798
  onSavePaymentMethod === null || onSavePaymentMethod === void 0 ? void 0 : onSavePaymentMethod();
2797
2799
  setShowPaymentMethodForm(false);
@@ -2842,7 +2844,7 @@ function ActualInvoice() {
2842
2844
  var handleAllErrorFormats = common.useAllErrorFormats(onTokenExpired);
2843
2845
  // Queries
2844
2846
  var formattedInvoice = reactQuery.useQuery({
2845
- queryKey: common.QueryKeyFactory.default.createFormattedInvoiceKey(token, id),
2847
+ queryKey: common.QueryKeyFactory.default.createFormattedInvoiceKey(id, token),
2846
2848
  queryFn: function () { return common.getFormattedInvoice({ id: id, token: token, apiHost: apiHost }); },
2847
2849
  }).data;
2848
2850
  // Derived state
@@ -2854,7 +2856,7 @@ function ActualInvoice() {
2854
2856
  queryKey: common.QueryKeyFactory.default.transactionsKey(token),
2855
2857
  });
2856
2858
  queryClient.invalidateQueries({
2857
- queryKey: common.QueryKeyFactory.default.createFormattedInvoiceKey(token, id),
2859
+ queryKey: common.QueryKeyFactory.default.createFormattedInvoiceKey(id, token),
2858
2860
  });
2859
2861
  showSuccessNotification("Your invoice has been paid", "Payment successful");
2860
2862
  };
@@ -2961,7 +2963,7 @@ var useSendAcceptQuote = function (_a) {
2961
2963
  });
2962
2964
  client.on("sign", function (data) {
2963
2965
  queryClient.refetchQueries({
2964
- queryKey: common.QueryKeyFactory.default.createQuoteKey(token, quoteId),
2966
+ queryKey: common.QueryKeyFactory.default.createQuoteKey(quoteId, token),
2965
2967
  });
2966
2968
  queryClient.refetchQueries({
2967
2969
  queryKey: common.QueryKeyFactory.default.createQuoteKey(token),
@@ -2985,7 +2987,7 @@ var useSendAcceptQuote = function (_a) {
2985
2987
  else {
2986
2988
  setAcceptBoxVisible(false);
2987
2989
  queryClient.invalidateQueries({
2988
- queryKey: common.QueryKeyFactory.default.createQuoteKey(token, quoteId),
2990
+ queryKey: common.QueryKeyFactory.default.createQuoteKey(quoteId, token),
2989
2991
  });
2990
2992
  queryClient.invalidateQueries({
2991
2993
  queryKey: common.QueryKeyFactory.default.createQuoteKey(token),
@@ -3144,7 +3146,7 @@ function ActualQuote(_a) {
3144
3146
  var _e = React.useContext(InvoiceQuoteContext), className = _e.className, id = _e.id, hideDownloadButton = _e.hideDownloadButton, onQuoteLoaded = _e.onQuoteLoaded;
3145
3147
  // Queries
3146
3148
  var _f = reactQuery.useQuery({
3147
- queryKey: common.QueryKeyFactory.default.createQuoteKey(token, id),
3149
+ queryKey: common.QueryKeyFactory.default.createQuoteKey(id, token),
3148
3150
  queryFn: function () { return __awaiter(_this, void 0, void 0, function () {
3149
3151
  var error_1;
3150
3152
  return __generator(this, function (_a) {
@@ -3220,7 +3222,7 @@ var getQuotes = function (_a) {
3220
3222
  });
3221
3223
  };
3222
3224
 
3223
- var transactionMutation = function (filter) { return "\nquery transactions {\n transactions ".concat(filter ? "(".concat(filter, ")") : "", " {\n nodes {\n amount\n createdAt\n currencyId\n description\n id\n kind\n state\n transactionableId\n transactionable {\n ...on Payment { amount }\n ...on Invoice { amount number dueAt issuedAt isLegacy }\n ...on CreditNote { amount number dueAt issuedAt }\n }\n }\n }\n}"); };
3225
+ var transactionMutation = function (filter) { return "\nquery transactions {\n transactions ".concat(filter ? "(".concat(filter, ")") : "", " {\n nodes {\n amount\n createdAt\n currencyId\n description\n id\n kind\n state\n transactionableId\n transactionable {\n ...on Payment { amount }\n ...on Invoice { amount number dueAt issuedAt isLegacy }\n ...on CreditNote { amount number issuedAt }\n }\n }\n }\n}"); };
3224
3226
  var getTransactions = function (filter, token, apiHost) { return __awaiter(void 0, void 0, void 0, function () {
3225
3227
  var response, _a, data, errors;
3226
3228
  return __generator(this, function (_b) {
@@ -3346,7 +3348,7 @@ function transactionDateToDisplay(transaction, transactionDateType) {
3346
3348
  if (transaction.kind === "PAYMENT") {
3347
3349
  return transaction.createdAt;
3348
3350
  }
3349
- else if (transactionDateType === "dueAt") {
3351
+ else if (transaction.kind !== "REFUND" && transactionDateType === "dueAt") {
3350
3352
  return (_a = transaction.transactionable) === null || _a === void 0 ? void 0 : _a.dueAt;
3351
3353
  }
3352
3354
  else if (transactionDateType === "issuedAt") {
@@ -3679,15 +3681,15 @@ var PaymentMethod = function (_a) {
3679
3681
  var data = usePaymentMethod(graphQLClient, entityId, token).data;
3680
3682
  var onClickRemove = useRemovePaymentMethod(paymentPlugins || [], token, apiHost, entityId);
3681
3683
  // Queries
3682
- var _f = reactQuery.useQuery({
3683
- queryKey: common.QueryKeyFactory.default.billingDetailsKey(token, entityId),
3684
+ var billingDetails = reactQuery.useQuery({
3685
+ queryKey: common.QueryKeyFactory.default.billingDetailsKey(entityId, token),
3684
3686
  queryFn: function () { return getBillingDetails({ token: token, apiHost: apiHost }); },
3685
- }), billingDetails = _f.data; _f.isLoading;
3687
+ }).data;
3686
3688
  // Local state
3687
- var _g = React.useState(false), showModal = _g[0], setShowModal = _g[1];
3689
+ var _f = React.useState(false), showModal = _f[0], setShowModal = _f[1];
3688
3690
  var onSuccess = function () {
3689
3691
  queryClient.invalidateQueries({
3690
- queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey(token, entityId),
3692
+ queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey(entityId, token),
3691
3693
  });
3692
3694
  setShowModal(false);
3693
3695
  showSuccessNotification("Your payment method has been saved");
@@ -3933,7 +3935,7 @@ var Checkout = function (_a) {
3933
3935
  ((taxationRequiredAccountFields === null || taxationRequiredAccountFields === void 0 ? void 0 : taxationRequiredAccountFields.length) || 0) > 0,
3934
3936
  }), account = _g.data, isLoadingAccount = _g.isLoading;
3935
3937
  reactQuery.useQuery({
3936
- queryKey: queryKeyFactory.createQuoteTaxCalculateKey(token, quote === null || quote === void 0 ? void 0 : quote.id),
3938
+ queryKey: queryKeyFactory.createQuoteTaxCalculateKey(quote === null || quote === void 0 ? void 0 : quote.id, token),
3937
3939
  queryFn: function () { return __awaiter(void 0, void 0, void 0, function () {
3938
3940
  var updatedQuote;
3939
3941
  return __generator(this, function (_a) {
@@ -3949,7 +3951,7 @@ var Checkout = function (_a) {
3949
3951
  updatedQuote = _a.sent();
3950
3952
  if (updatedQuote) {
3951
3953
  queryClient.setQueryData(queryKeyFactory.createObjectKey("editingQuote", updatedQuote.id), updatedQuote);
3952
- queryClient.setQueryData(queryKeyFactory.calculatedPricesKey(token, quantity, selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id), updatedQuote);
3954
+ queryClient.setQueryData(queryKeyFactory.calculatedPricesKey(quantity, selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id, token), updatedQuote);
3953
3955
  }
3954
3956
  _a.label = 2;
3955
3957
  case 2: return [2 /*return*/, {}];
@@ -4148,7 +4150,7 @@ function Signup(_a) {
4148
4150
  // We must invalidate the accountPaymentMethodKey query in order to clear payment methods from the provided api token,
4149
4151
  // to instead use paymentMethods from portalSessionToken.
4150
4152
  queryClient.invalidateQueries({
4151
- queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey(token, entityId),
4153
+ queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey(entityId, token),
4152
4154
  });
4153
4155
  setProceedingToPayment(false);
4154
4156
  setQuote(data.quote);
@@ -4474,7 +4476,10 @@ var FeatureUsageGraph = function (_a) {
4474
4476
  // State
4475
4477
  var _c = React.useState(false), isModalOpen = _c[0], setIsModalOpen = _c[1];
4476
4478
  var dataFormat = getDateFormat(featureUsage.dataInterval);
4477
- var featureName = common.StringUtils.pluralizeAttributeName(((_b = charge.feature) === null || _b === void 0 ? void 0 : _b.name) || "");
4479
+ var chargeFeatureName = ((_b = charge.feature) === null || _b === void 0 ? void 0 : _b.name) || "";
4480
+ var featureName = pluralize.isPlural(chargeFeatureName)
4481
+ ? chargeFeatureName
4482
+ : pluralize__default["default"](chargeFeatureName);
4478
4483
  var basicViewData = featureUsage.data.map(function (data) {
4479
4484
  var _a;
4480
4485
  return (_a = {
@@ -4818,7 +4823,7 @@ var Subscriptions = function (_a) {
4818
4823
  var token = useToken();
4819
4824
  // Queries
4820
4825
  var _d = reactQuery.useQuery({
4821
- queryKey: common.QueryKeyFactory.default.createTableKey(token, "subscriptions"),
4826
+ queryKey: common.QueryKeyFactory.default.createTableKey("subscriptions", token),
4822
4827
  queryFn: function () { return getSubscriptions({ entityId: entityId, token: token, apiHost: apiHost }); },
4823
4828
  enabled: Boolean(entityId),
4824
4829
  }), rawSubscriptions = _d.data, subscriptionsAreLoading = _d.isLoading;
@@ -4892,7 +4897,7 @@ var BillingDetails = function (_a) {
4892
4897
  var values = antd.Form.useWatch([], form);
4893
4898
  // Queries
4894
4899
  var _g = reactQuery.useQuery({
4895
- queryKey: common.QueryKeyFactory.default.billingDetailsKey(token, entityId),
4900
+ queryKey: common.QueryKeyFactory.default.billingDetailsKey(entityId, token),
4896
4901
  queryFn: function () { return getBillingDetails({ token: token, apiHost: apiHost }); },
4897
4902
  }), billingDetails = _g.data, isLoadingBillingDetails = _g.isLoading;
4898
4903
  var _h = reactQuery.useMutation({
@@ -4916,7 +4921,7 @@ var BillingDetails = function (_a) {
4916
4921
  })];
4917
4922
  case 1:
4918
4923
  updatedBillingDetails = _a.sent();
4919
- queryClient.setQueryData(common.QueryKeyFactory.default.billingDetailsKey(token, entityId), function (old) {
4924
+ queryClient.setQueryData(common.QueryKeyFactory.default.billingDetailsKey(entityId, token), function (old) {
4920
4925
  return __assign(__assign({}, old), updatedBillingDetails.billingDetails);
4921
4926
  });
4922
4927
  return [2 /*return*/, updatedBillingDetails];
@@ -4926,7 +4931,7 @@ var BillingDetails = function (_a) {
4926
4931
  onSuccess: function () {
4927
4932
  showSuccessNotification("Your account details have been saved");
4928
4933
  queryClient.invalidateQueries({
4929
- queryKey: common.QueryKeyFactory.default.taxationRequiredAccountFieldsKey(token, entityId),
4934
+ queryKey: common.QueryKeyFactory.default.taxationRequiredAccountFieldsKey(entityId, token),
4930
4935
  });
4931
4936
  },
4932
4937
  }), updateBillingDetails = _h.mutate, isUpdatingBillingDetails = _h.isPending;
package/dist/cjs/src/hooks/usePaymentMethod.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import { GraphQLClient } from "graphql-request";
2
- export declare const usePaymentMethod: (graphQLClient: GraphQLClient, entityId: string, token: string) => import("@tanstack/react-query/build/legacy/types").UseQueryResult<any, Error>;
2
+ export declare const usePaymentMethod: (graphQLClient: GraphQLClient, entityId?: string, token?: string) => import("@tanstack/react-query/build/legacy/types").UseQueryResult<any, Error>;
package/dist/esm/index.js CHANGED
@@ -4,7 +4,7 @@ import React__default, { createContext, useContext, useEffect, useState, useMemo
4
4
  import { Markup } from 'interweave';
5
5
  import { ConfigProvider, Button, Typography, Tag, Divider, Popconfirm, Input, Checkbox, Collapse, Modal, Form, Drawer, Card as Card$1, Select, Image, Dropdown, Skeleton } from 'antd';
6
6
  import styled from 'styled-components';
7
- import { DEFAULT_ACCENT_COLOR, DEFAULT_BRAND_COLOR, DEFAULT_SECONDARY_COLOR, DEFAULT_TOP_NAV_IMAGE_URL, gqlRequest, QueryKeyFactory, useIsMobile, isColorTooDark, MARK_PRO, INPUT_BORDER_COLOR, SLATE_50, SLATE_400, SLATE_200, getPlugins, useAllErrorFormats, formatCurrency, invokePlugin, GRAY_500, GRAY_200, useErrorNotification, useSuccessNotification, getFormattedInvoice, PAYABLE_INVOICE_STATES, BreakpointNumbers, useGraphQLmutation, formatDate, FrontendTransaction, SLATE_600, WHITE, TransactionKind, Lists, getAccount, SubscriptionChargeKind, SubscriptionState as SubscriptionState$2, MODAL_MAX_HEIGHT, SLATE_500, StringUtils, DataInterval, TAG_COLORS, ChargeType, PricingModel } from '@bunnyapp/common';
7
+ import { DEFAULT_ACCENT_COLOR, DEFAULT_BRAND_COLOR, DEFAULT_SECONDARY_COLOR, DEFAULT_TOP_NAV_IMAGE_URL, gqlRequest, QueryKeyFactory, useIsMobile, isColorTooDark, MARK_PRO, INPUT_BORDER_COLOR, SLATE_50, SLATE_400, SLATE_200, getPlugins, useAllErrorFormats, formatCurrency, invokePlugin, GRAY_500, GRAY_200, useErrorNotification, useSuccessNotification, getFormattedInvoice, PAYABLE_INVOICE_STATES, BreakpointNumbers, useGraphQLmutation, formatDate, FrontendTransaction, SLATE_600, WHITE, TransactionKind, Lists, getAccount, SubscriptionChargeKind, SubscriptionState as SubscriptionState$2, MODAL_MAX_HEIGHT, SLATE_500, DataInterval, TAG_COLORS, ChargeType, PricingModel } from '@bunnyapp/common';
8
8
  import { QueryClient, QueryClientProvider, useQuery, useQueryClient, keepPreviousData, useMutation } from '@tanstack/react-query';
9
9
  import theme from 'antd/lib/theme';
10
10
  import { RecoilRoot } from 'recoil';
@@ -13,6 +13,7 @@ import { useElements, useStripe, PaymentElement, Elements } from '@stripe/react-
13
13
  import { loadStripe } from '@stripe/stripe-js/pure';
14
14
  import { capitalize, startCase, cloneDeep, omit } from 'lodash';
15
15
  import { BarChart, ResponsiveContainer, XAxis, Tooltip, Bar, Rectangle } from 'recharts';
16
+ import pluralize, { isPlural } from 'pluralize';
16
17
 
17
18
  function styleInject(css, ref) {
18
19
  if ( ref === void 0 ) ref = {};
@@ -1844,7 +1845,7 @@ function InvoicePDF(_a) {
1844
1845
  var paymentMethodsQuery = "query paymentMethods ($filter: String, $first: Int, $sort: String) {\n paymentMethods (filter: $filter, first: $first, sort: $sort) {\n nodes {\n id\n disabled\n pluginId\n accountId\n expirationDate\n plugin {\n guid\n id\n }\n state\n metadata {\n issuer\n identifier\n kind\n description\n icon\n }\n }\n }\n}";
1845
1846
  var usePaymentMethod = function (graphQLClient, entityId, token) {
1846
1847
  var result = useQuery({
1847
- queryKey: QueryKeyFactory.default.accountPaymentMethodKey(token, entityId),
1848
+ queryKey: QueryKeyFactory.default.accountPaymentMethodKey(entityId, token),
1848
1849
  queryFn: function () {
1849
1850
  return graphQLClient
1850
1851
  .request(paymentMethodsQuery, {
@@ -2696,7 +2697,7 @@ function useRemovePaymentMethod(paymentPlugins, token, apiHost, entityId, accoun
2696
2697
  })
2697
2698
  .then(function () {
2698
2699
  showSuccessNotification("Payment method was removed", "Success");
2699
- queryClient.setQueryData(QueryKeyFactory.default.accountPaymentMethodKey(token, entityId), null);
2700
+ queryClient.setQueryData(QueryKeyFactory.default.accountPaymentMethodKey(entityId, token), null);
2700
2701
  })
2701
2702
  .catch(function (error) {
2702
2703
  showErrorNotification(error.message, "Error removing payment method");
@@ -2763,7 +2764,7 @@ var PaymentForm = function (_a) {
2763
2764
  };
2764
2765
  var handleSavePaymentMethod = function () {
2765
2766
  queryClient.invalidateQueries({
2766
- queryKey: QueryKeyFactory.default.accountPaymentMethodKey(token, entityId),
2767
+ queryKey: QueryKeyFactory.default.accountPaymentMethodKey(entityId, token),
2767
2768
  });
2768
2769
  onSavePaymentMethod === null || onSavePaymentMethod === void 0 ? void 0 : onSavePaymentMethod();
2769
2770
  setShowPaymentMethodForm(false);
@@ -2814,7 +2815,7 @@ function ActualInvoice() {
2814
2815
  var handleAllErrorFormats = useAllErrorFormats(onTokenExpired);
2815
2816
  // Queries
2816
2817
  var formattedInvoice = useQuery({
2817
- queryKey: QueryKeyFactory.default.createFormattedInvoiceKey(token, id),
2818
+ queryKey: QueryKeyFactory.default.createFormattedInvoiceKey(id, token),
2818
2819
  queryFn: function () { return getFormattedInvoice({ id: id, token: token, apiHost: apiHost }); },
2819
2820
  }).data;
2820
2821
  // Derived state
@@ -2826,7 +2827,7 @@ function ActualInvoice() {
2826
2827
  queryKey: QueryKeyFactory.default.transactionsKey(token),
2827
2828
  });
2828
2829
  queryClient.invalidateQueries({
2829
- queryKey: QueryKeyFactory.default.createFormattedInvoiceKey(token, id),
2830
+ queryKey: QueryKeyFactory.default.createFormattedInvoiceKey(id, token),
2830
2831
  });
2831
2832
  showSuccessNotification("Your invoice has been paid", "Payment successful");
2832
2833
  };
@@ -2933,7 +2934,7 @@ var useSendAcceptQuote = function (_a) {
2933
2934
  });
2934
2935
  client.on("sign", function (data) {
2935
2936
  queryClient.refetchQueries({
2936
- queryKey: QueryKeyFactory.default.createQuoteKey(token, quoteId),
2937
+ queryKey: QueryKeyFactory.default.createQuoteKey(quoteId, token),
2937
2938
  });
2938
2939
  queryClient.refetchQueries({
2939
2940
  queryKey: QueryKeyFactory.default.createQuoteKey(token),
@@ -2957,7 +2958,7 @@ var useSendAcceptQuote = function (_a) {
2957
2958
  else {
2958
2959
  setAcceptBoxVisible(false);
2959
2960
  queryClient.invalidateQueries({
2960
- queryKey: QueryKeyFactory.default.createQuoteKey(token, quoteId),
2961
+ queryKey: QueryKeyFactory.default.createQuoteKey(quoteId, token),
2961
2962
  });
2962
2963
  queryClient.invalidateQueries({
2963
2964
  queryKey: QueryKeyFactory.default.createQuoteKey(token),
@@ -3116,7 +3117,7 @@ function ActualQuote(_a) {
3116
3117
  var _e = useContext(InvoiceQuoteContext), className = _e.className, id = _e.id, hideDownloadButton = _e.hideDownloadButton, onQuoteLoaded = _e.onQuoteLoaded;
3117
3118
  // Queries
3118
3119
  var _f = useQuery({
3119
- queryKey: QueryKeyFactory.default.createQuoteKey(token, id),
3120
+ queryKey: QueryKeyFactory.default.createQuoteKey(id, token),
3120
3121
  queryFn: function () { return __awaiter(_this, void 0, void 0, function () {
3121
3122
  var error_1;
3122
3123
  return __generator(this, function (_a) {
@@ -3192,7 +3193,7 @@ var getQuotes = function (_a) {
3192
3193
  });
3193
3194
  };
3194
3195
 
3195
- var transactionMutation = function (filter) { return "\nquery transactions {\n transactions ".concat(filter ? "(".concat(filter, ")") : "", " {\n nodes {\n amount\n createdAt\n currencyId\n description\n id\n kind\n state\n transactionableId\n transactionable {\n ...on Payment { amount }\n ...on Invoice { amount number dueAt issuedAt isLegacy }\n ...on CreditNote { amount number dueAt issuedAt }\n }\n }\n }\n}"); };
3196
+ var transactionMutation = function (filter) { return "\nquery transactions {\n transactions ".concat(filter ? "(".concat(filter, ")") : "", " {\n nodes {\n amount\n createdAt\n currencyId\n description\n id\n kind\n state\n transactionableId\n transactionable {\n ...on Payment { amount }\n ...on Invoice { amount number dueAt issuedAt isLegacy }\n ...on CreditNote { amount number issuedAt }\n }\n }\n }\n}"); };
3196
3197
  var getTransactions = function (filter, token, apiHost) { return __awaiter(void 0, void 0, void 0, function () {
3197
3198
  var response, _a, data, errors;
3198
3199
  return __generator(this, function (_b) {
@@ -3318,7 +3319,7 @@ function transactionDateToDisplay(transaction, transactionDateType) {
3318
3319
  if (transaction.kind === "PAYMENT") {
3319
3320
  return transaction.createdAt;
3320
3321
  }
3321
- else if (transactionDateType === "dueAt") {
3322
+ else if (transaction.kind !== "REFUND" && transactionDateType === "dueAt") {
3322
3323
  return (_a = transaction.transactionable) === null || _a === void 0 ? void 0 : _a.dueAt;
3323
3324
  }
3324
3325
  else if (transactionDateType === "issuedAt") {
@@ -3651,15 +3652,15 @@ var PaymentMethod = function (_a) {
3651
3652
  var data = usePaymentMethod(graphQLClient, entityId, token).data;
3652
3653
  var onClickRemove = useRemovePaymentMethod(paymentPlugins || [], token, apiHost, entityId);
3653
3654
  // Queries
3654
- var _f = useQuery({
3655
- queryKey: QueryKeyFactory.default.billingDetailsKey(token, entityId),
3655
+ var billingDetails = useQuery({
3656
+ queryKey: QueryKeyFactory.default.billingDetailsKey(entityId, token),
3656
3657
  queryFn: function () { return getBillingDetails({ token: token, apiHost: apiHost }); },
3657
- }), billingDetails = _f.data; _f.isLoading;
3658
+ }).data;
3658
3659
  // Local state
3659
- var _g = useState(false), showModal = _g[0], setShowModal = _g[1];
3660
+ var _f = useState(false), showModal = _f[0], setShowModal = _f[1];
3660
3661
  var onSuccess = function () {
3661
3662
  queryClient.invalidateQueries({
3662
- queryKey: QueryKeyFactory.default.accountPaymentMethodKey(token, entityId),
3663
+ queryKey: QueryKeyFactory.default.accountPaymentMethodKey(entityId, token),
3663
3664
  });
3664
3665
  setShowModal(false);
3665
3666
  showSuccessNotification("Your payment method has been saved");
@@ -3905,7 +3906,7 @@ var Checkout = function (_a) {
3905
3906
  ((taxationRequiredAccountFields === null || taxationRequiredAccountFields === void 0 ? void 0 : taxationRequiredAccountFields.length) || 0) > 0,
3906
3907
  }), account = _g.data, isLoadingAccount = _g.isLoading;
3907
3908
  useQuery({
3908
- queryKey: queryKeyFactory.createQuoteTaxCalculateKey(token, quote === null || quote === void 0 ? void 0 : quote.id),
3909
+ queryKey: queryKeyFactory.createQuoteTaxCalculateKey(quote === null || quote === void 0 ? void 0 : quote.id, token),
3909
3910
  queryFn: function () { return __awaiter(void 0, void 0, void 0, function () {
3910
3911
  var updatedQuote;
3911
3912
  return __generator(this, function (_a) {
@@ -3921,7 +3922,7 @@ var Checkout = function (_a) {
3921
3922
  updatedQuote = _a.sent();
3922
3923
  if (updatedQuote) {
3923
3924
  queryClient.setQueryData(queryKeyFactory.createObjectKey("editingQuote", updatedQuote.id), updatedQuote);
3924
- queryClient.setQueryData(queryKeyFactory.calculatedPricesKey(token, quantity, selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id), updatedQuote);
3925
+ queryClient.setQueryData(queryKeyFactory.calculatedPricesKey(quantity, selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id, token), updatedQuote);
3925
3926
  }
3926
3927
  _a.label = 2;
3927
3928
  case 2: return [2 /*return*/, {}];
@@ -4120,7 +4121,7 @@ function Signup(_a) {
4120
4121
  // We must invalidate the accountPaymentMethodKey query in order to clear payment methods from the provided api token,
4121
4122
  // to instead use paymentMethods from portalSessionToken.
4122
4123
  queryClient.invalidateQueries({
4123
- queryKey: QueryKeyFactory.default.accountPaymentMethodKey(token, entityId),
4124
+ queryKey: QueryKeyFactory.default.accountPaymentMethodKey(entityId, token),
4124
4125
  });
4125
4126
  setProceedingToPayment(false);
4126
4127
  setQuote(data.quote);
@@ -4446,7 +4447,10 @@ var FeatureUsageGraph = function (_a) {
4446
4447
  // State
4447
4448
  var _c = useState(false), isModalOpen = _c[0], setIsModalOpen = _c[1];
4448
4449
  var dataFormat = getDateFormat(featureUsage.dataInterval);
4449
- var featureName = StringUtils.pluralizeAttributeName(((_b = charge.feature) === null || _b === void 0 ? void 0 : _b.name) || "");
4450
+ var chargeFeatureName = ((_b = charge.feature) === null || _b === void 0 ? void 0 : _b.name) || "";
4451
+ var featureName = isPlural(chargeFeatureName)
4452
+ ? chargeFeatureName
4453
+ : pluralize(chargeFeatureName);
4450
4454
  var basicViewData = featureUsage.data.map(function (data) {
4451
4455
  var _a;
4452
4456
  return (_a = {
@@ -4790,7 +4794,7 @@ var Subscriptions = function (_a) {
4790
4794
  var token = useToken();
4791
4795
  // Queries
4792
4796
  var _d = useQuery({
4793
- queryKey: QueryKeyFactory.default.createTableKey(token, "subscriptions"),
4797
+ queryKey: QueryKeyFactory.default.createTableKey("subscriptions", token),
4794
4798
  queryFn: function () { return getSubscriptions({ entityId: entityId, token: token, apiHost: apiHost }); },
4795
4799
  enabled: Boolean(entityId),
4796
4800
  }), rawSubscriptions = _d.data, subscriptionsAreLoading = _d.isLoading;
@@ -4864,7 +4868,7 @@ var BillingDetails = function (_a) {
4864
4868
  var values = Form.useWatch([], form);
4865
4869
  // Queries
4866
4870
  var _g = useQuery({
4867
- queryKey: QueryKeyFactory.default.billingDetailsKey(token, entityId),
4871
+ queryKey: QueryKeyFactory.default.billingDetailsKey(entityId, token),
4868
4872
  queryFn: function () { return getBillingDetails({ token: token, apiHost: apiHost }); },
4869
4873
  }), billingDetails = _g.data, isLoadingBillingDetails = _g.isLoading;
4870
4874
  var _h = useMutation({
@@ -4888,7 +4892,7 @@ var BillingDetails = function (_a) {
4888
4892
  })];
4889
4893
  case 1:
4890
4894
  updatedBillingDetails = _a.sent();
4891
- queryClient.setQueryData(QueryKeyFactory.default.billingDetailsKey(token, entityId), function (old) {
4895
+ queryClient.setQueryData(QueryKeyFactory.default.billingDetailsKey(entityId, token), function (old) {
4892
4896
  return __assign(__assign({}, old), updatedBillingDetails.billingDetails);
4893
4897
  });
4894
4898
  return [2 /*return*/, updatedBillingDetails];
@@ -4898,7 +4902,7 @@ var BillingDetails = function (_a) {
4898
4902
  onSuccess: function () {
4899
4903
  showSuccessNotification("Your account details have been saved");
4900
4904
  queryClient.invalidateQueries({
4901
- queryKey: QueryKeyFactory.default.taxationRequiredAccountFieldsKey(token, entityId),
4905
+ queryKey: QueryKeyFactory.default.taxationRequiredAccountFieldsKey(entityId, token),
4902
4906
  });
4903
4907
  },
4904
4908
  }), updateBillingDetails = _h.mutate, isUpdatingBillingDetails = _h.isPending;
package/dist/esm/src/hooks/usePaymentMethod.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import { GraphQLClient } from "graphql-request";
2
- export declare const usePaymentMethod: (graphQLClient: GraphQLClient, entityId: string, token: string) => import("@tanstack/react-query/build/legacy/types").UseQueryResult<any, Error>;
2
+ export declare const usePaymentMethod: (graphQLClient: GraphQLClient, entityId?: string, token?: string) => import("@tanstack/react-query/build/legacy/types").UseQueryResult<any, Error>;
package/dist/index.d.ts CHANGED
@@ -209,6 +209,6 @@ declare const BillingDetails: ({ entityId, isCardEnabled, shadow, className, hid
209
209
  }) => boolean) | undefined;
210
210
  }) => react_jsx_runtime.JSX.Element;
211
211
 
212
- declare const usePaymentMethod: (graphQLClient: GraphQLClient, entityId: string, token: string) => _tanstack_react_query_build_legacy_types.UseQueryResult<any, Error>;
212
+ declare const usePaymentMethod: (graphQLClient: GraphQLClient, entityId?: string, token?: string) => _tanstack_react_query_build_legacy_types.UseQueryResult<any, Error>;
213
213
 
214
214
  export { BillingDetails, BunnyProvider, Checkout, Invoice, PaymentMethod, Quote, Quotes, Signup, Subscriptions, Transactions, getQuoteAmountDue, usePaymentMethod };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bunnyapp/components",
3
- "version": "1.0.31",
3
+ "version": "1.0.34",
4
4
  "description": "Components from the Bunny portal to embed Bunny UI functionality into your application.",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -39,6 +39,7 @@
39
39
  "@tanstack/react-query-devtools": "^5.65.1",
40
40
  "@types/hellosign-embedded": "^2.0.6",
41
41
  "@types/lodash": "^4.17.13",
42
+ "@types/pluralize": "^0.0.33",
42
43
  "@types/react": "^18.3.1",
43
44
  "@types/react-dom": "^18.3.1",
44
45
  "@vitejs/plugin-react": "^4.3.4",
@@ -62,7 +63,7 @@
62
63
  "vite": "^5.4.11"
63
64
  },
64
65
  "peerDependencies": {
65
- "@bunnyapp/common": "^1.0.43",
66
+ "@bunnyapp/common": "^1.0.44",
66
67
  "@fortawesome/fontawesome-svg-core": "^6.7.2",
67
68
  "@fortawesome/free-brands-svg-icons": "^6.7.2",
68
69
  "@fortawesome/free-regular-svg-icons": "^6.7.2",
@@ -77,6 +78,7 @@
77
78
  "interweave": "^13.1.0",
78
79
  "less": "^4.2.0",
79
80
  "lodash": "^4.17.21",
81
+ "pluralize": "^8.0.0",
80
82
  "react": "^18.3.1",
81
83
  "react-dom": "^18.3.1",
82
84
  "recharts": "^2.15.0",