@layerfi/components 0.1.17 → 0.1.18
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/LICENSE +21 -0
- package/README.md +15 -5
- package/dist/esm/index.js +531 -517
- package/dist/esm/index.js.map +4 -4
- package/dist/index.d.ts +14 -0
- package/dist/index.js +662 -647
- package/dist/index.js.map +4 -4
- package/dist/styles/index.css +23 -12
- package/dist/styles/index.css.map +2 -2
- package/package.json +2 -2
- package/image.png +0 -0
package/dist/index.js
CHANGED
|
@@ -36,6 +36,7 @@ __export(src_exports, {
|
|
|
36
36
|
BankTransactionsWithLinkedAccounts: () => BankTransactionsWithLinkedAccounts,
|
|
37
37
|
ChartOfAccounts: () => ChartOfAccounts,
|
|
38
38
|
GeneralLedgerView: () => GeneralLedgerView,
|
|
39
|
+
Hello: () => Hello,
|
|
39
40
|
Journal: () => Journal,
|
|
40
41
|
LayerProvider: () => LayerProvider,
|
|
41
42
|
LinkedAccounts: () => LinkedAccounts,
|
|
@@ -4352,12 +4353,25 @@ var BankTransactions = ({
|
|
|
4352
4353
|
);
|
|
4353
4354
|
};
|
|
4354
4355
|
|
|
4356
|
+
// src/components/Hello/Hello.tsx
|
|
4357
|
+
var import_react47 = __toESM(require("react"));
|
|
4358
|
+
var import_swr3 = __toESM(require("swr"));
|
|
4359
|
+
var fetcher = (url) => fetch(url).then((res) => res.json());
|
|
4360
|
+
var Hello = ({ user }) => {
|
|
4361
|
+
const { data, isLoading } = (0, import_swr3.default)(
|
|
4362
|
+
`https://api.github.com/users/${user || "jyurek"}`,
|
|
4363
|
+
fetcher
|
|
4364
|
+
);
|
|
4365
|
+
const name = (isLoading ? "..." : data?.name) || "User";
|
|
4366
|
+
return /* @__PURE__ */ import_react47.default.createElement(import_react47.default.Fragment, null, /* @__PURE__ */ import_react47.default.createElement("div", { className: "hello" }, "Hello, ", name, "!"));
|
|
4367
|
+
};
|
|
4368
|
+
|
|
4355
4369
|
// src/components/LinkedAccounts/LinkedAccounts.tsx
|
|
4356
|
-
var
|
|
4370
|
+
var import_react56 = __toESM(require("react"));
|
|
4357
4371
|
|
|
4358
4372
|
// src/contexts/LinkedAccountsContext/LinkedAccountsContext.ts
|
|
4359
|
-
var
|
|
4360
|
-
var LinkedAccountsContext = (0,
|
|
4373
|
+
var import_react48 = require("react");
|
|
4374
|
+
var LinkedAccountsContext = (0, import_react48.createContext)({
|
|
4361
4375
|
data: void 0,
|
|
4362
4376
|
isLoading: false,
|
|
4363
4377
|
loadingStatus: "initial",
|
|
@@ -4376,10 +4390,10 @@ var LinkedAccountsContext = (0, import_react47.createContext)({
|
|
|
4376
4390
|
});
|
|
4377
4391
|
|
|
4378
4392
|
// src/providers/LinkedAccountsProvider/LinkedAccountsProvider.tsx
|
|
4379
|
-
var
|
|
4393
|
+
var import_react50 = __toESM(require("react"));
|
|
4380
4394
|
|
|
4381
4395
|
// src/hooks/useLinkedAccounts/useLinkedAccounts.ts
|
|
4382
|
-
var
|
|
4396
|
+
var import_react49 = require("react");
|
|
4383
4397
|
var import_react_plaid_link = require("react-plaid-link");
|
|
4384
4398
|
|
|
4385
4399
|
// src/hooks/useLinkedAccounts/mockData.ts
|
|
@@ -4475,27 +4489,27 @@ var LINKED_ACCOUNTS_MOCK_DATA = [
|
|
|
4475
4489
|
];
|
|
4476
4490
|
|
|
4477
4491
|
// src/hooks/useLinkedAccounts/useLinkedAccounts.ts
|
|
4478
|
-
var
|
|
4492
|
+
var import_swr4 = __toESM(require("swr"));
|
|
4479
4493
|
var DEBUG = true;
|
|
4480
4494
|
var USE_MOCK_RESPONSE_DATA = false;
|
|
4481
4495
|
var USE_PLAID_SANDBOX = true;
|
|
4482
4496
|
var useLinkedAccounts = () => {
|
|
4483
4497
|
const { auth, businessId, apiUrl } = useLayerContext();
|
|
4484
|
-
const [linkToken, setLinkToken] = (0,
|
|
4485
|
-
const [loadingStatus, setLoadingStatus] = (0,
|
|
4498
|
+
const [linkToken, setLinkToken] = (0, import_react49.useState)(null);
|
|
4499
|
+
const [loadingStatus, setLoadingStatus] = (0, import_react49.useState)("initial");
|
|
4486
4500
|
const {
|
|
4487
4501
|
data: responseData,
|
|
4488
4502
|
isLoading,
|
|
4489
4503
|
isValidating,
|
|
4490
4504
|
error: responseError,
|
|
4491
4505
|
mutate
|
|
4492
|
-
} = (0,
|
|
4506
|
+
} = (0, import_swr4.default)(
|
|
4493
4507
|
businessId && auth?.access_token && `linked-accounts-${businessId}`,
|
|
4494
4508
|
Layer.getLinkedAccounts(apiUrl, auth?.access_token, {
|
|
4495
4509
|
params: { businessId }
|
|
4496
4510
|
})
|
|
4497
4511
|
);
|
|
4498
|
-
(0,
|
|
4512
|
+
(0, import_react49.useEffect)(() => {
|
|
4499
4513
|
if (!isLoading && responseData?.data.external_accounts) {
|
|
4500
4514
|
setLoadingStatus("complete");
|
|
4501
4515
|
return;
|
|
@@ -4537,7 +4551,7 @@ var useLinkedAccounts = () => {
|
|
|
4537
4551
|
onSuccess: exchangePlaidPublicToken2,
|
|
4538
4552
|
env: USE_PLAID_SANDBOX ? "sandbox" : void 0
|
|
4539
4553
|
});
|
|
4540
|
-
(0,
|
|
4554
|
+
(0, import_react49.useEffect)(() => {
|
|
4541
4555
|
if (plaidLinkReady) {
|
|
4542
4556
|
plaidLinkStart();
|
|
4543
4557
|
}
|
|
@@ -4615,15 +4629,15 @@ var LinkedAccountsProvider = ({
|
|
|
4615
4629
|
children
|
|
4616
4630
|
}) => {
|
|
4617
4631
|
const linkedAccountsContextData = useLinkedAccounts();
|
|
4618
|
-
return /* @__PURE__ */
|
|
4632
|
+
return /* @__PURE__ */ import_react50.default.createElement(LinkedAccountsContext.Provider, { value: linkedAccountsContextData }, children);
|
|
4619
4633
|
};
|
|
4620
4634
|
|
|
4621
4635
|
// src/components/LinkedAccounts/LinkedAccountsContent.tsx
|
|
4622
|
-
var
|
|
4636
|
+
var import_react55 = __toESM(require("react"));
|
|
4623
4637
|
|
|
4624
4638
|
// src/icons/PlusIcon.tsx
|
|
4625
|
-
var
|
|
4626
|
-
var PlusIcon = ({ size = 14, ...props }) => /* @__PURE__ */
|
|
4639
|
+
var React63 = __toESM(require("react"));
|
|
4640
|
+
var PlusIcon = ({ size = 14, ...props }) => /* @__PURE__ */ React63.createElement(
|
|
4627
4641
|
"svg",
|
|
4628
4642
|
{
|
|
4629
4643
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -4633,7 +4647,7 @@ var PlusIcon = ({ size = 14, ...props }) => /* @__PURE__ */ React62.createElemen
|
|
|
4633
4647
|
width: size,
|
|
4634
4648
|
height: size
|
|
4635
4649
|
},
|
|
4636
|
-
/* @__PURE__ */
|
|
4650
|
+
/* @__PURE__ */ React63.createElement(
|
|
4637
4651
|
"path",
|
|
4638
4652
|
{
|
|
4639
4653
|
d: "M14.6667 8.49996C14.6667 4.81806 11.6819 1.83329 8.00004 1.83329C4.31814 1.83329 1.33337 4.81806 1.33337 8.49996C1.33337 12.1819 4.31814 15.1666 8.00004 15.1666C11.6819 15.1666 14.6667 12.1819 14.6667 8.49996Z",
|
|
@@ -4642,7 +4656,7 @@ var PlusIcon = ({ size = 14, ...props }) => /* @__PURE__ */ React62.createElemen
|
|
|
4642
4656
|
strokeLinejoin: "round"
|
|
4643
4657
|
}
|
|
4644
4658
|
),
|
|
4645
|
-
/* @__PURE__ */
|
|
4659
|
+
/* @__PURE__ */ React63.createElement(
|
|
4646
4660
|
"path",
|
|
4647
4661
|
{
|
|
4648
4662
|
d: "M5.33337 8.5L10.6667 8.5",
|
|
@@ -4651,7 +4665,7 @@ var PlusIcon = ({ size = 14, ...props }) => /* @__PURE__ */ React62.createElemen
|
|
|
4651
4665
|
strokeLinejoin: "round"
|
|
4652
4666
|
}
|
|
4653
4667
|
),
|
|
4654
|
-
/* @__PURE__ */
|
|
4668
|
+
/* @__PURE__ */ React63.createElement(
|
|
4655
4669
|
"path",
|
|
4656
4670
|
{
|
|
4657
4671
|
d: "M8 11.1666L8 5.83329",
|
|
@@ -4664,12 +4678,12 @@ var PlusIcon = ({ size = 14, ...props }) => /* @__PURE__ */ React62.createElemen
|
|
|
4664
4678
|
var PlusIcon_default = PlusIcon;
|
|
4665
4679
|
|
|
4666
4680
|
// src/components/LinkedAccountOptions/LinkedAccountOptions.tsx
|
|
4667
|
-
var
|
|
4681
|
+
var import_react53 = __toESM(require("react"));
|
|
4668
4682
|
|
|
4669
4683
|
// src/icons/MoreVertical.tsx
|
|
4670
|
-
var
|
|
4684
|
+
var import_react51 = __toESM(require("react"));
|
|
4671
4685
|
var MoreVertical = ({ size = 18, ...props }) => {
|
|
4672
|
-
return /* @__PURE__ */
|
|
4686
|
+
return /* @__PURE__ */ import_react51.default.createElement(
|
|
4673
4687
|
"svg",
|
|
4674
4688
|
{
|
|
4675
4689
|
viewBox: "0 0 16 14",
|
|
@@ -4679,7 +4693,7 @@ var MoreVertical = ({ size = 18, ...props }) => {
|
|
|
4679
4693
|
width: size,
|
|
4680
4694
|
height: size
|
|
4681
4695
|
},
|
|
4682
|
-
/* @__PURE__ */
|
|
4696
|
+
/* @__PURE__ */ import_react51.default.createElement(
|
|
4683
4697
|
"path",
|
|
4684
4698
|
{
|
|
4685
4699
|
d: "M8.66659 8C8.66659 7.63181 8.36811 7.33333 7.99992 7.33333C7.63173 7.33333 7.33325 7.63181 7.33325 8C7.33325 8.36819 7.63173 8.66667 7.99992 8.66667C8.36811 8.66667 8.66659 8.36819 8.66659 8Z",
|
|
@@ -4689,7 +4703,7 @@ var MoreVertical = ({ size = 18, ...props }) => {
|
|
|
4689
4703
|
strokeLinejoin: "round"
|
|
4690
4704
|
}
|
|
4691
4705
|
),
|
|
4692
|
-
/* @__PURE__ */
|
|
4706
|
+
/* @__PURE__ */ import_react51.default.createElement(
|
|
4693
4707
|
"path",
|
|
4694
4708
|
{
|
|
4695
4709
|
d: "M8.66659 3.33333C8.66659 2.96514 8.36811 2.66667 7.99992 2.66667C7.63173 2.66667 7.33325 2.96514 7.33325 3.33333C7.33325 3.70152 7.63173 4 7.99992 4C8.36811 4 8.66659 3.70152 8.66659 3.33333Z",
|
|
@@ -4699,7 +4713,7 @@ var MoreVertical = ({ size = 18, ...props }) => {
|
|
|
4699
4713
|
strokeLinejoin: "round"
|
|
4700
4714
|
}
|
|
4701
4715
|
),
|
|
4702
|
-
/* @__PURE__ */
|
|
4716
|
+
/* @__PURE__ */ import_react51.default.createElement(
|
|
4703
4717
|
"path",
|
|
4704
4718
|
{
|
|
4705
4719
|
d: "M8.66659 12.6667C8.66659 12.2985 8.36811 12 7.99992 12C7.63173 12 7.33325 12.2985 7.33325 12.6667C7.33325 13.0349 7.63173 13.3333 7.99992 13.3333C8.36811 13.3333 8.66659 13.0349 8.66659 12.6667Z",
|
|
@@ -4714,7 +4728,7 @@ var MoreVertical = ({ size = 18, ...props }) => {
|
|
|
4714
4728
|
var MoreVertical_default = MoreVertical;
|
|
4715
4729
|
|
|
4716
4730
|
// src/components/HoverMenu/HoverMenu.tsx
|
|
4717
|
-
var
|
|
4731
|
+
var import_react52 = __toESM(require("react"));
|
|
4718
4732
|
var import_classnames27 = __toESM(require("classnames"));
|
|
4719
4733
|
var HoverMenu = ({
|
|
4720
4734
|
children,
|
|
@@ -4723,13 +4737,13 @@ var HoverMenu = ({
|
|
|
4723
4737
|
accountId,
|
|
4724
4738
|
source
|
|
4725
4739
|
}) => {
|
|
4726
|
-
const [openMenu, setOpenMenu] = (0,
|
|
4727
|
-
const hoverMenuRef = (0,
|
|
4740
|
+
const [openMenu, setOpenMenu] = (0, import_react52.useState)(false);
|
|
4741
|
+
const hoverMenuRef = (0, import_react52.useRef)(null);
|
|
4728
4742
|
const hoverMenuClassName = (0, import_classnames27.default)(
|
|
4729
4743
|
"Layer__hover-menu",
|
|
4730
4744
|
openMenu && "Layer__hover-menu--open"
|
|
4731
4745
|
);
|
|
4732
|
-
(0,
|
|
4746
|
+
(0, import_react52.useEffect)(() => {
|
|
4733
4747
|
function handleClickOutside(event) {
|
|
4734
4748
|
if (hoverMenuRef.current && !hoverMenuRef.current.contains(event.target)) {
|
|
4735
4749
|
setOpenMenu(false);
|
|
@@ -4740,14 +4754,14 @@ var HoverMenu = ({
|
|
|
4740
4754
|
document.removeEventListener("click", handleClickOutside);
|
|
4741
4755
|
};
|
|
4742
4756
|
}, []);
|
|
4743
|
-
return /* @__PURE__ */
|
|
4757
|
+
return /* @__PURE__ */ import_react52.default.createElement(
|
|
4744
4758
|
"div",
|
|
4745
4759
|
{
|
|
4746
4760
|
className: hoverMenuClassName,
|
|
4747
4761
|
ref: hoverMenuRef,
|
|
4748
4762
|
onMouseLeave: () => setOpenMenu(false)
|
|
4749
4763
|
},
|
|
4750
|
-
/* @__PURE__ */
|
|
4764
|
+
/* @__PURE__ */ import_react52.default.createElement(
|
|
4751
4765
|
"div",
|
|
4752
4766
|
{
|
|
4753
4767
|
className: "Layer__hover-menu__children",
|
|
@@ -4757,13 +4771,13 @@ var HoverMenu = ({
|
|
|
4757
4771
|
},
|
|
4758
4772
|
children
|
|
4759
4773
|
),
|
|
4760
|
-
/* @__PURE__ */
|
|
4774
|
+
/* @__PURE__ */ import_react52.default.createElement("div", { className: "Layer__hover-menu__list-wrapper" }, /* @__PURE__ */ import_react52.default.createElement("ul", { className: "Layer__hover-menu__list" }, config && config.length > 0 && config.map((item) => /* @__PURE__ */ import_react52.default.createElement(
|
|
4761
4775
|
"li",
|
|
4762
4776
|
{
|
|
4763
4777
|
key: `hover-menu-${item.name}`,
|
|
4764
4778
|
className: "Layer__hover-menu__list-item"
|
|
4765
4779
|
},
|
|
4766
|
-
/* @__PURE__ */
|
|
4780
|
+
/* @__PURE__ */ import_react52.default.createElement(
|
|
4767
4781
|
"button",
|
|
4768
4782
|
{
|
|
4769
4783
|
className: "Layer__hover-menu__list-item-button",
|
|
@@ -4789,7 +4803,7 @@ var LinkedAccountOptions = ({
|
|
|
4789
4803
|
"Layer__linked-accounts__options",
|
|
4790
4804
|
showLedgerBalance == false && "--hide-ledger-balance"
|
|
4791
4805
|
);
|
|
4792
|
-
return /* @__PURE__ */
|
|
4806
|
+
return /* @__PURE__ */ import_react53.default.createElement("div", { className: linkedAccountOptionsClassName }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "Layer__linked-accounts__options-overlay" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "Layer__linked-accounts__options-overlay-button" }, /* @__PURE__ */ import_react53.default.createElement(
|
|
4793
4807
|
HoverMenu,
|
|
4794
4808
|
{
|
|
4795
4809
|
config,
|
|
@@ -4797,16 +4811,16 @@ var LinkedAccountOptions = ({
|
|
|
4797
4811
|
connectionId,
|
|
4798
4812
|
source
|
|
4799
4813
|
},
|
|
4800
|
-
/* @__PURE__ */
|
|
4814
|
+
/* @__PURE__ */ import_react53.default.createElement(MoreVertical_default, { size: 16 })
|
|
4801
4815
|
))), children);
|
|
4802
4816
|
};
|
|
4803
4817
|
|
|
4804
4818
|
// src/components/LinkedAccountThumb/LinkedAccountThumb.tsx
|
|
4805
|
-
var
|
|
4819
|
+
var import_react54 = __toESM(require("react"));
|
|
4806
4820
|
|
|
4807
4821
|
// src/icons/InstitutionIcon.tsx
|
|
4808
|
-
var
|
|
4809
|
-
var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */
|
|
4822
|
+
var React67 = __toESM(require("react"));
|
|
4823
|
+
var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React67.createElement(
|
|
4810
4824
|
"svg",
|
|
4811
4825
|
{
|
|
4812
4826
|
viewBox: "0 0 27 28",
|
|
@@ -4816,42 +4830,42 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4816
4830
|
width: size,
|
|
4817
4831
|
height: size
|
|
4818
4832
|
},
|
|
4819
|
-
/* @__PURE__ */
|
|
4833
|
+
/* @__PURE__ */ React67.createElement("g", { filter: "url(#filter0_i_2320_122784)" }, /* @__PURE__ */ React67.createElement(
|
|
4820
4834
|
"path",
|
|
4821
4835
|
{
|
|
4822
4836
|
d: "M0 8.50225C0 8.13268 0.20383 7.79324 0.530047 7.61956L13.03 0.964441C13.3238 0.80803 13.6762 0.808029 13.97 0.964441L26.47 7.61956C26.7962 7.79324 27 8.13268 27 8.50225V9.71423C27 10.2665 26.5523 10.7142 26 10.7142H0.999999C0.447715 10.7142 0 10.2665 0 9.71423V8.50225Z",
|
|
4823
4837
|
fill: "currentColor"
|
|
4824
4838
|
}
|
|
4825
4839
|
)),
|
|
4826
|
-
/* @__PURE__ */
|
|
4840
|
+
/* @__PURE__ */ React67.createElement("g", { filter: "url(#filter1_i_2320_122784)" }, /* @__PURE__ */ React67.createElement(
|
|
4827
4841
|
"path",
|
|
4828
4842
|
{
|
|
4829
4843
|
d: "M3 13C3 12.4477 3.44772 12 4 12H7C7.55228 12 8 12.4477 8 13V20C8 20.5523 7.55228 21 7 21H4C3.44772 21 3 20.5523 3 20L3 13Z",
|
|
4830
4844
|
fill: "currentColor"
|
|
4831
4845
|
}
|
|
4832
4846
|
)),
|
|
4833
|
-
/* @__PURE__ */
|
|
4847
|
+
/* @__PURE__ */ React67.createElement("g", { filter: "url(#filter2_i_2320_122784)" }, /* @__PURE__ */ React67.createElement(
|
|
4834
4848
|
"path",
|
|
4835
4849
|
{
|
|
4836
4850
|
d: "M11 13C11 12.4477 11.4477 12 12 12H15C15.5523 12 16 12.4477 16 13V20C16 20.5523 15.5523 21 15 21H12C11.4477 21 11 20.5523 11 20L11 13Z",
|
|
4837
4851
|
fill: "currentColor"
|
|
4838
4852
|
}
|
|
4839
4853
|
)),
|
|
4840
|
-
/* @__PURE__ */
|
|
4854
|
+
/* @__PURE__ */ React67.createElement("g", { filter: "url(#filter3_i_2320_122784)" }, /* @__PURE__ */ React67.createElement(
|
|
4841
4855
|
"path",
|
|
4842
4856
|
{
|
|
4843
4857
|
d: "M19 13C19 12.4477 19.4477 12 20 12H23C23.5523 12 24 12.4477 24 13V20C24 20.5523 23.5523 21 23 21H20C19.4477 21 19 20.5523 19 20L19 13Z",
|
|
4844
4858
|
fill: "currentColor"
|
|
4845
4859
|
}
|
|
4846
4860
|
)),
|
|
4847
|
-
/* @__PURE__ */
|
|
4861
|
+
/* @__PURE__ */ React67.createElement("g", { filter: "url(#filter4_i_2320_122784)" }, /* @__PURE__ */ React67.createElement(
|
|
4848
4862
|
"path",
|
|
4849
4863
|
{
|
|
4850
4864
|
d: "M1 23.2856C1 22.7334 1.44772 22.2856 2 22.2856H25C25.5523 22.2856 26 22.7334 26 23.2856V26.2856C26 26.8379 25.5523 27.2856 25 27.2856H2C1.44772 27.2856 1 26.8379 1 26.2856L1 23.2856Z",
|
|
4851
4865
|
fill: "currentColor"
|
|
4852
4866
|
}
|
|
4853
4867
|
)),
|
|
4854
|
-
/* @__PURE__ */
|
|
4868
|
+
/* @__PURE__ */ React67.createElement("defs", null, /* @__PURE__ */ React67.createElement(
|
|
4855
4869
|
"filter",
|
|
4856
4870
|
{
|
|
4857
4871
|
id: "filter0_i_2320_122784",
|
|
@@ -4862,8 +4876,8 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4862
4876
|
filterUnits: "userSpaceOnUse",
|
|
4863
4877
|
colorInterpolationFilters: "sRGB"
|
|
4864
4878
|
},
|
|
4865
|
-
/* @__PURE__ */
|
|
4866
|
-
/* @__PURE__ */
|
|
4879
|
+
/* @__PURE__ */ React67.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
|
|
4880
|
+
/* @__PURE__ */ React67.createElement(
|
|
4867
4881
|
"feBlend",
|
|
4868
4882
|
{
|
|
4869
4883
|
mode: "normal",
|
|
@@ -4872,7 +4886,7 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4872
4886
|
result: "shape"
|
|
4873
4887
|
}
|
|
4874
4888
|
),
|
|
4875
|
-
/* @__PURE__ */
|
|
4889
|
+
/* @__PURE__ */ React67.createElement(
|
|
4876
4890
|
"feColorMatrix",
|
|
4877
4891
|
{
|
|
4878
4892
|
in: "SourceAlpha",
|
|
@@ -4881,17 +4895,17 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4881
4895
|
result: "hardAlpha"
|
|
4882
4896
|
}
|
|
4883
4897
|
),
|
|
4884
|
-
/* @__PURE__ */
|
|
4885
|
-
/* @__PURE__ */
|
|
4886
|
-
/* @__PURE__ */
|
|
4887
|
-
/* @__PURE__ */
|
|
4898
|
+
/* @__PURE__ */ React67.createElement("feOffset", null),
|
|
4899
|
+
/* @__PURE__ */ React67.createElement("feGaussianBlur", { stdDeviation: "0.5" }),
|
|
4900
|
+
/* @__PURE__ */ React67.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
|
|
4901
|
+
/* @__PURE__ */ React67.createElement(
|
|
4888
4902
|
"feColorMatrix",
|
|
4889
4903
|
{
|
|
4890
4904
|
type: "matrix",
|
|
4891
4905
|
values: "0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.04 0"
|
|
4892
4906
|
}
|
|
4893
4907
|
),
|
|
4894
|
-
/* @__PURE__ */
|
|
4908
|
+
/* @__PURE__ */ React67.createElement(
|
|
4895
4909
|
"feBlend",
|
|
4896
4910
|
{
|
|
4897
4911
|
mode: "normal",
|
|
@@ -4899,7 +4913,7 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4899
4913
|
result: "effect1_innerShadow_2320_122784"
|
|
4900
4914
|
}
|
|
4901
4915
|
)
|
|
4902
|
-
), /* @__PURE__ */
|
|
4916
|
+
), /* @__PURE__ */ React67.createElement(
|
|
4903
4917
|
"filter",
|
|
4904
4918
|
{
|
|
4905
4919
|
id: "filter1_i_2320_122784",
|
|
@@ -4910,8 +4924,8 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4910
4924
|
filterUnits: "userSpaceOnUse",
|
|
4911
4925
|
colorInterpolationFilters: "sRGB"
|
|
4912
4926
|
},
|
|
4913
|
-
/* @__PURE__ */
|
|
4914
|
-
/* @__PURE__ */
|
|
4927
|
+
/* @__PURE__ */ React67.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
|
|
4928
|
+
/* @__PURE__ */ React67.createElement(
|
|
4915
4929
|
"feBlend",
|
|
4916
4930
|
{
|
|
4917
4931
|
mode: "normal",
|
|
@@ -4920,7 +4934,7 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4920
4934
|
result: "shape"
|
|
4921
4935
|
}
|
|
4922
4936
|
),
|
|
4923
|
-
/* @__PURE__ */
|
|
4937
|
+
/* @__PURE__ */ React67.createElement(
|
|
4924
4938
|
"feColorMatrix",
|
|
4925
4939
|
{
|
|
4926
4940
|
in: "SourceAlpha",
|
|
@@ -4929,17 +4943,17 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4929
4943
|
result: "hardAlpha"
|
|
4930
4944
|
}
|
|
4931
4945
|
),
|
|
4932
|
-
/* @__PURE__ */
|
|
4933
|
-
/* @__PURE__ */
|
|
4934
|
-
/* @__PURE__ */
|
|
4935
|
-
/* @__PURE__ */
|
|
4946
|
+
/* @__PURE__ */ React67.createElement("feOffset", null),
|
|
4947
|
+
/* @__PURE__ */ React67.createElement("feGaussianBlur", { stdDeviation: "0.5" }),
|
|
4948
|
+
/* @__PURE__ */ React67.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
|
|
4949
|
+
/* @__PURE__ */ React67.createElement(
|
|
4936
4950
|
"feColorMatrix",
|
|
4937
4951
|
{
|
|
4938
4952
|
type: "matrix",
|
|
4939
4953
|
values: "0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.04 0"
|
|
4940
4954
|
}
|
|
4941
4955
|
),
|
|
4942
|
-
/* @__PURE__ */
|
|
4956
|
+
/* @__PURE__ */ React67.createElement(
|
|
4943
4957
|
"feBlend",
|
|
4944
4958
|
{
|
|
4945
4959
|
mode: "normal",
|
|
@@ -4947,7 +4961,7 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4947
4961
|
result: "effect1_innerShadow_2320_122784"
|
|
4948
4962
|
}
|
|
4949
4963
|
)
|
|
4950
|
-
), /* @__PURE__ */
|
|
4964
|
+
), /* @__PURE__ */ React67.createElement(
|
|
4951
4965
|
"filter",
|
|
4952
4966
|
{
|
|
4953
4967
|
id: "filter2_i_2320_122784",
|
|
@@ -4958,8 +4972,8 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4958
4972
|
filterUnits: "userSpaceOnUse",
|
|
4959
4973
|
colorInterpolationFilters: "sRGB"
|
|
4960
4974
|
},
|
|
4961
|
-
/* @__PURE__ */
|
|
4962
|
-
/* @__PURE__ */
|
|
4975
|
+
/* @__PURE__ */ React67.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
|
|
4976
|
+
/* @__PURE__ */ React67.createElement(
|
|
4963
4977
|
"feBlend",
|
|
4964
4978
|
{
|
|
4965
4979
|
mode: "normal",
|
|
@@ -4968,7 +4982,7 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4968
4982
|
result: "shape"
|
|
4969
4983
|
}
|
|
4970
4984
|
),
|
|
4971
|
-
/* @__PURE__ */
|
|
4985
|
+
/* @__PURE__ */ React67.createElement(
|
|
4972
4986
|
"feColorMatrix",
|
|
4973
4987
|
{
|
|
4974
4988
|
in: "SourceAlpha",
|
|
@@ -4977,17 +4991,17 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4977
4991
|
result: "hardAlpha"
|
|
4978
4992
|
}
|
|
4979
4993
|
),
|
|
4980
|
-
/* @__PURE__ */
|
|
4981
|
-
/* @__PURE__ */
|
|
4982
|
-
/* @__PURE__ */
|
|
4983
|
-
/* @__PURE__ */
|
|
4994
|
+
/* @__PURE__ */ React67.createElement("feOffset", null),
|
|
4995
|
+
/* @__PURE__ */ React67.createElement("feGaussianBlur", { stdDeviation: "0.5" }),
|
|
4996
|
+
/* @__PURE__ */ React67.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
|
|
4997
|
+
/* @__PURE__ */ React67.createElement(
|
|
4984
4998
|
"feColorMatrix",
|
|
4985
4999
|
{
|
|
4986
5000
|
type: "matrix",
|
|
4987
5001
|
values: "0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.04 0"
|
|
4988
5002
|
}
|
|
4989
5003
|
),
|
|
4990
|
-
/* @__PURE__ */
|
|
5004
|
+
/* @__PURE__ */ React67.createElement(
|
|
4991
5005
|
"feBlend",
|
|
4992
5006
|
{
|
|
4993
5007
|
mode: "normal",
|
|
@@ -4995,7 +5009,7 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
4995
5009
|
result: "effect1_innerShadow_2320_122784"
|
|
4996
5010
|
}
|
|
4997
5011
|
)
|
|
4998
|
-
), /* @__PURE__ */
|
|
5012
|
+
), /* @__PURE__ */ React67.createElement(
|
|
4999
5013
|
"filter",
|
|
5000
5014
|
{
|
|
5001
5015
|
id: "filter3_i_2320_122784",
|
|
@@ -5006,8 +5020,8 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
5006
5020
|
filterUnits: "userSpaceOnUse",
|
|
5007
5021
|
colorInterpolationFilters: "sRGB"
|
|
5008
5022
|
},
|
|
5009
|
-
/* @__PURE__ */
|
|
5010
|
-
/* @__PURE__ */
|
|
5023
|
+
/* @__PURE__ */ React67.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
|
|
5024
|
+
/* @__PURE__ */ React67.createElement(
|
|
5011
5025
|
"feBlend",
|
|
5012
5026
|
{
|
|
5013
5027
|
mode: "normal",
|
|
@@ -5016,7 +5030,7 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
5016
5030
|
result: "shape"
|
|
5017
5031
|
}
|
|
5018
5032
|
),
|
|
5019
|
-
/* @__PURE__ */
|
|
5033
|
+
/* @__PURE__ */ React67.createElement(
|
|
5020
5034
|
"feColorMatrix",
|
|
5021
5035
|
{
|
|
5022
5036
|
in: "SourceAlpha",
|
|
@@ -5025,17 +5039,17 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
5025
5039
|
result: "hardAlpha"
|
|
5026
5040
|
}
|
|
5027
5041
|
),
|
|
5028
|
-
/* @__PURE__ */
|
|
5029
|
-
/* @__PURE__ */
|
|
5030
|
-
/* @__PURE__ */
|
|
5031
|
-
/* @__PURE__ */
|
|
5042
|
+
/* @__PURE__ */ React67.createElement("feOffset", null),
|
|
5043
|
+
/* @__PURE__ */ React67.createElement("feGaussianBlur", { stdDeviation: "0.5" }),
|
|
5044
|
+
/* @__PURE__ */ React67.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
|
|
5045
|
+
/* @__PURE__ */ React67.createElement(
|
|
5032
5046
|
"feColorMatrix",
|
|
5033
5047
|
{
|
|
5034
5048
|
type: "matrix",
|
|
5035
5049
|
values: "0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.04 0"
|
|
5036
5050
|
}
|
|
5037
5051
|
),
|
|
5038
|
-
/* @__PURE__ */
|
|
5052
|
+
/* @__PURE__ */ React67.createElement(
|
|
5039
5053
|
"feBlend",
|
|
5040
5054
|
{
|
|
5041
5055
|
mode: "normal",
|
|
@@ -5043,7 +5057,7 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
5043
5057
|
result: "effect1_innerShadow_2320_122784"
|
|
5044
5058
|
}
|
|
5045
5059
|
)
|
|
5046
|
-
), /* @__PURE__ */
|
|
5060
|
+
), /* @__PURE__ */ React67.createElement(
|
|
5047
5061
|
"filter",
|
|
5048
5062
|
{
|
|
5049
5063
|
id: "filter4_i_2320_122784",
|
|
@@ -5054,8 +5068,8 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
5054
5068
|
filterUnits: "userSpaceOnUse",
|
|
5055
5069
|
colorInterpolationFilters: "sRGB"
|
|
5056
5070
|
},
|
|
5057
|
-
/* @__PURE__ */
|
|
5058
|
-
/* @__PURE__ */
|
|
5071
|
+
/* @__PURE__ */ React67.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
|
|
5072
|
+
/* @__PURE__ */ React67.createElement(
|
|
5059
5073
|
"feBlend",
|
|
5060
5074
|
{
|
|
5061
5075
|
mode: "normal",
|
|
@@ -5064,7 +5078,7 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
5064
5078
|
result: "shape"
|
|
5065
5079
|
}
|
|
5066
5080
|
),
|
|
5067
|
-
/* @__PURE__ */
|
|
5081
|
+
/* @__PURE__ */ React67.createElement(
|
|
5068
5082
|
"feColorMatrix",
|
|
5069
5083
|
{
|
|
5070
5084
|
in: "SourceAlpha",
|
|
@@ -5073,17 +5087,17 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React66.creat
|
|
|
5073
5087
|
result: "hardAlpha"
|
|
5074
5088
|
}
|
|
5075
5089
|
),
|
|
5076
|
-
/* @__PURE__ */
|
|
5077
|
-
/* @__PURE__ */
|
|
5078
|
-
/* @__PURE__ */
|
|
5079
|
-
/* @__PURE__ */
|
|
5090
|
+
/* @__PURE__ */ React67.createElement("feOffset", null),
|
|
5091
|
+
/* @__PURE__ */ React67.createElement("feGaussianBlur", { stdDeviation: "0.5" }),
|
|
5092
|
+
/* @__PURE__ */ React67.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
|
|
5093
|
+
/* @__PURE__ */ React67.createElement(
|
|
5080
5094
|
"feColorMatrix",
|
|
5081
5095
|
{
|
|
5082
5096
|
type: "matrix",
|
|
5083
5097
|
values: "0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.04 0"
|
|
5084
5098
|
}
|
|
5085
5099
|
),
|
|
5086
|
-
/* @__PURE__ */
|
|
5100
|
+
/* @__PURE__ */ React67.createElement(
|
|
5087
5101
|
"feBlend",
|
|
5088
5102
|
{
|
|
5089
5103
|
mode: "normal",
|
|
@@ -5097,7 +5111,7 @@ var InstitutionIcon_default = InstitutionIcon;
|
|
|
5097
5111
|
|
|
5098
5112
|
// src/components/LinkedAccountThumb/LinkedAccountThumb.tsx
|
|
5099
5113
|
var import_classnames29 = __toESM(require("classnames"));
|
|
5100
|
-
var AccountNumber = ({ accountNumber }) => /* @__PURE__ */
|
|
5114
|
+
var AccountNumber = ({ accountNumber }) => /* @__PURE__ */ import_react54.default.createElement("div", { className: "account-number" }, /* @__PURE__ */ import_react54.default.createElement(Text, { size: "sm" }, "\u2022\u2022\u2022 ", accountNumber));
|
|
5101
5115
|
var LinkedAccountThumb = ({
|
|
5102
5116
|
account,
|
|
5103
5117
|
asWidget,
|
|
@@ -5107,7 +5121,7 @@ var LinkedAccountThumb = ({
|
|
|
5107
5121
|
"Layer__linked-account-thumb",
|
|
5108
5122
|
asWidget && "--as-widget"
|
|
5109
5123
|
);
|
|
5110
|
-
return /* @__PURE__ */
|
|
5124
|
+
return /* @__PURE__ */ import_react54.default.createElement("div", { className: linkedAccountThumbClassName }, /* @__PURE__ */ import_react54.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react54.default.createElement("div", { className: "topbar-details" }, /* @__PURE__ */ import_react54.default.createElement(Text, { as: "span", className: "account-name" }, account.external_account_name), !asWidget && account.mask && /* @__PURE__ */ import_react54.default.createElement(AccountNumber, { accountNumber: account.mask }), /* @__PURE__ */ import_react54.default.createElement(
|
|
5111
5125
|
Text,
|
|
5112
5126
|
{
|
|
5113
5127
|
as: "span",
|
|
@@ -5115,7 +5129,7 @@ var LinkedAccountThumb = ({
|
|
|
5115
5129
|
size: "sm"
|
|
5116
5130
|
},
|
|
5117
5131
|
account.institution?.name
|
|
5118
|
-
)), /* @__PURE__ */
|
|
5132
|
+
)), /* @__PURE__ */ import_react54.default.createElement("div", { className: "topbar-logo" }, account.institution?.logo != void 0 ? /* @__PURE__ */ import_react54.default.createElement(
|
|
5119
5133
|
"img",
|
|
5120
5134
|
{
|
|
5121
5135
|
width: 28,
|
|
@@ -5123,7 +5137,7 @@ var LinkedAccountThumb = ({
|
|
|
5123
5137
|
src: `data:image/png;base64,${account.institution.logo}`,
|
|
5124
5138
|
alt: account.institution?.name
|
|
5125
5139
|
}
|
|
5126
|
-
) : /* @__PURE__ */
|
|
5140
|
+
) : /* @__PURE__ */ import_react54.default.createElement(InstitutionIcon_default, null))), !asWidget && /* @__PURE__ */ import_react54.default.createElement("div", { className: "middlebar" }, /* @__PURE__ */ import_react54.default.createElement(
|
|
5127
5141
|
Text,
|
|
5128
5142
|
{
|
|
5129
5143
|
as: "span",
|
|
@@ -5131,7 +5145,7 @@ var LinkedAccountThumb = ({
|
|
|
5131
5145
|
size: "sm"
|
|
5132
5146
|
},
|
|
5133
5147
|
"Bank balance"
|
|
5134
|
-
), /* @__PURE__ */
|
|
5148
|
+
), /* @__PURE__ */ import_react54.default.createElement(Text, { as: "span", className: "account-balance" }, "$", centsToDollars(account.latest_balance_timestamp?.balance))), showLedgerBalance && /* @__PURE__ */ import_react54.default.createElement("div", { className: "bottombar" }, asWidget && account.mask ? /* @__PURE__ */ import_react54.default.createElement(AccountNumber, { accountNumber: account.mask }) : /* @__PURE__ */ import_react54.default.createElement(
|
|
5135
5149
|
Text,
|
|
5136
5150
|
{
|
|
5137
5151
|
as: "span",
|
|
@@ -5139,7 +5153,7 @@ var LinkedAccountThumb = ({
|
|
|
5139
5153
|
size: "sm"
|
|
5140
5154
|
},
|
|
5141
5155
|
"Ledger balance"
|
|
5142
|
-
), /* @__PURE__ */
|
|
5156
|
+
), /* @__PURE__ */ import_react54.default.createElement(Text, { as: "span", className: "account-balance" }, "$", centsToDollars(account.current_ledger_balance))));
|
|
5143
5157
|
};
|
|
5144
5158
|
|
|
5145
5159
|
// src/components/LinkedAccounts/LinkedAccountsContent.tsx
|
|
@@ -5148,7 +5162,7 @@ var LinkedAccountsContent = ({
|
|
|
5148
5162
|
asWidget,
|
|
5149
5163
|
showLedgerBalance
|
|
5150
5164
|
}) => {
|
|
5151
|
-
const { data, addConnection, unlinkAccount: unlinkAccount2 } = (0,
|
|
5165
|
+
const { data, addConnection, unlinkAccount: unlinkAccount2 } = (0, import_react55.useContext)(
|
|
5152
5166
|
LinkedAccountsContext
|
|
5153
5167
|
);
|
|
5154
5168
|
const linkedAccountOptionsConfig = [
|
|
@@ -5161,7 +5175,7 @@ var LinkedAccountsContent = ({
|
|
|
5161
5175
|
"Layer__linked-accounts__new-account",
|
|
5162
5176
|
asWidget && "--as-widget"
|
|
5163
5177
|
);
|
|
5164
|
-
return /* @__PURE__ */
|
|
5178
|
+
return /* @__PURE__ */ import_react55.default.createElement("div", { className: "Layer__linked-accounts__list" }, data?.map((account, index) => /* @__PURE__ */ import_react55.default.createElement(
|
|
5165
5179
|
LinkedAccountOptions,
|
|
5166
5180
|
{
|
|
5167
5181
|
key: `linked-acc-${index}`,
|
|
@@ -5171,7 +5185,7 @@ var LinkedAccountsContent = ({
|
|
|
5171
5185
|
source: account.external_account_source,
|
|
5172
5186
|
showLedgerBalance
|
|
5173
5187
|
},
|
|
5174
|
-
/* @__PURE__ */
|
|
5188
|
+
/* @__PURE__ */ import_react55.default.createElement(
|
|
5175
5189
|
LinkedAccountThumb,
|
|
5176
5190
|
{
|
|
5177
5191
|
account,
|
|
@@ -5179,7 +5193,7 @@ var LinkedAccountsContent = ({
|
|
|
5179
5193
|
showLedgerBalance
|
|
5180
5194
|
}
|
|
5181
5195
|
)
|
|
5182
|
-
)), /* @__PURE__ */
|
|
5196
|
+
)), /* @__PURE__ */ import_react55.default.createElement(
|
|
5183
5197
|
"div",
|
|
5184
5198
|
{
|
|
5185
5199
|
role: "button",
|
|
@@ -5188,31 +5202,31 @@ var LinkedAccountsContent = ({
|
|
|
5188
5202
|
onClick: () => addConnection("PLAID"),
|
|
5189
5203
|
className: linkedAccountsNewAccountClassName
|
|
5190
5204
|
},
|
|
5191
|
-
/* @__PURE__ */
|
|
5205
|
+
/* @__PURE__ */ import_react55.default.createElement("div", { className: "Layer__linked-accounts__new-account-label" }, /* @__PURE__ */ import_react55.default.createElement(PlusIcon_default, { size: 15 }), /* @__PURE__ */ import_react55.default.createElement(Text, { as: "span", size: "sm" }, "Add Account"))
|
|
5192
5206
|
));
|
|
5193
5207
|
};
|
|
5194
5208
|
|
|
5195
5209
|
// src/components/LinkedAccounts/LinkedAccounts.tsx
|
|
5196
5210
|
var COMPONENT_NAME2 = "linked-accounts";
|
|
5197
5211
|
var LinkedAccounts = (props) => {
|
|
5198
|
-
return /* @__PURE__ */
|
|
5212
|
+
return /* @__PURE__ */ import_react56.default.createElement(LinkedAccountsProvider, null, /* @__PURE__ */ import_react56.default.createElement(LinkedAccountsComponent, { ...props }));
|
|
5199
5213
|
};
|
|
5200
5214
|
var LinkedAccountsComponent = ({
|
|
5201
5215
|
asWidget,
|
|
5202
5216
|
elevated,
|
|
5203
5217
|
showLedgerBalance = true
|
|
5204
5218
|
}) => {
|
|
5205
|
-
const { isLoading, error, isValidating, refetchAccounts } = (0,
|
|
5219
|
+
const { isLoading, error, isValidating, refetchAccounts } = (0, import_react56.useContext)(
|
|
5206
5220
|
LinkedAccountsContext
|
|
5207
5221
|
);
|
|
5208
|
-
return /* @__PURE__ */
|
|
5222
|
+
return /* @__PURE__ */ import_react56.default.createElement(Container, { name: COMPONENT_NAME2, elevated }, /* @__PURE__ */ import_react56.default.createElement(Header, { className: "Layer__linked-accounts__header" }, /* @__PURE__ */ import_react56.default.createElement(
|
|
5209
5223
|
Heading,
|
|
5210
5224
|
{
|
|
5211
5225
|
className: "Layer__linked-accounts__title",
|
|
5212
5226
|
size: "secondary" /* secondary */
|
|
5213
5227
|
},
|
|
5214
5228
|
"Linked Accounts"
|
|
5215
|
-
)), isLoading && /* @__PURE__ */
|
|
5229
|
+
)), isLoading && /* @__PURE__ */ import_react56.default.createElement("div", { className: "Layer__linked-accounts__loader-container" }, /* @__PURE__ */ import_react56.default.createElement(Loader2, null)), error && !isLoading ? /* @__PURE__ */ import_react56.default.createElement(
|
|
5216
5230
|
DataState,
|
|
5217
5231
|
{
|
|
5218
5232
|
status: "failed" /* failed */,
|
|
@@ -5221,7 +5235,7 @@ var LinkedAccountsComponent = ({
|
|
|
5221
5235
|
onRefresh: () => refetchAccounts(),
|
|
5222
5236
|
isLoading: isValidating
|
|
5223
5237
|
}
|
|
5224
|
-
) : null, !error && !isLoading ? /* @__PURE__ */
|
|
5238
|
+
) : null, !error && !isLoading ? /* @__PURE__ */ import_react56.default.createElement(
|
|
5225
5239
|
LinkedAccountsContent,
|
|
5226
5240
|
{
|
|
5227
5241
|
asWidget,
|
|
@@ -5231,10 +5245,10 @@ var LinkedAccountsComponent = ({
|
|
|
5231
5245
|
};
|
|
5232
5246
|
|
|
5233
5247
|
// src/components/ProfitAndLoss/ProfitAndLoss.tsx
|
|
5234
|
-
var
|
|
5248
|
+
var import_react72 = __toESM(require("react"));
|
|
5235
5249
|
|
|
5236
5250
|
// src/hooks/useProfitAndLoss/useProfitAndLoss.tsx
|
|
5237
|
-
var
|
|
5251
|
+
var import_react57 = require("react");
|
|
5238
5252
|
|
|
5239
5253
|
// src/utils/profitAndLossUtils.ts
|
|
5240
5254
|
var doesLineItemQualifies = (item) => {
|
|
@@ -5291,7 +5305,7 @@ var applyShare = (items, total) => {
|
|
|
5291
5305
|
|
|
5292
5306
|
// src/hooks/useProfitAndLoss/useProfitAndLossQuery.tsx
|
|
5293
5307
|
var import_date_fns10 = require("date-fns");
|
|
5294
|
-
var
|
|
5308
|
+
var import_swr5 = __toESM(require("swr"));
|
|
5295
5309
|
var useProfitAndLossQuery = ({
|
|
5296
5310
|
startDate,
|
|
5297
5311
|
endDate,
|
|
@@ -5308,7 +5322,7 @@ var useProfitAndLossQuery = ({
|
|
|
5308
5322
|
isValidating,
|
|
5309
5323
|
error: rawError,
|
|
5310
5324
|
mutate
|
|
5311
|
-
} = (0,
|
|
5325
|
+
} = (0, import_swr5.default)(
|
|
5312
5326
|
businessId && startDate && endDate && auth?.access_token && `profit-and-loss-${businessId}-${startDate.valueOf()}-${endDate.valueOf()}-${tagFilter?.key}-${tagFilter?.values?.join(
|
|
5313
5327
|
","
|
|
5314
5328
|
)}-${reportingBasis}`,
|
|
@@ -5348,17 +5362,17 @@ var useProfitAndLoss = ({
|
|
|
5348
5362
|
startDate: (0, import_date_fns11.startOfMonth)(/* @__PURE__ */ new Date()),
|
|
5349
5363
|
endDate: (0, import_date_fns11.endOfMonth)(/* @__PURE__ */ new Date())
|
|
5350
5364
|
}) => {
|
|
5351
|
-
const [startDate, setStartDate] = (0,
|
|
5365
|
+
const [startDate, setStartDate] = (0, import_react57.useState)(
|
|
5352
5366
|
initialStartDate || (0, import_date_fns11.startOfMonth)(Date.now())
|
|
5353
5367
|
);
|
|
5354
|
-
const [endDate, setEndDate] = (0,
|
|
5368
|
+
const [endDate, setEndDate] = (0, import_react57.useState)(
|
|
5355
5369
|
initialEndDate || (0, import_date_fns11.endOfMonth)(Date.now())
|
|
5356
5370
|
);
|
|
5357
|
-
const [filters, setFilters] = (0,
|
|
5371
|
+
const [filters, setFilters] = (0, import_react57.useState)({
|
|
5358
5372
|
expenses: void 0,
|
|
5359
5373
|
revenue: void 0
|
|
5360
5374
|
});
|
|
5361
|
-
const [sidebarScope, setSidebarScope] = (0,
|
|
5375
|
+
const [sidebarScope, setSidebarScope] = (0, import_react57.useState)(void 0);
|
|
5362
5376
|
const { data, isLoading, isValidating, error, refetch } = useProfitAndLossQuery({
|
|
5363
5377
|
startDate,
|
|
5364
5378
|
endDate,
|
|
@@ -5391,7 +5405,7 @@ var useProfitAndLoss = ({
|
|
|
5391
5405
|
}
|
|
5392
5406
|
});
|
|
5393
5407
|
};
|
|
5394
|
-
const { filteredDataRevenue, filteredTotalRevenue } = (0,
|
|
5408
|
+
const { filteredDataRevenue, filteredTotalRevenue } = (0, import_react57.useMemo)(() => {
|
|
5395
5409
|
if (!data) {
|
|
5396
5410
|
return { filteredDataRevenue: [], filteredTotalRevenue: void 0 };
|
|
5397
5411
|
}
|
|
@@ -5428,7 +5442,7 @@ var useProfitAndLoss = ({
|
|
|
5428
5442
|
const withShare = applyShare(sorted, total);
|
|
5429
5443
|
return { filteredDataRevenue: withShare, filteredTotalRevenue: total };
|
|
5430
5444
|
}, [data, startDate, filters, sidebarScope]);
|
|
5431
|
-
const { filteredDataExpenses, filteredTotalExpenses } = (0,
|
|
5445
|
+
const { filteredDataExpenses, filteredTotalExpenses } = (0, import_react57.useMemo)(() => {
|
|
5432
5446
|
if (!data) {
|
|
5433
5447
|
return { filteredDataExpenses: [], filteredTotalExpenses: void 0 };
|
|
5434
5448
|
}
|
|
@@ -5486,10 +5500,10 @@ var useProfitAndLoss = ({
|
|
|
5486
5500
|
};
|
|
5487
5501
|
|
|
5488
5502
|
// src/components/ProfitAndLossChart/ProfitAndLossChart.tsx
|
|
5489
|
-
var
|
|
5503
|
+
var import_react60 = __toESM(require("react"));
|
|
5490
5504
|
|
|
5491
5505
|
// src/hooks/useProfitAndLoss/useProfitAndLossLTM.tsx
|
|
5492
|
-
var
|
|
5506
|
+
var import_react58 = require("react");
|
|
5493
5507
|
var import_date_fns12 = require("date-fns");
|
|
5494
5508
|
var buildDates = ({ currentDate }) => {
|
|
5495
5509
|
const list = [];
|
|
@@ -5511,8 +5525,8 @@ var useProfitAndLossLTM = ({ currentDate, tagFilter, reportingBasis } = {
|
|
|
5511
5525
|
currentDate: /* @__PURE__ */ new Date()
|
|
5512
5526
|
}) => {
|
|
5513
5527
|
const { businessId } = useLayerContext();
|
|
5514
|
-
const [loaded, setLoaded] = (0,
|
|
5515
|
-
const dates = (0,
|
|
5528
|
+
const [loaded, setLoaded] = (0, import_react58.useState)("initial");
|
|
5529
|
+
const dates = (0, import_react58.useMemo)(() => {
|
|
5516
5530
|
return buildDates({ currentDate });
|
|
5517
5531
|
}, [currentDate, businessId, tagFilter, reportingBasis]);
|
|
5518
5532
|
const {
|
|
@@ -5659,7 +5673,7 @@ var useProfitAndLossLTM = ({ currentDate, tagFilter, reportingBasis } = {
|
|
|
5659
5673
|
tagFilter,
|
|
5660
5674
|
reportingBasis
|
|
5661
5675
|
});
|
|
5662
|
-
const { data, isLoading, error } = (0,
|
|
5676
|
+
const { data, isLoading, error } = (0, import_react58.useMemo)(() => {
|
|
5663
5677
|
return {
|
|
5664
5678
|
data: [
|
|
5665
5679
|
{
|
|
@@ -5814,7 +5828,7 @@ var useProfitAndLossLTM = ({ currentDate, tagFilter, reportingBasis } = {
|
|
|
5814
5828
|
error10,
|
|
5815
5829
|
error11
|
|
5816
5830
|
]);
|
|
5817
|
-
(0,
|
|
5831
|
+
(0, import_react58.useEffect)(() => {
|
|
5818
5832
|
if (isLoading && loaded === "initial") {
|
|
5819
5833
|
setLoaded("loading");
|
|
5820
5834
|
return;
|
|
@@ -5880,7 +5894,7 @@ var convertCurrencyToNumber = (amount) => {
|
|
|
5880
5894
|
};
|
|
5881
5895
|
|
|
5882
5896
|
// src/components/ProfitAndLossChart/Indicator.tsx
|
|
5883
|
-
var
|
|
5897
|
+
var import_react59 = __toESM(require("react"));
|
|
5884
5898
|
var emptyViewBox = { x: 0, y: 0, width: 0, height: 0 };
|
|
5885
5899
|
var Indicator = ({
|
|
5886
5900
|
className,
|
|
@@ -5893,7 +5907,7 @@ var Indicator = ({
|
|
|
5893
5907
|
if (!className?.match(/selected/)) {
|
|
5894
5908
|
return null;
|
|
5895
5909
|
}
|
|
5896
|
-
const [opacityIndicator, setOpacityIndicator] = (0,
|
|
5910
|
+
const [opacityIndicator, setOpacityIndicator] = (0, import_react59.useState)(0);
|
|
5897
5911
|
const { x: animateTo = 0, width = 0 } = "x" in viewBox ? viewBox : emptyViewBox;
|
|
5898
5912
|
const margin = width > 12 ? 4 : 1;
|
|
5899
5913
|
const boxWidth = width * 2 + margin;
|
|
@@ -5902,7 +5916,7 @@ var Indicator = ({
|
|
|
5902
5916
|
const borderRadius = 6;
|
|
5903
5917
|
const rectWidth = `${boxWidth * multiplier}px`;
|
|
5904
5918
|
const rectHeight = "calc(100% - 38px)";
|
|
5905
|
-
(0,
|
|
5919
|
+
(0, import_react59.useEffect)(() => {
|
|
5906
5920
|
if (Math.abs(animateTo - animateFrom) < 30) {
|
|
5907
5921
|
setOpacityIndicator(0);
|
|
5908
5922
|
}
|
|
@@ -5921,7 +5935,7 @@ var Indicator = ({
|
|
|
5921
5935
|
}
|
|
5922
5936
|
};
|
|
5923
5937
|
const actualX = animateFrom === -1 ? animateTo : animateFrom;
|
|
5924
|
-
return /* @__PURE__ */
|
|
5938
|
+
return /* @__PURE__ */ import_react59.default.createElement(
|
|
5925
5939
|
"rect",
|
|
5926
5940
|
{
|
|
5927
5941
|
ref: rectRef,
|
|
@@ -5948,19 +5962,19 @@ var barGap = 4;
|
|
|
5948
5962
|
var barSize = 20;
|
|
5949
5963
|
var ProfitAndLossChart = () => {
|
|
5950
5964
|
const { getColor } = useLayerContext();
|
|
5951
|
-
const { changeDateRange, dateRange } = (0,
|
|
5952
|
-
const [customCursorSize, setCustomCursorSize] = (0,
|
|
5965
|
+
const { changeDateRange, dateRange } = (0, import_react60.useContext)(ProfitAndLoss.Context);
|
|
5966
|
+
const [customCursorSize, setCustomCursorSize] = (0, import_react60.useState)({
|
|
5953
5967
|
width: 0,
|
|
5954
5968
|
height: 0,
|
|
5955
5969
|
x: 0
|
|
5956
5970
|
});
|
|
5957
|
-
const [barAnimActive, setBarAnimActive] = (0,
|
|
5971
|
+
const [barAnimActive, setBarAnimActive] = (0, import_react60.useState)(true);
|
|
5958
5972
|
const startSelectionMonth = dateRange.startDate.getMonth();
|
|
5959
5973
|
const endSelectionMonth = dateRange.endDate.getMonth();
|
|
5960
5974
|
const { data, loaded } = useProfitAndLossLTM({
|
|
5961
5975
|
currentDate: (0, import_date_fns13.startOfMonth)(Date.now())
|
|
5962
5976
|
});
|
|
5963
|
-
(0,
|
|
5977
|
+
(0, import_react60.useEffect)(() => {
|
|
5964
5978
|
if (loaded === "complete") {
|
|
5965
5979
|
setTimeout(() => {
|
|
5966
5980
|
setBarAnimActive(false);
|
|
@@ -5990,7 +6004,7 @@ var ProfitAndLossChart = () => {
|
|
|
5990
6004
|
if (active && payload && payload.length) {
|
|
5991
6005
|
const netProfit = payload[0].payload.netProfit ?? 0;
|
|
5992
6006
|
const netProfitClass = netProfit > 0 ? "positive" : netProfit < 0 ? "negative" : "";
|
|
5993
|
-
return /* @__PURE__ */
|
|
6007
|
+
return /* @__PURE__ */ import_react60.default.createElement("div", { className: "Layer__chart__tooltip" }, loaded !== "complete" ? /* @__PURE__ */ import_react60.default.createElement(Text, null, "Loading...") : /* @__PURE__ */ import_react60.default.createElement("ul", { className: "Layer__chart__tooltip-list" }, /* @__PURE__ */ import_react60.default.createElement("li", null, /* @__PURE__ */ import_react60.default.createElement("label", { className: "Layer__chart__tooltip-label" }, capitalizeFirstLetter(payload[0].name ?? "")), /* @__PURE__ */ import_react60.default.createElement("span", { className: "Layer__chart__tooltip-value" }, "$", centsToDollars(Math.abs(payload[0].value ?? 0)))), /* @__PURE__ */ import_react60.default.createElement("li", null, /* @__PURE__ */ import_react60.default.createElement("label", { className: "Layer__chart__tooltip-label" }, capitalizeFirstLetter(payload[1].name ?? "")), /* @__PURE__ */ import_react60.default.createElement("span", { className: "Layer__chart__tooltip-value" }, "$", centsToDollars(Math.abs(payload[1].value ?? 0)))), /* @__PURE__ */ import_react60.default.createElement("li", null, /* @__PURE__ */ import_react60.default.createElement("label", { className: "Layer__chart__tooltip-label" }, "Net Profit"), /* @__PURE__ */ import_react60.default.createElement(
|
|
5994
6008
|
"span",
|
|
5995
6009
|
{
|
|
5996
6010
|
className: `Layer__chart__tooltip-value ${netProfitClass}`
|
|
@@ -6005,7 +6019,7 @@ var ProfitAndLossChart = () => {
|
|
|
6005
6019
|
const { x, y, width: rectWidth } = props;
|
|
6006
6020
|
const { width, height } = customCursorSize;
|
|
6007
6021
|
const offsetX = (rectWidth - width) / 2;
|
|
6008
|
-
return /* @__PURE__ */
|
|
6022
|
+
return /* @__PURE__ */ import_react60.default.createElement(
|
|
6009
6023
|
import_recharts.Rectangle,
|
|
6010
6024
|
{
|
|
6011
6025
|
fill: "#F7F8FA",
|
|
@@ -6019,7 +6033,7 @@ var ProfitAndLossChart = () => {
|
|
|
6019
6033
|
}
|
|
6020
6034
|
);
|
|
6021
6035
|
};
|
|
6022
|
-
const theData = (0,
|
|
6036
|
+
const theData = (0, import_react60.useMemo)(() => {
|
|
6023
6037
|
if (loaded !== "complete") {
|
|
6024
6038
|
return data?.map((x) => ({
|
|
6025
6039
|
name: (0, import_date_fns13.format)(x.startDate, "LLL"),
|
|
@@ -6031,8 +6045,8 @@ var ProfitAndLossChart = () => {
|
|
|
6031
6045
|
}
|
|
6032
6046
|
return data?.map((x) => summarizePnL(x.data));
|
|
6033
6047
|
}, [startSelectionMonth, endSelectionMonth, loaded]);
|
|
6034
|
-
const [animateFrom, setAnimateFrom] = (0,
|
|
6035
|
-
return /* @__PURE__ */
|
|
6048
|
+
const [animateFrom, setAnimateFrom] = (0, import_react60.useState)(-1);
|
|
6049
|
+
return /* @__PURE__ */ import_react60.default.createElement(
|
|
6036
6050
|
import_recharts.ResponsiveContainer,
|
|
6037
6051
|
{
|
|
6038
6052
|
className: (0, import_classnames31.default)(
|
|
@@ -6042,7 +6056,7 @@ var ProfitAndLossChart = () => {
|
|
|
6042
6056
|
width: "100%",
|
|
6043
6057
|
height: "100%"
|
|
6044
6058
|
},
|
|
6045
|
-
/* @__PURE__ */
|
|
6059
|
+
/* @__PURE__ */ import_react60.default.createElement(
|
|
6046
6060
|
import_recharts.BarChart,
|
|
6047
6061
|
{
|
|
6048
6062
|
margin: { left: 12, right: 12, bottom: 12 },
|
|
@@ -6051,17 +6065,17 @@ var ProfitAndLossChart = () => {
|
|
|
6051
6065
|
barGap,
|
|
6052
6066
|
className: "Layer__profit-and-loss-chart"
|
|
6053
6067
|
},
|
|
6054
|
-
/* @__PURE__ */
|
|
6068
|
+
/* @__PURE__ */ import_react60.default.createElement(
|
|
6055
6069
|
import_recharts.Tooltip,
|
|
6056
6070
|
{
|
|
6057
6071
|
wrapperClassName: "Layer__chart__tooltip-wrapper",
|
|
6058
|
-
content: /* @__PURE__ */
|
|
6059
|
-
cursor: /* @__PURE__ */
|
|
6072
|
+
content: /* @__PURE__ */ import_react60.default.createElement(CustomTooltip, null),
|
|
6073
|
+
cursor: /* @__PURE__ */ import_react60.default.createElement(CustomizedCursor, null),
|
|
6060
6074
|
animationDuration: 100,
|
|
6061
6075
|
animationEasing: "ease-out"
|
|
6062
6076
|
}
|
|
6063
6077
|
),
|
|
6064
|
-
/* @__PURE__ */
|
|
6078
|
+
/* @__PURE__ */ import_react60.default.createElement(
|
|
6065
6079
|
import_recharts.CartesianGrid,
|
|
6066
6080
|
{
|
|
6067
6081
|
vertical: false,
|
|
@@ -6069,7 +6083,7 @@ var ProfitAndLossChart = () => {
|
|
|
6069
6083
|
strokeDasharray: "5 5"
|
|
6070
6084
|
}
|
|
6071
6085
|
),
|
|
6072
|
-
/* @__PURE__ */
|
|
6086
|
+
/* @__PURE__ */ import_react60.default.createElement(
|
|
6073
6087
|
import_recharts.Legend,
|
|
6074
6088
|
{
|
|
6075
6089
|
verticalAlign: "top",
|
|
@@ -6088,8 +6102,8 @@ var ProfitAndLossChart = () => {
|
|
|
6088
6102
|
]
|
|
6089
6103
|
}
|
|
6090
6104
|
),
|
|
6091
|
-
/* @__PURE__ */
|
|
6092
|
-
/* @__PURE__ */
|
|
6105
|
+
/* @__PURE__ */ import_react60.default.createElement(import_recharts.XAxis, { dataKey: "name", tickLine: false }),
|
|
6106
|
+
/* @__PURE__ */ import_react60.default.createElement(
|
|
6093
6107
|
import_recharts.Bar,
|
|
6094
6108
|
{
|
|
6095
6109
|
dataKey: "revenue",
|
|
@@ -6098,10 +6112,10 @@ var ProfitAndLossChart = () => {
|
|
|
6098
6112
|
radius: [2, 2, 0, 0],
|
|
6099
6113
|
className: "Layer__profit-and-loss-chart__bar--income"
|
|
6100
6114
|
},
|
|
6101
|
-
/* @__PURE__ */
|
|
6115
|
+
/* @__PURE__ */ import_react60.default.createElement(
|
|
6102
6116
|
import_recharts.LabelList,
|
|
6103
6117
|
{
|
|
6104
|
-
content: /* @__PURE__ */
|
|
6118
|
+
content: /* @__PURE__ */ import_react60.default.createElement(
|
|
6105
6119
|
Indicator,
|
|
6106
6120
|
{
|
|
6107
6121
|
setCustomCursorSize: (width, height, x) => setCustomCursorSize({ width, height, x }),
|
|
@@ -6113,7 +6127,7 @@ var ProfitAndLossChart = () => {
|
|
|
6113
6127
|
}
|
|
6114
6128
|
),
|
|
6115
6129
|
theData?.map((entry) => {
|
|
6116
|
-
return /* @__PURE__ */
|
|
6130
|
+
return /* @__PURE__ */ import_react60.default.createElement(
|
|
6117
6131
|
import_recharts.Cell,
|
|
6118
6132
|
{
|
|
6119
6133
|
key: entry.name,
|
|
@@ -6122,7 +6136,7 @@ var ProfitAndLossChart = () => {
|
|
|
6122
6136
|
);
|
|
6123
6137
|
})
|
|
6124
6138
|
),
|
|
6125
|
-
/* @__PURE__ */
|
|
6139
|
+
/* @__PURE__ */ import_react60.default.createElement(
|
|
6126
6140
|
import_recharts.Bar,
|
|
6127
6141
|
{
|
|
6128
6142
|
dataKey: "expenses",
|
|
@@ -6131,7 +6145,7 @@ var ProfitAndLossChart = () => {
|
|
|
6131
6145
|
radius: [2, 2, 0, 0],
|
|
6132
6146
|
className: "Layer__profit-and-loss-chart__bar--expenses"
|
|
6133
6147
|
},
|
|
6134
|
-
theData.map((entry) => /* @__PURE__ */
|
|
6148
|
+
theData.map((entry) => /* @__PURE__ */ import_react60.default.createElement(
|
|
6135
6149
|
import_recharts.Cell,
|
|
6136
6150
|
{
|
|
6137
6151
|
key: entry.name,
|
|
@@ -6144,24 +6158,24 @@ var ProfitAndLossChart = () => {
|
|
|
6144
6158
|
};
|
|
6145
6159
|
|
|
6146
6160
|
// src/components/ProfitAndLossDatePicker/ProfitAndLossDatePicker.tsx
|
|
6147
|
-
var
|
|
6161
|
+
var import_react62 = __toESM(require("react"));
|
|
6148
6162
|
|
|
6149
6163
|
// src/components/DateMonthPicker/DateMonthPicker.tsx
|
|
6150
|
-
var
|
|
6164
|
+
var import_react61 = __toESM(require("react"));
|
|
6151
6165
|
var import_date_fns14 = require("date-fns");
|
|
6152
6166
|
var DateMonthPicker = ({
|
|
6153
6167
|
dateRange,
|
|
6154
6168
|
changeDateRange
|
|
6155
6169
|
}) => {
|
|
6156
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
6157
|
-
const [localDate, setLocalDate] = (0,
|
|
6158
|
-
const [nextOpacity, setNextOpacity] = (0,
|
|
6159
|
-
const [currentOpacity, setCurrentOpacity] = (0,
|
|
6160
|
-
const [transformStyle, setTransformStyle] = (0,
|
|
6170
|
+
const [isAnimating, setIsAnimating] = (0, import_react61.useState)(false);
|
|
6171
|
+
const [localDate, setLocalDate] = (0, import_react61.useState)(dateRange.startDate);
|
|
6172
|
+
const [nextOpacity, setNextOpacity] = (0, import_react61.useState)(0);
|
|
6173
|
+
const [currentOpacity, setCurrentOpacity] = (0, import_react61.useState)(1);
|
|
6174
|
+
const [transformStyle, setTransformStyle] = (0, import_react61.useState)({
|
|
6161
6175
|
transform: "translateX(33%)",
|
|
6162
6176
|
transition: "ease"
|
|
6163
6177
|
});
|
|
6164
|
-
(0,
|
|
6178
|
+
(0, import_react61.useEffect)(() => {
|
|
6165
6179
|
if (dateRange.startDate !== localDate && !isAnimating) {
|
|
6166
6180
|
setLocalDate(dateRange.startDate);
|
|
6167
6181
|
setTransformStyle({ transform: "translateX(33%)", transition: "none" });
|
|
@@ -6199,14 +6213,14 @@ var DateMonthPicker = ({
|
|
|
6199
6213
|
const currentLabel = (0, import_date_fns14.format)(localDate, "LLLL, y");
|
|
6200
6214
|
const prevLabel = (0, import_date_fns14.format)((0, import_date_fns14.add)(localDate, { months: -1 }), "LLLL, y");
|
|
6201
6215
|
const nextLabel = (0, import_date_fns14.format)((0, import_date_fns14.add)(localDate, { months: 1 }), "LLLL, y");
|
|
6202
|
-
return /* @__PURE__ */
|
|
6216
|
+
return /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__date-month-picker" }, /* @__PURE__ */ import_react61.default.createElement(
|
|
6203
6217
|
"div",
|
|
6204
6218
|
{
|
|
6205
6219
|
className: "Layer__date-month-picker__labels-container",
|
|
6206
6220
|
style: transformStyle
|
|
6207
6221
|
},
|
|
6208
|
-
/* @__PURE__ */
|
|
6209
|
-
/* @__PURE__ */
|
|
6222
|
+
/* @__PURE__ */ import_react61.default.createElement("span", { className: "Layer__date-month-picker__label" }, prevLabel),
|
|
6223
|
+
/* @__PURE__ */ import_react61.default.createElement(
|
|
6210
6224
|
"span",
|
|
6211
6225
|
{
|
|
6212
6226
|
className: "Layer__date-month-picker__label",
|
|
@@ -6214,7 +6228,7 @@ var DateMonthPicker = ({
|
|
|
6214
6228
|
},
|
|
6215
6229
|
currentLabel
|
|
6216
6230
|
),
|
|
6217
|
-
/* @__PURE__ */
|
|
6231
|
+
/* @__PURE__ */ import_react61.default.createElement(
|
|
6218
6232
|
"span",
|
|
6219
6233
|
{
|
|
6220
6234
|
className: "Layer__date-month-picker__label",
|
|
@@ -6222,7 +6236,7 @@ var DateMonthPicker = ({
|
|
|
6222
6236
|
},
|
|
6223
6237
|
nextLabel
|
|
6224
6238
|
)
|
|
6225
|
-
), /* @__PURE__ */
|
|
6239
|
+
), /* @__PURE__ */ import_react61.default.createElement(
|
|
6226
6240
|
"button",
|
|
6227
6241
|
{
|
|
6228
6242
|
"aria-label": "View Previous Month",
|
|
@@ -6230,14 +6244,14 @@ var DateMonthPicker = ({
|
|
|
6230
6244
|
onClick: () => change(-1),
|
|
6231
6245
|
disabled: isAnimating
|
|
6232
6246
|
},
|
|
6233
|
-
/* @__PURE__ */
|
|
6247
|
+
/* @__PURE__ */ import_react61.default.createElement(
|
|
6234
6248
|
ChevronLeft_default,
|
|
6235
6249
|
{
|
|
6236
6250
|
className: "Layer__date-month-picker__button-icon",
|
|
6237
6251
|
size: 16
|
|
6238
6252
|
}
|
|
6239
6253
|
)
|
|
6240
|
-
), /* @__PURE__ */
|
|
6254
|
+
), /* @__PURE__ */ import_react61.default.createElement(
|
|
6241
6255
|
"button",
|
|
6242
6256
|
{
|
|
6243
6257
|
"aria-label": "View Next Month",
|
|
@@ -6245,28 +6259,28 @@ var DateMonthPicker = ({
|
|
|
6245
6259
|
onClick: () => change(1),
|
|
6246
6260
|
disabled: isAnimating
|
|
6247
6261
|
},
|
|
6248
|
-
/* @__PURE__ */
|
|
6262
|
+
/* @__PURE__ */ import_react61.default.createElement(
|
|
6249
6263
|
ChevronRight_default,
|
|
6250
6264
|
{
|
|
6251
6265
|
className: "Layer__date-month-picker__button-icon",
|
|
6252
6266
|
size: 16
|
|
6253
6267
|
}
|
|
6254
6268
|
)
|
|
6255
|
-
), /* @__PURE__ */
|
|
6269
|
+
), /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__date-month-picker__effect-blur" }));
|
|
6256
6270
|
};
|
|
6257
6271
|
|
|
6258
6272
|
// src/components/ProfitAndLossDatePicker/ProfitAndLossDatePicker.tsx
|
|
6259
6273
|
var ProfitAndLossDatePicker = () => {
|
|
6260
|
-
const { changeDateRange, dateRange } = (0,
|
|
6261
|
-
return /* @__PURE__ */
|
|
6274
|
+
const { changeDateRange, dateRange } = (0, import_react62.useContext)(ProfitAndLoss.Context);
|
|
6275
|
+
return /* @__PURE__ */ import_react62.default.createElement(DateMonthPicker, { dateRange, changeDateRange });
|
|
6262
6276
|
};
|
|
6263
6277
|
|
|
6264
6278
|
// src/components/ProfitAndLossDetailedCharts/ProfitAndLossDetailedCharts.tsx
|
|
6265
|
-
var
|
|
6279
|
+
var import_react66 = __toESM(require("react"));
|
|
6266
6280
|
|
|
6267
6281
|
// src/icons/X.tsx
|
|
6268
|
-
var
|
|
6269
|
-
var X = ({ size = 18, ...props }) => /* @__PURE__ */
|
|
6282
|
+
var React75 = __toESM(require("react"));
|
|
6283
|
+
var X = ({ size = 18, ...props }) => /* @__PURE__ */ React75.createElement(
|
|
6270
6284
|
"svg",
|
|
6271
6285
|
{
|
|
6272
6286
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -6276,7 +6290,7 @@ var X = ({ size = 18, ...props }) => /* @__PURE__ */ React74.createElement(
|
|
|
6276
6290
|
width: size,
|
|
6277
6291
|
height: size
|
|
6278
6292
|
},
|
|
6279
|
-
/* @__PURE__ */
|
|
6293
|
+
/* @__PURE__ */ React75.createElement(
|
|
6280
6294
|
"path",
|
|
6281
6295
|
{
|
|
6282
6296
|
d: "M13.5 4.5L4.5 13.5",
|
|
@@ -6285,7 +6299,7 @@ var X = ({ size = 18, ...props }) => /* @__PURE__ */ React74.createElement(
|
|
|
6285
6299
|
strokeLinejoin: "round"
|
|
6286
6300
|
}
|
|
6287
6301
|
),
|
|
6288
|
-
/* @__PURE__ */
|
|
6302
|
+
/* @__PURE__ */ React75.createElement(
|
|
6289
6303
|
"path",
|
|
6290
6304
|
{
|
|
6291
6305
|
d: "M4.5 4.5L13.5 13.5",
|
|
@@ -6298,7 +6312,7 @@ var X = ({ size = 18, ...props }) => /* @__PURE__ */ React74.createElement(
|
|
|
6298
6312
|
var X_default = X;
|
|
6299
6313
|
|
|
6300
6314
|
// src/components/ProfitAndLossDetailedCharts/DetailedChart.tsx
|
|
6301
|
-
var
|
|
6315
|
+
var import_react63 = __toESM(require("react"));
|
|
6302
6316
|
|
|
6303
6317
|
// src/config/charts.ts
|
|
6304
6318
|
var INACTIVE_OPACITY_LEVELS = [
|
|
@@ -6397,7 +6411,7 @@ var DetailedChart = ({
|
|
|
6397
6411
|
date,
|
|
6398
6412
|
isLoading
|
|
6399
6413
|
}) => {
|
|
6400
|
-
const chartData = (0,
|
|
6414
|
+
const chartData = (0, import_react63.useMemo)(() => {
|
|
6401
6415
|
if (!filteredData) {
|
|
6402
6416
|
return [];
|
|
6403
6417
|
}
|
|
@@ -6415,7 +6429,7 @@ var DetailedChart = ({
|
|
|
6415
6429
|
});
|
|
6416
6430
|
}, [filteredData, isLoading]);
|
|
6417
6431
|
const noValue = chartData.length === 0 || !chartData.find((x) => x.value !== 0);
|
|
6418
|
-
return /* @__PURE__ */
|
|
6432
|
+
return /* @__PURE__ */ import_react63.default.createElement("div", { className: "chart-field" }, /* @__PURE__ */ import_react63.default.createElement("div", { className: "header--tablet" }, /* @__PURE__ */ import_react63.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, humanizeTitle(sidebarScope)), /* @__PURE__ */ import_react63.default.createElement(ProfitAndLossDatePicker, null)), /* @__PURE__ */ import_react63.default.createElement("div", { className: "chart-container" }, /* @__PURE__ */ import_react63.default.createElement(import_recharts2.ResponsiveContainer, null, /* @__PURE__ */ import_react63.default.createElement(import_recharts2.PieChart, null, !isLoading && !noValue ? /* @__PURE__ */ import_react63.default.createElement(
|
|
6419
6433
|
import_recharts2.Pie,
|
|
6420
6434
|
{
|
|
6421
6435
|
data: chartData,
|
|
@@ -6423,8 +6437,8 @@ var DetailedChart = ({
|
|
|
6423
6437
|
nameKey: "name",
|
|
6424
6438
|
cx: "50%",
|
|
6425
6439
|
cy: "50%",
|
|
6426
|
-
innerRadius:
|
|
6427
|
-
outerRadius:
|
|
6440
|
+
innerRadius: "91%",
|
|
6441
|
+
outerRadius: "100%",
|
|
6428
6442
|
paddingAngle: 0.5,
|
|
6429
6443
|
fill: "#8884d8",
|
|
6430
6444
|
animationDuration: 200,
|
|
@@ -6440,7 +6454,7 @@ var DetailedChart = ({
|
|
|
6440
6454
|
fill = void 0;
|
|
6441
6455
|
opacity = INACTIVE_OPACITY_LEVELS[index % INACTIVE_OPACITY_LEVELS.length];
|
|
6442
6456
|
}
|
|
6443
|
-
return /* @__PURE__ */
|
|
6457
|
+
return /* @__PURE__ */ import_react63.default.createElement(
|
|
6444
6458
|
import_recharts2.Cell,
|
|
6445
6459
|
{
|
|
6446
6460
|
key: `cell-${index}`,
|
|
@@ -6452,7 +6466,7 @@ var DetailedChart = ({
|
|
|
6452
6466
|
}
|
|
6453
6467
|
);
|
|
6454
6468
|
}),
|
|
6455
|
-
/* @__PURE__ */
|
|
6469
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
6456
6470
|
import_recharts2.Label,
|
|
6457
6471
|
{
|
|
6458
6472
|
position: "center",
|
|
@@ -6473,7 +6487,7 @@ var DetailedChart = ({
|
|
|
6473
6487
|
if (hoveredItem) {
|
|
6474
6488
|
text = hoveredItem;
|
|
6475
6489
|
}
|
|
6476
|
-
return /* @__PURE__ */
|
|
6490
|
+
return /* @__PURE__ */ import_react63.default.createElement(
|
|
6477
6491
|
import_recharts2.Text,
|
|
6478
6492
|
{
|
|
6479
6493
|
...positioningProps,
|
|
@@ -6484,7 +6498,7 @@ var DetailedChart = ({
|
|
|
6484
6498
|
}
|
|
6485
6499
|
}
|
|
6486
6500
|
),
|
|
6487
|
-
/* @__PURE__ */
|
|
6501
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
6488
6502
|
import_recharts2.Label,
|
|
6489
6503
|
{
|
|
6490
6504
|
position: "center",
|
|
@@ -6507,7 +6521,7 @@ var DetailedChart = ({
|
|
|
6507
6521
|
(x) => x.display_name === hoveredItem
|
|
6508
6522
|
)?.value;
|
|
6509
6523
|
}
|
|
6510
|
-
return /* @__PURE__ */
|
|
6524
|
+
return /* @__PURE__ */ import_react63.default.createElement(
|
|
6511
6525
|
import_recharts2.Text,
|
|
6512
6526
|
{
|
|
6513
6527
|
...positioningProps,
|
|
@@ -6518,7 +6532,7 @@ var DetailedChart = ({
|
|
|
6518
6532
|
}
|
|
6519
6533
|
}
|
|
6520
6534
|
),
|
|
6521
|
-
/* @__PURE__ */
|
|
6535
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
6522
6536
|
import_recharts2.Label,
|
|
6523
6537
|
{
|
|
6524
6538
|
position: "center",
|
|
@@ -6537,7 +6551,7 @@ var DetailedChart = ({
|
|
|
6537
6551
|
verticalAnchor: "middle"
|
|
6538
6552
|
};
|
|
6539
6553
|
if (hoveredItem) {
|
|
6540
|
-
return /* @__PURE__ */
|
|
6554
|
+
return /* @__PURE__ */ import_react63.default.createElement(
|
|
6541
6555
|
import_recharts2.Text,
|
|
6542
6556
|
{
|
|
6543
6557
|
...positioningProps,
|
|
@@ -6554,7 +6568,7 @@ var DetailedChart = ({
|
|
|
6554
6568
|
}
|
|
6555
6569
|
}
|
|
6556
6570
|
)
|
|
6557
|
-
) : null, !isLoading && noValue ? /* @__PURE__ */
|
|
6571
|
+
) : null, !isLoading && noValue ? /* @__PURE__ */ import_react63.default.createElement(
|
|
6558
6572
|
import_recharts2.Pie,
|
|
6559
6573
|
{
|
|
6560
6574
|
data: [{ name: "Total", value: 1 }],
|
|
@@ -6562,14 +6576,14 @@ var DetailedChart = ({
|
|
|
6562
6576
|
nameKey: "name",
|
|
6563
6577
|
cx: "50%",
|
|
6564
6578
|
cy: "50%",
|
|
6565
|
-
innerRadius:
|
|
6566
|
-
outerRadius:
|
|
6579
|
+
innerRadius: "91%",
|
|
6580
|
+
outerRadius: "100%",
|
|
6567
6581
|
paddingAngle: 0,
|
|
6568
6582
|
fill: "#F8F8FA",
|
|
6569
6583
|
animationDuration: 200,
|
|
6570
6584
|
animationEasing: "ease-in-out"
|
|
6571
6585
|
},
|
|
6572
|
-
/* @__PURE__ */
|
|
6586
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
6573
6587
|
import_recharts2.Label,
|
|
6574
6588
|
{
|
|
6575
6589
|
position: "center",
|
|
@@ -6590,7 +6604,7 @@ var DetailedChart = ({
|
|
|
6590
6604
|
if (hoveredItem) {
|
|
6591
6605
|
text = hoveredItem;
|
|
6592
6606
|
}
|
|
6593
|
-
return /* @__PURE__ */
|
|
6607
|
+
return /* @__PURE__ */ import_react63.default.createElement(
|
|
6594
6608
|
import_recharts2.Text,
|
|
6595
6609
|
{
|
|
6596
6610
|
...positioningProps,
|
|
@@ -6601,7 +6615,7 @@ var DetailedChart = ({
|
|
|
6601
6615
|
}
|
|
6602
6616
|
}
|
|
6603
6617
|
),
|
|
6604
|
-
/* @__PURE__ */
|
|
6618
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
6605
6619
|
import_recharts2.Label,
|
|
6606
6620
|
{
|
|
6607
6621
|
position: "center",
|
|
@@ -6624,7 +6638,7 @@ var DetailedChart = ({
|
|
|
6624
6638
|
(x) => x.display_name === hoveredItem
|
|
6625
6639
|
)?.value;
|
|
6626
6640
|
}
|
|
6627
|
-
return /* @__PURE__ */
|
|
6641
|
+
return /* @__PURE__ */ import_react63.default.createElement(
|
|
6628
6642
|
import_recharts2.Text,
|
|
6629
6643
|
{
|
|
6630
6644
|
...positioningProps,
|
|
@@ -6635,7 +6649,7 @@ var DetailedChart = ({
|
|
|
6635
6649
|
}
|
|
6636
6650
|
}
|
|
6637
6651
|
)
|
|
6638
|
-
) : null, isLoading ? /* @__PURE__ */
|
|
6652
|
+
) : null, isLoading ? /* @__PURE__ */ import_react63.default.createElement(
|
|
6639
6653
|
import_recharts2.Pie,
|
|
6640
6654
|
{
|
|
6641
6655
|
data: [{ name: "loading...", value: 1 }],
|
|
@@ -6643,8 +6657,8 @@ var DetailedChart = ({
|
|
|
6643
6657
|
nameKey: "name",
|
|
6644
6658
|
cx: "50%",
|
|
6645
6659
|
cy: "50%",
|
|
6646
|
-
innerRadius:
|
|
6647
|
-
outerRadius:
|
|
6660
|
+
innerRadius: "91%",
|
|
6661
|
+
outerRadius: "100%",
|
|
6648
6662
|
paddingAngle: 0,
|
|
6649
6663
|
fill: "#F8F8FA",
|
|
6650
6664
|
animationDuration: 200,
|
|
@@ -6654,11 +6668,11 @@ var DetailedChart = ({
|
|
|
6654
6668
|
};
|
|
6655
6669
|
|
|
6656
6670
|
// src/components/ProfitAndLossDetailedCharts/DetailedTable.tsx
|
|
6657
|
-
var
|
|
6671
|
+
var import_react64 = __toESM(require("react"));
|
|
6658
6672
|
|
|
6659
6673
|
// src/icons/SortArrows.tsx
|
|
6660
|
-
var
|
|
6661
|
-
var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */
|
|
6674
|
+
var React77 = __toESM(require("react"));
|
|
6675
|
+
var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React77.createElement(
|
|
6662
6676
|
"svg",
|
|
6663
6677
|
{
|
|
6664
6678
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -6668,7 +6682,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React76.createElem
|
|
|
6668
6682
|
width: size,
|
|
6669
6683
|
height: size
|
|
6670
6684
|
},
|
|
6671
|
-
/* @__PURE__ */
|
|
6685
|
+
/* @__PURE__ */ React77.createElement("g", { clipPath: "url(#clip0_1758_75388)" }, /* @__PURE__ */ React77.createElement(
|
|
6672
6686
|
"path",
|
|
6673
6687
|
{
|
|
6674
6688
|
d: "M1.33325 8.5L3.99992 11.1667L6.66659 8.5",
|
|
@@ -6677,7 +6691,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React76.createElem
|
|
|
6677
6691
|
strokeLinejoin: "round",
|
|
6678
6692
|
className: "desc-arrow"
|
|
6679
6693
|
}
|
|
6680
|
-
), /* @__PURE__ */
|
|
6694
|
+
), /* @__PURE__ */ React77.createElement(
|
|
6681
6695
|
"path",
|
|
6682
6696
|
{
|
|
6683
6697
|
d: "M4 2.5L4 11.1667",
|
|
@@ -6686,7 +6700,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React76.createElem
|
|
|
6686
6700
|
strokeLinejoin: "round",
|
|
6687
6701
|
className: "desc-arrow"
|
|
6688
6702
|
}
|
|
6689
|
-
), /* @__PURE__ */
|
|
6703
|
+
), /* @__PURE__ */ React77.createElement(
|
|
6690
6704
|
"path",
|
|
6691
6705
|
{
|
|
6692
6706
|
d: "M5.99988 5.16602L8.66654 2.49935L11.3332 5.16602",
|
|
@@ -6695,7 +6709,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React76.createElem
|
|
|
6695
6709
|
strokeLinejoin: "round",
|
|
6696
6710
|
className: "asc-arrow"
|
|
6697
6711
|
}
|
|
6698
|
-
), /* @__PURE__ */
|
|
6712
|
+
), /* @__PURE__ */ React77.createElement(
|
|
6699
6713
|
"path",
|
|
6700
6714
|
{
|
|
6701
6715
|
d: "M8.66663 11.166L8.66663 2.49935",
|
|
@@ -6705,7 +6719,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React76.createElem
|
|
|
6705
6719
|
className: "asc-arrow"
|
|
6706
6720
|
}
|
|
6707
6721
|
)),
|
|
6708
|
-
/* @__PURE__ */
|
|
6722
|
+
/* @__PURE__ */ React77.createElement("defs", null, /* @__PURE__ */ React77.createElement("clipPath", { id: "clip0_1758_75388" }, /* @__PURE__ */ React77.createElement(
|
|
6709
6723
|
"rect",
|
|
6710
6724
|
{
|
|
6711
6725
|
width: "12",
|
|
@@ -6733,33 +6747,33 @@ var DetailedTable = ({
|
|
|
6733
6747
|
sidebarScope && filters[sidebarScope]?.sortBy === column ? `sort--${(sidebarScope && filters[sidebarScope]?.sortDirection) ?? "desc"}` : ""
|
|
6734
6748
|
);
|
|
6735
6749
|
};
|
|
6736
|
-
return /* @__PURE__ */
|
|
6750
|
+
return /* @__PURE__ */ import_react64.default.createElement("div", { className: "details-container" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "table" }, /* @__PURE__ */ import_react64.default.createElement("table", null, /* @__PURE__ */ import_react64.default.createElement("thead", null, /* @__PURE__ */ import_react64.default.createElement("tr", null, /* @__PURE__ */ import_react64.default.createElement(
|
|
6737
6751
|
"th",
|
|
6738
6752
|
{
|
|
6739
6753
|
className: buildColClass("category"),
|
|
6740
6754
|
onClick: () => sortBy(sidebarScope ?? "expenses", "category")
|
|
6741
6755
|
},
|
|
6742
6756
|
"Category ",
|
|
6743
|
-
/* @__PURE__ */
|
|
6744
|
-
), /* @__PURE__ */
|
|
6757
|
+
/* @__PURE__ */ import_react64.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
|
|
6758
|
+
), /* @__PURE__ */ import_react64.default.createElement(
|
|
6745
6759
|
"th",
|
|
6746
6760
|
{
|
|
6747
6761
|
className: buildColClass("type"),
|
|
6748
6762
|
onClick: () => sortBy(sidebarScope ?? "expenses", "type")
|
|
6749
6763
|
},
|
|
6750
6764
|
"Type ",
|
|
6751
|
-
/* @__PURE__ */
|
|
6752
|
-
), /* @__PURE__ */
|
|
6765
|
+
/* @__PURE__ */ import_react64.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
|
|
6766
|
+
), /* @__PURE__ */ import_react64.default.createElement("th", null), /* @__PURE__ */ import_react64.default.createElement(
|
|
6753
6767
|
"th",
|
|
6754
6768
|
{
|
|
6755
6769
|
className: buildColClass("value"),
|
|
6756
6770
|
onClick: () => sortBy(sidebarScope ?? "expenses", "value")
|
|
6757
6771
|
},
|
|
6758
6772
|
"Value ",
|
|
6759
|
-
/* @__PURE__ */
|
|
6760
|
-
))), /* @__PURE__ */
|
|
6773
|
+
/* @__PURE__ */ import_react64.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
|
|
6774
|
+
))), /* @__PURE__ */ import_react64.default.createElement("tbody", null, filteredData.filter((x) => !x.hidden).map((item, idx) => {
|
|
6761
6775
|
const colorConfig = DEFAULT_CHART_COLORS[idx % DEFAULT_CHART_COLORS.length];
|
|
6762
|
-
return /* @__PURE__ */
|
|
6776
|
+
return /* @__PURE__ */ import_react64.default.createElement(
|
|
6763
6777
|
"tr",
|
|
6764
6778
|
{
|
|
6765
6779
|
key: `pl-side-table-item-${idx}`,
|
|
@@ -6770,10 +6784,10 @@ var DetailedTable = ({
|
|
|
6770
6784
|
onMouseEnter: () => setHoveredItem(item.display_name),
|
|
6771
6785
|
onMouseLeave: () => setHoveredItem(void 0)
|
|
6772
6786
|
},
|
|
6773
|
-
/* @__PURE__ */
|
|
6774
|
-
/* @__PURE__ */
|
|
6775
|
-
/* @__PURE__ */
|
|
6776
|
-
/* @__PURE__ */
|
|
6787
|
+
/* @__PURE__ */ import_react64.default.createElement("td", { className: "category-col" }, item.display_name),
|
|
6788
|
+
/* @__PURE__ */ import_react64.default.createElement("td", { className: "type-col" }, item.type),
|
|
6789
|
+
/* @__PURE__ */ import_react64.default.createElement("td", { className: "value-col" }, "$", centsToDollars(item.value)),
|
|
6790
|
+
/* @__PURE__ */ import_react64.default.createElement("td", { className: "share-col" }, /* @__PURE__ */ import_react64.default.createElement("span", { className: "share-cell-content" }, formatPercent(item.share), "%", /* @__PURE__ */ import_react64.default.createElement(
|
|
6777
6791
|
"div",
|
|
6778
6792
|
{
|
|
6779
6793
|
className: "share-icon",
|
|
@@ -6788,7 +6802,7 @@ var DetailedTable = ({
|
|
|
6788
6802
|
};
|
|
6789
6803
|
|
|
6790
6804
|
// src/components/ProfitAndLossDetailedCharts/Filters.tsx
|
|
6791
|
-
var
|
|
6805
|
+
var import_react65 = __toESM(require("react"));
|
|
6792
6806
|
var import_react_select3 = __toESM(require("react-select"));
|
|
6793
6807
|
var Filters = ({
|
|
6794
6808
|
filteredData,
|
|
@@ -6796,7 +6810,7 @@ var Filters = ({
|
|
|
6796
6810
|
filters,
|
|
6797
6811
|
setFilterTypes
|
|
6798
6812
|
}) => {
|
|
6799
|
-
return /* @__PURE__ */
|
|
6813
|
+
return /* @__PURE__ */ import_react65.default.createElement("div", { className: "filters" }, /* @__PURE__ */ import_react65.default.createElement(Text, { size: "sm" /* sm */, className: "Layer__label" }, "Filters"), /* @__PURE__ */ import_react65.default.createElement(
|
|
6800
6814
|
import_react_select3.default,
|
|
6801
6815
|
{
|
|
6802
6816
|
className: "Layer__select type-select",
|
|
@@ -6818,8 +6832,8 @@ var Filters = ({
|
|
|
6818
6832
|
);
|
|
6819
6833
|
},
|
|
6820
6834
|
components: {
|
|
6821
|
-
DropdownIndicator: (props) => /* @__PURE__ */
|
|
6822
|
-
Placeholder: (props) => /* @__PURE__ */
|
|
6835
|
+
DropdownIndicator: (props) => /* @__PURE__ */ import_react65.default.createElement(import_react_select3.components.DropdownIndicator, { ...props }, /* @__PURE__ */ import_react65.default.createElement(ChevronDown_default, null)),
|
|
6836
|
+
Placeholder: (props) => /* @__PURE__ */ import_react65.default.createElement(import_react_select3.components.Placeholder, { ...props }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "Layer__select__multi-all-placeholder-badge" }, "All"))
|
|
6823
6837
|
}
|
|
6824
6838
|
}
|
|
6825
6839
|
));
|
|
@@ -6844,20 +6858,20 @@ var ProfitAndLossDetailedCharts = ({
|
|
|
6844
6858
|
sidebarScope,
|
|
6845
6859
|
setSidebarScope,
|
|
6846
6860
|
setFilterTypes
|
|
6847
|
-
} = (0,
|
|
6861
|
+
} = (0, import_react66.useContext)(ProfitAndLoss.Context);
|
|
6848
6862
|
const theScope = scope ? scope : sidebarScope;
|
|
6849
6863
|
const data = theScope === "revenue" ? filteredDataRevenue : filteredDataExpenses;
|
|
6850
6864
|
const total = theScope === "revenue" ? filteredTotalRevenue : filteredTotalExpenses;
|
|
6851
|
-
const [hoveredItem, setHoveredItem] = (0,
|
|
6852
|
-
return /* @__PURE__ */
|
|
6865
|
+
const [hoveredItem, setHoveredItem] = (0, import_react66.useState)();
|
|
6866
|
+
return /* @__PURE__ */ import_react66.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts" }, /* @__PURE__ */ import_react66.default.createElement("header", { className: "Layer__profit-and-loss-detailed-charts__header" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__head" }, /* @__PURE__ */ import_react66.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, humanizeTitle(theScope)), /* @__PURE__ */ import_react66.default.createElement(Text, { size: "sm" /* sm */, className: "date" }, (0, import_date_fns15.format)(dateRange.startDate, "LLLL, y")), showDatePicker && /* @__PURE__ */ import_react66.default.createElement(ProfitAndLossDatePicker, null)), !hideClose && /* @__PURE__ */ import_react66.default.createElement(
|
|
6853
6867
|
Button,
|
|
6854
6868
|
{
|
|
6855
|
-
rightIcon: /* @__PURE__ */
|
|
6869
|
+
rightIcon: /* @__PURE__ */ import_react66.default.createElement(X_default, null),
|
|
6856
6870
|
iconOnly: true,
|
|
6857
6871
|
onClick: () => setSidebarScope(void 0),
|
|
6858
6872
|
variant: "secondary" /* secondary */
|
|
6859
6873
|
}
|
|
6860
|
-
)), /* @__PURE__ */
|
|
6874
|
+
)), /* @__PURE__ */ import_react66.default.createElement("header", { className: "Layer__profit-and-loss-detailed-charts__header--tablet" }, /* @__PURE__ */ import_react66.default.createElement(BackButton, { onClick: () => setSidebarScope(void 0) })), /* @__PURE__ */ import_react66.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__content" }, /* @__PURE__ */ import_react66.default.createElement(
|
|
6861
6875
|
DetailedChart,
|
|
6862
6876
|
{
|
|
6863
6877
|
filteredData: data,
|
|
@@ -6868,7 +6882,7 @@ var ProfitAndLossDetailedCharts = ({
|
|
|
6868
6882
|
date: dateRange.startDate,
|
|
6869
6883
|
isLoading
|
|
6870
6884
|
}
|
|
6871
|
-
), /* @__PURE__ */
|
|
6885
|
+
), /* @__PURE__ */ import_react66.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__table-wrapper" }, /* @__PURE__ */ import_react66.default.createElement(
|
|
6872
6886
|
Filters,
|
|
6873
6887
|
{
|
|
6874
6888
|
filteredData: data,
|
|
@@ -6876,7 +6890,7 @@ var ProfitAndLossDetailedCharts = ({
|
|
|
6876
6890
|
filters,
|
|
6877
6891
|
setFilterTypes
|
|
6878
6892
|
}
|
|
6879
|
-
), /* @__PURE__ */
|
|
6893
|
+
), /* @__PURE__ */ import_react66.default.createElement(
|
|
6880
6894
|
DetailedTable,
|
|
6881
6895
|
{
|
|
6882
6896
|
filteredData: data,
|
|
@@ -6890,10 +6904,10 @@ var ProfitAndLossDetailedCharts = ({
|
|
|
6890
6904
|
};
|
|
6891
6905
|
|
|
6892
6906
|
// src/components/ProfitAndLossSummaries/ProfitAndLossSummaries.tsx
|
|
6893
|
-
var
|
|
6907
|
+
var import_react69 = __toESM(require("react"));
|
|
6894
6908
|
|
|
6895
6909
|
// src/components/SkeletonLoader/SkeletonLoader.tsx
|
|
6896
|
-
var
|
|
6910
|
+
var import_react67 = __toESM(require("react"));
|
|
6897
6911
|
var import_classnames33 = __toESM(require("classnames"));
|
|
6898
6912
|
var SkeletonLoader = ({
|
|
6899
6913
|
height,
|
|
@@ -6904,14 +6918,14 @@ var SkeletonLoader = ({
|
|
|
6904
6918
|
"Layer__skeleton-loader Layer__anim--skeleton-loading",
|
|
6905
6919
|
className
|
|
6906
6920
|
);
|
|
6907
|
-
return /* @__PURE__ */
|
|
6921
|
+
return /* @__PURE__ */ import_react67.default.createElement("div", { className: baseClassName, style: { width, height } });
|
|
6908
6922
|
};
|
|
6909
6923
|
|
|
6910
6924
|
// src/components/ProfitAndLossSummaries/MiniChart.tsx
|
|
6911
|
-
var
|
|
6925
|
+
var import_react68 = __toESM(require("react"));
|
|
6912
6926
|
var import_recharts3 = require("recharts");
|
|
6913
6927
|
var MiniChart = ({ data }) => {
|
|
6914
|
-
return /* @__PURE__ */
|
|
6928
|
+
return /* @__PURE__ */ import_react68.default.createElement(import_recharts3.PieChart, { width: 48, height: 48, className: "mini-chart" }, /* @__PURE__ */ import_react68.default.createElement(
|
|
6915
6929
|
import_recharts3.Pie,
|
|
6916
6930
|
{
|
|
6917
6931
|
data,
|
|
@@ -6930,7 +6944,7 @@ var MiniChart = ({ data }) => {
|
|
|
6930
6944
|
},
|
|
6931
6945
|
data.map((entry, index) => {
|
|
6932
6946
|
const colorConfig = DEFAULT_CHART_COLORS[index % DEFAULT_CHART_COLORS.length];
|
|
6933
|
-
return /* @__PURE__ */
|
|
6947
|
+
return /* @__PURE__ */ import_react68.default.createElement(
|
|
6934
6948
|
import_recharts3.Cell,
|
|
6935
6949
|
{
|
|
6936
6950
|
key: `cell-${index}`,
|
|
@@ -6981,24 +6995,24 @@ var ProfitAndLossSummaries = ({
|
|
|
6981
6995
|
isLoading,
|
|
6982
6996
|
setSidebarScope,
|
|
6983
6997
|
sidebarScope
|
|
6984
|
-
} = (0,
|
|
6998
|
+
} = (0, import_react69.useContext)(ProfitAndLoss.Context);
|
|
6985
6999
|
const dataItem = Array.isArray(storedData) ? storedData[storedData.length - 1] : storedData;
|
|
6986
|
-
const expensesChartData = (0,
|
|
7000
|
+
const expensesChartData = (0, import_react69.useMemo)(() => {
|
|
6987
7001
|
return buildMiniChartData("expenses", dataItem);
|
|
6988
7002
|
}, [storedData]);
|
|
6989
|
-
const revenueChartData = (0,
|
|
7003
|
+
const revenueChartData = (0, import_react69.useMemo)(() => {
|
|
6990
7004
|
return buildMiniChartData("revenue", dataItem);
|
|
6991
7005
|
}, [storedData]);
|
|
6992
7006
|
const data = dataItem ? dataItem : { income: { value: NaN }, net_profit: NaN };
|
|
6993
7007
|
const incomeDirectionClass = (data.income.value ?? NaN) < 0 ? "Layer__profit-and-loss-summaries__amount--negative" : "Layer__profit-and-loss-summaries__amount--positive";
|
|
6994
7008
|
const expensesDirectionClass = (data?.income?.value ?? NaN) - data.net_profit < 0 ? "Layer__profit-and-loss-summaries__amount--negative" : "Layer__profit-and-loss-summaries__amount--positive";
|
|
6995
7009
|
const netProfitDirectionClass = data.net_profit < 0 ? "Layer__profit-and-loss-summaries__amount--negative" : "Layer__profit-and-loss-summaries__amount--positive";
|
|
6996
|
-
return /* @__PURE__ */
|
|
7010
|
+
return /* @__PURE__ */ import_react69.default.createElement(
|
|
6997
7011
|
"div",
|
|
6998
7012
|
{
|
|
6999
7013
|
className: `Layer__profit-and-loss-summaries ${vertical ? "flex-col" : ""}`
|
|
7000
7014
|
},
|
|
7001
|
-
/* @__PURE__ */
|
|
7015
|
+
/* @__PURE__ */ import_react69.default.createElement(
|
|
7002
7016
|
"div",
|
|
7003
7017
|
{
|
|
7004
7018
|
className: (0, import_classnames34.default)(
|
|
@@ -7011,8 +7025,8 @@ var ProfitAndLossSummaries = ({
|
|
|
7011
7025
|
actionable && setSidebarScope("revenue");
|
|
7012
7026
|
}
|
|
7013
7027
|
},
|
|
7014
|
-
/* @__PURE__ */
|
|
7015
|
-
/* @__PURE__ */
|
|
7028
|
+
/* @__PURE__ */ import_react69.default.createElement(MiniChart, { data: revenueChartData }),
|
|
7029
|
+
/* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, revenueLabel), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react69.default.createElement(SkeletonLoader, null)) : /* @__PURE__ */ import_react69.default.createElement(
|
|
7016
7030
|
"span",
|
|
7017
7031
|
{
|
|
7018
7032
|
className: `Layer__profit-and-loss-summaries__amount ${incomeDirectionClass}`
|
|
@@ -7020,7 +7034,7 @@ var ProfitAndLossSummaries = ({
|
|
|
7020
7034
|
centsToDollars(Math.abs(data?.income?.value ?? NaN))
|
|
7021
7035
|
))
|
|
7022
7036
|
),
|
|
7023
|
-
/* @__PURE__ */
|
|
7037
|
+
/* @__PURE__ */ import_react69.default.createElement(
|
|
7024
7038
|
"div",
|
|
7025
7039
|
{
|
|
7026
7040
|
className: (0, import_classnames34.default)(
|
|
@@ -7033,8 +7047,8 @@ var ProfitAndLossSummaries = ({
|
|
|
7033
7047
|
actionable && setSidebarScope("expenses");
|
|
7034
7048
|
}
|
|
7035
7049
|
},
|
|
7036
|
-
/* @__PURE__ */
|
|
7037
|
-
/* @__PURE__ */
|
|
7050
|
+
/* @__PURE__ */ import_react69.default.createElement(MiniChart, { data: expensesChartData }),
|
|
7051
|
+
/* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, "Expenses"), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react69.default.createElement(SkeletonLoader, { className: "Layer__profit-and-loss-summaries__loader" })) : /* @__PURE__ */ import_react69.default.createElement(
|
|
7038
7052
|
"span",
|
|
7039
7053
|
{
|
|
7040
7054
|
className: `Layer__profit-and-loss-summaries__amount ${expensesDirectionClass}`
|
|
@@ -7044,7 +7058,7 @@ var ProfitAndLossSummaries = ({
|
|
|
7044
7058
|
)
|
|
7045
7059
|
))
|
|
7046
7060
|
),
|
|
7047
|
-
/* @__PURE__ */
|
|
7061
|
+
/* @__PURE__ */ import_react69.default.createElement(
|
|
7048
7062
|
"div",
|
|
7049
7063
|
{
|
|
7050
7064
|
className: (0, import_classnames34.default)(
|
|
@@ -7052,7 +7066,7 @@ var ProfitAndLossSummaries = ({
|
|
|
7052
7066
|
actionable && "Layer__actionable"
|
|
7053
7067
|
)
|
|
7054
7068
|
},
|
|
7055
|
-
/* @__PURE__ */
|
|
7069
|
+
/* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, "Net Profit"), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react69.default.createElement(SkeletonLoader, { className: "Layer__profit-and-loss-summaries__loader" })) : /* @__PURE__ */ import_react69.default.createElement(
|
|
7056
7070
|
"span",
|
|
7057
7071
|
{
|
|
7058
7072
|
className: `Layer__profit-and-loss-summaries__amount ${netProfitDirectionClass}`
|
|
@@ -7064,14 +7078,14 @@ var ProfitAndLossSummaries = ({
|
|
|
7064
7078
|
};
|
|
7065
7079
|
|
|
7066
7080
|
// src/components/ProfitAndLossTable/ProfitAndLossTable.tsx
|
|
7067
|
-
var
|
|
7081
|
+
var import_react71 = __toESM(require("react"));
|
|
7068
7082
|
|
|
7069
7083
|
// src/components/ProfitAndLossRow/ProfitAndLossRow.tsx
|
|
7070
|
-
var
|
|
7084
|
+
var import_react70 = __toESM(require("react"));
|
|
7071
7085
|
|
|
7072
7086
|
// src/icons/PieChart.tsx
|
|
7073
|
-
var
|
|
7074
|
-
var PieChart3 = ({ size = 12, ...props }) => /* @__PURE__ */
|
|
7087
|
+
var React84 = __toESM(require("react"));
|
|
7088
|
+
var PieChart3 = ({ size = 12, ...props }) => /* @__PURE__ */ React84.createElement(
|
|
7075
7089
|
"svg",
|
|
7076
7090
|
{
|
|
7077
7091
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -7081,7 +7095,7 @@ var PieChart3 = ({ size = 12, ...props }) => /* @__PURE__ */ React83.createEleme
|
|
|
7081
7095
|
width: size,
|
|
7082
7096
|
height: size
|
|
7083
7097
|
},
|
|
7084
|
-
/* @__PURE__ */
|
|
7098
|
+
/* @__PURE__ */ React84.createElement("g", null, /* @__PURE__ */ React84.createElement(
|
|
7085
7099
|
"path",
|
|
7086
7100
|
{
|
|
7087
7101
|
d: "M10.2213 7.78271C9.92969 8.47226 9.47363 9.07989 8.89297 9.55247C8.3123 10.0251 7.62471 10.3482 6.89031 10.4936C6.1559 10.6391 5.39705 10.6024 4.68009 10.3869C3.96313 10.1713 3.30989 9.78337 2.77749 9.25701C2.24509 8.73065 1.84973 8.08189 1.62598 7.36744C1.40223 6.65298 1.3569 5.8946 1.49396 5.15858C1.63102 4.42257 1.94629 3.73133 2.41221 3.14531C2.87813 2.55928 3.48051 2.09631 4.16669 1.79688",
|
|
@@ -7089,7 +7103,7 @@ var PieChart3 = ({ size = 12, ...props }) => /* @__PURE__ */ React83.createEleme
|
|
|
7089
7103
|
strokeLinecap: "round",
|
|
7090
7104
|
strokeLinejoin: "round"
|
|
7091
7105
|
}
|
|
7092
|
-
), /* @__PURE__ */
|
|
7106
|
+
), /* @__PURE__ */ React84.createElement(
|
|
7093
7107
|
"path",
|
|
7094
7108
|
{
|
|
7095
7109
|
d: "M10.5833 6.00033C10.5833 5.39843 10.4648 4.80244 10.2344 4.24636C10.0041 3.69028 9.66651 3.18502 9.24091 2.75942C8.8153 2.33382 8.31004 1.99621 7.75397 1.76588C7.19789 1.53554 6.60189 1.41699 6 1.41699V6.00033H10.5833Z",
|
|
@@ -7116,7 +7130,7 @@ var ProfitAndLossRow = ({
|
|
|
7116
7130
|
return null;
|
|
7117
7131
|
}
|
|
7118
7132
|
const { value, display_name, line_items } = lineItem;
|
|
7119
|
-
const [expanded, setExpanded] = (0,
|
|
7133
|
+
const [expanded, setExpanded] = (0, import_react70.useState)(true);
|
|
7120
7134
|
const amount = value ?? 0;
|
|
7121
7135
|
const amountString = centsToDollars(Math.abs(amount));
|
|
7122
7136
|
const labelClasses = [
|
|
@@ -7147,20 +7161,20 @@ var ProfitAndLossRow = ({
|
|
|
7147
7161
|
);
|
|
7148
7162
|
displayChildren && expanded && labelClasses.push("Layer__profit-and-loss-row__label--expanded");
|
|
7149
7163
|
displayChildren && expanded && valueClasses.push("Layer__profit-and-loss-row__value--expanded");
|
|
7150
|
-
return /* @__PURE__ */
|
|
7164
|
+
return /* @__PURE__ */ import_react70.default.createElement(import_react70.default.Fragment, null, /* @__PURE__ */ import_react70.default.createElement(
|
|
7151
7165
|
"div",
|
|
7152
7166
|
{
|
|
7153
7167
|
className: labelClasses.join(" "),
|
|
7154
7168
|
onClick: () => !lockExpanded && toggleExpanded()
|
|
7155
7169
|
},
|
|
7156
|
-
/* @__PURE__ */
|
|
7170
|
+
/* @__PURE__ */ import_react70.default.createElement("span", { className: "Layer__profit-and-loss-row__label__title" }, !lockExpanded && variant !== "summation" ? /* @__PURE__ */ import_react70.default.createElement(
|
|
7157
7171
|
ChevronDownFill_default,
|
|
7158
7172
|
{
|
|
7159
7173
|
size: 16,
|
|
7160
7174
|
className: "Layer__profit-and-loss-row__label__chevron"
|
|
7161
7175
|
}
|
|
7162
|
-
) : null, /* @__PURE__ */
|
|
7163
|
-
setSidebarScope && /* @__PURE__ */
|
|
7176
|
+
) : null, /* @__PURE__ */ import_react70.default.createElement(Text, null, display_name)),
|
|
7177
|
+
setSidebarScope && /* @__PURE__ */ import_react70.default.createElement(
|
|
7164
7178
|
"span",
|
|
7165
7179
|
{
|
|
7166
7180
|
className: "Layer__profit-and-loss-row__detailed-chart-btn",
|
|
@@ -7169,14 +7183,14 @@ var ProfitAndLossRow = ({
|
|
|
7169
7183
|
setSidebarScope && setSidebarScope(scope ?? "expenses");
|
|
7170
7184
|
}
|
|
7171
7185
|
},
|
|
7172
|
-
/* @__PURE__ */
|
|
7186
|
+
/* @__PURE__ */ import_react70.default.createElement(PieChart_default, null)
|
|
7173
7187
|
)
|
|
7174
|
-
), /* @__PURE__ */
|
|
7188
|
+
), /* @__PURE__ */ import_react70.default.createElement("div", { className: valueClasses.join(" ") }, /* @__PURE__ */ import_react70.default.createElement(Text, null, amountString)), canGoDeeper && hasChildren && /* @__PURE__ */ import_react70.default.createElement(
|
|
7175
7189
|
"div",
|
|
7176
7190
|
{
|
|
7177
7191
|
className: `Layer__profit-and-loss-row__children ${expanded && "Layer__profit-and-loss-row__children--expanded"}`
|
|
7178
7192
|
},
|
|
7179
|
-
/* @__PURE__ */
|
|
7193
|
+
/* @__PURE__ */ import_react70.default.createElement("div", { className: "Layer__profit-and-loss-row__children--content" }, (line_items || []).map((line_item) => /* @__PURE__ */ import_react70.default.createElement(
|
|
7180
7194
|
ProfitAndLossRow,
|
|
7181
7195
|
{
|
|
7182
7196
|
key: line_item.display_name,
|
|
@@ -7244,11 +7258,11 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7244
7258
|
data: actualData,
|
|
7245
7259
|
isLoading,
|
|
7246
7260
|
setSidebarScope
|
|
7247
|
-
} = (0,
|
|
7261
|
+
} = (0, import_react71.useContext)(ProfitAndLoss.Context);
|
|
7248
7262
|
const currentData = Array.isArray(actualData) ? actualData[actualData.length - 1] : actualData;
|
|
7249
7263
|
const data = !currentData || isLoading ? empty_profit_and_loss_report_default : currentData;
|
|
7250
7264
|
if (isLoading || actualData === void 0) {
|
|
7251
|
-
return /* @__PURE__ */
|
|
7265
|
+
return /* @__PURE__ */ import_react71.default.createElement(
|
|
7252
7266
|
"div",
|
|
7253
7267
|
{
|
|
7254
7268
|
className: (0, import_classnames35.default)(
|
|
@@ -7256,10 +7270,10 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7256
7270
|
asContainer && "Layer__component-container"
|
|
7257
7271
|
)
|
|
7258
7272
|
},
|
|
7259
|
-
/* @__PURE__ */
|
|
7273
|
+
/* @__PURE__ */ import_react71.default.createElement(Loader2, null)
|
|
7260
7274
|
);
|
|
7261
7275
|
}
|
|
7262
|
-
return /* @__PURE__ */
|
|
7276
|
+
return /* @__PURE__ */ import_react71.default.createElement(import_react71.default.Fragment, null, /* @__PURE__ */ import_react71.default.createElement(
|
|
7263
7277
|
"div",
|
|
7264
7278
|
{
|
|
7265
7279
|
className: (0, import_classnames35.default)(
|
|
@@ -7267,7 +7281,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7267
7281
|
asContainer && "Layer__component-container"
|
|
7268
7282
|
)
|
|
7269
7283
|
},
|
|
7270
|
-
/* @__PURE__ */
|
|
7284
|
+
/* @__PURE__ */ import_react71.default.createElement(
|
|
7271
7285
|
ProfitAndLossRow,
|
|
7272
7286
|
{
|
|
7273
7287
|
lineItem: data.income,
|
|
@@ -7277,7 +7291,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7277
7291
|
setSidebarScope
|
|
7278
7292
|
}
|
|
7279
7293
|
),
|
|
7280
|
-
/* @__PURE__ */
|
|
7294
|
+
/* @__PURE__ */ import_react71.default.createElement(
|
|
7281
7295
|
ProfitAndLossRow,
|
|
7282
7296
|
{
|
|
7283
7297
|
lineItem: data.cost_of_goods_sold,
|
|
@@ -7287,7 +7301,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7287
7301
|
setSidebarScope
|
|
7288
7302
|
}
|
|
7289
7303
|
),
|
|
7290
|
-
/* @__PURE__ */
|
|
7304
|
+
/* @__PURE__ */ import_react71.default.createElement(
|
|
7291
7305
|
ProfitAndLossRow,
|
|
7292
7306
|
{
|
|
7293
7307
|
lineItem: {
|
|
@@ -7301,7 +7315,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7301
7315
|
setSidebarScope
|
|
7302
7316
|
}
|
|
7303
7317
|
),
|
|
7304
|
-
/* @__PURE__ */
|
|
7318
|
+
/* @__PURE__ */ import_react71.default.createElement(
|
|
7305
7319
|
ProfitAndLossRow,
|
|
7306
7320
|
{
|
|
7307
7321
|
lineItem: data.expenses,
|
|
@@ -7311,7 +7325,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7311
7325
|
setSidebarScope
|
|
7312
7326
|
}
|
|
7313
7327
|
),
|
|
7314
|
-
/* @__PURE__ */
|
|
7328
|
+
/* @__PURE__ */ import_react71.default.createElement(
|
|
7315
7329
|
ProfitAndLossRow,
|
|
7316
7330
|
{
|
|
7317
7331
|
lineItem: {
|
|
@@ -7325,7 +7339,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7325
7339
|
setSidebarScope
|
|
7326
7340
|
}
|
|
7327
7341
|
),
|
|
7328
|
-
/* @__PURE__ */
|
|
7342
|
+
/* @__PURE__ */ import_react71.default.createElement(
|
|
7329
7343
|
ProfitAndLossRow,
|
|
7330
7344
|
{
|
|
7331
7345
|
lineItem: data.taxes,
|
|
@@ -7335,7 +7349,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7335
7349
|
setSidebarScope
|
|
7336
7350
|
}
|
|
7337
7351
|
),
|
|
7338
|
-
/* @__PURE__ */
|
|
7352
|
+
/* @__PURE__ */ import_react71.default.createElement(
|
|
7339
7353
|
ProfitAndLossRow,
|
|
7340
7354
|
{
|
|
7341
7355
|
lineItem: {
|
|
@@ -7347,14 +7361,14 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7347
7361
|
lockExpanded
|
|
7348
7362
|
}
|
|
7349
7363
|
)
|
|
7350
|
-
), data.other_outflows || data.personal_expenses ? /* @__PURE__ */
|
|
7364
|
+
), data.other_outflows || data.personal_expenses ? /* @__PURE__ */ import_react71.default.createElement("div", { className: "Layer__profit-and-loss-table Layer__profit-and-loss-table__outflows" }, /* @__PURE__ */ import_react71.default.createElement(
|
|
7351
7365
|
ProfitAndLossRow,
|
|
7352
7366
|
{
|
|
7353
7367
|
lineItem: data.other_outflows,
|
|
7354
7368
|
direction: "DEBIT" /* DEBIT */,
|
|
7355
7369
|
lockExpanded
|
|
7356
7370
|
}
|
|
7357
|
-
), /* @__PURE__ */
|
|
7371
|
+
), /* @__PURE__ */ import_react71.default.createElement(
|
|
7358
7372
|
ProfitAndLossRow,
|
|
7359
7373
|
{
|
|
7360
7374
|
lineItem: data.personal_expenses,
|
|
@@ -7366,7 +7380,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7366
7380
|
|
|
7367
7381
|
// src/components/ProfitAndLoss/ProfitAndLoss.tsx
|
|
7368
7382
|
var import_date_fns16 = require("date-fns");
|
|
7369
|
-
var PNLContext = (0,
|
|
7383
|
+
var PNLContext = (0, import_react72.createContext)({
|
|
7370
7384
|
data: void 0,
|
|
7371
7385
|
filteredDataRevenue: [],
|
|
7372
7386
|
filteredTotalRevenue: void 0,
|
|
@@ -7402,7 +7416,7 @@ var ProfitAndLoss = ({
|
|
|
7402
7416
|
asContainer = true
|
|
7403
7417
|
}) => {
|
|
7404
7418
|
const contextData = useProfitAndLoss({ tagFilter, reportingBasis });
|
|
7405
|
-
return /* @__PURE__ */
|
|
7419
|
+
return /* @__PURE__ */ import_react72.default.createElement(PNLContext.Provider, { value: contextData }, asContainer ? /* @__PURE__ */ import_react72.default.createElement(Container, { name: "profit-and-loss" }, children) : children);
|
|
7406
7420
|
};
|
|
7407
7421
|
ProfitAndLoss.Chart = ProfitAndLossChart;
|
|
7408
7422
|
ProfitAndLoss.Context = PNLContext;
|
|
@@ -7412,10 +7426,10 @@ ProfitAndLoss.Table = ProfitAndLossTable;
|
|
|
7412
7426
|
ProfitAndLoss.DetailedCharts = ProfitAndLossDetailedCharts;
|
|
7413
7427
|
|
|
7414
7428
|
// src/components/ProfitAndLossView/ProfitAndLossView.tsx
|
|
7415
|
-
var
|
|
7429
|
+
var import_react74 = __toESM(require("react"));
|
|
7416
7430
|
|
|
7417
7431
|
// src/components/Panel/Panel.tsx
|
|
7418
|
-
var
|
|
7432
|
+
var import_react73 = __toESM(require("react"));
|
|
7419
7433
|
var import_classnames36 = __toESM(require("classnames"));
|
|
7420
7434
|
var Panel = ({
|
|
7421
7435
|
children,
|
|
@@ -7425,13 +7439,13 @@ var Panel = ({
|
|
|
7425
7439
|
sidebarIsOpen,
|
|
7426
7440
|
parentRef
|
|
7427
7441
|
}) => {
|
|
7428
|
-
const [sidebarHeight, setSidebarHeight] = (0,
|
|
7429
|
-
(0,
|
|
7442
|
+
const [sidebarHeight, setSidebarHeight] = (0, import_react73.useState)(0);
|
|
7443
|
+
(0, import_react73.useEffect)(() => {
|
|
7430
7444
|
if (parentRef?.current?.offsetHeight) {
|
|
7431
7445
|
setSidebarHeight(parentRef?.current?.offsetHeight - 1);
|
|
7432
7446
|
}
|
|
7433
7447
|
}, [parentRef?.current?.offsetHeight, sidebarIsOpen]);
|
|
7434
|
-
return /* @__PURE__ */
|
|
7448
|
+
return /* @__PURE__ */ import_react73.default.createElement(
|
|
7435
7449
|
"div",
|
|
7436
7450
|
{
|
|
7437
7451
|
className: (0, import_classnames36.default)(
|
|
@@ -7440,8 +7454,8 @@ var Panel = ({
|
|
|
7440
7454
|
sidebarIsOpen && "Layer__panel--open"
|
|
7441
7455
|
)
|
|
7442
7456
|
},
|
|
7443
|
-
/* @__PURE__ */
|
|
7444
|
-
sidebar && /* @__PURE__ */
|
|
7457
|
+
/* @__PURE__ */ import_react73.default.createElement("div", { className: "Layer__panel__content" }, header, children),
|
|
7458
|
+
sidebar && /* @__PURE__ */ import_react73.default.createElement(
|
|
7445
7459
|
"div",
|
|
7446
7460
|
{
|
|
7447
7461
|
className: "Layer__panel__sidebar",
|
|
@@ -7449,7 +7463,7 @@ var Panel = ({
|
|
|
7449
7463
|
maxHeight: sidebarHeight > 0 && sidebarIsOpen ? sidebarHeight : 0
|
|
7450
7464
|
}
|
|
7451
7465
|
},
|
|
7452
|
-
/* @__PURE__ */
|
|
7466
|
+
/* @__PURE__ */ import_react73.default.createElement("div", { className: "Layer__panel__sidebar-content" }, sidebar)
|
|
7453
7467
|
)
|
|
7454
7468
|
);
|
|
7455
7469
|
};
|
|
@@ -7457,34 +7471,34 @@ var Panel = ({
|
|
|
7457
7471
|
// src/components/ProfitAndLossView/ProfitAndLossView.tsx
|
|
7458
7472
|
var COMPONENT_NAME3 = "profit-and-loss";
|
|
7459
7473
|
var ProfitAndLossView = (props) => {
|
|
7460
|
-
const containerRef = (0,
|
|
7461
|
-
return /* @__PURE__ */
|
|
7474
|
+
const containerRef = (0, import_react74.useRef)(null);
|
|
7475
|
+
return /* @__PURE__ */ import_react74.default.createElement(Container, { name: COMPONENT_NAME3, ref: containerRef }, /* @__PURE__ */ import_react74.default.createElement(ProfitAndLoss, null, /* @__PURE__ */ import_react74.default.createElement(ProfitAndLossPanel, { containerRef, ...props })));
|
|
7462
7476
|
};
|
|
7463
7477
|
var ProfitAndLossPanel = ({
|
|
7464
7478
|
containerRef,
|
|
7465
7479
|
...props
|
|
7466
7480
|
}) => {
|
|
7467
|
-
const { sidebarScope } = (0,
|
|
7468
|
-
return /* @__PURE__ */
|
|
7481
|
+
const { sidebarScope } = (0, import_react74.useContext)(ProfitAndLoss.Context);
|
|
7482
|
+
return /* @__PURE__ */ import_react74.default.createElement(
|
|
7469
7483
|
Panel,
|
|
7470
7484
|
{
|
|
7471
|
-
sidebar: /* @__PURE__ */
|
|
7485
|
+
sidebar: /* @__PURE__ */ import_react74.default.createElement(ProfitAndLossDetailedCharts, null),
|
|
7472
7486
|
sidebarIsOpen: Boolean(sidebarScope),
|
|
7473
7487
|
parentRef: containerRef
|
|
7474
7488
|
},
|
|
7475
|
-
/* @__PURE__ */
|
|
7476
|
-
/* @__PURE__ */
|
|
7489
|
+
/* @__PURE__ */ import_react74.default.createElement(Header, { className: `Layer__${COMPONENT_NAME3}__header` }, /* @__PURE__ */ import_react74.default.createElement(Heading, { className: "Layer__profit-and-loss__title" }, "Profit & Loss")),
|
|
7490
|
+
/* @__PURE__ */ import_react74.default.createElement(Components, { ...props })
|
|
7477
7491
|
);
|
|
7478
7492
|
};
|
|
7479
7493
|
var Components = ({
|
|
7480
7494
|
hideChart = false,
|
|
7481
7495
|
hideTable = false
|
|
7482
7496
|
}) => {
|
|
7483
|
-
const { error, isLoading, isValidating, refetch } = (0,
|
|
7497
|
+
const { error, isLoading, isValidating, refetch } = (0, import_react74.useContext)(
|
|
7484
7498
|
ProfitAndLoss.Context
|
|
7485
7499
|
);
|
|
7486
7500
|
if (!isLoading && error) {
|
|
7487
|
-
return /* @__PURE__ */
|
|
7501
|
+
return /* @__PURE__ */ import_react74.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react74.default.createElement(
|
|
7488
7502
|
DataState,
|
|
7489
7503
|
{
|
|
7490
7504
|
status: "failed" /* failed */,
|
|
@@ -7495,29 +7509,29 @@ var Components = ({
|
|
|
7495
7509
|
}
|
|
7496
7510
|
));
|
|
7497
7511
|
}
|
|
7498
|
-
return /* @__PURE__ */
|
|
7512
|
+
return /* @__PURE__ */ import_react74.default.createElement(import_react74.default.Fragment, null, !hideChart && /* @__PURE__ */ import_react74.default.createElement("div", { className: `Layer__${COMPONENT_NAME3}__chart_with_summaries` }, /* @__PURE__ */ import_react74.default.createElement(
|
|
7499
7513
|
"div",
|
|
7500
7514
|
{
|
|
7501
7515
|
className: `Layer__${COMPONENT_NAME3}__chart_with_summaries__summary-col`
|
|
7502
7516
|
},
|
|
7503
|
-
/* @__PURE__ */
|
|
7504
|
-
/* @__PURE__ */
|
|
7505
|
-
), /* @__PURE__ */
|
|
7517
|
+
/* @__PURE__ */ import_react74.default.createElement(ProfitAndLoss.DatePicker, null),
|
|
7518
|
+
/* @__PURE__ */ import_react74.default.createElement(ProfitAndLoss.Summaries, { vertical: true })
|
|
7519
|
+
), /* @__PURE__ */ import_react74.default.createElement(
|
|
7506
7520
|
"div",
|
|
7507
7521
|
{
|
|
7508
7522
|
className: `Layer__${COMPONENT_NAME3}__chart_with_summaries__chart-col`
|
|
7509
7523
|
},
|
|
7510
|
-
/* @__PURE__ */
|
|
7511
|
-
)), !hideTable && /* @__PURE__ */
|
|
7524
|
+
/* @__PURE__ */ import_react74.default.createElement(ProfitAndLoss.Chart, null)
|
|
7525
|
+
)), !hideTable && /* @__PURE__ */ import_react74.default.createElement(ProfitAndLoss.Table, null));
|
|
7512
7526
|
};
|
|
7513
7527
|
|
|
7514
7528
|
// src/components/ChartOfAccounts/ChartOfAccounts.tsx
|
|
7515
|
-
var
|
|
7529
|
+
var import_react92 = __toESM(require("react"));
|
|
7516
7530
|
|
|
7517
7531
|
// src/contexts/ChartOfAccountsContext/ChartOfAccountsContext.tsx
|
|
7518
|
-
var
|
|
7532
|
+
var import_react75 = require("react");
|
|
7519
7533
|
var import_date_fns17 = require("date-fns");
|
|
7520
|
-
var ChartOfAccountsContext = (0,
|
|
7534
|
+
var ChartOfAccountsContext = (0, import_react75.createContext)(
|
|
7521
7535
|
{
|
|
7522
7536
|
data: void 0,
|
|
7523
7537
|
isLoading: false,
|
|
@@ -7548,8 +7562,8 @@ var ChartOfAccountsContext = (0, import_react74.createContext)(
|
|
|
7548
7562
|
);
|
|
7549
7563
|
|
|
7550
7564
|
// src/contexts/LedgerAccountsContext/LedgerAccountsContext.tsx
|
|
7551
|
-
var
|
|
7552
|
-
var LedgerAccountsContext = (0,
|
|
7565
|
+
var import_react76 = require("react");
|
|
7566
|
+
var LedgerAccountsContext = (0, import_react76.createContext)({
|
|
7553
7567
|
data: void 0,
|
|
7554
7568
|
entryData: void 0,
|
|
7555
7569
|
isLoading: false,
|
|
@@ -7571,7 +7585,7 @@ var LedgerAccountsContext = (0, import_react75.createContext)({
|
|
|
7571
7585
|
});
|
|
7572
7586
|
|
|
7573
7587
|
// src/hooks/useChartOfAccounts/useChartOfAccounts.tsx
|
|
7574
|
-
var
|
|
7588
|
+
var import_react77 = require("react");
|
|
7575
7589
|
|
|
7576
7590
|
// src/components/ChartOfAccountsForm/constants.ts
|
|
7577
7591
|
var LEDGER_ACCOUNT_TYPES = [
|
|
@@ -7776,7 +7790,7 @@ var LEDGER_ACCOUNT_SUBTYPES_FOR_TYPE = {
|
|
|
7776
7790
|
|
|
7777
7791
|
// src/hooks/useChartOfAccounts/useChartOfAccounts.tsx
|
|
7778
7792
|
var import_date_fns18 = require("date-fns");
|
|
7779
|
-
var
|
|
7793
|
+
var import_swr6 = __toESM(require("swr"));
|
|
7780
7794
|
var validate = (formData) => {
|
|
7781
7795
|
const errors = [];
|
|
7782
7796
|
const nameError = validateName(formData);
|
|
@@ -7860,16 +7874,16 @@ var useChartOfAccounts = ({ withDates, startDate: initialStartDate, endDate: ini
|
|
|
7860
7874
|
endDate: (0, import_date_fns18.endOfMonth)(/* @__PURE__ */ new Date())
|
|
7861
7875
|
}) => {
|
|
7862
7876
|
const { auth, businessId, apiUrl } = useLayerContext();
|
|
7863
|
-
const [form, setForm] = (0,
|
|
7864
|
-
const [sendingForm, setSendingForm] = (0,
|
|
7865
|
-
const [apiError, setApiError] = (0,
|
|
7866
|
-
const [startDate, setStartDate] = (0,
|
|
7877
|
+
const [form, setForm] = (0, import_react77.useState)();
|
|
7878
|
+
const [sendingForm, setSendingForm] = (0, import_react77.useState)(false);
|
|
7879
|
+
const [apiError, setApiError] = (0, import_react77.useState)(void 0);
|
|
7880
|
+
const [startDate, setStartDate] = (0, import_react77.useState)(
|
|
7867
7881
|
initialStartDate ?? (0, import_date_fns18.startOfMonth)(Date.now())
|
|
7868
7882
|
);
|
|
7869
|
-
const [endDate, setEndDate] = (0,
|
|
7883
|
+
const [endDate, setEndDate] = (0, import_react77.useState)(
|
|
7870
7884
|
initialEndDate ?? (0, import_date_fns18.endOfMonth)(Date.now())
|
|
7871
7885
|
);
|
|
7872
|
-
const { data, isLoading, isValidating, error, mutate } = (0,
|
|
7886
|
+
const { data, isLoading, isValidating, error, mutate } = (0, import_swr6.default)(
|
|
7873
7887
|
businessId && auth?.access_token && `chart-of-accounts-${businessId}-${startDate?.valueOf()}-${endDate?.valueOf()}`,
|
|
7874
7888
|
Layer.getLedgerAccountBalances(apiUrl, auth?.access_token, {
|
|
7875
7889
|
params: {
|
|
@@ -8065,13 +8079,13 @@ var useChartOfAccounts = ({ withDates, startDate: initialStartDate, endDate: ini
|
|
|
8065
8079
|
};
|
|
8066
8080
|
|
|
8067
8081
|
// src/hooks/useLedgerAccounts/useLedgerAccounts.tsx
|
|
8068
|
-
var
|
|
8069
|
-
var
|
|
8082
|
+
var import_react78 = require("react");
|
|
8083
|
+
var import_swr7 = __toESM(require("swr"));
|
|
8070
8084
|
var useLedgerAccounts = () => {
|
|
8071
8085
|
const { auth, businessId, apiUrl } = useLayerContext();
|
|
8072
|
-
const [accountId, setAccountId] = (0,
|
|
8073
|
-
const [selectedEntryId, setSelectedEntryId] = (0,
|
|
8074
|
-
const { data, isLoading, isValidating, error, mutate } = (0,
|
|
8086
|
+
const [accountId, setAccountId] = (0, import_react78.useState)();
|
|
8087
|
+
const [selectedEntryId, setSelectedEntryId] = (0, import_react78.useState)();
|
|
8088
|
+
const { data, isLoading, isValidating, error, mutate } = (0, import_swr7.default)(
|
|
8075
8089
|
businessId && accountId && auth?.access_token && `ledger-accounts-lines-${businessId}-${accountId}`,
|
|
8076
8090
|
Layer.getLedgerAccountsLines(apiUrl, auth?.access_token, {
|
|
8077
8091
|
params: { businessId, accountId }
|
|
@@ -8083,7 +8097,7 @@ var useLedgerAccounts = () => {
|
|
|
8083
8097
|
isLoading: isLoadingEntry,
|
|
8084
8098
|
isValidating: isValdiatingEntry,
|
|
8085
8099
|
error: errorEntry
|
|
8086
|
-
} = (0,
|
|
8100
|
+
} = (0, import_swr7.default)(
|
|
8087
8101
|
businessId && selectedEntryId && auth?.access_token && `ledger-accounts-entry-${businessId}-${selectedEntryId}}`,
|
|
8088
8102
|
Layer.getLedgerAccountsEntry(apiUrl, auth?.access_token, {
|
|
8089
8103
|
params: { businessId, entryId: selectedEntryId }
|
|
@@ -8113,21 +8127,21 @@ var useLedgerAccounts = () => {
|
|
|
8113
8127
|
};
|
|
8114
8128
|
|
|
8115
8129
|
// src/components/ChartOfAccountsTable/ChartOfAccountsTable.tsx
|
|
8116
|
-
var
|
|
8130
|
+
var import_react84 = __toESM(require("react"));
|
|
8117
8131
|
|
|
8118
8132
|
// src/components/ChartOfAccountsDatePicker/ChartOfAccountsDatePicker.tsx
|
|
8119
|
-
var
|
|
8133
|
+
var import_react79 = __toESM(require("react"));
|
|
8120
8134
|
var ChartOfAccountsDatePicker = () => {
|
|
8121
|
-
const { changeDateRange, dateRange } = (0,
|
|
8122
|
-
return /* @__PURE__ */
|
|
8135
|
+
const { changeDateRange, dateRange } = (0, import_react79.useContext)(ChartOfAccountsContext);
|
|
8136
|
+
return /* @__PURE__ */ import_react79.default.createElement(DateMonthPicker, { dateRange, changeDateRange });
|
|
8123
8137
|
};
|
|
8124
8138
|
|
|
8125
8139
|
// src/components/ChartOfAccountsRow/ChartOfAccountsRow.tsx
|
|
8126
|
-
var
|
|
8140
|
+
var import_react80 = __toESM(require("react"));
|
|
8127
8141
|
|
|
8128
8142
|
// src/icons/Edit2.tsx
|
|
8129
|
-
var
|
|
8130
|
-
var Edit2 = ({ size = 18, ...props }) => /* @__PURE__ */
|
|
8143
|
+
var React91 = __toESM(require("react"));
|
|
8144
|
+
var Edit2 = ({ size = 18, ...props }) => /* @__PURE__ */ React91.createElement(
|
|
8131
8145
|
"svg",
|
|
8132
8146
|
{
|
|
8133
8147
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -8137,7 +8151,7 @@ var Edit2 = ({ size = 18, ...props }) => /* @__PURE__ */ React90.createElement(
|
|
|
8137
8151
|
width: size,
|
|
8138
8152
|
height: size
|
|
8139
8153
|
},
|
|
8140
|
-
/* @__PURE__ */
|
|
8154
|
+
/* @__PURE__ */ React91.createElement(
|
|
8141
8155
|
"path",
|
|
8142
8156
|
{
|
|
8143
8157
|
d: "M12.75 2.25C12.947 2.05301 13.1808 1.89676 13.4382 1.79015C13.6956 1.68355 13.9714 1.62868 14.25 1.62868C14.5286 1.62868 14.8044 1.68355 15.0618 1.79015C15.3192 1.89676 15.553 2.05301 15.75 2.25C15.947 2.44698 16.1032 2.68083 16.2098 2.9382C16.3165 3.19557 16.3713 3.47142 16.3713 3.75C16.3713 4.02857 16.3165 4.30442 16.2098 4.56179C16.1032 4.81916 15.947 5.05302 15.75 5.25L5.625 15.375L1.5 16.5L2.625 12.375L12.75 2.25Z",
|
|
@@ -8182,10 +8196,10 @@ var ChartOfAccountsRow = ({
|
|
|
8182
8196
|
view,
|
|
8183
8197
|
expandAll
|
|
8184
8198
|
}) => {
|
|
8185
|
-
const { form, editAccount } = (0,
|
|
8186
|
-
const { setAccountId } = (0,
|
|
8199
|
+
const { form, editAccount } = (0, import_react80.useContext)(ChartOfAccountsContext);
|
|
8200
|
+
const { setAccountId } = (0, import_react80.useContext)(LedgerAccountsContext);
|
|
8187
8201
|
const baseStyle = view === "desktop" ? EXPANDED_STYLE : EXPANDED_MOBILE_STYLE;
|
|
8188
|
-
const [isOpen, setIsOpen] = (0,
|
|
8202
|
+
const [isOpen, setIsOpen] = (0, import_react80.useState)(defaultOpen);
|
|
8189
8203
|
const style = expanded ? {
|
|
8190
8204
|
...baseStyle,
|
|
8191
8205
|
transitionDelay: `${15 * index}ms`
|
|
@@ -8193,15 +8207,15 @@ var ChartOfAccountsRow = ({
|
|
|
8193
8207
|
...COLLAPSED_STYLE,
|
|
8194
8208
|
transitionDelay: `${acountsLength - 15 * index}ms`
|
|
8195
8209
|
};
|
|
8196
|
-
const [showComponent, setShowComponent] = (0,
|
|
8197
|
-
const [prevExpandedAll, setPrevExpandedAll] = (0,
|
|
8198
|
-
(0,
|
|
8210
|
+
const [showComponent, setShowComponent] = (0, import_react80.useState)(false);
|
|
8211
|
+
const [prevExpandedAll, setPrevExpandedAll] = (0, import_react80.useState)(expandAll);
|
|
8212
|
+
(0, import_react80.useEffect)(() => {
|
|
8199
8213
|
const timeoutId = setTimeout(() => {
|
|
8200
8214
|
setShowComponent(true);
|
|
8201
8215
|
}, cumulativeIndex * 50);
|
|
8202
8216
|
return () => clearTimeout(timeoutId);
|
|
8203
8217
|
}, []);
|
|
8204
|
-
(0,
|
|
8218
|
+
(0, import_react80.useEffect)(() => {
|
|
8205
8219
|
if (prevExpandedAll !== expandAll && expandAll) {
|
|
8206
8220
|
setIsOpen(expandAll === "collapsed" ? false : true);
|
|
8207
8221
|
}
|
|
@@ -8222,7 +8236,7 @@ var ChartOfAccountsRow = ({
|
|
|
8222
8236
|
baseClass,
|
|
8223
8237
|
"Layer__chart-of-accounts__row---mobile"
|
|
8224
8238
|
);
|
|
8225
|
-
return /* @__PURE__ */
|
|
8239
|
+
return /* @__PURE__ */ import_react80.default.createElement(import_react80.default.Fragment, null, view === "desktop" && /* @__PURE__ */ import_react80.default.createElement(
|
|
8226
8240
|
"tr",
|
|
8227
8241
|
{
|
|
8228
8242
|
className: desktopRowClass,
|
|
@@ -8232,7 +8246,7 @@ var ChartOfAccountsRow = ({
|
|
|
8232
8246
|
setAccountId(account.id);
|
|
8233
8247
|
}
|
|
8234
8248
|
},
|
|
8235
|
-
/* @__PURE__ */
|
|
8249
|
+
/* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__coa__name" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content", style }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8236
8250
|
"span",
|
|
8237
8251
|
{
|
|
8238
8252
|
className: "Layer__table-cell-content-indentation",
|
|
@@ -8240,7 +8254,7 @@ var ChartOfAccountsRow = ({
|
|
|
8240
8254
|
paddingLeft: INDENTATION * depth + 16
|
|
8241
8255
|
}
|
|
8242
8256
|
},
|
|
8243
|
-
account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */
|
|
8257
|
+
account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */ import_react80.default.createElement(
|
|
8244
8258
|
ChevronDownFill_default,
|
|
8245
8259
|
{
|
|
8246
8260
|
size: 16,
|
|
@@ -8251,22 +8265,22 @@ var ChartOfAccountsRow = ({
|
|
|
8251
8265
|
}
|
|
8252
8266
|
}
|
|
8253
8267
|
),
|
|
8254
|
-
/* @__PURE__ */
|
|
8268
|
+
/* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__coa__name__text" }, account.name)
|
|
8255
8269
|
))),
|
|
8256
|
-
/* @__PURE__ */
|
|
8270
|
+
/* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__coa__type" }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8257
8271
|
"span",
|
|
8258
8272
|
{
|
|
8259
8273
|
className: "Layer__table-cell-content Layer__mobile--hidden",
|
|
8260
8274
|
style
|
|
8261
8275
|
},
|
|
8262
8276
|
account.account_type?.display_name
|
|
8263
|
-
), /* @__PURE__ */
|
|
8277
|
+
), /* @__PURE__ */ import_react80.default.createElement(
|
|
8264
8278
|
"span",
|
|
8265
8279
|
{
|
|
8266
8280
|
className: "Layer__table-cell-content Layer__desktop--hidden",
|
|
8267
8281
|
style
|
|
8268
8282
|
},
|
|
8269
|
-
/* @__PURE__ */
|
|
8283
|
+
/* @__PURE__ */ import_react80.default.createElement(
|
|
8270
8284
|
Text,
|
|
8271
8285
|
{
|
|
8272
8286
|
weight: "bold" /* bold */,
|
|
@@ -8274,10 +8288,10 @@ var ChartOfAccountsRow = ({
|
|
|
8274
8288
|
},
|
|
8275
8289
|
account.normality
|
|
8276
8290
|
),
|
|
8277
|
-
/* @__PURE__ */
|
|
8291
|
+
/* @__PURE__ */ import_react80.default.createElement(Text, { className: "Layer__coa__subtype--mobile" }, account.account_subtype?.display_name)
|
|
8278
8292
|
)),
|
|
8279
|
-
/* @__PURE__ */
|
|
8280
|
-
/* @__PURE__ */
|
|
8293
|
+
/* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__coa__subtype Layer__mobile--hidden" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content", style }, account.account_subtype?.display_name)),
|
|
8294
|
+
/* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__coa__balance" }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8281
8295
|
"span",
|
|
8282
8296
|
{
|
|
8283
8297
|
className: "Layer__table-cell-content Layer__table-cell--amount",
|
|
@@ -8286,11 +8300,11 @@ var ChartOfAccountsRow = ({
|
|
|
8286
8300
|
"$",
|
|
8287
8301
|
centsToDollars(Math.abs(account.balance || 0))
|
|
8288
8302
|
)),
|
|
8289
|
-
/* @__PURE__ */
|
|
8303
|
+
/* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__coa__actions" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content", style }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8290
8304
|
Button,
|
|
8291
8305
|
{
|
|
8292
8306
|
variant: "secondary" /* secondary */,
|
|
8293
|
-
rightIcon: /* @__PURE__ */
|
|
8307
|
+
rightIcon: /* @__PURE__ */ import_react80.default.createElement(Edit2_default, { size: 12 }),
|
|
8294
8308
|
iconOnly: true,
|
|
8295
8309
|
onClick: (e) => {
|
|
8296
8310
|
e.preventDefault();
|
|
@@ -8300,7 +8314,7 @@ var ChartOfAccountsRow = ({
|
|
|
8300
8314
|
},
|
|
8301
8315
|
"Edit"
|
|
8302
8316
|
)))
|
|
8303
|
-
), view === "mobile" || view === "tablet" ? /* @__PURE__ */
|
|
8317
|
+
), view === "mobile" || view === "tablet" ? /* @__PURE__ */ import_react80.default.createElement(
|
|
8304
8318
|
"tr",
|
|
8305
8319
|
{
|
|
8306
8320
|
className: mobileRowClass,
|
|
@@ -8310,7 +8324,7 @@ var ChartOfAccountsRow = ({
|
|
|
8310
8324
|
setAccountId(account.id);
|
|
8311
8325
|
}
|
|
8312
8326
|
},
|
|
8313
|
-
/* @__PURE__ */
|
|
8327
|
+
/* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell", colSpan: 5 }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8314
8328
|
"span",
|
|
8315
8329
|
{
|
|
8316
8330
|
className: "Layer__table-cell-content Layer__table-cell-content-indentation",
|
|
@@ -8319,7 +8333,7 @@ var ChartOfAccountsRow = ({
|
|
|
8319
8333
|
...style
|
|
8320
8334
|
}
|
|
8321
8335
|
},
|
|
8322
|
-
account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */
|
|
8336
|
+
account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */ import_react80.default.createElement(
|
|
8323
8337
|
ChevronDownFill_default,
|
|
8324
8338
|
{
|
|
8325
8339
|
size: 16,
|
|
@@ -8330,14 +8344,14 @@ var ChartOfAccountsRow = ({
|
|
|
8330
8344
|
}
|
|
8331
8345
|
}
|
|
8332
8346
|
),
|
|
8333
|
-
/* @__PURE__ */
|
|
8347
|
+
/* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__top-row" }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8334
8348
|
Text,
|
|
8335
8349
|
{
|
|
8336
8350
|
as: "span",
|
|
8337
8351
|
className: "Layer__chart-of-accounts__mobile-row-content__name"
|
|
8338
8352
|
},
|
|
8339
8353
|
account.name
|
|
8340
|
-
), /* @__PURE__ */
|
|
8354
|
+
), /* @__PURE__ */ import_react80.default.createElement(
|
|
8341
8355
|
TextButton,
|
|
8342
8356
|
{
|
|
8343
8357
|
onClick: (e) => {
|
|
@@ -8347,7 +8361,7 @@ var ChartOfAccountsRow = ({
|
|
|
8347
8361
|
}
|
|
8348
8362
|
},
|
|
8349
8363
|
"Edit"
|
|
8350
|
-
)), /* @__PURE__ */
|
|
8364
|
+
)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__bottom-row" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__types" }, /* @__PURE__ */ import_react80.default.createElement(Text, { as: "span" }, account.normality), /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__chart-of-accounts__mobile-row-content__separator" }), /* @__PURE__ */ import_react80.default.createElement(Text, { as: "span" }, "Sub-Type")), /* @__PURE__ */ import_react80.default.createElement(
|
|
8351
8365
|
Text,
|
|
8352
8366
|
{
|
|
8353
8367
|
as: "span",
|
|
@@ -8357,7 +8371,7 @@ var ChartOfAccountsRow = ({
|
|
|
8357
8371
|
centsToDollars(Math.abs(account.balance || 0))
|
|
8358
8372
|
)))
|
|
8359
8373
|
))
|
|
8360
|
-
) : null, (account.sub_accounts || []).map((subAccount, idx) => /* @__PURE__ */
|
|
8374
|
+
) : null, (account.sub_accounts || []).map((subAccount, idx) => /* @__PURE__ */ import_react80.default.createElement(
|
|
8361
8375
|
ChartOfAccountsRow,
|
|
8362
8376
|
{
|
|
8363
8377
|
key: subAccount.id,
|
|
@@ -8374,14 +8388,14 @@ var ChartOfAccountsRow = ({
|
|
|
8374
8388
|
};
|
|
8375
8389
|
|
|
8376
8390
|
// src/components/ChartOfAccountsSidebar/ChartOfAccountsSidebar.tsx
|
|
8377
|
-
var
|
|
8391
|
+
var import_react83 = __toESM(require("react"));
|
|
8378
8392
|
|
|
8379
8393
|
// src/components/ChartOfAccountsForm/ChartOfAccountsForm.tsx
|
|
8380
|
-
var
|
|
8394
|
+
var import_react82 = __toESM(require("react"));
|
|
8381
8395
|
|
|
8382
8396
|
// src/components/ChartOfAccountsForm/useParentOptions.ts
|
|
8383
|
-
var
|
|
8384
|
-
var useParentOptions = (data) => (0,
|
|
8397
|
+
var import_react81 = require("react");
|
|
8398
|
+
var useParentOptions = (data) => (0, import_react81.useMemo)(
|
|
8385
8399
|
() => flattenAccounts(data?.accounts || []).sort((a, b) => a?.name && b?.name ? a.name.localeCompare(b.name) : 0).map((x) => {
|
|
8386
8400
|
return {
|
|
8387
8401
|
label: x.name,
|
|
@@ -8401,9 +8415,9 @@ var ChartOfAccountsForm = () => {
|
|
|
8401
8415
|
submitForm,
|
|
8402
8416
|
sendingForm,
|
|
8403
8417
|
apiError
|
|
8404
|
-
} = (0,
|
|
8418
|
+
} = (0, import_react82.useContext)(ChartOfAccountsContext);
|
|
8405
8419
|
const parentOptions = useParentOptions(data);
|
|
8406
|
-
const entry = (0,
|
|
8420
|
+
const entry = (0, import_react82.useMemo)(() => {
|
|
8407
8421
|
if (form?.action === "edit" && form.accountId) {
|
|
8408
8422
|
return flattenAccounts(data?.accounts || []).find(
|
|
8409
8423
|
(x) => x.id === form.accountId
|
|
@@ -8414,7 +8428,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8414
8428
|
if (!form) {
|
|
8415
8429
|
return;
|
|
8416
8430
|
}
|
|
8417
|
-
return /* @__PURE__ */
|
|
8431
|
+
return /* @__PURE__ */ import_react82.default.createElement(
|
|
8418
8432
|
"form",
|
|
8419
8433
|
{
|
|
8420
8434
|
className: "Layer__form",
|
|
@@ -8423,7 +8437,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8423
8437
|
submitForm();
|
|
8424
8438
|
}
|
|
8425
8439
|
},
|
|
8426
|
-
/* @__PURE__ */
|
|
8440
|
+
/* @__PURE__ */ import_react82.default.createElement("div", { className: "Layer__chart-of-accounts__sidebar__header" }, /* @__PURE__ */ import_react82.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, form?.action === "edit" ? "Edit" : "Add New", " Account"), /* @__PURE__ */ import_react82.default.createElement("div", { className: "actions" }, /* @__PURE__ */ import_react82.default.createElement(
|
|
8427
8441
|
Button,
|
|
8428
8442
|
{
|
|
8429
8443
|
type: "button",
|
|
@@ -8432,7 +8446,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8432
8446
|
disabled: sendingForm
|
|
8433
8447
|
},
|
|
8434
8448
|
"Cancel"
|
|
8435
|
-
), apiError && /* @__PURE__ */
|
|
8449
|
+
), apiError && /* @__PURE__ */ import_react82.default.createElement(
|
|
8436
8450
|
RetryButton,
|
|
8437
8451
|
{
|
|
8438
8452
|
type: "submit",
|
|
@@ -8441,7 +8455,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8441
8455
|
disabled: sendingForm
|
|
8442
8456
|
},
|
|
8443
8457
|
"Retry"
|
|
8444
|
-
), !apiError && /* @__PURE__ */
|
|
8458
|
+
), !apiError && /* @__PURE__ */ import_react82.default.createElement(
|
|
8445
8459
|
SubmitButton,
|
|
8446
8460
|
{
|
|
8447
8461
|
type: "submit",
|
|
@@ -8451,7 +8465,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8451
8465
|
},
|
|
8452
8466
|
"Save"
|
|
8453
8467
|
))),
|
|
8454
|
-
apiError && /* @__PURE__ */
|
|
8468
|
+
apiError && /* @__PURE__ */ import_react82.default.createElement(
|
|
8455
8469
|
Text,
|
|
8456
8470
|
{
|
|
8457
8471
|
size: "sm" /* sm */,
|
|
@@ -8459,8 +8473,8 @@ var ChartOfAccountsForm = () => {
|
|
|
8459
8473
|
},
|
|
8460
8474
|
apiError
|
|
8461
8475
|
),
|
|
8462
|
-
entry && /* @__PURE__ */
|
|
8463
|
-
/* @__PURE__ */
|
|
8476
|
+
entry && /* @__PURE__ */ import_react82.default.createElement("div", { className: "Layer__chart-of-accounts__form-edit-entry" }, /* @__PURE__ */ import_react82.default.createElement(Text, { weight: "bold" /* bold */ }, entry.name), /* @__PURE__ */ import_react82.default.createElement(Text, { weight: "bold" /* bold */ }, "$", centsToDollars(entry.balance || 0))),
|
|
8477
|
+
/* @__PURE__ */ import_react82.default.createElement("div", { className: "Layer__chart-of-accounts__form" }, /* @__PURE__ */ import_react82.default.createElement(InputGroup, { name: "parent", label: "Parent", inline: true }, /* @__PURE__ */ import_react82.default.createElement(
|
|
8464
8478
|
Select2,
|
|
8465
8479
|
{
|
|
8466
8480
|
options: parentOptions,
|
|
@@ -8468,7 +8482,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8468
8482
|
onChange: (sel) => changeFormData("parent", sel),
|
|
8469
8483
|
disabled: sendingForm
|
|
8470
8484
|
}
|
|
8471
|
-
)), /* @__PURE__ */
|
|
8485
|
+
)), /* @__PURE__ */ import_react82.default.createElement(InputGroup, { name: "name", label: "Name", inline: true }, /* @__PURE__ */ import_react82.default.createElement(
|
|
8472
8486
|
Input,
|
|
8473
8487
|
{
|
|
8474
8488
|
name: "name",
|
|
@@ -8479,7 +8493,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8479
8493
|
disabled: sendingForm,
|
|
8480
8494
|
onChange: (e) => changeFormData("name", e.target.value)
|
|
8481
8495
|
}
|
|
8482
|
-
)), /* @__PURE__ */
|
|
8496
|
+
)), /* @__PURE__ */ import_react82.default.createElement(InputGroup, { name: "type", label: "Type", inline: true }, /* @__PURE__ */ import_react82.default.createElement(
|
|
8483
8497
|
Select2,
|
|
8484
8498
|
{
|
|
8485
8499
|
options: LEDGER_ACCOUNT_TYPES,
|
|
@@ -8489,7 +8503,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8489
8503
|
errorMessage: form?.errors?.find((x) => x.field === "type")?.message,
|
|
8490
8504
|
disabled: sendingForm || form.action === "edit" || form.data.parent !== void 0
|
|
8491
8505
|
}
|
|
8492
|
-
)), /* @__PURE__ */
|
|
8506
|
+
)), /* @__PURE__ */ import_react82.default.createElement(InputGroup, { name: "subType", label: "Sub-Type", inline: true }, /* @__PURE__ */ import_react82.default.createElement(
|
|
8493
8507
|
Select2,
|
|
8494
8508
|
{
|
|
8495
8509
|
options: form?.data.type?.value !== void 0 ? LEDGER_ACCOUNT_SUBTYPES_FOR_TYPE[form?.data.type?.value] : LEDGER_ACCOUNT_SUBTYPES,
|
|
@@ -8497,7 +8511,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8497
8511
|
onChange: (sel) => changeFormData("subType", sel),
|
|
8498
8512
|
disabled: sendingForm
|
|
8499
8513
|
}
|
|
8500
|
-
)), /* @__PURE__ */
|
|
8514
|
+
)), /* @__PURE__ */ import_react82.default.createElement(InputGroup, { name: "normality", label: "Normality", inline: true }, /* @__PURE__ */ import_react82.default.createElement(
|
|
8501
8515
|
Select2,
|
|
8502
8516
|
{
|
|
8503
8517
|
options: NORMALITY_OPTIONS,
|
|
@@ -8517,7 +8531,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8517
8531
|
var ChartOfAccountsSidebar = ({
|
|
8518
8532
|
parentRef: _parentRef
|
|
8519
8533
|
}) => {
|
|
8520
|
-
return /* @__PURE__ */
|
|
8534
|
+
return /* @__PURE__ */ import_react83.default.createElement(ChartOfAccountsForm, null);
|
|
8521
8535
|
};
|
|
8522
8536
|
|
|
8523
8537
|
// src/components/ChartOfAccountsTable/ChartOfAccountsTable.tsx
|
|
@@ -8529,24 +8543,24 @@ var ChartOfAccountsTable = ({
|
|
|
8529
8543
|
withDateControl = false,
|
|
8530
8544
|
withExpandAllButton = false
|
|
8531
8545
|
}) => {
|
|
8532
|
-
const { data, isLoading, addAccount, error, isValidating, refetch, form } = (0,
|
|
8533
|
-
const [expandAll, setExpandAll] = (0,
|
|
8546
|
+
const { data, isLoading, addAccount, error, isValidating, refetch, form } = (0, import_react84.useContext)(ChartOfAccountsContext);
|
|
8547
|
+
const [expandAll, setExpandAll] = (0, import_react84.useState)();
|
|
8534
8548
|
let cumulativeIndex = 0;
|
|
8535
8549
|
const accountsLength = data?.accounts.length ?? 0;
|
|
8536
|
-
return /* @__PURE__ */
|
|
8550
|
+
return /* @__PURE__ */ import_react84.default.createElement(
|
|
8537
8551
|
Panel,
|
|
8538
8552
|
{
|
|
8539
|
-
sidebar: /* @__PURE__ */
|
|
8553
|
+
sidebar: /* @__PURE__ */ import_react84.default.createElement(ChartOfAccountsSidebar, { parentRef: containerRef }),
|
|
8540
8554
|
sidebarIsOpen: Boolean(form),
|
|
8541
8555
|
parentRef: containerRef
|
|
8542
8556
|
},
|
|
8543
|
-
/* @__PURE__ */
|
|
8557
|
+
/* @__PURE__ */ import_react84.default.createElement(
|
|
8544
8558
|
Header,
|
|
8545
8559
|
{
|
|
8546
8560
|
className: `Layer__${COMPONENT_NAME4}__header`,
|
|
8547
8561
|
layout: withDateControl ? "next-line-actions" /* NEXT_LINE_ACTIONS */ : void 0
|
|
8548
8562
|
},
|
|
8549
|
-
/* @__PURE__ */
|
|
8563
|
+
/* @__PURE__ */ import_react84.default.createElement(
|
|
8550
8564
|
Heading,
|
|
8551
8565
|
{
|
|
8552
8566
|
className: `Layer__${COMPONENT_NAME4}__title`,
|
|
@@ -8554,12 +8568,12 @@ var ChartOfAccountsTable = ({
|
|
|
8554
8568
|
},
|
|
8555
8569
|
"Chart of Accounts"
|
|
8556
8570
|
),
|
|
8557
|
-
/* @__PURE__ */
|
|
8571
|
+
/* @__PURE__ */ import_react84.default.createElement(
|
|
8558
8572
|
"div",
|
|
8559
8573
|
{
|
|
8560
8574
|
className: `Layer__${COMPONENT_NAME4}__actions Layer__header__actions`
|
|
8561
8575
|
},
|
|
8562
|
-
withDateControl || withExpandAllButton ? /* @__PURE__ */
|
|
8576
|
+
withDateControl || withExpandAllButton ? /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__header__actions-col" }, withDateControl && /* @__PURE__ */ import_react84.default.createElement(ChartOfAccountsDatePicker, null), withExpandAllButton && /* @__PURE__ */ import_react84.default.createElement(
|
|
8563
8577
|
Button,
|
|
8564
8578
|
{
|
|
8565
8579
|
variant: "secondary" /* secondary */,
|
|
@@ -8569,21 +8583,21 @@ var ChartOfAccountsTable = ({
|
|
|
8569
8583
|
},
|
|
8570
8584
|
!expandAll || expandAll === "collapsed" ? "Expand all rows" : "Collpase all rows"
|
|
8571
8585
|
)) : null,
|
|
8572
|
-
/* @__PURE__ */
|
|
8586
|
+
/* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__header__actions-col" }, /* @__PURE__ */ import_react84.default.createElement(
|
|
8573
8587
|
Button,
|
|
8574
8588
|
{
|
|
8575
8589
|
variant: "secondary" /* secondary */,
|
|
8576
8590
|
disabled: isLoading,
|
|
8577
|
-
rightIcon: /* @__PURE__ */
|
|
8591
|
+
rightIcon: /* @__PURE__ */ import_react84.default.createElement(DownloadCloud_default, { size: 12 })
|
|
8578
8592
|
},
|
|
8579
8593
|
"Download"
|
|
8580
|
-
), /* @__PURE__ */
|
|
8594
|
+
), /* @__PURE__ */ import_react84.default.createElement(Button, { onClick: () => addAccount(), disabled: isLoading }, "Add Account"))
|
|
8581
8595
|
)
|
|
8582
8596
|
),
|
|
8583
|
-
/* @__PURE__ */
|
|
8597
|
+
/* @__PURE__ */ import_react84.default.createElement("table", { className: "Layer__chart-of-accounts__table" }, /* @__PURE__ */ import_react84.default.createElement("thead", null, /* @__PURE__ */ import_react84.default.createElement("tr", { className: "Layer__table-row--header" }, /* @__PURE__ */ import_react84.default.createElement("th", { className: "Layer__table-header Layer__coa__name" }, "Name"), /* @__PURE__ */ import_react84.default.createElement("th", { className: "Layer__table-header Layer__coa__type" }, "Type"), /* @__PURE__ */ import_react84.default.createElement("th", { className: "Layer__table-header Layer__coa__subtype Layer__mobile--hidden" }, "Sub-Type"), /* @__PURE__ */ import_react84.default.createElement("th", { className: "Layer__table-header Layer__coa__balance" }, "Balance"), /* @__PURE__ */ import_react84.default.createElement("th", { className: "Layer__table-header Layer__coa__actions" }))), /* @__PURE__ */ import_react84.default.createElement("tbody", null, !error && data?.accounts.map((account, idx) => {
|
|
8584
8598
|
const currentCumulativeIndex = cumulativeIndex;
|
|
8585
8599
|
cumulativeIndex = (account.sub_accounts?.length || 0) + cumulativeIndex + 1;
|
|
8586
|
-
return /* @__PURE__ */
|
|
8600
|
+
return /* @__PURE__ */ import_react84.default.createElement(
|
|
8587
8601
|
ChartOfAccountsRow,
|
|
8588
8602
|
{
|
|
8589
8603
|
key: account.id,
|
|
@@ -8599,7 +8613,7 @@ var ChartOfAccountsTable = ({
|
|
|
8599
8613
|
}
|
|
8600
8614
|
);
|
|
8601
8615
|
}))),
|
|
8602
|
-
error ? /* @__PURE__ */
|
|
8616
|
+
error ? /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react84.default.createElement(
|
|
8603
8617
|
DataState,
|
|
8604
8618
|
{
|
|
8605
8619
|
status: "failed" /* failed */,
|
|
@@ -8609,8 +8623,8 @@ var ChartOfAccountsTable = ({
|
|
|
8609
8623
|
isLoading: isValidating || isLoading
|
|
8610
8624
|
}
|
|
8611
8625
|
)) : null,
|
|
8612
|
-
(!data || isLoading) && !error ? /* @__PURE__ */
|
|
8613
|
-
!isLoading && !error && data?.accounts.length === 0 ? /* @__PURE__ */
|
|
8626
|
+
(!data || isLoading) && !error ? /* @__PURE__ */ import_react84.default.createElement("div", { className: `Layer__${COMPONENT_NAME4}__loader-container` }, /* @__PURE__ */ import_react84.default.createElement(Loader2, null)) : null,
|
|
8627
|
+
!isLoading && !error && data?.accounts.length === 0 ? /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react84.default.createElement(
|
|
8614
8628
|
DataState,
|
|
8615
8629
|
{
|
|
8616
8630
|
status: "info" /* info */,
|
|
@@ -8624,20 +8638,20 @@ var ChartOfAccountsTable = ({
|
|
|
8624
8638
|
};
|
|
8625
8639
|
|
|
8626
8640
|
// src/components/LedgerAccount/LedgerAccountIndex.tsx
|
|
8627
|
-
var
|
|
8641
|
+
var import_react91 = __toESM(require("react"));
|
|
8628
8642
|
|
|
8629
8643
|
// src/components/LedgerAccountEntryDetails/LedgerAccountEntryDetails.tsx
|
|
8630
|
-
var
|
|
8644
|
+
var import_react89 = __toESM(require("react"));
|
|
8631
8645
|
|
|
8632
8646
|
// src/components/Card/Card.tsx
|
|
8633
|
-
var
|
|
8647
|
+
var import_react85 = __toESM(require("react"));
|
|
8634
8648
|
var import_classnames38 = __toESM(require("classnames"));
|
|
8635
8649
|
var Card = ({ children, className }) => {
|
|
8636
|
-
return /* @__PURE__ */
|
|
8650
|
+
return /* @__PURE__ */ import_react85.default.createElement("div", { className: (0, import_classnames38.default)("Layer__card", className) }, children);
|
|
8637
8651
|
};
|
|
8638
8652
|
|
|
8639
8653
|
// src/components/DateTime/DateTime.tsx
|
|
8640
|
-
var
|
|
8654
|
+
var import_react86 = __toESM(require("react"));
|
|
8641
8655
|
var import_date_fns19 = require("date-fns");
|
|
8642
8656
|
var DateTime = ({
|
|
8643
8657
|
value,
|
|
@@ -8648,11 +8662,11 @@ var DateTime = ({
|
|
|
8648
8662
|
onlyTime
|
|
8649
8663
|
}) => {
|
|
8650
8664
|
if (format7) {
|
|
8651
|
-
return /* @__PURE__ */
|
|
8665
|
+
return /* @__PURE__ */ import_react86.default.createElement(Text, { className: "Layer__datetime" }, (0, import_date_fns19.format)((0, import_date_fns19.parseISO)(value), format7));
|
|
8652
8666
|
}
|
|
8653
8667
|
const date = (0, import_date_fns19.format)((0, import_date_fns19.parseISO)(value), dateFormat ?? DATE_FORMAT);
|
|
8654
8668
|
const time = (0, import_date_fns19.format)((0, import_date_fns19.parseISO)(value), timeFormat ?? TIME_FORMAT);
|
|
8655
|
-
return /* @__PURE__ */
|
|
8669
|
+
return /* @__PURE__ */ import_react86.default.createElement(Text, { className: "Layer__datetime" }, !onlyTime && /* @__PURE__ */ import_react86.default.createElement(
|
|
8656
8670
|
Text,
|
|
8657
8671
|
{
|
|
8658
8672
|
as: "span",
|
|
@@ -8661,7 +8675,7 @@ var DateTime = ({
|
|
|
8661
8675
|
className: "Layer__datetime__date"
|
|
8662
8676
|
},
|
|
8663
8677
|
date
|
|
8664
|
-
), !onlyDate && /* @__PURE__ */
|
|
8678
|
+
), !onlyDate && /* @__PURE__ */ import_react86.default.createElement(
|
|
8665
8679
|
Text,
|
|
8666
8680
|
{
|
|
8667
8681
|
as: "span",
|
|
@@ -8674,7 +8688,7 @@ var DateTime = ({
|
|
|
8674
8688
|
};
|
|
8675
8689
|
|
|
8676
8690
|
// src/components/DetailsList/DetailsList.tsx
|
|
8677
|
-
var
|
|
8691
|
+
var import_react87 = __toESM(require("react"));
|
|
8678
8692
|
var import_classnames39 = __toESM(require("classnames"));
|
|
8679
8693
|
var DetailsList = ({
|
|
8680
8694
|
title,
|
|
@@ -8682,14 +8696,14 @@ var DetailsList = ({
|
|
|
8682
8696
|
className,
|
|
8683
8697
|
actions
|
|
8684
8698
|
}) => {
|
|
8685
|
-
return /* @__PURE__ */
|
|
8699
|
+
return /* @__PURE__ */ import_react87.default.createElement("div", { className: (0, import_classnames39.default)("Layer__details-list", className) }, title && /* @__PURE__ */ import_react87.default.createElement(Header, null, /* @__PURE__ */ import_react87.default.createElement(Heading, { size: "secondary" /* secondary */ }, title), actions && /* @__PURE__ */ import_react87.default.createElement("div", { className: "Layer__details-list__actions" }, actions)), /* @__PURE__ */ import_react87.default.createElement("ul", { className: "Layer__details-list__list" }, children));
|
|
8686
8700
|
};
|
|
8687
8701
|
|
|
8688
8702
|
// src/components/DetailsList/DetailsListItem.tsx
|
|
8689
|
-
var
|
|
8703
|
+
var import_react88 = __toESM(require("react"));
|
|
8690
8704
|
var renderValue = (value) => {
|
|
8691
8705
|
if (typeof value === "string") {
|
|
8692
|
-
return /* @__PURE__ */
|
|
8706
|
+
return /* @__PURE__ */ import_react88.default.createElement(Text, { weight: "bold" /* bold */, size: "sm" /* sm */ }, value);
|
|
8693
8707
|
}
|
|
8694
8708
|
return value;
|
|
8695
8709
|
};
|
|
@@ -8698,7 +8712,7 @@ var DetailsListItem = ({
|
|
|
8698
8712
|
children,
|
|
8699
8713
|
isLoading
|
|
8700
8714
|
}) => {
|
|
8701
|
-
return /* @__PURE__ */
|
|
8715
|
+
return /* @__PURE__ */ import_react88.default.createElement("li", { className: "Layer__details-list-item" }, /* @__PURE__ */ import_react88.default.createElement("label", { className: "Layer__details-list-item__label" }, label), /* @__PURE__ */ import_react88.default.createElement("span", { className: "Layer__details-list-item__value" }, isLoading ? /* @__PURE__ */ import_react88.default.createElement(SkeletonLoader, null) : renderValue(children)));
|
|
8702
8716
|
};
|
|
8703
8717
|
|
|
8704
8718
|
// src/components/LedgerAccountEntryDetails/LedgerAccountEntryDetails.tsx
|
|
@@ -8706,39 +8720,39 @@ var SourceDetailView = ({ source }) => {
|
|
|
8706
8720
|
switch (source.type) {
|
|
8707
8721
|
case "Transaction_Ledger_Entry_Source": {
|
|
8708
8722
|
const transactionSource = source;
|
|
8709
|
-
return /* @__PURE__ */
|
|
8723
|
+
return /* @__PURE__ */ import_react89.default.createElement(import_react89.default.Fragment, null, /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Account name" }, transactionSource.account_name), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Date" }, /* @__PURE__ */ import_react89.default.createElement(DateTime, { value: transactionSource.date })), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(transactionSource.amount)}`), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Direction" }, transactionSource.direction), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Counterparty" }, transactionSource.counterparty));
|
|
8710
8724
|
}
|
|
8711
8725
|
case "Invoice_Ledger_Entry_Source": {
|
|
8712
8726
|
const invoiceSource = source;
|
|
8713
|
-
return /* @__PURE__ */
|
|
8727
|
+
return /* @__PURE__ */ import_react89.default.createElement(import_react89.default.Fragment, null, /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Invoice number" }, invoiceSource.invoice_number), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Recipient name" }, invoiceSource.recipient_name), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Date" }, /* @__PURE__ */ import_react89.default.createElement(DateTime, { value: invoiceSource.date })), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(invoiceSource.amount)}`));
|
|
8714
8728
|
}
|
|
8715
8729
|
case "Manual_Ledger_Entry_Source": {
|
|
8716
8730
|
const manualSource = source;
|
|
8717
|
-
return /* @__PURE__ */
|
|
8731
|
+
return /* @__PURE__ */ import_react89.default.createElement(import_react89.default.Fragment, null, /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Memo" }, manualSource.memo), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Created by" }, manualSource.created_by));
|
|
8718
8732
|
}
|
|
8719
8733
|
case "Invoice_Payment_Ledger_Entry_Source": {
|
|
8720
8734
|
const invoicePaymentSource = source;
|
|
8721
|
-
return /* @__PURE__ */
|
|
8735
|
+
return /* @__PURE__ */ import_react89.default.createElement(import_react89.default.Fragment, null, /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Invoice number" }, invoicePaymentSource.invoice_number), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(invoicePaymentSource.amount)}`));
|
|
8722
8736
|
}
|
|
8723
8737
|
case "Refund_Ledger_Entry_Source": {
|
|
8724
8738
|
const refundSource = source;
|
|
8725
|
-
return /* @__PURE__ */
|
|
8739
|
+
return /* @__PURE__ */ import_react89.default.createElement(import_react89.default.Fragment, null, /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(refundSource.refunded_to_customer_amount)}`), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Recipient name" }, refundSource.recipient_name));
|
|
8726
8740
|
}
|
|
8727
8741
|
case "Opening_Balance_Ledger_Entry_Source": {
|
|
8728
8742
|
const openingBalanceSource = source;
|
|
8729
|
-
return /* @__PURE__ */
|
|
8743
|
+
return /* @__PURE__ */ import_react89.default.createElement(import_react89.default.Fragment, null, /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Account name" }, openingBalanceSource.account_name));
|
|
8730
8744
|
}
|
|
8731
8745
|
case "Payout_Ledger_Entry_Source": {
|
|
8732
8746
|
const payoutSource = source;
|
|
8733
|
-
return /* @__PURE__ */
|
|
8747
|
+
return /* @__PURE__ */ import_react89.default.createElement(import_react89.default.Fragment, null, /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(payoutSource.paid_out_amount)}`), /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Processor" }, payoutSource.processor));
|
|
8734
8748
|
}
|
|
8735
8749
|
default:
|
|
8736
8750
|
return null;
|
|
8737
8751
|
}
|
|
8738
8752
|
};
|
|
8739
8753
|
var LedgerAccountEntryDetails = () => {
|
|
8740
|
-
const { entryData, isLoadingEntry, closeSelectedEntry, errorEntry } = (0,
|
|
8741
|
-
const { totalDebit, totalCredit } = (0,
|
|
8754
|
+
const { entryData, isLoadingEntry, closeSelectedEntry, errorEntry } = (0, import_react89.useContext)(LedgerAccountsContext);
|
|
8755
|
+
const { totalDebit, totalCredit } = (0, import_react89.useMemo)(() => {
|
|
8742
8756
|
let totalDebit2 = 0;
|
|
8743
8757
|
let totalCredit2 = 0;
|
|
8744
8758
|
entryData?.line_items?.forEach((item) => {
|
|
@@ -8750,36 +8764,36 @@ var LedgerAccountEntryDetails = () => {
|
|
|
8750
8764
|
});
|
|
8751
8765
|
return { totalDebit: totalDebit2, totalCredit: totalCredit2 };
|
|
8752
8766
|
}, [entryData]);
|
|
8753
|
-
return /* @__PURE__ */
|
|
8767
|
+
return /* @__PURE__ */ import_react89.default.createElement("div", { className: "Layer__ledger-account__entry-details" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "Layer__ledger-account__entry-details__back-btn" }, /* @__PURE__ */ import_react89.default.createElement(BackButton, { onClick: () => closeSelectedEntry() })), /* @__PURE__ */ import_react89.default.createElement(
|
|
8754
8768
|
DetailsList,
|
|
8755
8769
|
{
|
|
8756
8770
|
title: "Transaction source",
|
|
8757
|
-
actions: /* @__PURE__ */
|
|
8771
|
+
actions: /* @__PURE__ */ import_react89.default.createElement(
|
|
8758
8772
|
IconButton,
|
|
8759
8773
|
{
|
|
8760
|
-
icon: /* @__PURE__ */
|
|
8774
|
+
icon: /* @__PURE__ */ import_react89.default.createElement(X_default, null),
|
|
8761
8775
|
onClick: () => closeSelectedEntry(),
|
|
8762
8776
|
className: "Layer__hidden-sm Layer__hidden-xs"
|
|
8763
8777
|
}
|
|
8764
8778
|
)
|
|
8765
8779
|
},
|
|
8766
|
-
/* @__PURE__ */
|
|
8767
|
-
entryData?.source?.display_description && /* @__PURE__ */
|
|
8768
|
-
), /* @__PURE__ */
|
|
8780
|
+
/* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Source", isLoading: isLoadingEntry }, /* @__PURE__ */ import_react89.default.createElement(Badge, null, entryData?.source?.entity_name)),
|
|
8781
|
+
entryData?.source?.display_description && /* @__PURE__ */ import_react89.default.createElement(SourceDetailView, { source: entryData?.source })
|
|
8782
|
+
), /* @__PURE__ */ import_react89.default.createElement(
|
|
8769
8783
|
DetailsList,
|
|
8770
8784
|
{
|
|
8771
8785
|
title: `Journal Entry ${entryData?.id.substring(0, 5)}`,
|
|
8772
8786
|
className: "Layer__border-top"
|
|
8773
8787
|
},
|
|
8774
|
-
/* @__PURE__ */
|
|
8775
|
-
/* @__PURE__ */
|
|
8776
|
-
/* @__PURE__ */
|
|
8777
|
-
entryData?.reversal_id && /* @__PURE__ */
|
|
8778
|
-
), !isLoadingEntry && !errorEntry ? /* @__PURE__ */
|
|
8788
|
+
/* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Entry type", isLoading: isLoadingEntry }, humanizeEnum(entryData?.entry_type ?? "")),
|
|
8789
|
+
/* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Date", isLoading: isLoadingEntry }, entryData?.entry_at && /* @__PURE__ */ import_react89.default.createElement(DateTime, { value: entryData?.entry_at })),
|
|
8790
|
+
/* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Creation date", isLoading: isLoadingEntry }, entryData?.date && /* @__PURE__ */ import_react89.default.createElement(DateTime, { value: entryData?.date })),
|
|
8791
|
+
entryData?.reversal_id && /* @__PURE__ */ import_react89.default.createElement(DetailsListItem, { label: "Reversal", isLoading: isLoadingEntry }, entryData?.reversal_id.substring(0, 5))
|
|
8792
|
+
), !isLoadingEntry && !errorEntry ? /* @__PURE__ */ import_react89.default.createElement("div", { className: "Layer__ledger-account__entry-details__line-items" }, /* @__PURE__ */ import_react89.default.createElement(Card, null, /* @__PURE__ */ import_react89.default.createElement("table", { className: "Layer__table Layer__ledger-account__entry-details__table" }, /* @__PURE__ */ import_react89.default.createElement("thead", null, /* @__PURE__ */ import_react89.default.createElement("tr", null, /* @__PURE__ */ import_react89.default.createElement("th", { className: "Layer__table-header" }, "Line items"), /* @__PURE__ */ import_react89.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react89.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"))), /* @__PURE__ */ import_react89.default.createElement("tbody", null, entryData?.line_items?.map((item) => /* @__PURE__ */ import_react89.default.createElement("tr", { key: `ledger-line-item-${item.id}` }, /* @__PURE__ */ import_react89.default.createElement("td", { className: "Layer__table-cell" }, item.account?.name || ""), /* @__PURE__ */ import_react89.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "DEBIT" /* DEBIT */ && /* @__PURE__ */ import_react89.default.createElement(Badge, { variant: "warning" /* WARNING */ }, "$", centsToDollars(item.amount || 0))), /* @__PURE__ */ import_react89.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "CREDIT" /* CREDIT */ && /* @__PURE__ */ import_react89.default.createElement(Badge, { variant: "success" /* SUCCESS */ }, "$", centsToDollars(item.amount || 0))))), /* @__PURE__ */ import_react89.default.createElement("tr", { className: "Layer__table Layer__ledger-account__entry-details__table__total-row" }, /* @__PURE__ */ import_react89.default.createElement("td", { className: "Layer__table-cell" }, "Total"), /* @__PURE__ */ import_react89.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(totalDebit || 0)), /* @__PURE__ */ import_react89.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(totalCredit || 0))))))) : null);
|
|
8779
8793
|
};
|
|
8780
8794
|
|
|
8781
8795
|
// src/components/LedgerAccount/LedgerAccountRow.tsx
|
|
8782
|
-
var
|
|
8796
|
+
var import_react90 = __toESM(require("react"));
|
|
8783
8797
|
var import_classnames40 = __toESM(require("classnames"));
|
|
8784
8798
|
var import_date_fns20 = require("date-fns");
|
|
8785
8799
|
var LedgerAccountRow = ({
|
|
@@ -8788,9 +8802,9 @@ var LedgerAccountRow = ({
|
|
|
8788
8802
|
initialLoad,
|
|
8789
8803
|
view
|
|
8790
8804
|
}) => {
|
|
8791
|
-
const { selectedEntryId, setSelectedEntryId, closeSelectedEntry } = (0,
|
|
8792
|
-
const [showComponent, setShowComponent] = (0,
|
|
8793
|
-
(0,
|
|
8805
|
+
const { selectedEntryId, setSelectedEntryId, closeSelectedEntry } = (0, import_react90.useContext)(LedgerAccountsContext);
|
|
8806
|
+
const [showComponent, setShowComponent] = (0, import_react90.useState)(false);
|
|
8807
|
+
(0, import_react90.useEffect)(() => {
|
|
8794
8808
|
if (initialLoad) {
|
|
8795
8809
|
const timeoutId = setTimeout(() => {
|
|
8796
8810
|
setShowComponent(true);
|
|
@@ -8801,7 +8815,7 @@ var LedgerAccountRow = ({
|
|
|
8801
8815
|
}
|
|
8802
8816
|
}, []);
|
|
8803
8817
|
if (view === "tablet") {
|
|
8804
|
-
return /* @__PURE__ */
|
|
8818
|
+
return /* @__PURE__ */ import_react90.default.createElement(
|
|
8805
8819
|
"tr",
|
|
8806
8820
|
{
|
|
8807
8821
|
className: (0, import_classnames40.default)(
|
|
@@ -8820,21 +8834,21 @@ var LedgerAccountRow = ({
|
|
|
8820
8834
|
}
|
|
8821
8835
|
}
|
|
8822
8836
|
},
|
|
8823
|
-
/* @__PURE__ */
|
|
8837
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ import_react90.default.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ import_react90.default.createElement(Text, null, row.date && (0, import_date_fns20.format)((0, import_date_fns20.parseISO)(row.date), DATE_FORMAT)), /* @__PURE__ */ import_react90.default.createElement(
|
|
8824
8838
|
Text,
|
|
8825
8839
|
{
|
|
8826
8840
|
weight: "normal" /* normal */,
|
|
8827
8841
|
className: "Layer__ledger_account-table__journal-id"
|
|
8828
8842
|
},
|
|
8829
8843
|
row.entry_id.substring(0, 5)
|
|
8830
|
-
)), /* @__PURE__ */
|
|
8831
|
-
/* @__PURE__ */
|
|
8832
|
-
/* @__PURE__ */
|
|
8833
|
-
/* @__PURE__ */
|
|
8844
|
+
)), /* @__PURE__ */ import_react90.default.createElement(Text, null, row.source?.display_description ?? ""))),
|
|
8845
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)),
|
|
8846
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)),
|
|
8847
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, `$${centsToDollars(row.running_balance)}`))
|
|
8834
8848
|
);
|
|
8835
8849
|
}
|
|
8836
8850
|
if (view === "mobile") {
|
|
8837
|
-
return /* @__PURE__ */
|
|
8851
|
+
return /* @__PURE__ */ import_react90.default.createElement(
|
|
8838
8852
|
"tr",
|
|
8839
8853
|
{
|
|
8840
8854
|
className: (0, import_classnames40.default)(
|
|
@@ -8853,17 +8867,17 @@ var LedgerAccountRow = ({
|
|
|
8853
8867
|
}
|
|
8854
8868
|
}
|
|
8855
8869
|
},
|
|
8856
|
-
/* @__PURE__ */
|
|
8870
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ import_react90.default.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ import_react90.default.createElement(Text, null, row.date && (0, import_date_fns20.format)((0, import_date_fns20.parseISO)(row.date), DATE_FORMAT)), /* @__PURE__ */ import_react90.default.createElement(
|
|
8857
8871
|
Text,
|
|
8858
8872
|
{
|
|
8859
8873
|
weight: "normal" /* normal */,
|
|
8860
8874
|
className: "Layer__ledger_account-table__journal-id"
|
|
8861
8875
|
},
|
|
8862
8876
|
row.entry_id.substring(0, 5)
|
|
8863
|
-
)), /* @__PURE__ */
|
|
8877
|
+
)), /* @__PURE__ */ import_react90.default.createElement(Text, null, row.source?.display_description ?? ""), /* @__PURE__ */ import_react90.default.createElement("div", { className: "Layer__ledger_account-table__balances-mobile" }, /* @__PURE__ */ import_react90.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Debit"), /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, " ", row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)), /* @__PURE__ */ import_react90.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Credit"), /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)), /* @__PURE__ */ import_react90.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Running balance"), /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, `$${centsToDollars(row.running_balance)}`)))))
|
|
8864
8878
|
);
|
|
8865
8879
|
}
|
|
8866
|
-
return /* @__PURE__ */
|
|
8880
|
+
return /* @__PURE__ */ import_react90.default.createElement(
|
|
8867
8881
|
"tr",
|
|
8868
8882
|
{
|
|
8869
8883
|
className: (0, import_classnames40.default)(
|
|
@@ -8882,12 +8896,12 @@ var LedgerAccountRow = ({
|
|
|
8882
8896
|
}
|
|
8883
8897
|
}
|
|
8884
8898
|
},
|
|
8885
|
-
/* @__PURE__ */
|
|
8886
|
-
/* @__PURE__ */
|
|
8887
|
-
/* @__PURE__ */
|
|
8888
|
-
/* @__PURE__ */
|
|
8889
|
-
/* @__PURE__ */
|
|
8890
|
-
/* @__PURE__ */
|
|
8899
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content" }, row.date && (0, import_date_fns20.format)((0, import_date_fns20.parseISO)(row.date), DATE_FORMAT))),
|
|
8900
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content" }, row.entry_id.substring(0, 5))),
|
|
8901
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content" }, row.source?.display_description ?? "")),
|
|
8902
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)),
|
|
8903
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)),
|
|
8904
|
+
/* @__PURE__ */ import_react90.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, `$${centsToDollars(row.running_balance)}`))
|
|
8891
8905
|
);
|
|
8892
8906
|
};
|
|
8893
8907
|
|
|
@@ -8898,9 +8912,9 @@ var LedgerAccount = ({
|
|
|
8898
8912
|
pageSize = 15,
|
|
8899
8913
|
view
|
|
8900
8914
|
}) => {
|
|
8901
|
-
const [currentPage, setCurrentPage] = (0,
|
|
8902
|
-
const [initialLoad, setInitialLoad] = (0,
|
|
8903
|
-
const { data: accountData } = (0,
|
|
8915
|
+
const [currentPage, setCurrentPage] = (0, import_react91.useState)(1);
|
|
8916
|
+
const [initialLoad, setInitialLoad] = (0, import_react91.useState)(true);
|
|
8917
|
+
const { data: accountData } = (0, import_react91.useContext)(ChartOfAccountsContext);
|
|
8904
8918
|
const {
|
|
8905
8919
|
data: rawData,
|
|
8906
8920
|
error,
|
|
@@ -8911,8 +8925,8 @@ var LedgerAccount = ({
|
|
|
8911
8925
|
selectedEntryId,
|
|
8912
8926
|
closeSelectedEntry,
|
|
8913
8927
|
refetch
|
|
8914
|
-
} = (0,
|
|
8915
|
-
(0,
|
|
8928
|
+
} = (0, import_react91.useContext)(LedgerAccountsContext);
|
|
8929
|
+
(0, import_react91.useEffect)(() => {
|
|
8916
8930
|
if (!isLoading) {
|
|
8917
8931
|
const timeoutLoad = setTimeout(() => {
|
|
8918
8932
|
setInitialLoad(false);
|
|
@@ -8924,12 +8938,12 @@ var LedgerAccount = ({
|
|
|
8924
8938
|
"Layer__ledger-account__index",
|
|
8925
8939
|
accountId && "open"
|
|
8926
8940
|
);
|
|
8927
|
-
const entry = (0,
|
|
8941
|
+
const entry = (0, import_react91.useMemo)(() => {
|
|
8928
8942
|
return flattenAccounts(accountData?.accounts || []).find(
|
|
8929
8943
|
(x) => x.id === accountId
|
|
8930
8944
|
);
|
|
8931
8945
|
}, [accountId]);
|
|
8932
|
-
const data = (0,
|
|
8946
|
+
const data = (0, import_react91.useMemo)(() => {
|
|
8933
8947
|
const firstPageIndex = (currentPage - 1) * pageSize;
|
|
8934
8948
|
const lastPageIndex = firstPageIndex + pageSize;
|
|
8935
8949
|
return rawData?.sort((a, b) => Date.parse(b.date) - Date.parse(a.date))?.slice(firstPageIndex, lastPageIndex);
|
|
@@ -8938,36 +8952,36 @@ var LedgerAccount = ({
|
|
|
8938
8952
|
setAccountId(void 0);
|
|
8939
8953
|
closeSelectedEntry();
|
|
8940
8954
|
};
|
|
8941
|
-
return /* @__PURE__ */
|
|
8955
|
+
return /* @__PURE__ */ import_react91.default.createElement(
|
|
8942
8956
|
Panel,
|
|
8943
8957
|
{
|
|
8944
|
-
sidebar: /* @__PURE__ */
|
|
8958
|
+
sidebar: /* @__PURE__ */ import_react91.default.createElement(LedgerAccountEntryDetails, null),
|
|
8945
8959
|
sidebarIsOpen: Boolean(selectedEntryId),
|
|
8946
8960
|
parentRef: containerRef,
|
|
8947
8961
|
className: "Layer__ledger-account__panel"
|
|
8948
8962
|
},
|
|
8949
|
-
/* @__PURE__ */
|
|
8963
|
+
/* @__PURE__ */ import_react91.default.createElement("div", { className: baseClassName }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "Layer__ledger-account__header" }, /* @__PURE__ */ import_react91.default.createElement(BackButton, { onClick: close }), /* @__PURE__ */ import_react91.default.createElement("div", { className: "Layer__ledger-account__title-container" }, /* @__PURE__ */ import_react91.default.createElement(
|
|
8950
8964
|
Text,
|
|
8951
8965
|
{
|
|
8952
8966
|
weight: "bold" /* bold */,
|
|
8953
8967
|
className: "Layer__ledger-account__title"
|
|
8954
8968
|
},
|
|
8955
8969
|
entry?.name ?? ""
|
|
8956
|
-
), /* @__PURE__ */
|
|
8970
|
+
), /* @__PURE__ */ import_react91.default.createElement(
|
|
8957
8971
|
Button,
|
|
8958
8972
|
{
|
|
8959
8973
|
variant: "secondary" /* secondary */,
|
|
8960
|
-
rightIcon: /* @__PURE__ */
|
|
8974
|
+
rightIcon: /* @__PURE__ */ import_react91.default.createElement(DownloadCloud_default, { size: 12 })
|
|
8961
8975
|
},
|
|
8962
8976
|
"Download"
|
|
8963
|
-
)), /* @__PURE__ */
|
|
8977
|
+
)), /* @__PURE__ */ import_react91.default.createElement("div", { className: "Layer__ledger-account__balance-container" }, /* @__PURE__ */ import_react91.default.createElement(
|
|
8964
8978
|
Text,
|
|
8965
8979
|
{
|
|
8966
8980
|
weight: "bold" /* bold */,
|
|
8967
8981
|
className: "Layer__ledger-account__balance-label"
|
|
8968
8982
|
},
|
|
8969
8983
|
"Current balance"
|
|
8970
|
-
), /* @__PURE__ */
|
|
8984
|
+
), /* @__PURE__ */ import_react91.default.createElement(
|
|
8971
8985
|
Text,
|
|
8972
8986
|
{
|
|
8973
8987
|
weight: "bold" /* bold */,
|
|
@@ -8975,7 +8989,7 @@ var LedgerAccount = ({
|
|
|
8975
8989
|
},
|
|
8976
8990
|
"$",
|
|
8977
8991
|
centsToDollars(entry?.balance || 0)
|
|
8978
|
-
))), /* @__PURE__ */
|
|
8992
|
+
))), /* @__PURE__ */ import_react91.default.createElement("table", { className: "Layer__table Layer__table--hover-effect Layer__ledger-account-table" }, /* @__PURE__ */ import_react91.default.createElement("thead", null, /* @__PURE__ */ import_react91.default.createElement("tr", null, view !== "desktop" && /* @__PURE__ */ import_react91.default.createElement("th", null), view === "desktop" && /* @__PURE__ */ import_react91.default.createElement(import_react91.default.Fragment, null, /* @__PURE__ */ import_react91.default.createElement("th", { className: "Layer__table-header" }, "Date"), /* @__PURE__ */ import_react91.default.createElement("th", { className: "Layer__table-header" }, "Journal id #"), /* @__PURE__ */ import_react91.default.createElement("th", { className: "Layer__table-header" }, "Source")), view !== "mobile" && /* @__PURE__ */ import_react91.default.createElement(import_react91.default.Fragment, null, /* @__PURE__ */ import_react91.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react91.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"), /* @__PURE__ */ import_react91.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Running balance")))), /* @__PURE__ */ import_react91.default.createElement("tbody", null, data?.map((x, index) => /* @__PURE__ */ import_react91.default.createElement(
|
|
8979
8993
|
LedgerAccountRow,
|
|
8980
8994
|
{
|
|
8981
8995
|
key: x.id,
|
|
@@ -8984,7 +8998,7 @@ var LedgerAccount = ({
|
|
|
8984
8998
|
initialLoad,
|
|
8985
8999
|
view
|
|
8986
9000
|
}
|
|
8987
|
-
)))), data && /* @__PURE__ */
|
|
9001
|
+
)))), data && /* @__PURE__ */ import_react91.default.createElement("div", { className: "Layer__ledger-account__pagination" }, /* @__PURE__ */ import_react91.default.createElement(
|
|
8988
9002
|
Pagination,
|
|
8989
9003
|
{
|
|
8990
9004
|
currentPage,
|
|
@@ -8992,7 +9006,7 @@ var LedgerAccount = ({
|
|
|
8992
9006
|
pageSize,
|
|
8993
9007
|
onPageChange: (page) => setCurrentPage(page)
|
|
8994
9008
|
}
|
|
8995
|
-
)), error ? /* @__PURE__ */
|
|
9009
|
+
)), error ? /* @__PURE__ */ import_react91.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react91.default.createElement(
|
|
8996
9010
|
DataState,
|
|
8997
9011
|
{
|
|
8998
9012
|
status: "failed" /* failed */,
|
|
@@ -9001,7 +9015,7 @@ var LedgerAccount = ({
|
|
|
9001
9015
|
onRefresh: () => refetch(),
|
|
9002
9016
|
isLoading: isValidating || isLoading
|
|
9003
9017
|
}
|
|
9004
|
-
)) : null, (!data || isLoading) && !error ? /* @__PURE__ */
|
|
9018
|
+
)) : null, (!data || isLoading) && !error ? /* @__PURE__ */ import_react91.default.createElement("div", { className: `Layer__ledger-account__loader-container` }, /* @__PURE__ */ import_react91.default.createElement(Loader2, null)) : null, !isLoading && !error && data?.length === 0 ? /* @__PURE__ */ import_react91.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react91.default.createElement(
|
|
9005
9019
|
DataState,
|
|
9006
9020
|
{
|
|
9007
9021
|
status: "info" /* info */,
|
|
@@ -9019,15 +9033,15 @@ var ChartOfAccounts = (props) => {
|
|
|
9019
9033
|
withDates: props.withDateControl
|
|
9020
9034
|
});
|
|
9021
9035
|
const ledgerAccountsContextData = useLedgerAccounts();
|
|
9022
|
-
return /* @__PURE__ */
|
|
9036
|
+
return /* @__PURE__ */ import_react92.default.createElement(ChartOfAccountsContext.Provider, { value: chartOfAccountsContextData }, /* @__PURE__ */ import_react92.default.createElement(LedgerAccountsContext.Provider, { value: ledgerAccountsContextData }, /* @__PURE__ */ import_react92.default.createElement(ChartOfAccountsContent, { ...props })));
|
|
9023
9037
|
};
|
|
9024
9038
|
var ChartOfAccountsContent = ({
|
|
9025
9039
|
asWidget,
|
|
9026
9040
|
withDateControl,
|
|
9027
9041
|
withExpandAllButton
|
|
9028
9042
|
}) => {
|
|
9029
|
-
const { accountId } = (0,
|
|
9030
|
-
const [view, setView] = (0,
|
|
9043
|
+
const { accountId } = (0, import_react92.useContext)(LedgerAccountsContext);
|
|
9044
|
+
const [view, setView] = (0, import_react92.useState)("desktop");
|
|
9031
9045
|
const containerRef = useElementSize((_a, _b, { width }) => {
|
|
9032
9046
|
if (width) {
|
|
9033
9047
|
if (width >= BREAKPOINTS.TABLET && view !== "desktop") {
|
|
@@ -9039,7 +9053,7 @@ var ChartOfAccountsContent = ({
|
|
|
9039
9053
|
}
|
|
9040
9054
|
}
|
|
9041
9055
|
});
|
|
9042
|
-
return /* @__PURE__ */
|
|
9056
|
+
return /* @__PURE__ */ import_react92.default.createElement(Container, { name: "chart-of-accounts", ref: containerRef, asWidget }, accountId ? /* @__PURE__ */ import_react92.default.createElement(LedgerAccount, { view, containerRef }) : /* @__PURE__ */ import_react92.default.createElement(
|
|
9043
9057
|
ChartOfAccountsTable,
|
|
9044
9058
|
{
|
|
9045
9059
|
asWidget,
|
|
@@ -9052,9 +9066,9 @@ var ChartOfAccountsContent = ({
|
|
|
9052
9066
|
};
|
|
9053
9067
|
|
|
9054
9068
|
// src/providers/LayerProvider/LayerProvider.tsx
|
|
9055
|
-
var
|
|
9069
|
+
var import_react93 = __toESM(require("react"));
|
|
9056
9070
|
var import_date_fns21 = require("date-fns");
|
|
9057
|
-
var
|
|
9071
|
+
var import_swr8 = __toESM(require("swr"));
|
|
9058
9072
|
var reducer = (state, action) => {
|
|
9059
9073
|
switch (action.type) {
|
|
9060
9074
|
case "LayerContext.setAuth" /* setAuth */:
|
|
@@ -9095,7 +9109,7 @@ var LayerProvider = ({
|
|
|
9095
9109
|
};
|
|
9096
9110
|
const colors = buildColorsPalette(theme);
|
|
9097
9111
|
const { url, scope, apiUrl } = LayerEnvironment[environment];
|
|
9098
|
-
const [state, dispatch] = (0,
|
|
9112
|
+
const [state, dispatch] = (0, import_react93.useReducer)(reducer, {
|
|
9099
9113
|
auth: {
|
|
9100
9114
|
access_token: "",
|
|
9101
9115
|
token_type: "",
|
|
@@ -9109,7 +9123,7 @@ var LayerProvider = ({
|
|
|
9109
9123
|
colors,
|
|
9110
9124
|
onboardingStep: void 0
|
|
9111
9125
|
});
|
|
9112
|
-
const { data: auth } = appId !== void 0 && appSecret !== void 0 ? (0,
|
|
9126
|
+
const { data: auth } = appId !== void 0 && appSecret !== void 0 ? (0, import_swr8.default)(
|
|
9113
9127
|
businessAccessToken === void 0 && appId !== void 0 && appSecret !== void 0 && (0, import_date_fns21.isBefore)(state.auth.expires_at, /* @__PURE__ */ new Date()) && "authenticate",
|
|
9114
9128
|
Layer.authenticate({
|
|
9115
9129
|
appId,
|
|
@@ -9119,7 +9133,7 @@ var LayerProvider = ({
|
|
|
9119
9133
|
}),
|
|
9120
9134
|
defaultSWRConfig
|
|
9121
9135
|
) : { data: void 0 };
|
|
9122
|
-
(0,
|
|
9136
|
+
(0, import_react93.useEffect)(() => {
|
|
9123
9137
|
if (businessAccessToken) {
|
|
9124
9138
|
dispatch({
|
|
9125
9139
|
type: "LayerContext.setAuth" /* setAuth */,
|
|
@@ -9144,7 +9158,7 @@ var LayerProvider = ({
|
|
|
9144
9158
|
});
|
|
9145
9159
|
}
|
|
9146
9160
|
}, [businessAccessToken, auth?.access_token]);
|
|
9147
|
-
(0,
|
|
9161
|
+
(0, import_swr8.default)(
|
|
9148
9162
|
businessId && auth?.access_token && `categories-${businessId}`,
|
|
9149
9163
|
Layer.getCategories(apiUrl, auth?.access_token, { params: { businessId } }),
|
|
9150
9164
|
{
|
|
@@ -9197,7 +9211,7 @@ var LayerProvider = ({
|
|
|
9197
9211
|
type: "LayerContext.setOnboardingStep" /* setOnboardingStep */,
|
|
9198
9212
|
payload: { onboardingStep: value }
|
|
9199
9213
|
});
|
|
9200
|
-
return /* @__PURE__ */
|
|
9214
|
+
return /* @__PURE__ */ import_react93.default.createElement(import_swr8.SWRConfig, { value: defaultSWRConfig }, /* @__PURE__ */ import_react93.default.createElement(
|
|
9201
9215
|
LayerContext.Provider,
|
|
9202
9216
|
{
|
|
9203
9217
|
value: {
|
|
@@ -9215,11 +9229,11 @@ var LayerProvider = ({
|
|
|
9215
9229
|
};
|
|
9216
9230
|
|
|
9217
9231
|
// src/components/Journal/Journal.tsx
|
|
9218
|
-
var
|
|
9232
|
+
var import_react102 = __toESM(require("react"));
|
|
9219
9233
|
|
|
9220
9234
|
// src/contexts/JournalContext/JournalContext.tsx
|
|
9221
|
-
var
|
|
9222
|
-
var JournalContext = (0,
|
|
9235
|
+
var import_react94 = require("react");
|
|
9236
|
+
var JournalContext = (0, import_react94.createContext)({
|
|
9223
9237
|
data: void 0,
|
|
9224
9238
|
isLoading: false,
|
|
9225
9239
|
error: void 0,
|
|
@@ -9252,16 +9266,16 @@ var JournalContext = (0, import_react93.createContext)({
|
|
|
9252
9266
|
});
|
|
9253
9267
|
|
|
9254
9268
|
// src/hooks/useJournal/useJournal.tsx
|
|
9255
|
-
var
|
|
9256
|
-
var
|
|
9269
|
+
var import_react95 = require("react");
|
|
9270
|
+
var import_swr9 = __toESM(require("swr"));
|
|
9257
9271
|
var useJournal = () => {
|
|
9258
9272
|
const { auth, businessId, apiUrl } = useLayerContext();
|
|
9259
|
-
const [selectedEntryId, setSelectedEntryId] = (0,
|
|
9260
|
-
const [form, setForm] = (0,
|
|
9261
|
-
const [addingEntry, setAddingEntry] = (0,
|
|
9262
|
-
const [sendingForm, setSendingForm] = (0,
|
|
9263
|
-
const [apiError, setApiError] = (0,
|
|
9264
|
-
const { data, isLoading, isValidating, error, mutate } = (0,
|
|
9273
|
+
const [selectedEntryId, setSelectedEntryId] = (0, import_react95.useState)();
|
|
9274
|
+
const [form, setForm] = (0, import_react95.useState)();
|
|
9275
|
+
const [addingEntry, setAddingEntry] = (0, import_react95.useState)(false);
|
|
9276
|
+
const [sendingForm, setSendingForm] = (0, import_react95.useState)(false);
|
|
9277
|
+
const [apiError, setApiError] = (0, import_react95.useState)(void 0);
|
|
9278
|
+
const { data, isLoading, isValidating, error, mutate } = (0, import_swr9.default)(
|
|
9265
9279
|
businessId && auth?.access_token && `journal-lines-${businessId}`,
|
|
9266
9280
|
Layer.getJournal(apiUrl, auth?.access_token, {
|
|
9267
9281
|
params: { businessId }
|
|
@@ -9513,10 +9527,10 @@ var useJournal = () => {
|
|
|
9513
9527
|
var flattenEntries = (entries) => entries.flatMap((a) => [a, flattenEntries(a.line_items || [])]).flat().filter((id) => id);
|
|
9514
9528
|
|
|
9515
9529
|
// src/components/JournalTable/JournalTable.tsx
|
|
9516
|
-
var
|
|
9530
|
+
var import_react101 = __toESM(require("react"));
|
|
9517
9531
|
|
|
9518
9532
|
// src/components/JournalRow/JournalRow.tsx
|
|
9519
|
-
var
|
|
9533
|
+
var import_react96 = __toESM(require("react"));
|
|
9520
9534
|
var import_classnames42 = __toESM(require("classnames"));
|
|
9521
9535
|
var import_date_fns22 = require("date-fns");
|
|
9522
9536
|
var INDENTATION2 = 24;
|
|
@@ -9542,8 +9556,8 @@ var JournalRow = ({
|
|
|
9542
9556
|
cumulativeIndex = 0,
|
|
9543
9557
|
selectedEntries = false
|
|
9544
9558
|
}) => {
|
|
9545
|
-
const { selectedEntryId, setSelectedEntryId, closeSelectedEntry } = (0,
|
|
9546
|
-
const [isOpen, setIsOpen] = (0,
|
|
9559
|
+
const { selectedEntryId, setSelectedEntryId, closeSelectedEntry } = (0, import_react96.useContext)(JournalContext);
|
|
9560
|
+
const [isOpen, setIsOpen] = (0, import_react96.useState)(index === 0 ? true : defaultOpen);
|
|
9547
9561
|
const style = expanded ? {
|
|
9548
9562
|
...EXPANDED_STYLE2,
|
|
9549
9563
|
transitionDelay: `${15 * index}ms`
|
|
@@ -9551,7 +9565,7 @@ var JournalRow = ({
|
|
|
9551
9565
|
...COLLAPSED_STYLE2,
|
|
9552
9566
|
transitionDelay: `${lineItemsLength - 15 * index}ms`
|
|
9553
9567
|
};
|
|
9554
|
-
const [showComponent, setShowComponent] = (0,
|
|
9568
|
+
const [showComponent, setShowComponent] = (0, import_react96.useState)(false);
|
|
9555
9569
|
const baseClass = (0, import_classnames42.default)(
|
|
9556
9570
|
"Layer__journal-table-row",
|
|
9557
9571
|
row.id === selectedEntryId && "Layer__table-row--active",
|
|
@@ -9569,7 +9583,7 @@ var JournalRow = ({
|
|
|
9569
9583
|
"Layer__journal-line__table-row",
|
|
9570
9584
|
!expanded && "Layer__table-row--hidden"
|
|
9571
9585
|
);
|
|
9572
|
-
(0,
|
|
9586
|
+
(0, import_react96.useEffect)(() => {
|
|
9573
9587
|
if (initialLoad) {
|
|
9574
9588
|
const timeoutId = setTimeout(() => {
|
|
9575
9589
|
setShowComponent(true);
|
|
@@ -9580,7 +9594,7 @@ var JournalRow = ({
|
|
|
9580
9594
|
}
|
|
9581
9595
|
}, []);
|
|
9582
9596
|
if ("line_items" in row) {
|
|
9583
|
-
return /* @__PURE__ */
|
|
9597
|
+
return /* @__PURE__ */ import_react96.default.createElement(import_react96.default.Fragment, null, /* @__PURE__ */ import_react96.default.createElement(
|
|
9584
9598
|
"tr",
|
|
9585
9599
|
{
|
|
9586
9600
|
className: baseClass,
|
|
@@ -9594,7 +9608,7 @@ var JournalRow = ({
|
|
|
9594
9608
|
}
|
|
9595
9609
|
}
|
|
9596
9610
|
},
|
|
9597
|
-
/* @__PURE__ */
|
|
9611
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell Layer__journal__arrow" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ import_react96.default.createElement(
|
|
9598
9612
|
"span",
|
|
9599
9613
|
{
|
|
9600
9614
|
className: "Layer__table-cell-content-indentation",
|
|
@@ -9607,32 +9621,32 @@ var JournalRow = ({
|
|
|
9607
9621
|
setIsOpen(!isOpen);
|
|
9608
9622
|
}
|
|
9609
9623
|
},
|
|
9610
|
-
row.line_items && row.line_items.length > 0 && /* @__PURE__ */
|
|
9624
|
+
row.line_items && row.line_items.length > 0 && /* @__PURE__ */ import_react96.default.createElement(
|
|
9611
9625
|
ChevronDownFill_default,
|
|
9612
9626
|
{
|
|
9613
9627
|
size: 16,
|
|
9614
9628
|
className: "Layer__table__expand-icon",
|
|
9615
9629
|
style: {
|
|
9616
|
-
transform: isOpen ? "rotate(0deg)" : "rotate(
|
|
9630
|
+
transform: isOpen ? "rotate(0deg)" : "rotate(-90deg)"
|
|
9617
9631
|
}
|
|
9618
9632
|
}
|
|
9619
9633
|
)
|
|
9620
9634
|
))),
|
|
9621
|
-
/* @__PURE__ */
|
|
9622
|
-
/* @__PURE__ */
|
|
9623
|
-
/* @__PURE__ */
|
|
9624
|
-
/* @__PURE__ */
|
|
9625
|
-
/* @__PURE__ */
|
|
9635
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content" }, row.id.substring(0, 5))),
|
|
9636
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content" }, row.date && (0, import_date_fns22.format)((0, import_date_fns22.parseISO)(row.date), DATE_FORMAT))),
|
|
9637
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content" }, humanizeEnum(row.entry_type))),
|
|
9638
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content" }, `(${row.line_items.length})`)),
|
|
9639
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, "$", centsToDollars(
|
|
9626
9640
|
Math.abs(
|
|
9627
9641
|
row.line_items.filter((item) => item.direction === "DEBIT").map((item) => item.amount).reduce((a, b) => a + b, 0)
|
|
9628
9642
|
)
|
|
9629
9643
|
))),
|
|
9630
|
-
/* @__PURE__ */
|
|
9644
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, "$", centsToDollars(
|
|
9631
9645
|
Math.abs(
|
|
9632
9646
|
row.line_items.filter((item) => item.direction === "CREDIT").map((item) => item.amount).reduce((a, b) => a + b, 0)
|
|
9633
9647
|
)
|
|
9634
9648
|
)))
|
|
9635
|
-
), (row.line_items || []).map((lineItem, idx) => /* @__PURE__ */
|
|
9649
|
+
), (row.line_items || []).map((lineItem, idx) => /* @__PURE__ */ import_react96.default.createElement(
|
|
9636
9650
|
JournalRow,
|
|
9637
9651
|
{
|
|
9638
9652
|
key: lineItem.id,
|
|
@@ -9647,18 +9661,18 @@ var JournalRow = ({
|
|
|
9647
9661
|
}
|
|
9648
9662
|
)));
|
|
9649
9663
|
}
|
|
9650
|
-
return /* @__PURE__ */
|
|
9664
|
+
return /* @__PURE__ */ import_react96.default.createElement(
|
|
9651
9665
|
"tr",
|
|
9652
9666
|
{
|
|
9653
9667
|
className: journalEntryLineClass,
|
|
9654
9668
|
style: { transitionDelay: `${15 * index}ms` }
|
|
9655
9669
|
},
|
|
9656
|
-
/* @__PURE__ */
|
|
9657
|
-
/* @__PURE__ */
|
|
9658
|
-
/* @__PURE__ */
|
|
9659
|
-
/* @__PURE__ */
|
|
9660
|
-
/* @__PURE__ */
|
|
9661
|
-
/* @__PURE__ */
|
|
9670
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content", style })),
|
|
9671
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content", style }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-hidden" }, row.id.substring(0, 5)))),
|
|
9672
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell" }),
|
|
9673
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell" }),
|
|
9674
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react96.default.createElement("span", { className: "Layer__table-cell-content", style }, row.account.name)),
|
|
9675
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, row.direction === "DEBIT" && /* @__PURE__ */ import_react96.default.createElement(
|
|
9662
9676
|
"span",
|
|
9663
9677
|
{
|
|
9664
9678
|
className: "Layer__table-cell-content Layer__table-cell--amount",
|
|
@@ -9667,7 +9681,7 @@ var JournalRow = ({
|
|
|
9667
9681
|
"$",
|
|
9668
9682
|
centsToDollars(Math.abs(row.amount))
|
|
9669
9683
|
)),
|
|
9670
|
-
/* @__PURE__ */
|
|
9684
|
+
/* @__PURE__ */ import_react96.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, row.direction === "CREDIT" && /* @__PURE__ */ import_react96.default.createElement(
|
|
9671
9685
|
"span",
|
|
9672
9686
|
{
|
|
9673
9687
|
className: "Layer__table-cell-content Layer__table-cell--amount",
|
|
@@ -9680,10 +9694,10 @@ var JournalRow = ({
|
|
|
9680
9694
|
};
|
|
9681
9695
|
|
|
9682
9696
|
// src/components/JournalSidebar/JournalSidebar.tsx
|
|
9683
|
-
var
|
|
9697
|
+
var import_react100 = __toESM(require("react"));
|
|
9684
9698
|
|
|
9685
9699
|
// src/components/JournalEntryDetails/JournalEntryDetails.tsx
|
|
9686
|
-
var
|
|
9700
|
+
var import_react97 = __toESM(require("react"));
|
|
9687
9701
|
var JournalEntryDetails = () => {
|
|
9688
9702
|
const {
|
|
9689
9703
|
data,
|
|
@@ -9691,29 +9705,29 @@ var JournalEntryDetails = () => {
|
|
|
9691
9705
|
errorEntry,
|
|
9692
9706
|
closeSelectedEntry,
|
|
9693
9707
|
selectedEntryId
|
|
9694
|
-
} = (0,
|
|
9695
|
-
const entry = (0,
|
|
9708
|
+
} = (0, import_react97.useContext)(JournalContext);
|
|
9709
|
+
const entry = (0, import_react97.useMemo)(() => {
|
|
9696
9710
|
if (selectedEntryId && data) {
|
|
9697
9711
|
return flattenEntries(data || []).find((x) => x.id === selectedEntryId);
|
|
9698
9712
|
}
|
|
9699
9713
|
return;
|
|
9700
9714
|
}, [data, selectedEntryId]);
|
|
9701
|
-
return /* @__PURE__ */
|
|
9715
|
+
return /* @__PURE__ */ import_react97.default.createElement("div", { className: "Layer__journal__entry-details" }, /* @__PURE__ */ import_react97.default.createElement(
|
|
9702
9716
|
DetailsList,
|
|
9703
9717
|
{
|
|
9704
9718
|
className: "Layer__journal__entry-details__title",
|
|
9705
9719
|
title: `Journal Entry #${entry?.id.substring(0, 5)}`,
|
|
9706
|
-
actions: /* @__PURE__ */
|
|
9720
|
+
actions: /* @__PURE__ */ import_react97.default.createElement("div", { className: "Layer__journal__entry-details__back-btn" }, /* @__PURE__ */ import_react97.default.createElement(CloseButton, { onClick: () => closeSelectedEntry() }))
|
|
9707
9721
|
},
|
|
9708
|
-
/* @__PURE__ */
|
|
9709
|
-
/* @__PURE__ */
|
|
9710
|
-
/* @__PURE__ */
|
|
9711
|
-
entry?.reversal_id && /* @__PURE__ */
|
|
9712
|
-
), !isLoadingEntry && !errorEntry ? /* @__PURE__ */
|
|
9722
|
+
/* @__PURE__ */ import_react97.default.createElement(DetailsListItem, { label: "Entry type", isLoading: isLoadingEntry }, humanizeEnum(entry?.entry_type ?? "")),
|
|
9723
|
+
/* @__PURE__ */ import_react97.default.createElement(DetailsListItem, { label: "Date", isLoading: isLoadingEntry }, entry?.entry_at && /* @__PURE__ */ import_react97.default.createElement(DateTime, { value: entry?.entry_at })),
|
|
9724
|
+
/* @__PURE__ */ import_react97.default.createElement(DetailsListItem, { label: "Creation date", isLoading: isLoadingEntry }, entry?.date && /* @__PURE__ */ import_react97.default.createElement(DateTime, { value: entry?.date })),
|
|
9725
|
+
entry?.reversal_id && /* @__PURE__ */ import_react97.default.createElement(DetailsListItem, { label: "Reversal", isLoading: isLoadingEntry }, "Journal Entry #", entry?.reversal_id)
|
|
9726
|
+
), !isLoadingEntry && !errorEntry ? /* @__PURE__ */ import_react97.default.createElement("div", { className: "Layer__ledger-account__entry-details__line-items" }, /* @__PURE__ */ import_react97.default.createElement(Card, null, /* @__PURE__ */ import_react97.default.createElement("table", { className: "Layer__table Layer__ledger-account__entry-details__table" }, /* @__PURE__ */ import_react97.default.createElement("thead", null, /* @__PURE__ */ import_react97.default.createElement("tr", null, /* @__PURE__ */ import_react97.default.createElement("th", { className: "Layer__table-header" }, "Line items"), /* @__PURE__ */ import_react97.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react97.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"))), /* @__PURE__ */ import_react97.default.createElement("tbody", null, entry?.line_items?.map((item) => /* @__PURE__ */ import_react97.default.createElement("tr", { key: `ledger-line-item-${item.id}` }, /* @__PURE__ */ import_react97.default.createElement("td", { className: "Layer__table-cell" }, item.account?.name || ""), /* @__PURE__ */ import_react97.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "DEBIT" /* DEBIT */ && /* @__PURE__ */ import_react97.default.createElement(Badge, { variant: "warning" /* WARNING */ }, "$", centsToDollars(item.amount || 0))), /* @__PURE__ */ import_react97.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "CREDIT" /* CREDIT */ && /* @__PURE__ */ import_react97.default.createElement(Badge, { variant: "success" /* SUCCESS */ }, "$", centsToDollars(item.amount || 0))))), /* @__PURE__ */ import_react97.default.createElement("tr", { className: "Layer__table Layer__ledger-account__entry-details__table__total-row" }, /* @__PURE__ */ import_react97.default.createElement("td", { className: "Layer__table-cell" }, "Total"), /* @__PURE__ */ import_react97.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(
|
|
9713
9727
|
Math.abs(
|
|
9714
9728
|
entry?.line_items.filter((item) => item.direction === "DEBIT").map((item) => item.amount).reduce((a, b) => a + b, 0)
|
|
9715
9729
|
) || 0
|
|
9716
|
-
)), /* @__PURE__ */
|
|
9730
|
+
)), /* @__PURE__ */ import_react97.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(
|
|
9717
9731
|
Math.abs(
|
|
9718
9732
|
entry?.line_items.filter((item) => item.direction === "CREDIT").map((item) => item.amount).reduce((a, b) => a + b, 0)
|
|
9719
9733
|
) || 0
|
|
@@ -9721,10 +9735,10 @@ var JournalEntryDetails = () => {
|
|
|
9721
9735
|
};
|
|
9722
9736
|
|
|
9723
9737
|
// src/components/JournalForm/JournalForm.tsx
|
|
9724
|
-
var
|
|
9738
|
+
var import_react99 = __toESM(require("react"));
|
|
9725
9739
|
|
|
9726
9740
|
// src/components/JournalForm/JournalFormEntryLines.tsx
|
|
9727
|
-
var
|
|
9741
|
+
var import_react98 = __toESM(require("react"));
|
|
9728
9742
|
var JournalFormEntryLines = ({
|
|
9729
9743
|
entrylineItems,
|
|
9730
9744
|
addEntryLine,
|
|
@@ -9733,17 +9747,17 @@ var JournalFormEntryLines = ({
|
|
|
9733
9747
|
sendingForm,
|
|
9734
9748
|
config
|
|
9735
9749
|
}) => {
|
|
9736
|
-
const { data: accountsData } = (0,
|
|
9737
|
-
const { form } = (0,
|
|
9750
|
+
const { data: accountsData } = (0, import_react98.useContext)(ChartOfAccountsContext);
|
|
9751
|
+
const { form } = (0, import_react98.useContext)(JournalContext);
|
|
9738
9752
|
const parentOptions = useParentOptions(accountsData);
|
|
9739
|
-
return /* @__PURE__ */
|
|
9740
|
-
return /* @__PURE__ */
|
|
9753
|
+
return /* @__PURE__ */ import_react98.default.createElement(import_react98.default.Fragment, null, Object.keys(Direction).map((direction, idx) => {
|
|
9754
|
+
return /* @__PURE__ */ import_react98.default.createElement(
|
|
9741
9755
|
"div",
|
|
9742
9756
|
{
|
|
9743
9757
|
key: "Layer__journal__form__input-group-" + idx,
|
|
9744
9758
|
className: "Layer__journal__form__input-group Layer__journal__form__input-group__border"
|
|
9745
9759
|
},
|
|
9746
|
-
/* @__PURE__ */
|
|
9760
|
+
/* @__PURE__ */ import_react98.default.createElement(
|
|
9747
9761
|
Text,
|
|
9748
9762
|
{
|
|
9749
9763
|
className: "Layer__journal__form__input-group__title",
|
|
@@ -9757,13 +9771,13 @@ var JournalFormEntryLines = ({
|
|
|
9757
9771
|
if (item.direction !== direction) {
|
|
9758
9772
|
return null;
|
|
9759
9773
|
}
|
|
9760
|
-
return /* @__PURE__ */
|
|
9774
|
+
return /* @__PURE__ */ import_react98.default.createElement(
|
|
9761
9775
|
"div",
|
|
9762
9776
|
{
|
|
9763
9777
|
className: "Layer__journal__form__input-group__line-item",
|
|
9764
9778
|
key: direction + "-" + idx2
|
|
9765
9779
|
},
|
|
9766
|
-
/* @__PURE__ */
|
|
9780
|
+
/* @__PURE__ */ import_react98.default.createElement(InputGroup, { name: direction, label: "Amount", inline: true }, /* @__PURE__ */ import_react98.default.createElement(
|
|
9767
9781
|
InputWithBadge,
|
|
9768
9782
|
{
|
|
9769
9783
|
name: direction,
|
|
@@ -9789,14 +9803,14 @@ var JournalFormEntryLines = ({
|
|
|
9789
9803
|
)?.message
|
|
9790
9804
|
}
|
|
9791
9805
|
)),
|
|
9792
|
-
/* @__PURE__ */
|
|
9806
|
+
/* @__PURE__ */ import_react98.default.createElement(
|
|
9793
9807
|
InputGroup,
|
|
9794
9808
|
{
|
|
9795
9809
|
name: "account-name",
|
|
9796
9810
|
label: "Account name",
|
|
9797
9811
|
inline: true
|
|
9798
9812
|
},
|
|
9799
|
-
/* @__PURE__ */
|
|
9813
|
+
/* @__PURE__ */ import_react98.default.createElement(
|
|
9800
9814
|
Select2,
|
|
9801
9815
|
{
|
|
9802
9816
|
options: parentOptions,
|
|
@@ -9820,18 +9834,18 @@ var JournalFormEntryLines = ({
|
|
|
9820
9834
|
)?.message
|
|
9821
9835
|
}
|
|
9822
9836
|
),
|
|
9823
|
-
idx2 >= 2 && /* @__PURE__ */
|
|
9837
|
+
idx2 >= 2 && /* @__PURE__ */ import_react98.default.createElement(
|
|
9824
9838
|
IconButton,
|
|
9825
9839
|
{
|
|
9826
9840
|
className: "Layer__remove__button",
|
|
9827
9841
|
onClick: () => removeEntryLine(idx2),
|
|
9828
|
-
icon: /* @__PURE__ */
|
|
9842
|
+
icon: /* @__PURE__ */ import_react98.default.createElement(Trash_default, null)
|
|
9829
9843
|
}
|
|
9830
9844
|
)
|
|
9831
9845
|
)
|
|
9832
9846
|
);
|
|
9833
9847
|
}),
|
|
9834
|
-
(config.form.addEntryLinesLimit === void 0 || config.form.addEntryLinesLimit > entrylineItems?.length) && /* @__PURE__ */
|
|
9848
|
+
(config.form.addEntryLinesLimit === void 0 || config.form.addEntryLinesLimit > entrylineItems?.length) && /* @__PURE__ */ import_react98.default.createElement(
|
|
9835
9849
|
TextButton,
|
|
9836
9850
|
{
|
|
9837
9851
|
className: "Layer__journal__add-entry-line",
|
|
@@ -9854,8 +9868,8 @@ var JournalForm = ({ config }) => {
|
|
|
9854
9868
|
changeFormData,
|
|
9855
9869
|
addEntryLine,
|
|
9856
9870
|
removeEntryLine
|
|
9857
|
-
} = (0,
|
|
9858
|
-
return /* @__PURE__ */
|
|
9871
|
+
} = (0, import_react99.useContext)(JournalContext);
|
|
9872
|
+
return /* @__PURE__ */ import_react99.default.createElement(
|
|
9859
9873
|
"form",
|
|
9860
9874
|
{
|
|
9861
9875
|
className: "Layer__form",
|
|
@@ -9864,7 +9878,7 @@ var JournalForm = ({ config }) => {
|
|
|
9864
9878
|
submitForm();
|
|
9865
9879
|
}
|
|
9866
9880
|
},
|
|
9867
|
-
/* @__PURE__ */
|
|
9881
|
+
/* @__PURE__ */ import_react99.default.createElement("div", { className: "Layer__journal__sidebar__header" }, /* @__PURE__ */ import_react99.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, "Add New Entry"), /* @__PURE__ */ import_react99.default.createElement("div", { className: "actions" }, /* @__PURE__ */ import_react99.default.createElement(
|
|
9868
9882
|
Button,
|
|
9869
9883
|
{
|
|
9870
9884
|
type: "button",
|
|
@@ -9873,7 +9887,7 @@ var JournalForm = ({ config }) => {
|
|
|
9873
9887
|
disabled: sendingForm
|
|
9874
9888
|
},
|
|
9875
9889
|
"Cancel"
|
|
9876
|
-
), apiError && /* @__PURE__ */
|
|
9890
|
+
), apiError && /* @__PURE__ */ import_react99.default.createElement(
|
|
9877
9891
|
RetryButton,
|
|
9878
9892
|
{
|
|
9879
9893
|
type: "submit",
|
|
@@ -9882,7 +9896,7 @@ var JournalForm = ({ config }) => {
|
|
|
9882
9896
|
disabled: sendingForm
|
|
9883
9897
|
},
|
|
9884
9898
|
"Retry"
|
|
9885
|
-
), !apiError && /* @__PURE__ */
|
|
9899
|
+
), !apiError && /* @__PURE__ */ import_react99.default.createElement(
|
|
9886
9900
|
SubmitButton,
|
|
9887
9901
|
{
|
|
9888
9902
|
type: "submit",
|
|
@@ -9892,7 +9906,7 @@ var JournalForm = ({ config }) => {
|
|
|
9892
9906
|
},
|
|
9893
9907
|
"Save"
|
|
9894
9908
|
))),
|
|
9895
|
-
apiError && /* @__PURE__ */
|
|
9909
|
+
apiError && /* @__PURE__ */ import_react99.default.createElement(
|
|
9896
9910
|
Text,
|
|
9897
9911
|
{
|
|
9898
9912
|
size: "sm" /* sm */,
|
|
@@ -9900,7 +9914,7 @@ var JournalForm = ({ config }) => {
|
|
|
9900
9914
|
},
|
|
9901
9915
|
apiError
|
|
9902
9916
|
),
|
|
9903
|
-
/* @__PURE__ */
|
|
9917
|
+
/* @__PURE__ */ import_react99.default.createElement("div", { className: "Layer__journal__form__input-group" }, /* @__PURE__ */ import_react99.default.createElement(InputGroup, { name: "date", label: "Date", inline: true }, /* @__PURE__ */ import_react99.default.createElement("div", { className: "Layer__journal__datepicker__wrapper" }, /* @__PURE__ */ import_react99.default.createElement(
|
|
9904
9918
|
DateInput,
|
|
9905
9919
|
{
|
|
9906
9920
|
selected: form?.data.entry_at,
|
|
@@ -9908,7 +9922,7 @@ var JournalForm = ({ config }) => {
|
|
|
9908
9922
|
dateFormat: "MMMM d, yyyy",
|
|
9909
9923
|
placeholderText: "Select date"
|
|
9910
9924
|
}
|
|
9911
|
-
), /* @__PURE__ */
|
|
9925
|
+
), /* @__PURE__ */ import_react99.default.createElement(
|
|
9912
9926
|
DateInput,
|
|
9913
9927
|
{
|
|
9914
9928
|
selected: form?.data.entry_at,
|
|
@@ -9921,7 +9935,7 @@ var JournalForm = ({ config }) => {
|
|
|
9921
9935
|
placeholderText: "Select time"
|
|
9922
9936
|
}
|
|
9923
9937
|
)))),
|
|
9924
|
-
/* @__PURE__ */
|
|
9938
|
+
/* @__PURE__ */ import_react99.default.createElement(
|
|
9925
9939
|
JournalFormEntryLines,
|
|
9926
9940
|
{
|
|
9927
9941
|
entrylineItems: form?.data.line_items || [],
|
|
@@ -9932,7 +9946,7 @@ var JournalForm = ({ config }) => {
|
|
|
9932
9946
|
config
|
|
9933
9947
|
}
|
|
9934
9948
|
),
|
|
9935
|
-
/* @__PURE__ */
|
|
9949
|
+
/* @__PURE__ */ import_react99.default.createElement("div", { className: "Layer__journal__form__input-group Layer__journal__form__input-group__textarea" }, /* @__PURE__ */ import_react99.default.createElement(InputGroup, { name: "memo", label: "Notes" }, /* @__PURE__ */ import_react99.default.createElement(
|
|
9936
9950
|
Textarea,
|
|
9937
9951
|
{
|
|
9938
9952
|
name: "memo",
|
|
@@ -9950,11 +9964,11 @@ var JournalSidebar = ({
|
|
|
9950
9964
|
parentRef: _parentRef,
|
|
9951
9965
|
config
|
|
9952
9966
|
}) => {
|
|
9953
|
-
const { selectedEntryId } = (0,
|
|
9967
|
+
const { selectedEntryId } = (0, import_react100.useContext)(JournalContext);
|
|
9954
9968
|
if (selectedEntryId !== "new") {
|
|
9955
|
-
return /* @__PURE__ */
|
|
9969
|
+
return /* @__PURE__ */ import_react100.default.createElement(JournalEntryDetails, null);
|
|
9956
9970
|
}
|
|
9957
|
-
return /* @__PURE__ */
|
|
9971
|
+
return /* @__PURE__ */ import_react100.default.createElement(JournalForm, { config });
|
|
9958
9972
|
};
|
|
9959
9973
|
|
|
9960
9974
|
// src/components/JournalTable/JournalTable.tsx
|
|
@@ -9965,7 +9979,7 @@ var JournalTable = ({
|
|
|
9965
9979
|
pageSize = 15,
|
|
9966
9980
|
config
|
|
9967
9981
|
}) => {
|
|
9968
|
-
const [currentPage, setCurrentPage] = (0,
|
|
9982
|
+
const [currentPage, setCurrentPage] = (0, import_react101.useState)(1);
|
|
9969
9983
|
const {
|
|
9970
9984
|
data: rawData,
|
|
9971
9985
|
isLoading,
|
|
@@ -9974,30 +9988,30 @@ var JournalTable = ({
|
|
|
9974
9988
|
refetch,
|
|
9975
9989
|
selectedEntryId,
|
|
9976
9990
|
addEntry
|
|
9977
|
-
} = (0,
|
|
9978
|
-
const data = (0,
|
|
9991
|
+
} = (0, import_react101.useContext)(JournalContext);
|
|
9992
|
+
const data = (0, import_react101.useMemo)(() => {
|
|
9979
9993
|
const firstPageIndex = (currentPage - 1) * pageSize;
|
|
9980
9994
|
const lastPageIndex = firstPageIndex + pageSize;
|
|
9981
9995
|
return rawData?.sort((a, b) => Date.parse(b.date) - Date.parse(a.date))?.slice(firstPageIndex, lastPageIndex);
|
|
9982
9996
|
}, [rawData, currentPage]);
|
|
9983
|
-
return /* @__PURE__ */
|
|
9997
|
+
return /* @__PURE__ */ import_react101.default.createElement(
|
|
9984
9998
|
Panel,
|
|
9985
9999
|
{
|
|
9986
|
-
sidebar: /* @__PURE__ */
|
|
10000
|
+
sidebar: /* @__PURE__ */ import_react101.default.createElement(JournalSidebar, { parentRef: containerRef, config }),
|
|
9987
10001
|
sidebarIsOpen: Boolean(selectedEntryId),
|
|
9988
10002
|
parentRef: containerRef
|
|
9989
10003
|
},
|
|
9990
|
-
/* @__PURE__ */
|
|
10004
|
+
/* @__PURE__ */ import_react101.default.createElement(Header, { className: `Layer__${COMPONENT_NAME5}__header` }, /* @__PURE__ */ import_react101.default.createElement(Heading, { className: `Layer__${COMPONENT_NAME5}__title` }, "Journal"), /* @__PURE__ */ import_react101.default.createElement("div", { className: `Layer__${COMPONENT_NAME5}__actions` }, /* @__PURE__ */ import_react101.default.createElement(
|
|
9991
10005
|
Button,
|
|
9992
10006
|
{
|
|
9993
10007
|
variant: "secondary" /* secondary */,
|
|
9994
10008
|
disabled: isLoading,
|
|
9995
|
-
rightIcon: /* @__PURE__ */
|
|
10009
|
+
rightIcon: /* @__PURE__ */ import_react101.default.createElement(DownloadCloud_default, { size: 12 })
|
|
9996
10010
|
},
|
|
9997
10011
|
"Download"
|
|
9998
|
-
), /* @__PURE__ */
|
|
9999
|
-
/* @__PURE__ */
|
|
10000
|
-
return /* @__PURE__ */
|
|
10012
|
+
), /* @__PURE__ */ import_react101.default.createElement(Button, { onClick: () => addEntry(), disabled: isLoading }, "Add Entry"))),
|
|
10013
|
+
/* @__PURE__ */ import_react101.default.createElement("table", { className: "Layer__table Layer__table--hover-effect Layer__journal__table" }, /* @__PURE__ */ import_react101.default.createElement("thead", null, /* @__PURE__ */ import_react101.default.createElement("tr", null, /* @__PURE__ */ import_react101.default.createElement("th", { className: "Layer__table-header" }), /* @__PURE__ */ import_react101.default.createElement("th", { className: "Layer__table-header" }, "Id"), /* @__PURE__ */ import_react101.default.createElement("th", { className: "Layer__table-header" }, "Date"), /* @__PURE__ */ import_react101.default.createElement("th", { className: "Layer__table-header" }, "Transaction"), /* @__PURE__ */ import_react101.default.createElement("th", { className: "Layer__table-header" }, "Account"), /* @__PURE__ */ import_react101.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react101.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"))), /* @__PURE__ */ import_react101.default.createElement("tbody", null, !error && data?.map((entry, idx) => {
|
|
10014
|
+
return /* @__PURE__ */ import_react101.default.createElement(
|
|
10001
10015
|
JournalRow,
|
|
10002
10016
|
{
|
|
10003
10017
|
key: "journal-row-" + idx + entry.id,
|
|
@@ -10007,7 +10021,7 @@ var JournalTable = ({
|
|
|
10007
10021
|
}
|
|
10008
10022
|
);
|
|
10009
10023
|
}))),
|
|
10010
|
-
data && /* @__PURE__ */
|
|
10024
|
+
data && /* @__PURE__ */ import_react101.default.createElement("div", { className: "Layer__journal__pagination" }, /* @__PURE__ */ import_react101.default.createElement(
|
|
10011
10025
|
Pagination,
|
|
10012
10026
|
{
|
|
10013
10027
|
currentPage,
|
|
@@ -10016,7 +10030,7 @@ var JournalTable = ({
|
|
|
10016
10030
|
onPageChange: (page) => setCurrentPage(page)
|
|
10017
10031
|
}
|
|
10018
10032
|
)),
|
|
10019
|
-
error ? /* @__PURE__ */
|
|
10033
|
+
error ? /* @__PURE__ */ import_react101.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react101.default.createElement(
|
|
10020
10034
|
DataState,
|
|
10021
10035
|
{
|
|
10022
10036
|
status: "failed" /* failed */,
|
|
@@ -10026,7 +10040,7 @@ var JournalTable = ({
|
|
|
10026
10040
|
isLoading: isValidating || isLoading
|
|
10027
10041
|
}
|
|
10028
10042
|
)) : null,
|
|
10029
|
-
(!data || isLoading) && !error ? /* @__PURE__ */
|
|
10043
|
+
(!data || isLoading) && !error ? /* @__PURE__ */ import_react101.default.createElement("div", { className: `Layer__${COMPONENT_NAME5}__loader-container` }, /* @__PURE__ */ import_react101.default.createElement(Loader2, null)) : null
|
|
10030
10044
|
);
|
|
10031
10045
|
};
|
|
10032
10046
|
|
|
@@ -10039,13 +10053,13 @@ var JOURNAL_CONFIG = {
|
|
|
10039
10053
|
var Journal = (props) => {
|
|
10040
10054
|
const JournalContextData = useJournal();
|
|
10041
10055
|
const AccountsContextData = useChartOfAccounts();
|
|
10042
|
-
return /* @__PURE__ */
|
|
10056
|
+
return /* @__PURE__ */ import_react102.default.createElement(ChartOfAccountsContext.Provider, { value: AccountsContextData }, /* @__PURE__ */ import_react102.default.createElement(JournalContext.Provider, { value: JournalContextData }, /* @__PURE__ */ import_react102.default.createElement(JournalContent, { ...props })));
|
|
10043
10057
|
};
|
|
10044
10058
|
var JournalContent = ({
|
|
10045
10059
|
asWidget,
|
|
10046
10060
|
config = JOURNAL_CONFIG
|
|
10047
10061
|
}) => {
|
|
10048
|
-
const [view, setView] = (0,
|
|
10062
|
+
const [view, setView] = (0, import_react102.useState)("desktop");
|
|
10049
10063
|
const containerRef = useElementSize((_a, _b, { width }) => {
|
|
10050
10064
|
if (width) {
|
|
10051
10065
|
if (width >= BREAKPOINTS.TABLET && view !== "desktop") {
|
|
@@ -10057,18 +10071,18 @@ var JournalContent = ({
|
|
|
10057
10071
|
}
|
|
10058
10072
|
}
|
|
10059
10073
|
});
|
|
10060
|
-
return /* @__PURE__ */
|
|
10074
|
+
return /* @__PURE__ */ import_react102.default.createElement(Container, { name: "journal", ref: containerRef, asWidget }, /* @__PURE__ */ import_react102.default.createElement(JournalTable, { view, containerRef, config }));
|
|
10061
10075
|
};
|
|
10062
10076
|
|
|
10063
10077
|
// src/components/Onboarding/Onboarding.tsx
|
|
10064
|
-
var
|
|
10078
|
+
var import_react106 = __toESM(require("react"));
|
|
10065
10079
|
|
|
10066
10080
|
// src/components/Onboarding/ConnectAccount.tsx
|
|
10067
|
-
var
|
|
10081
|
+
var import_react105 = __toESM(require("react"));
|
|
10068
10082
|
|
|
10069
10083
|
// src/icons/CreditCard.tsx
|
|
10070
|
-
var
|
|
10071
|
-
var CreditCard = ({ size = 12, ...props }) => /* @__PURE__ */
|
|
10084
|
+
var React113 = __toESM(require("react"));
|
|
10085
|
+
var CreditCard = ({ size = 12, ...props }) => /* @__PURE__ */ React113.createElement(
|
|
10072
10086
|
"svg",
|
|
10073
10087
|
{
|
|
10074
10088
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -10078,7 +10092,7 @@ var CreditCard = ({ size = 12, ...props }) => /* @__PURE__ */ React112.createEle
|
|
|
10078
10092
|
width: size,
|
|
10079
10093
|
height: size
|
|
10080
10094
|
},
|
|
10081
|
-
/* @__PURE__ */
|
|
10095
|
+
/* @__PURE__ */ React113.createElement(
|
|
10082
10096
|
"path",
|
|
10083
10097
|
{
|
|
10084
10098
|
d: "M10.5 2H1.5C0.947715 2 0.5 2.44772 0.5 3V9C0.5 9.55228 0.947715 10 1.5 10H10.5C11.0523 10 11.5 9.55228 11.5 9V3C11.5 2.44772 11.0523 2 10.5 2Z",
|
|
@@ -10087,7 +10101,7 @@ var CreditCard = ({ size = 12, ...props }) => /* @__PURE__ */ React112.createEle
|
|
|
10087
10101
|
strokeLinejoin: "round"
|
|
10088
10102
|
}
|
|
10089
10103
|
),
|
|
10090
|
-
/* @__PURE__ */
|
|
10104
|
+
/* @__PURE__ */ React113.createElement(
|
|
10091
10105
|
"path",
|
|
10092
10106
|
{
|
|
10093
10107
|
d: "M0.5 5H11.5",
|
|
@@ -10100,8 +10114,8 @@ var CreditCard = ({ size = 12, ...props }) => /* @__PURE__ */ React112.createEle
|
|
|
10100
10114
|
var CreditCard_default = CreditCard;
|
|
10101
10115
|
|
|
10102
10116
|
// src/icons/Folder.tsx
|
|
10103
|
-
var
|
|
10104
|
-
var Folder = ({ size = 12, ...props }) => /* @__PURE__ */
|
|
10117
|
+
var React114 = __toESM(require("react"));
|
|
10118
|
+
var Folder = ({ size = 12, ...props }) => /* @__PURE__ */ React114.createElement(
|
|
10105
10119
|
"svg",
|
|
10106
10120
|
{
|
|
10107
10121
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -10111,7 +10125,7 @@ var Folder = ({ size = 12, ...props }) => /* @__PURE__ */ React113.createElement
|
|
|
10111
10125
|
width: size,
|
|
10112
10126
|
height: size
|
|
10113
10127
|
},
|
|
10114
|
-
/* @__PURE__ */
|
|
10128
|
+
/* @__PURE__ */ React114.createElement(
|
|
10115
10129
|
"path",
|
|
10116
10130
|
{
|
|
10117
10131
|
d: "M11 9.5C11 9.76522 10.8946 10.0196 10.7071 10.2071C10.5196 10.3946 10.2652 10.5 10 10.5H2C1.73478 10.5 1.48043 10.3946 1.29289 10.2071C1.10536 10.0196 1 9.76522 1 9.5V2.5C1 2.23478 1.10536 1.98043 1.29289 1.79289C1.48043 1.60536 1.73478 1.5 2 1.5H4.5L5.5 3H10C10.2652 3 10.5196 3.10536 10.7071 3.29289C10.8946 3.48043 11 3.73478 11 4V9.5Z",
|
|
@@ -10124,8 +10138,8 @@ var Folder = ({ size = 12, ...props }) => /* @__PURE__ */ React113.createElement
|
|
|
10124
10138
|
var Folder_default = Folder;
|
|
10125
10139
|
|
|
10126
10140
|
// src/icons/Link.tsx
|
|
10127
|
-
var
|
|
10128
|
-
var Link = ({ size = 18, ...props }) => /* @__PURE__ */
|
|
10141
|
+
var React115 = __toESM(require("react"));
|
|
10142
|
+
var Link = ({ size = 18, ...props }) => /* @__PURE__ */ React115.createElement(
|
|
10129
10143
|
"svg",
|
|
10130
10144
|
{
|
|
10131
10145
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -10135,7 +10149,7 @@ var Link = ({ size = 18, ...props }) => /* @__PURE__ */ React114.createElement(
|
|
|
10135
10149
|
width: size,
|
|
10136
10150
|
height: size
|
|
10137
10151
|
},
|
|
10138
|
-
/* @__PURE__ */
|
|
10152
|
+
/* @__PURE__ */ React115.createElement(
|
|
10139
10153
|
"path",
|
|
10140
10154
|
{
|
|
10141
10155
|
d: "M7.5 9.75C7.82209 10.1806 8.23302 10.5369 8.70491 10.7947C9.17681 11.0525 9.69863 11.2058 10.235 11.2442C10.7713 11.2827 11.3097 11.2053 11.8135 11.0173C12.3173 10.8294 12.7748 10.5353 13.155 10.155L15.405 7.905C16.0881 7.19774 16.4661 6.25048 16.4575 5.26724C16.449 4.284 16.0546 3.34346 15.3593 2.64818C14.664 1.9529 13.7235 1.55851 12.7403 1.54997C11.757 1.54143 10.8098 1.9194 10.1025 2.6025L8.8125 3.885",
|
|
@@ -10144,7 +10158,7 @@ var Link = ({ size = 18, ...props }) => /* @__PURE__ */ React114.createElement(
|
|
|
10144
10158
|
strokeLinejoin: "round"
|
|
10145
10159
|
}
|
|
10146
10160
|
),
|
|
10147
|
-
/* @__PURE__ */
|
|
10161
|
+
/* @__PURE__ */ React115.createElement(
|
|
10148
10162
|
"path",
|
|
10149
10163
|
{
|
|
10150
10164
|
d: "M10.5 8.25C10.1779 7.8194 9.76698 7.46311 9.29508 7.2053C8.82319 6.94748 8.30137 6.79416 7.76501 6.75575C7.22865 6.71734 6.69031 6.79473 6.18649 6.98266C5.68267 7.1706 5.22516 7.4647 4.845 7.845L2.595 10.095C1.9119 10.8023 1.53393 11.7495 1.54247 12.7328C1.55101 13.716 1.9454 14.6565 2.64068 15.3518C3.33596 16.0471 4.2765 16.4415 5.25974 16.45C6.24298 16.4586 7.19024 16.0806 7.8975 15.3975L9.18 14.115",
|
|
@@ -10157,9 +10171,9 @@ var Link = ({ size = 18, ...props }) => /* @__PURE__ */ React114.createElement(
|
|
|
10157
10171
|
var Link_default = Link;
|
|
10158
10172
|
|
|
10159
10173
|
// src/icons/PlaidIcon.tsx
|
|
10160
|
-
var
|
|
10174
|
+
var import_react103 = __toESM(require("react"));
|
|
10161
10175
|
var PlaidIcon = () => {
|
|
10162
|
-
return /* @__PURE__ */
|
|
10176
|
+
return /* @__PURE__ */ import_react103.default.createElement(
|
|
10163
10177
|
"img",
|
|
10164
10178
|
{
|
|
10165
10179
|
src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAhCAYAAAC4JqlRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAQDSURBVHgB7VbpK65bFP+9XJTMJGPGDIVIpjIln2S4SIr4AxSOIZFwPxA+HUf5rhAZb3xQylCUizKLD+I1ROYpZcq+e63u+9S5t573XN1z3nvr/or97GVba+3fmrYGf8DBwSHx/f09VH7a4DvD2Nj414uLi1X61tAvOzu7z0KIT/iB0Gg0bdfX12UaafyTNP4ZBoB0okxja2u7L789YRhoyQEBA8IIBsZ/0wF7e3tYWVkpe2tra8hQ4iP46VsOWVpaIiYmBrGxsYiKikJERASWl5eRnZ0NU1NT9PX1ISwsDCsrK5iZmcHi4iKmpqbw+vqqV7feJCwsLERbW5uyX19fx/7+PjIyMrC5uQkTExP4+/tjZGQEvr6+CA4OVs6Wlpaiq6sLqiAH1H4GBgaEDqmpqYq8qalJkdfX1yvyrKwscXd3x/L+/n6hT79eBnZ3d3F6egobGxtInUhPT8f9/T3fWHfb7e1tpKSk8JmxsTGWPT4+wsnJCV5eXqoEqCYhUSo7JXp6epCWlkadC5OTkxgaGmLjFRUVKC8vR2BgIEZHR9k4OUlnJXOcnO7u7vhwCKqqqpjKxMRE3tOqQ3Nzs3KutbWVZU9PT0IywbKEhASW1dbWqoZAlQHKbEJISAiXXnt7O+/Pz8+Rn58PDw8PeHp6Ii8vDzLuMDMzQ0tLC988Li6Oz/r5+X2cARcXF7G1tcU3OTk54bWyslJIx8Tx8bGQ00wcHR2Jw8NDERoaKsrKyviMzBleZcUIZ2dnVQb0VkF0dLR4fn5mhbLeFXlBQYESDsnAX6rm5eWF/1efflUHXF1d+RY6BuSDRRQXF/NtdTe/ubnhb5JVV1d/xYCsDuHm5vZxB2QTYUU1NTVCxprDQU6QUR3tFA5y4OzsTKHdx8dHyOrgfW9v78eTcGdnh9e5uTlOMukI3t7euN47OztxcHAArVaL7u5uODo68lnJEGRuYHWVX1zcntWgOguothsbG5GcnIyHhwd0dHRA3hS3t7eoq6vD5eUlzM3NIalnQ9R0qPVSs4qPj2cd09PTaib0zwLq+9QJLSwseE/KZQgwPj6OgIAAlm1sbPBsIGbIaWpGxJisIm5matA7jicmJtgQ1XZJSQlTTsplbJUzw8PDzAr9raioiLtfUFAQT0R90DuOZ2dnkZOTwyOZDK2trWFvbw+ZmZk8AygnGhoaIBMS3t7eX01Dyh19+KY3IY3cpKQkREZGQrZjZfbn5ubyzB8cHER4eDiWlpawsLDAhufn5zlv/hEH/gzdZKRQEIgdephcXV3h7+L/V/G/wgEtDAetkUymLzAQyLaxfMX8JtspPeqj8QMhn3dfZEf9RaMTyNIKNTIy+hnfGXKa3splVXbOGdr/DtMw0L76HoUPAAAAAElFTkSuQmCC",
|
|
@@ -10170,8 +10184,8 @@ var PlaidIcon = () => {
|
|
|
10170
10184
|
var PlaidIcon_default = PlaidIcon;
|
|
10171
10185
|
|
|
10172
10186
|
// src/icons/Sunrise.tsx
|
|
10173
|
-
var
|
|
10174
|
-
var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */
|
|
10187
|
+
var React117 = __toESM(require("react"));
|
|
10188
|
+
var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React117.createElement(
|
|
10175
10189
|
"svg",
|
|
10176
10190
|
{
|
|
10177
10191
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -10181,7 +10195,7 @@ var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React116.createElemen
|
|
|
10181
10195
|
width: size,
|
|
10182
10196
|
height: size
|
|
10183
10197
|
},
|
|
10184
|
-
/* @__PURE__ */
|
|
10198
|
+
/* @__PURE__ */ React117.createElement(
|
|
10185
10199
|
"path",
|
|
10186
10200
|
{
|
|
10187
10201
|
d: "M8.5 9C8.5 8.33696 8.23661 7.70107 7.76777 7.23223C7.29893 6.76339 6.66304 6.5 6 6.5C5.33696 6.5 4.70107 6.76339 4.23223 7.23223C3.76339 7.70107 3.5 8.33696 3.5 9",
|
|
@@ -10190,7 +10204,7 @@ var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React116.createElemen
|
|
|
10190
10204
|
strokeLinejoin: "round"
|
|
10191
10205
|
}
|
|
10192
10206
|
),
|
|
10193
|
-
/* @__PURE__ */
|
|
10207
|
+
/* @__PURE__ */ React117.createElement(
|
|
10194
10208
|
"path",
|
|
10195
10209
|
{
|
|
10196
10210
|
d: "M6 3.3335V4.66683",
|
|
@@ -10199,7 +10213,7 @@ var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React116.createElemen
|
|
|
10199
10213
|
strokeLinejoin: "round"
|
|
10200
10214
|
}
|
|
10201
10215
|
),
|
|
10202
|
-
/* @__PURE__ */
|
|
10216
|
+
/* @__PURE__ */ React117.createElement(
|
|
10203
10217
|
"path",
|
|
10204
10218
|
{
|
|
10205
10219
|
d: "M2.11 5.10986L2.82 5.81986",
|
|
@@ -10208,7 +10222,7 @@ var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React116.createElemen
|
|
|
10208
10222
|
strokeLinejoin: "round"
|
|
10209
10223
|
}
|
|
10210
10224
|
),
|
|
10211
|
-
/* @__PURE__ */
|
|
10225
|
+
/* @__PURE__ */ React117.createElement(
|
|
10212
10226
|
"path",
|
|
10213
10227
|
{
|
|
10214
10228
|
d: "M0.5 9H1.5",
|
|
@@ -10217,7 +10231,7 @@ var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React116.createElemen
|
|
|
10217
10231
|
strokeLinejoin: "round"
|
|
10218
10232
|
}
|
|
10219
10233
|
),
|
|
10220
|
-
/* @__PURE__ */
|
|
10234
|
+
/* @__PURE__ */ React117.createElement(
|
|
10221
10235
|
"path",
|
|
10222
10236
|
{
|
|
10223
10237
|
d: "M10.5 9H11.5",
|
|
@@ -10226,7 +10240,7 @@ var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React116.createElemen
|
|
|
10226
10240
|
strokeLinejoin: "round"
|
|
10227
10241
|
}
|
|
10228
10242
|
),
|
|
10229
|
-
/* @__PURE__ */
|
|
10243
|
+
/* @__PURE__ */ React117.createElement(
|
|
10230
10244
|
"path",
|
|
10231
10245
|
{
|
|
10232
10246
|
d: "M9.17999 5.81986L9.88999 5.10986",
|
|
@@ -10235,7 +10249,7 @@ var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React116.createElemen
|
|
|
10235
10249
|
strokeLinejoin: "round"
|
|
10236
10250
|
}
|
|
10237
10251
|
),
|
|
10238
|
-
/* @__PURE__ */
|
|
10252
|
+
/* @__PURE__ */ React117.createElement(
|
|
10239
10253
|
"path",
|
|
10240
10254
|
{
|
|
10241
10255
|
d: "M11.5 11H0.5",
|
|
@@ -10248,19 +10262,19 @@ var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React116.createElemen
|
|
|
10248
10262
|
var Sunrise_default = Sunrise;
|
|
10249
10263
|
|
|
10250
10264
|
// src/components/ActionableRow/ActionableRow.tsx
|
|
10251
|
-
var
|
|
10265
|
+
var import_react104 = __toESM(require("react"));
|
|
10252
10266
|
var renderIcon = (icon, iconBox) => {
|
|
10253
10267
|
if (iconBox) {
|
|
10254
10268
|
return iconBox;
|
|
10255
10269
|
}
|
|
10256
10270
|
if (icon) {
|
|
10257
|
-
return /* @__PURE__ */
|
|
10271
|
+
return /* @__PURE__ */ import_react104.default.createElement("span", { className: "Layer__actionable_row__icon" }, icon);
|
|
10258
10272
|
}
|
|
10259
10273
|
return;
|
|
10260
10274
|
};
|
|
10261
10275
|
var renderTitle = (title) => {
|
|
10262
10276
|
if (title && typeof title === "string") {
|
|
10263
|
-
return /* @__PURE__ */
|
|
10277
|
+
return /* @__PURE__ */ import_react104.default.createElement(Text, { className: "Layer__actionable_row__title" }, title);
|
|
10264
10278
|
}
|
|
10265
10279
|
if (title) {
|
|
10266
10280
|
return title;
|
|
@@ -10269,7 +10283,7 @@ var renderTitle = (title) => {
|
|
|
10269
10283
|
};
|
|
10270
10284
|
var renderDescription = (description) => {
|
|
10271
10285
|
if (description && typeof description === "string") {
|
|
10272
|
-
return /* @__PURE__ */
|
|
10286
|
+
return /* @__PURE__ */ import_react104.default.createElement(Text, { className: "Layer__actionable_row__description" }, description);
|
|
10273
10287
|
}
|
|
10274
10288
|
if (description) {
|
|
10275
10289
|
return description;
|
|
@@ -10284,11 +10298,11 @@ var ActionableRow = ({
|
|
|
10284
10298
|
button,
|
|
10285
10299
|
onClick
|
|
10286
10300
|
}) => {
|
|
10287
|
-
return /* @__PURE__ */
|
|
10301
|
+
return /* @__PURE__ */ import_react104.default.createElement("div", { className: "Layer__actionable_row" }, /* @__PURE__ */ import_react104.default.createElement("div", { className: "Layer__actionable_row__main" }, renderIcon(icon, iconBox), /* @__PURE__ */ import_react104.default.createElement("div", { className: "Layer__actionable_row__main__text" }, renderTitle(title), renderDescription(description))), /* @__PURE__ */ import_react104.default.createElement("div", { className: "Layer__actionable_row__action" }, button && button, !button && onClick ? /* @__PURE__ */ import_react104.default.createElement(
|
|
10288
10302
|
IconButton,
|
|
10289
10303
|
{
|
|
10290
10304
|
onClick,
|
|
10291
|
-
icon: /* @__PURE__ */
|
|
10305
|
+
icon: /* @__PURE__ */ import_react104.default.createElement(ChevronRight_default, { size: 11 }),
|
|
10292
10306
|
withBorder: true
|
|
10293
10307
|
}
|
|
10294
10308
|
) : null));
|
|
@@ -10299,53 +10313,53 @@ var ConnectAccount = ({
|
|
|
10299
10313
|
onboardingStep,
|
|
10300
10314
|
onTransactionsToReviewClick
|
|
10301
10315
|
}) => {
|
|
10302
|
-
const { addConnection } = (0,
|
|
10316
|
+
const { addConnection } = (0, import_react105.useContext)(LinkedAccountsContext);
|
|
10303
10317
|
const { data, isLoading } = useBankTransactions();
|
|
10304
|
-
const transactionsToReview = (0,
|
|
10318
|
+
const transactionsToReview = (0, import_react105.useMemo)(() => {
|
|
10305
10319
|
if (data && data.length > 0) {
|
|
10306
10320
|
return data.filter((tx) => filterVisibility("review" /* review */, tx)).length;
|
|
10307
10321
|
}
|
|
10308
10322
|
return 0;
|
|
10309
10323
|
}, [data, isLoading]);
|
|
10310
10324
|
if (onboardingStep === "connectAccount") {
|
|
10311
|
-
return /* @__PURE__ */
|
|
10325
|
+
return /* @__PURE__ */ import_react105.default.createElement(import_react105.default.Fragment, null, /* @__PURE__ */ import_react105.default.createElement(
|
|
10312
10326
|
DataState,
|
|
10313
10327
|
{
|
|
10314
10328
|
status: "info" /* info */,
|
|
10315
|
-
icon: /* @__PURE__ */
|
|
10329
|
+
icon: /* @__PURE__ */ import_react105.default.createElement(CreditCard_default, { size: 12 }),
|
|
10316
10330
|
title: "No accounts connected",
|
|
10317
10331
|
description: "Populate your accounting dashboard in 3 steps"
|
|
10318
10332
|
}
|
|
10319
|
-
), /* @__PURE__ */
|
|
10333
|
+
), /* @__PURE__ */ import_react105.default.createElement(
|
|
10320
10334
|
ActionableRow,
|
|
10321
10335
|
{
|
|
10322
|
-
iconBox: /* @__PURE__ */
|
|
10336
|
+
iconBox: /* @__PURE__ */ import_react105.default.createElement(PlaidIcon_default, null),
|
|
10323
10337
|
title: "Connect accounts",
|
|
10324
10338
|
description: "Import data with one simple integration.",
|
|
10325
|
-
button: /* @__PURE__ */
|
|
10339
|
+
button: /* @__PURE__ */ import_react105.default.createElement(
|
|
10326
10340
|
Button,
|
|
10327
10341
|
{
|
|
10328
10342
|
onClick: () => addConnection("PLAID"),
|
|
10329
|
-
rightIcon: /* @__PURE__ */
|
|
10343
|
+
rightIcon: /* @__PURE__ */ import_react105.default.createElement(Link_default, { size: 12 })
|
|
10330
10344
|
},
|
|
10331
10345
|
"Connect"
|
|
10332
10346
|
)
|
|
10333
10347
|
}
|
|
10334
10348
|
));
|
|
10335
10349
|
}
|
|
10336
|
-
return /* @__PURE__ */
|
|
10350
|
+
return /* @__PURE__ */ import_react105.default.createElement(import_react105.default.Fragment, null, /* @__PURE__ */ import_react105.default.createElement(
|
|
10337
10351
|
DataState,
|
|
10338
10352
|
{
|
|
10339
10353
|
status: "success" /* success */,
|
|
10340
|
-
icon: /* @__PURE__ */
|
|
10354
|
+
icon: /* @__PURE__ */ import_react105.default.createElement(Sunrise_default, { size: 12 }),
|
|
10341
10355
|
title: "Account linked successfully",
|
|
10342
10356
|
description: "Your transactions are now available on the platform, to see all data on the charts, categorise transactions."
|
|
10343
10357
|
}
|
|
10344
|
-
), onTransactionsToReviewClick && transactionsToReview > 0 ? /* @__PURE__ */
|
|
10358
|
+
), onTransactionsToReviewClick && transactionsToReview > 0 ? /* @__PURE__ */ import_react105.default.createElement(
|
|
10345
10359
|
ActionableRow,
|
|
10346
10360
|
{
|
|
10347
|
-
icon: /* @__PURE__ */
|
|
10348
|
-
title: /* @__PURE__ */
|
|
10361
|
+
icon: /* @__PURE__ */ import_react105.default.createElement(Folder_default, { size: 12 }),
|
|
10362
|
+
title: /* @__PURE__ */ import_react105.default.createElement(Text, null, "Categorise transactions", " ", /* @__PURE__ */ import_react105.default.createElement(Badge, { variant: "warning" /* WARNING */, size: "small" /* SMALL */ }, transactionsToReview, " pending")),
|
|
10349
10363
|
description: "Once your data is on the platform categorize them in Bank Transactions tab",
|
|
10350
10364
|
onClick: () => onTransactionsToReviewClick()
|
|
10351
10365
|
}
|
|
@@ -10365,16 +10379,16 @@ var EXPANDED_STYLE3 = {
|
|
|
10365
10379
|
transform: "scale(1)",
|
|
10366
10380
|
overflow: "hidden"
|
|
10367
10381
|
};
|
|
10368
|
-
var Onboarding = (props) => /* @__PURE__ */
|
|
10382
|
+
var Onboarding = (props) => /* @__PURE__ */ import_react106.default.createElement(LinkedAccountsProvider, null, /* @__PURE__ */ import_react106.default.createElement(OnboardingContent, { ...props }));
|
|
10369
10383
|
var OnboardingContent = ({
|
|
10370
10384
|
onTransactionsToReviewClick
|
|
10371
10385
|
}) => {
|
|
10372
10386
|
const { onboardingStep, setOnboardingStep } = useLayerContext();
|
|
10373
|
-
const [style, setStyle] = (0,
|
|
10387
|
+
const [style, setStyle] = (0, import_react106.useState)(
|
|
10374
10388
|
onboardingStep ? EXPANDED_STYLE3 : COLLAPSED_STYLE3
|
|
10375
10389
|
);
|
|
10376
|
-
const { data, loadingStatus } = (0,
|
|
10377
|
-
(0,
|
|
10390
|
+
const { data, loadingStatus } = (0, import_react106.useContext)(LinkedAccountsContext);
|
|
10391
|
+
(0, import_react106.useEffect)(() => {
|
|
10378
10392
|
if (data && data?.length === 0 && loadingStatus === "complete" && !onboardingStep) {
|
|
10379
10393
|
setOnboardingStep("connectAccount");
|
|
10380
10394
|
return;
|
|
@@ -10383,7 +10397,7 @@ var OnboardingContent = ({
|
|
|
10383
10397
|
setOnboardingStep("complete");
|
|
10384
10398
|
}
|
|
10385
10399
|
}, [data, loadingStatus]);
|
|
10386
|
-
(0,
|
|
10400
|
+
(0, import_react106.useEffect)(() => {
|
|
10387
10401
|
if (onboardingStep && style.maxHeight !== 1e3) {
|
|
10388
10402
|
setTimeout(() => {
|
|
10389
10403
|
setStyle(EXPANDED_STYLE3);
|
|
@@ -10393,7 +10407,7 @@ var OnboardingContent = ({
|
|
|
10393
10407
|
if (!onboardingStep) {
|
|
10394
10408
|
return null;
|
|
10395
10409
|
}
|
|
10396
|
-
return /* @__PURE__ */
|
|
10410
|
+
return /* @__PURE__ */ import_react106.default.createElement(Container, { name: "onboarding", style }, /* @__PURE__ */ import_react106.default.createElement("div", { className: "Layer__onboarding__content" }, /* @__PURE__ */ import_react106.default.createElement(
|
|
10397
10411
|
ConnectAccount,
|
|
10398
10412
|
{
|
|
10399
10413
|
onboardingStep,
|
|
@@ -10403,14 +10417,14 @@ var OnboardingContent = ({
|
|
|
10403
10417
|
};
|
|
10404
10418
|
|
|
10405
10419
|
// src/views/AccountingOverview/AccountingOverview.tsx
|
|
10406
|
-
var
|
|
10420
|
+
var import_react112 = __toESM(require("react"));
|
|
10407
10421
|
|
|
10408
10422
|
// src/components/TransactionToReviewCard/TransactionToReviewCard.tsx
|
|
10409
|
-
var
|
|
10423
|
+
var import_react109 = __toESM(require("react"));
|
|
10410
10424
|
|
|
10411
10425
|
// src/icons/Bell.tsx
|
|
10412
|
-
var
|
|
10413
|
-
var Bell = ({ size = 18, ...props }) => /* @__PURE__ */
|
|
10426
|
+
var React121 = __toESM(require("react"));
|
|
10427
|
+
var Bell = ({ size = 18, ...props }) => /* @__PURE__ */ React121.createElement(
|
|
10414
10428
|
"svg",
|
|
10415
10429
|
{
|
|
10416
10430
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -10420,7 +10434,7 @@ var Bell = ({ size = 18, ...props }) => /* @__PURE__ */ React120.createElement(
|
|
|
10420
10434
|
width: size,
|
|
10421
10435
|
height: size
|
|
10422
10436
|
},
|
|
10423
|
-
/* @__PURE__ */
|
|
10437
|
+
/* @__PURE__ */ React121.createElement(
|
|
10424
10438
|
"path",
|
|
10425
10439
|
{
|
|
10426
10440
|
d: "M13.5 6C13.5 4.80653 13.0259 3.66193 12.182 2.81802C11.3381 1.97411 10.1935 1.5 9 1.5C7.80653 1.5 6.66193 1.97411 5.81802 2.81802C4.97411 3.66193 4.5 4.80653 4.5 6C4.5 11.25 2.25 12.75 2.25 12.75H15.75C15.75 12.75 13.5 11.25 13.5 6Z",
|
|
@@ -10429,7 +10443,7 @@ var Bell = ({ size = 18, ...props }) => /* @__PURE__ */ React120.createElement(
|
|
|
10429
10443
|
"stroke-linejoin": "round"
|
|
10430
10444
|
}
|
|
10431
10445
|
),
|
|
10432
|
-
/* @__PURE__ */
|
|
10446
|
+
/* @__PURE__ */ React121.createElement(
|
|
10433
10447
|
"path",
|
|
10434
10448
|
{
|
|
10435
10449
|
d: "M10.2975 15.75C10.1656 15.9773 9.97638 16.166 9.74867 16.2971C9.52096 16.4283 9.26278 16.4973 9 16.4973C8.73721 16.4973 8.47904 16.4283 8.25133 16.2971C8.02362 16.166 7.83436 15.9773 7.7025 15.75",
|
|
@@ -10442,23 +10456,23 @@ var Bell = ({ size = 18, ...props }) => /* @__PURE__ */ React120.createElement(
|
|
|
10442
10456
|
var Bell_default = Bell;
|
|
10443
10457
|
|
|
10444
10458
|
// src/components/BadgeLoader/BadgeLoader.tsx
|
|
10445
|
-
var
|
|
10459
|
+
var import_react107 = __toESM(require("react"));
|
|
10446
10460
|
var BadgeLoader = ({ children }) => {
|
|
10447
|
-
return /* @__PURE__ */
|
|
10461
|
+
return /* @__PURE__ */ import_react107.default.createElement("span", { className: "Layer__loader Layer__loader--as-badge" }, /* @__PURE__ */ import_react107.default.createElement(Loader_default, { size: 11, className: "Layer__anim--rotating" }), children);
|
|
10448
10462
|
};
|
|
10449
10463
|
|
|
10450
10464
|
// src/components/NotificationCard/NotificationCard.tsx
|
|
10451
|
-
var
|
|
10465
|
+
var import_react108 = __toESM(require("react"));
|
|
10452
10466
|
var import_classnames43 = __toESM(require("classnames"));
|
|
10453
10467
|
var NotificationCard = ({
|
|
10454
10468
|
onClick,
|
|
10455
10469
|
children,
|
|
10456
10470
|
className
|
|
10457
10471
|
}) => {
|
|
10458
|
-
return /* @__PURE__ */
|
|
10472
|
+
return /* @__PURE__ */ import_react108.default.createElement("div", { className: (0, import_classnames43.default)("Layer__notification-card", className) }, /* @__PURE__ */ import_react108.default.createElement("div", { className: "Layer__notification-card__main" }, children), /* @__PURE__ */ import_react108.default.createElement(
|
|
10459
10473
|
IconButton,
|
|
10460
10474
|
{
|
|
10461
|
-
icon: /* @__PURE__ */
|
|
10475
|
+
icon: /* @__PURE__ */ import_react108.default.createElement(ChevronRight_default, null),
|
|
10462
10476
|
withBorder: true,
|
|
10463
10477
|
onClick: () => onClick()
|
|
10464
10478
|
}
|
|
@@ -10469,9 +10483,9 @@ var NotificationCard = ({
|
|
|
10469
10483
|
var TransactionToReviewCard = ({
|
|
10470
10484
|
onClick
|
|
10471
10485
|
}) => {
|
|
10472
|
-
const [loaded, setLoaded] = (0,
|
|
10486
|
+
const [loaded, setLoaded] = (0, import_react109.useState)("initiated");
|
|
10473
10487
|
const { data, isLoading, error, refetch } = useBankTransactions();
|
|
10474
|
-
(0,
|
|
10488
|
+
(0, import_react109.useEffect)(() => {
|
|
10475
10489
|
if (!isLoading && data && data?.length > 0) {
|
|
10476
10490
|
setLoaded("complete");
|
|
10477
10491
|
return;
|
|
@@ -10485,26 +10499,26 @@ var TransactionToReviewCard = ({
|
|
|
10485
10499
|
return;
|
|
10486
10500
|
}
|
|
10487
10501
|
}, [isLoading]);
|
|
10488
|
-
const toReview = (0,
|
|
10502
|
+
const toReview = (0, import_react109.useMemo)(() => {
|
|
10489
10503
|
if (data && data.length > 0) {
|
|
10490
10504
|
return data.filter((tx) => filterVisibility("review" /* review */, tx)).length;
|
|
10491
10505
|
}
|
|
10492
10506
|
return 0;
|
|
10493
10507
|
}, [data, isLoading]);
|
|
10494
|
-
return /* @__PURE__ */
|
|
10508
|
+
return /* @__PURE__ */ import_react109.default.createElement(
|
|
10495
10509
|
NotificationCard,
|
|
10496
10510
|
{
|
|
10497
10511
|
className: "Layer__txs-to-review",
|
|
10498
10512
|
onClick: () => onClick && onClick()
|
|
10499
10513
|
},
|
|
10500
|
-
/* @__PURE__ */
|
|
10501
|
-
loaded === "initiated" || loaded === "loading" ? /* @__PURE__ */
|
|
10502
|
-
loaded === "complete" && error ? /* @__PURE__ */
|
|
10514
|
+
/* @__PURE__ */ import_react109.default.createElement(Text, { size: "sm" /* sm */ }, "Transactions to review"),
|
|
10515
|
+
loaded === "initiated" || loaded === "loading" ? /* @__PURE__ */ import_react109.default.createElement(BadgeLoader, null) : null,
|
|
10516
|
+
loaded === "complete" && error ? /* @__PURE__ */ import_react109.default.createElement(
|
|
10503
10517
|
Badge,
|
|
10504
10518
|
{
|
|
10505
10519
|
variant: "error" /* ERROR */,
|
|
10506
10520
|
size: "small" /* SMALL */,
|
|
10507
|
-
icon: /* @__PURE__ */
|
|
10521
|
+
icon: /* @__PURE__ */ import_react109.default.createElement(RefreshCcw_default, { size: 12 }),
|
|
10508
10522
|
onClick: () => {
|
|
10509
10523
|
setLoaded("loading");
|
|
10510
10524
|
refetch();
|
|
@@ -10512,22 +10526,22 @@ var TransactionToReviewCard = ({
|
|
|
10512
10526
|
},
|
|
10513
10527
|
"Refresh"
|
|
10514
10528
|
) : null,
|
|
10515
|
-
loaded === "complete" && !error && toReview > 0 ? /* @__PURE__ */
|
|
10529
|
+
loaded === "complete" && !error && toReview > 0 ? /* @__PURE__ */ import_react109.default.createElement(
|
|
10516
10530
|
Badge,
|
|
10517
10531
|
{
|
|
10518
10532
|
variant: "warning" /* WARNING */,
|
|
10519
10533
|
size: "small" /* SMALL */,
|
|
10520
|
-
icon: /* @__PURE__ */
|
|
10534
|
+
icon: /* @__PURE__ */ import_react109.default.createElement(Bell_default, { size: 12 })
|
|
10521
10535
|
},
|
|
10522
10536
|
toReview,
|
|
10523
10537
|
" pending"
|
|
10524
10538
|
) : null,
|
|
10525
|
-
loaded === "complete" && !error && toReview === 0 ? /* @__PURE__ */
|
|
10539
|
+
loaded === "complete" && !error && toReview === 0 ? /* @__PURE__ */ import_react109.default.createElement(
|
|
10526
10540
|
Badge,
|
|
10527
10541
|
{
|
|
10528
10542
|
variant: "success" /* SUCCESS */,
|
|
10529
10543
|
size: "small" /* SMALL */,
|
|
10530
|
-
icon: /* @__PURE__ */
|
|
10544
|
+
icon: /* @__PURE__ */ import_react109.default.createElement(Check_default, { size: 12 })
|
|
10531
10545
|
},
|
|
10532
10546
|
"All done"
|
|
10533
10547
|
) : null
|
|
@@ -10535,19 +10549,19 @@ var TransactionToReviewCard = ({
|
|
|
10535
10549
|
};
|
|
10536
10550
|
|
|
10537
10551
|
// src/components/View/View.tsx
|
|
10538
|
-
var
|
|
10552
|
+
var import_react111 = __toESM(require("react"));
|
|
10539
10553
|
|
|
10540
10554
|
// src/components/ViewHeader/ViewHeader.tsx
|
|
10541
|
-
var
|
|
10555
|
+
var import_react110 = __toESM(require("react"));
|
|
10542
10556
|
var ViewHeader = ({ title, controls }) => {
|
|
10543
|
-
return /* @__PURE__ */
|
|
10557
|
+
return /* @__PURE__ */ import_react110.default.createElement("div", { className: "Layer__view-header" }, /* @__PURE__ */ import_react110.default.createElement("div", { className: "Layer__view-header__content" }, /* @__PURE__ */ import_react110.default.createElement(Heading, null, title), controls && /* @__PURE__ */ import_react110.default.createElement("div", { className: "Layer__view-header__controls" }, controls)));
|
|
10544
10558
|
};
|
|
10545
10559
|
|
|
10546
10560
|
// src/components/View/View.tsx
|
|
10547
10561
|
var View3 = ({ title, children, headerControls }) => {
|
|
10548
10562
|
const { theme } = useLayerContext();
|
|
10549
10563
|
const styles = parseStylesFromThemeConfig(theme);
|
|
10550
|
-
return /* @__PURE__ */
|
|
10564
|
+
return /* @__PURE__ */ import_react111.default.createElement("div", { className: "Layer__view", style: { ...styles } }, /* @__PURE__ */ import_react111.default.createElement(ViewHeader, { title, controls: headerControls }), /* @__PURE__ */ import_react111.default.createElement("div", { className: "Layer__view-main" }, children));
|
|
10551
10565
|
};
|
|
10552
10566
|
|
|
10553
10567
|
// src/views/AccountingOverview/AccountingOverview.tsx
|
|
@@ -10556,39 +10570,39 @@ var AccountingOverview = ({
|
|
|
10556
10570
|
enableOnboarding = false,
|
|
10557
10571
|
onTransactionsToReviewClick
|
|
10558
10572
|
}) => {
|
|
10559
|
-
return /* @__PURE__ */
|
|
10573
|
+
return /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react112.default.createElement(View3, { title, headerControls: /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.DatePicker, null) }, enableOnboarding && /* @__PURE__ */ import_react112.default.createElement(Onboarding, null), /* @__PURE__ */ import_react112.default.createElement("div", { className: "Layer__accounting-overview__summaries-row" }, /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.Summaries, { actionable: false }), /* @__PURE__ */ import_react112.default.createElement(TransactionToReviewCard, { onClick: onTransactionsToReviewClick })), /* @__PURE__ */ import_react112.default.createElement(
|
|
10560
10574
|
Container,
|
|
10561
10575
|
{
|
|
10562
10576
|
name: "accounting-overview-profit-and-loss",
|
|
10563
10577
|
asWidget: true,
|
|
10564
10578
|
elevated: true
|
|
10565
10579
|
},
|
|
10566
|
-
/* @__PURE__ */
|
|
10567
|
-
/* @__PURE__ */
|
|
10568
|
-
), /* @__PURE__ */
|
|
10580
|
+
/* @__PURE__ */ import_react112.default.createElement(Header, null, /* @__PURE__ */ import_react112.default.createElement(Heading, { size: "secondary" /* secondary */ }, "Profit & Loss")),
|
|
10581
|
+
/* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.Chart, null)
|
|
10582
|
+
), /* @__PURE__ */ import_react112.default.createElement("div", { className: "accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ import_react112.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "revenue", hideClose: true })), /* @__PURE__ */ import_react112.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "expenses", hideClose: true })))));
|
|
10569
10583
|
};
|
|
10570
10584
|
|
|
10571
10585
|
// src/views/BankTransactionsWithLinkedAccounts/BankTransactionsWithLinkedAccounts.tsx
|
|
10572
|
-
var
|
|
10586
|
+
var import_react113 = __toESM(require("react"));
|
|
10573
10587
|
var BankTransactionsWithLinkedAccounts = ({
|
|
10574
10588
|
title = "Bank transactions",
|
|
10575
10589
|
elevatedLinkedAccounts = true,
|
|
10576
10590
|
showLedgerBalance = true
|
|
10577
10591
|
}) => {
|
|
10578
|
-
return /* @__PURE__ */
|
|
10592
|
+
return /* @__PURE__ */ import_react113.default.createElement(View3, { title }, /* @__PURE__ */ import_react113.default.createElement(
|
|
10579
10593
|
LinkedAccounts,
|
|
10580
10594
|
{
|
|
10581
10595
|
elevated: elevatedLinkedAccounts,
|
|
10582
10596
|
showLedgerBalance
|
|
10583
10597
|
}
|
|
10584
|
-
), /* @__PURE__ */
|
|
10598
|
+
), /* @__PURE__ */ import_react113.default.createElement(BankTransactions, { asWidget: true }));
|
|
10585
10599
|
};
|
|
10586
10600
|
|
|
10587
10601
|
// src/views/Reports/Reports.tsx
|
|
10588
|
-
var
|
|
10602
|
+
var import_react114 = __toESM(require("react"));
|
|
10589
10603
|
var Reports = ({ title = "Reports" }) => {
|
|
10590
|
-
const containerRef = (0,
|
|
10591
|
-
return /* @__PURE__ */
|
|
10604
|
+
const containerRef = (0, import_react114.useRef)(null);
|
|
10605
|
+
return /* @__PURE__ */ import_react114.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react114.default.createElement(View3, { title, headerControls: /* @__PURE__ */ import_react114.default.createElement(ProfitAndLoss.DatePicker, null) }, /* @__PURE__ */ import_react114.default.createElement(
|
|
10592
10606
|
Toggle,
|
|
10593
10607
|
{
|
|
10594
10608
|
name: "reports-tabs",
|
|
@@ -10606,28 +10620,28 @@ var Reports = ({ title = "Reports" }) => {
|
|
|
10606
10620
|
selected: "profitAndLoss",
|
|
10607
10621
|
onChange: () => null
|
|
10608
10622
|
}
|
|
10609
|
-
), /* @__PURE__ */
|
|
10623
|
+
), /* @__PURE__ */ import_react114.default.createElement(Container, { name: "reports", ref: containerRef }, /* @__PURE__ */ import_react114.default.createElement(ReportsPanel, { containerRef }))));
|
|
10610
10624
|
};
|
|
10611
10625
|
var ReportsPanel = ({ containerRef }) => {
|
|
10612
|
-
const { sidebarScope } = (0,
|
|
10613
|
-
return /* @__PURE__ */
|
|
10626
|
+
const { sidebarScope } = (0, import_react114.useContext)(ProfitAndLoss.Context);
|
|
10627
|
+
return /* @__PURE__ */ import_react114.default.createElement(
|
|
10614
10628
|
Panel,
|
|
10615
10629
|
{
|
|
10616
|
-
sidebar: /* @__PURE__ */
|
|
10630
|
+
sidebar: /* @__PURE__ */ import_react114.default.createElement(ProfitAndLoss.DetailedCharts, null),
|
|
10617
10631
|
sidebarIsOpen: Boolean(sidebarScope),
|
|
10618
10632
|
parentRef: containerRef
|
|
10619
10633
|
},
|
|
10620
|
-
/* @__PURE__ */
|
|
10634
|
+
/* @__PURE__ */ import_react114.default.createElement(ProfitAndLoss.Table, { asContainer: false })
|
|
10621
10635
|
);
|
|
10622
10636
|
};
|
|
10623
10637
|
|
|
10624
10638
|
// src/views/GeneralLedger/GeneralLedger.tsx
|
|
10625
|
-
var
|
|
10639
|
+
var import_react115 = __toESM(require("react"));
|
|
10626
10640
|
var GeneralLedgerView = ({
|
|
10627
10641
|
title = "General Ledger"
|
|
10628
10642
|
}) => {
|
|
10629
|
-
const [activeTab, setActiveTab] = (0,
|
|
10630
|
-
return /* @__PURE__ */
|
|
10643
|
+
const [activeTab, setActiveTab] = (0, import_react115.useState)("chartOfAccounts");
|
|
10644
|
+
return /* @__PURE__ */ import_react115.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react115.default.createElement(View3, { title }, /* @__PURE__ */ import_react115.default.createElement(
|
|
10631
10645
|
Toggle,
|
|
10632
10646
|
{
|
|
10633
10647
|
name: "general-ledger-tabs",
|
|
@@ -10644,7 +10658,7 @@ var GeneralLedgerView = ({
|
|
|
10644
10658
|
selected: activeTab,
|
|
10645
10659
|
onChange: (opt) => setActiveTab(opt.target.value)
|
|
10646
10660
|
}
|
|
10647
|
-
), /* @__PURE__ */
|
|
10661
|
+
), /* @__PURE__ */ import_react115.default.createElement(Container, { name: "generalLedger" }, activeTab === "chartOfAccounts" ? /* @__PURE__ */ import_react115.default.createElement(ChartOfAccounts, { asWidget: true, withDateControl: true, withExpandAllButton: true }) : /* @__PURE__ */ import_react115.default.createElement(Journal, null))));
|
|
10648
10662
|
};
|
|
10649
10663
|
// Annotate the CommonJS export names for ESM import in node:
|
|
10650
10664
|
0 && (module.exports = {
|
|
@@ -10654,6 +10668,7 @@ var GeneralLedgerView = ({
|
|
|
10654
10668
|
BankTransactionsWithLinkedAccounts,
|
|
10655
10669
|
ChartOfAccounts,
|
|
10656
10670
|
GeneralLedgerView,
|
|
10671
|
+
Hello,
|
|
10657
10672
|
Journal,
|
|
10658
10673
|
LayerProvider,
|
|
10659
10674
|
LinkedAccounts,
|