@layerfi/components 0.1.14 → 0.1.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/index.js +299 -653
- package/dist/esm/index.js.map +4 -4
- package/dist/index.d.ts +1 -63
- package/dist/index.js +557 -911
- package/dist/index.js.map +4 -4
- package/dist/styles/index.css +2 -20
- package/dist/styles/index.css.map +2 -2
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -4897,7 +4897,7 @@ var LinkedAccountThumb = ({
|
|
|
4897
4897
|
size: "sm"
|
|
4898
4898
|
},
|
|
4899
4899
|
"Bank balance"
|
|
4900
|
-
), /* @__PURE__ */ import_react49.default.createElement(Text, { as: "span", className: "account-balance" }, "$", centsToDollars(account.latest_balance_timestamp
|
|
4900
|
+
), /* @__PURE__ */ import_react49.default.createElement(Text, { as: "span", className: "account-balance" }, "$", centsToDollars(account.latest_balance_timestamp?.balance))), /* @__PURE__ */ import_react49.default.createElement("div", { className: "bottombar" }, asWidget ? /* @__PURE__ */ import_react49.default.createElement(
|
|
4901
4901
|
AccountNumber,
|
|
4902
4902
|
{
|
|
4903
4903
|
accountNumber: "TODO"
|
|
@@ -4974,7 +4974,7 @@ var LinkedAccounts = ({ asWidget, elevated }) => {
|
|
|
4974
4974
|
};
|
|
4975
4975
|
|
|
4976
4976
|
// src/components/ProfitAndLoss/ProfitAndLoss.tsx
|
|
4977
|
-
var
|
|
4977
|
+
var import_react64 = __toESM(require("react"));
|
|
4978
4978
|
|
|
4979
4979
|
// src/hooks/useProfitAndLoss/useProfitAndLoss.tsx
|
|
4980
4980
|
var import_react51 = require("react");
|
|
@@ -5032,12 +5032,12 @@ var applyShare = (items, total) => {
|
|
|
5032
5032
|
});
|
|
5033
5033
|
};
|
|
5034
5034
|
|
|
5035
|
-
// src/hooks/useProfitAndLoss/
|
|
5035
|
+
// src/hooks/useProfitAndLoss/useProfitAndLoss.tsx
|
|
5036
5036
|
var import_date_fns10 = require("date-fns");
|
|
5037
5037
|
var import_swr5 = __toESM(require("swr"));
|
|
5038
|
-
var
|
|
5039
|
-
startDate,
|
|
5040
|
-
endDate,
|
|
5038
|
+
var useProfitAndLoss = ({
|
|
5039
|
+
startDate: initialStartDate,
|
|
5040
|
+
endDate: initialEndDate,
|
|
5041
5041
|
tagFilter,
|
|
5042
5042
|
reportingBasis
|
|
5043
5043
|
} = {
|
|
@@ -5045,6 +5045,17 @@ var useProfitAndLossQuery = ({
|
|
|
5045
5045
|
endDate: (0, import_date_fns10.endOfMonth)(/* @__PURE__ */ new Date())
|
|
5046
5046
|
}) => {
|
|
5047
5047
|
const { auth, businessId, apiUrl } = useLayerContext();
|
|
5048
|
+
const [startDate, setStartDate] = (0, import_react51.useState)(
|
|
5049
|
+
initialStartDate || (0, import_date_fns10.startOfMonth)(Date.now())
|
|
5050
|
+
);
|
|
5051
|
+
const [endDate, setEndDate] = (0, import_react51.useState)(
|
|
5052
|
+
initialEndDate || (0, import_date_fns10.endOfMonth)(Date.now())
|
|
5053
|
+
);
|
|
5054
|
+
const [filters, setFilters] = (0, import_react51.useState)({
|
|
5055
|
+
expenses: void 0,
|
|
5056
|
+
revenue: void 0
|
|
5057
|
+
});
|
|
5058
|
+
const [sidebarScope, setSidebarScope] = (0, import_react51.useState)(void 0);
|
|
5048
5059
|
const {
|
|
5049
5060
|
data: rawData,
|
|
5050
5061
|
isLoading,
|
|
@@ -5058,83 +5069,15 @@ var useProfitAndLossQuery = ({
|
|
|
5058
5069
|
Layer.getProfitAndLoss(apiUrl, auth?.access_token, {
|
|
5059
5070
|
params: {
|
|
5060
5071
|
businessId,
|
|
5061
|
-
startDate: (0, import_date_fns10.formatISO)(startDate
|
|
5062
|
-
endDate: (0, import_date_fns10.formatISO)(endDate
|
|
5072
|
+
startDate: (0, import_date_fns10.formatISO)(startDate),
|
|
5073
|
+
endDate: (0, import_date_fns10.formatISO)(endDate),
|
|
5063
5074
|
tagKey: tagFilter?.key,
|
|
5064
5075
|
tagValues: tagFilter?.values?.join(","),
|
|
5065
5076
|
reportingBasis
|
|
5066
5077
|
}
|
|
5067
5078
|
})
|
|
5068
5079
|
);
|
|
5069
|
-
const
|
|
5070
|
-
mutate();
|
|
5071
|
-
};
|
|
5072
|
-
return {
|
|
5073
|
-
startDate,
|
|
5074
|
-
endDate,
|
|
5075
|
-
data: rawData?.data,
|
|
5076
|
-
isLoading,
|
|
5077
|
-
isValidating,
|
|
5078
|
-
error: rawError,
|
|
5079
|
-
refetch
|
|
5080
|
-
};
|
|
5081
|
-
};
|
|
5082
|
-
|
|
5083
|
-
// src/hooks/useProfitAndLoss/useProfitAndLoss.tsx
|
|
5084
|
-
var import_date_fns11 = require("date-fns");
|
|
5085
|
-
var useProfitAndLoss = ({
|
|
5086
|
-
startDate: initialStartDate,
|
|
5087
|
-
endDate: initialEndDate,
|
|
5088
|
-
tagFilter,
|
|
5089
|
-
reportingBasis,
|
|
5090
|
-
fetchMultipleMonths = false
|
|
5091
|
-
} = {
|
|
5092
|
-
startDate: (0, import_date_fns11.startOfMonth)(/* @__PURE__ */ new Date()),
|
|
5093
|
-
endDate: (0, import_date_fns11.endOfMonth)(/* @__PURE__ */ new Date())
|
|
5094
|
-
}) => {
|
|
5095
|
-
const [startDate, setStartDate] = (0, import_react51.useState)(
|
|
5096
|
-
initialStartDate || (0, import_date_fns11.startOfMonth)(Date.now())
|
|
5097
|
-
);
|
|
5098
|
-
const [endDate, setEndDate] = (0, import_react51.useState)(
|
|
5099
|
-
initialEndDate || (0, import_date_fns11.endOfMonth)(Date.now())
|
|
5100
|
-
);
|
|
5101
|
-
const [filters, setFilters] = (0, import_react51.useState)({
|
|
5102
|
-
expenses: void 0,
|
|
5103
|
-
revenue: void 0
|
|
5104
|
-
});
|
|
5105
|
-
const [sidebarScope, setSidebarScope] = (0, import_react51.useState)(void 0);
|
|
5106
|
-
const { data, isLoading, isValidating, error, refetch } = useProfitAndLossQuery({
|
|
5107
|
-
startDate,
|
|
5108
|
-
endDate,
|
|
5109
|
-
tagFilter,
|
|
5110
|
-
reportingBasis
|
|
5111
|
-
});
|
|
5112
|
-
const changeDateRange = ({
|
|
5113
|
-
startDate: newStartDate,
|
|
5114
|
-
endDate: newEndDate
|
|
5115
|
-
}) => {
|
|
5116
|
-
newStartDate && setStartDate(newStartDate);
|
|
5117
|
-
newEndDate && setEndDate(newEndDate);
|
|
5118
|
-
};
|
|
5119
|
-
const sortBy = (scope, field, direction) => {
|
|
5120
|
-
setFilters({
|
|
5121
|
-
...filters,
|
|
5122
|
-
[scope]: {
|
|
5123
|
-
...filters[scope],
|
|
5124
|
-
sortBy: field,
|
|
5125
|
-
sortDirection: direction ?? filters[scope]?.sortDirection === "desc" ? "asc" : "desc"
|
|
5126
|
-
}
|
|
5127
|
-
});
|
|
5128
|
-
};
|
|
5129
|
-
const setFilterTypes = (scope, types) => {
|
|
5130
|
-
setFilters({
|
|
5131
|
-
...filters,
|
|
5132
|
-
[scope]: {
|
|
5133
|
-
...filters[scope],
|
|
5134
|
-
types
|
|
5135
|
-
}
|
|
5136
|
-
});
|
|
5137
|
-
};
|
|
5080
|
+
const { data, error } = rawData || {};
|
|
5138
5081
|
const { filteredDataRevenue, filteredTotalRevenue } = (0, import_react51.useMemo)(() => {
|
|
5139
5082
|
if (!data) {
|
|
5140
5083
|
return { filteredDataRevenue: [], filteredTotalRevenue: void 0 };
|
|
@@ -5209,6 +5152,35 @@ var useProfitAndLoss = ({
|
|
|
5209
5152
|
const withShare = applyShare(sorted, total);
|
|
5210
5153
|
return { filteredDataExpenses: withShare, filteredTotalExpenses: total };
|
|
5211
5154
|
}, [data, startDate, filters, sidebarScope]);
|
|
5155
|
+
const changeDateRange = ({
|
|
5156
|
+
startDate: newStartDate,
|
|
5157
|
+
endDate: newEndDate
|
|
5158
|
+
}) => {
|
|
5159
|
+
newStartDate && setStartDate(newStartDate);
|
|
5160
|
+
newEndDate && setEndDate(newEndDate);
|
|
5161
|
+
};
|
|
5162
|
+
const refetch = () => {
|
|
5163
|
+
mutate();
|
|
5164
|
+
};
|
|
5165
|
+
const sortBy = (scope, field, direction) => {
|
|
5166
|
+
setFilters({
|
|
5167
|
+
...filters,
|
|
5168
|
+
[scope]: {
|
|
5169
|
+
...filters[scope],
|
|
5170
|
+
sortBy: field,
|
|
5171
|
+
sortDirection: direction ?? filters[scope]?.sortDirection === "desc" ? "asc" : "desc"
|
|
5172
|
+
}
|
|
5173
|
+
});
|
|
5174
|
+
};
|
|
5175
|
+
const setFilterTypes = (scope, types) => {
|
|
5176
|
+
setFilters({
|
|
5177
|
+
...filters,
|
|
5178
|
+
[scope]: {
|
|
5179
|
+
...filters[scope],
|
|
5180
|
+
types
|
|
5181
|
+
}
|
|
5182
|
+
});
|
|
5183
|
+
};
|
|
5212
5184
|
return {
|
|
5213
5185
|
data,
|
|
5214
5186
|
filteredDataRevenue,
|
|
@@ -5217,7 +5189,7 @@ var useProfitAndLoss = ({
|
|
|
5217
5189
|
filteredTotalExpenses,
|
|
5218
5190
|
isLoading,
|
|
5219
5191
|
isValidating,
|
|
5220
|
-
error,
|
|
5192
|
+
error: error || rawError,
|
|
5221
5193
|
dateRange: { startDate, endDate },
|
|
5222
5194
|
refetch,
|
|
5223
5195
|
changeDateRange,
|
|
@@ -5230,350 +5202,7 @@ var useProfitAndLoss = ({
|
|
|
5230
5202
|
};
|
|
5231
5203
|
|
|
5232
5204
|
// src/components/ProfitAndLossChart/ProfitAndLossChart.tsx
|
|
5233
|
-
var
|
|
5234
|
-
|
|
5235
|
-
// src/hooks/useProfitAndLoss/useProfitAndLossLTM.tsx
|
|
5236
|
-
var import_react52 = require("react");
|
|
5237
|
-
var import_date_fns12 = require("date-fns");
|
|
5238
|
-
var buildDates = ({ currentDate }) => {
|
|
5239
|
-
const list = [];
|
|
5240
|
-
for (let i = 11; i > 0; i--) {
|
|
5241
|
-
const startDateWithOffset = (0, import_date_fns12.startOfMonth)((0, import_date_fns12.sub)(currentDate, { months: i }));
|
|
5242
|
-
const endDateWithOffset = (0, import_date_fns12.endOfMonth)((0, import_date_fns12.sub)(currentDate, { months: i }));
|
|
5243
|
-
list.push({
|
|
5244
|
-
startDate: startDateWithOffset,
|
|
5245
|
-
endDate: endDateWithOffset
|
|
5246
|
-
});
|
|
5247
|
-
}
|
|
5248
|
-
list.push({
|
|
5249
|
-
startDate: (0, import_date_fns12.startOfMonth)(currentDate),
|
|
5250
|
-
endDate: (0, import_date_fns12.endOfMonth)(currentDate)
|
|
5251
|
-
});
|
|
5252
|
-
return list;
|
|
5253
|
-
};
|
|
5254
|
-
var useProfitAndLossLTM = ({ currentDate, tagFilter, reportingBasis } = {
|
|
5255
|
-
currentDate: /* @__PURE__ */ new Date()
|
|
5256
|
-
}) => {
|
|
5257
|
-
const { businessId } = useLayerContext();
|
|
5258
|
-
const [loaded, setLoaded] = (0, import_react52.useState)("initial");
|
|
5259
|
-
const dates = (0, import_react52.useMemo)(() => {
|
|
5260
|
-
return buildDates({ currentDate });
|
|
5261
|
-
}, [currentDate, businessId, tagFilter, reportingBasis]);
|
|
5262
|
-
const {
|
|
5263
|
-
data: data0,
|
|
5264
|
-
isLoading: isLoading0,
|
|
5265
|
-
error: error0,
|
|
5266
|
-
startDate: startDate0,
|
|
5267
|
-
endDate: endDate0
|
|
5268
|
-
} = useProfitAndLossQuery({
|
|
5269
|
-
startDate: dates[0].startDate,
|
|
5270
|
-
endDate: dates[0].endDate,
|
|
5271
|
-
tagFilter,
|
|
5272
|
-
reportingBasis
|
|
5273
|
-
});
|
|
5274
|
-
const {
|
|
5275
|
-
data: data1,
|
|
5276
|
-
isLoading: isLoading1,
|
|
5277
|
-
error: error1,
|
|
5278
|
-
startDate: startDate1,
|
|
5279
|
-
endDate: endDate1
|
|
5280
|
-
} = useProfitAndLossQuery({
|
|
5281
|
-
startDate: dates[1].startDate,
|
|
5282
|
-
endDate: dates[1].endDate,
|
|
5283
|
-
tagFilter,
|
|
5284
|
-
reportingBasis
|
|
5285
|
-
});
|
|
5286
|
-
const {
|
|
5287
|
-
data: data2,
|
|
5288
|
-
isLoading: isLoading2,
|
|
5289
|
-
error: error2,
|
|
5290
|
-
startDate: startDate2,
|
|
5291
|
-
endDate: endDate2
|
|
5292
|
-
} = useProfitAndLossQuery({
|
|
5293
|
-
startDate: dates[2].startDate,
|
|
5294
|
-
endDate: dates[2].endDate,
|
|
5295
|
-
tagFilter,
|
|
5296
|
-
reportingBasis
|
|
5297
|
-
});
|
|
5298
|
-
const {
|
|
5299
|
-
data: data3,
|
|
5300
|
-
isLoading: isLoading3,
|
|
5301
|
-
error: error3,
|
|
5302
|
-
startDate: startDate3,
|
|
5303
|
-
endDate: endDate3
|
|
5304
|
-
} = useProfitAndLossQuery({
|
|
5305
|
-
startDate: dates[3].startDate,
|
|
5306
|
-
endDate: dates[3].endDate,
|
|
5307
|
-
tagFilter,
|
|
5308
|
-
reportingBasis
|
|
5309
|
-
});
|
|
5310
|
-
const {
|
|
5311
|
-
data: data4,
|
|
5312
|
-
isLoading: isLoading4,
|
|
5313
|
-
error: error4,
|
|
5314
|
-
startDate: startDate4,
|
|
5315
|
-
endDate: endDate4
|
|
5316
|
-
} = useProfitAndLossQuery({
|
|
5317
|
-
startDate: dates[4].startDate,
|
|
5318
|
-
endDate: dates[4].endDate,
|
|
5319
|
-
tagFilter,
|
|
5320
|
-
reportingBasis
|
|
5321
|
-
});
|
|
5322
|
-
const {
|
|
5323
|
-
data: data5,
|
|
5324
|
-
isLoading: isLoading5,
|
|
5325
|
-
error: error5,
|
|
5326
|
-
startDate: startDate5,
|
|
5327
|
-
endDate: endDate5
|
|
5328
|
-
} = useProfitAndLossQuery({
|
|
5329
|
-
startDate: dates[5].startDate,
|
|
5330
|
-
endDate: dates[5].endDate,
|
|
5331
|
-
tagFilter,
|
|
5332
|
-
reportingBasis
|
|
5333
|
-
});
|
|
5334
|
-
const {
|
|
5335
|
-
data: data6,
|
|
5336
|
-
isLoading: isLoading6,
|
|
5337
|
-
error: error6,
|
|
5338
|
-
startDate: startDate6,
|
|
5339
|
-
endDate: endDate6
|
|
5340
|
-
} = useProfitAndLossQuery({
|
|
5341
|
-
startDate: dates[6].startDate,
|
|
5342
|
-
endDate: dates[6].endDate,
|
|
5343
|
-
tagFilter,
|
|
5344
|
-
reportingBasis
|
|
5345
|
-
});
|
|
5346
|
-
const {
|
|
5347
|
-
data: data7,
|
|
5348
|
-
isLoading: isLoading7,
|
|
5349
|
-
error: error7,
|
|
5350
|
-
startDate: startDate7,
|
|
5351
|
-
endDate: endDate7
|
|
5352
|
-
} = useProfitAndLossQuery({
|
|
5353
|
-
startDate: dates[7].startDate,
|
|
5354
|
-
endDate: dates[7].endDate,
|
|
5355
|
-
tagFilter,
|
|
5356
|
-
reportingBasis
|
|
5357
|
-
});
|
|
5358
|
-
const {
|
|
5359
|
-
data: data8,
|
|
5360
|
-
isLoading: isLoading8,
|
|
5361
|
-
error: error8,
|
|
5362
|
-
startDate: startDate8,
|
|
5363
|
-
endDate: endDate8
|
|
5364
|
-
} = useProfitAndLossQuery({
|
|
5365
|
-
startDate: dates[8].startDate,
|
|
5366
|
-
endDate: dates[8].endDate,
|
|
5367
|
-
tagFilter,
|
|
5368
|
-
reportingBasis
|
|
5369
|
-
});
|
|
5370
|
-
const {
|
|
5371
|
-
data: data9,
|
|
5372
|
-
isLoading: isLoading9,
|
|
5373
|
-
error: error9,
|
|
5374
|
-
startDate: startDate9,
|
|
5375
|
-
endDate: endDate9
|
|
5376
|
-
} = useProfitAndLossQuery({
|
|
5377
|
-
startDate: dates[9].startDate,
|
|
5378
|
-
endDate: dates[9].endDate,
|
|
5379
|
-
tagFilter,
|
|
5380
|
-
reportingBasis
|
|
5381
|
-
});
|
|
5382
|
-
const {
|
|
5383
|
-
data: data10,
|
|
5384
|
-
isLoading: isLoading10,
|
|
5385
|
-
error: error10,
|
|
5386
|
-
startDate: startDate10,
|
|
5387
|
-
endDate: endDate10
|
|
5388
|
-
} = useProfitAndLossQuery({
|
|
5389
|
-
startDate: dates[10].startDate,
|
|
5390
|
-
endDate: dates[10].endDate,
|
|
5391
|
-
tagFilter,
|
|
5392
|
-
reportingBasis
|
|
5393
|
-
});
|
|
5394
|
-
const {
|
|
5395
|
-
data: data11,
|
|
5396
|
-
isLoading: isLoading11,
|
|
5397
|
-
error: error11,
|
|
5398
|
-
startDate: startDate11,
|
|
5399
|
-
endDate: endDate11
|
|
5400
|
-
} = useProfitAndLossQuery({
|
|
5401
|
-
startDate: dates[11].startDate,
|
|
5402
|
-
endDate: dates[11].endDate,
|
|
5403
|
-
tagFilter,
|
|
5404
|
-
reportingBasis
|
|
5405
|
-
});
|
|
5406
|
-
const { data, isLoading, error } = (0, import_react52.useMemo)(() => {
|
|
5407
|
-
return {
|
|
5408
|
-
data: [
|
|
5409
|
-
{
|
|
5410
|
-
data: data0,
|
|
5411
|
-
isLoading: isLoading0,
|
|
5412
|
-
error: error0,
|
|
5413
|
-
startDate: startDate0,
|
|
5414
|
-
endDate: endDate0
|
|
5415
|
-
},
|
|
5416
|
-
{
|
|
5417
|
-
data: data1,
|
|
5418
|
-
isLoading: isLoading1,
|
|
5419
|
-
error: error1,
|
|
5420
|
-
startDate: startDate1,
|
|
5421
|
-
endDate: endDate1
|
|
5422
|
-
},
|
|
5423
|
-
{
|
|
5424
|
-
data: data2,
|
|
5425
|
-
isLoading: isLoading2,
|
|
5426
|
-
error: error2,
|
|
5427
|
-
startDate: startDate2,
|
|
5428
|
-
endDate: endDate2
|
|
5429
|
-
},
|
|
5430
|
-
{
|
|
5431
|
-
data: data3,
|
|
5432
|
-
isLoading: isLoading3,
|
|
5433
|
-
error: error3,
|
|
5434
|
-
startDate: startDate3,
|
|
5435
|
-
endDate: endDate3
|
|
5436
|
-
},
|
|
5437
|
-
{
|
|
5438
|
-
data: data4,
|
|
5439
|
-
isLoading: isLoading4,
|
|
5440
|
-
error: error4,
|
|
5441
|
-
startDate: startDate4,
|
|
5442
|
-
endDate: endDate4
|
|
5443
|
-
},
|
|
5444
|
-
{
|
|
5445
|
-
data: data5,
|
|
5446
|
-
isLoading: isLoading5,
|
|
5447
|
-
error: error5,
|
|
5448
|
-
startDate: startDate5,
|
|
5449
|
-
endDate: endDate5
|
|
5450
|
-
},
|
|
5451
|
-
{
|
|
5452
|
-
data: data6,
|
|
5453
|
-
isLoading: isLoading6,
|
|
5454
|
-
error: error6,
|
|
5455
|
-
startDate: startDate6,
|
|
5456
|
-
endDate: endDate6
|
|
5457
|
-
},
|
|
5458
|
-
{
|
|
5459
|
-
data: data7,
|
|
5460
|
-
isLoading: isLoading7,
|
|
5461
|
-
error: error7,
|
|
5462
|
-
startDate: startDate7,
|
|
5463
|
-
endDate: endDate7
|
|
5464
|
-
},
|
|
5465
|
-
{
|
|
5466
|
-
data: data8,
|
|
5467
|
-
isLoading: isLoading8,
|
|
5468
|
-
error: error8,
|
|
5469
|
-
startDate: startDate8,
|
|
5470
|
-
endDate: endDate8
|
|
5471
|
-
},
|
|
5472
|
-
{
|
|
5473
|
-
data: data9,
|
|
5474
|
-
isLoading: isLoading9,
|
|
5475
|
-
error: error9,
|
|
5476
|
-
startDate: startDate9,
|
|
5477
|
-
endDate: endDate9
|
|
5478
|
-
},
|
|
5479
|
-
{
|
|
5480
|
-
data: data10,
|
|
5481
|
-
isLoading: isLoading10,
|
|
5482
|
-
error: error10,
|
|
5483
|
-
startDate: startDate10,
|
|
5484
|
-
endDate: endDate10
|
|
5485
|
-
},
|
|
5486
|
-
{
|
|
5487
|
-
data: data11,
|
|
5488
|
-
isLoading: isLoading11,
|
|
5489
|
-
error: error11,
|
|
5490
|
-
startDate: startDate11,
|
|
5491
|
-
endDate: endDate11
|
|
5492
|
-
}
|
|
5493
|
-
],
|
|
5494
|
-
error: [
|
|
5495
|
-
error0,
|
|
5496
|
-
error1,
|
|
5497
|
-
error2,
|
|
5498
|
-
error3,
|
|
5499
|
-
error4,
|
|
5500
|
-
error5,
|
|
5501
|
-
error6,
|
|
5502
|
-
error7,
|
|
5503
|
-
error8,
|
|
5504
|
-
error9,
|
|
5505
|
-
error10,
|
|
5506
|
-
error11
|
|
5507
|
-
].find((x) => !!x),
|
|
5508
|
-
isLoading: [
|
|
5509
|
-
isLoading0,
|
|
5510
|
-
isLoading1,
|
|
5511
|
-
isLoading2,
|
|
5512
|
-
isLoading3,
|
|
5513
|
-
isLoading4,
|
|
5514
|
-
isLoading5,
|
|
5515
|
-
isLoading6,
|
|
5516
|
-
isLoading7,
|
|
5517
|
-
isLoading8,
|
|
5518
|
-
isLoading9,
|
|
5519
|
-
isLoading10,
|
|
5520
|
-
isLoading11
|
|
5521
|
-
].find((x) => !!x)
|
|
5522
|
-
};
|
|
5523
|
-
}, [
|
|
5524
|
-
data0,
|
|
5525
|
-
data1,
|
|
5526
|
-
data2,
|
|
5527
|
-
data3,
|
|
5528
|
-
data4,
|
|
5529
|
-
data5,
|
|
5530
|
-
data6,
|
|
5531
|
-
data7,
|
|
5532
|
-
data8,
|
|
5533
|
-
data9,
|
|
5534
|
-
data10,
|
|
5535
|
-
data11,
|
|
5536
|
-
isLoading0,
|
|
5537
|
-
isLoading1,
|
|
5538
|
-
isLoading2,
|
|
5539
|
-
isLoading3,
|
|
5540
|
-
isLoading4,
|
|
5541
|
-
isLoading5,
|
|
5542
|
-
isLoading6,
|
|
5543
|
-
isLoading7,
|
|
5544
|
-
isLoading8,
|
|
5545
|
-
isLoading9,
|
|
5546
|
-
isLoading10,
|
|
5547
|
-
isLoading11,
|
|
5548
|
-
error0,
|
|
5549
|
-
error1,
|
|
5550
|
-
error2,
|
|
5551
|
-
error3,
|
|
5552
|
-
error4,
|
|
5553
|
-
error5,
|
|
5554
|
-
error6,
|
|
5555
|
-
error7,
|
|
5556
|
-
error8,
|
|
5557
|
-
error9,
|
|
5558
|
-
error10,
|
|
5559
|
-
error11
|
|
5560
|
-
]);
|
|
5561
|
-
(0, import_react52.useEffect)(() => {
|
|
5562
|
-
if (isLoading && loaded === "initial") {
|
|
5563
|
-
setLoaded("loading");
|
|
5564
|
-
return;
|
|
5565
|
-
}
|
|
5566
|
-
if (!isLoading && data && !data.find((x) => !x.data && !x.error)) {
|
|
5567
|
-
setLoaded("complete");
|
|
5568
|
-
}
|
|
5569
|
-
}, [data, isLoading]);
|
|
5570
|
-
return {
|
|
5571
|
-
data,
|
|
5572
|
-
isLoading,
|
|
5573
|
-
loaded,
|
|
5574
|
-
error
|
|
5575
|
-
};
|
|
5576
|
-
};
|
|
5205
|
+
var import_react53 = __toESM(require("react"));
|
|
5577
5206
|
|
|
5578
5207
|
// src/utils/format.ts
|
|
5579
5208
|
var capitalizeFirstLetter = (text) => text.charAt(0).toUpperCase() + text.slice(1);
|
|
@@ -5614,188 +5243,211 @@ var humanizeEnum = (text) => {
|
|
|
5614
5243
|
};
|
|
5615
5244
|
|
|
5616
5245
|
// src/components/ProfitAndLossChart/Indicator.tsx
|
|
5617
|
-
var
|
|
5246
|
+
var import_react52 = __toESM(require("react"));
|
|
5618
5247
|
var emptyViewBox = { x: 0, y: 0, width: 0, height: 0 };
|
|
5619
5248
|
var Indicator = ({
|
|
5249
|
+
viewBox = {},
|
|
5620
5250
|
className,
|
|
5621
5251
|
animateFrom,
|
|
5622
|
-
setAnimateFrom
|
|
5623
|
-
customCursorSize,
|
|
5624
|
-
setCustomCursorSize,
|
|
5625
|
-
viewBox = {}
|
|
5252
|
+
setAnimateFrom
|
|
5626
5253
|
}) => {
|
|
5627
5254
|
if (!className?.match(/selected/)) {
|
|
5628
5255
|
return null;
|
|
5629
5256
|
}
|
|
5630
|
-
const [opacityIndicator, setOpacityIndicator] = (0, import_react53.useState)(0);
|
|
5631
5257
|
const { x: animateTo = 0, width = 0 } = "x" in viewBox ? viewBox : emptyViewBox;
|
|
5632
5258
|
const margin = width > 12 ? 4 : 1;
|
|
5633
5259
|
const boxWidth = width * 2 + margin;
|
|
5634
5260
|
const multiplier = width > 12 ? 1.2 : 1;
|
|
5635
5261
|
const xOffset = (boxWidth * multiplier - boxWidth) / 2;
|
|
5636
|
-
const borderRadius =
|
|
5637
|
-
|
|
5638
|
-
const rectHeight = "calc(100% - 38px)";
|
|
5639
|
-
(0, import_react53.useEffect)(() => {
|
|
5640
|
-
if (Math.abs(animateTo - animateFrom) < 30) {
|
|
5641
|
-
setOpacityIndicator(0);
|
|
5642
|
-
}
|
|
5262
|
+
const borderRadius = width > 16 ? 8 : width / 2;
|
|
5263
|
+
(0, import_react52.useEffect)(() => {
|
|
5643
5264
|
setAnimateFrom(animateTo);
|
|
5644
|
-
setTimeout(() => {
|
|
5645
|
-
setOpacityIndicator(1);
|
|
5646
|
-
}, 200);
|
|
5647
5265
|
}, [animateTo]);
|
|
5648
|
-
const rectRef = (ref) => {
|
|
5649
|
-
if (ref) {
|
|
5650
|
-
const refRectWidth = ref.getBoundingClientRect().width;
|
|
5651
|
-
const refRectHeight = ref.getBoundingClientRect().height;
|
|
5652
|
-
if (customCursorSize.width !== refRectWidth || customCursorSize.height !== refRectHeight) {
|
|
5653
|
-
setCustomCursorSize(refRectWidth, refRectHeight, actualX - xOffset);
|
|
5654
|
-
}
|
|
5655
|
-
}
|
|
5656
|
-
};
|
|
5657
5266
|
const actualX = animateFrom === -1 ? animateTo : animateFrom;
|
|
5658
|
-
return /* @__PURE__ */
|
|
5267
|
+
return /* @__PURE__ */ import_react52.default.createElement(
|
|
5659
5268
|
"rect",
|
|
5660
5269
|
{
|
|
5661
|
-
ref: rectRef,
|
|
5662
5270
|
className: "Layer__profit-and-loss-chart__selection-indicator",
|
|
5663
5271
|
rx: borderRadius,
|
|
5664
5272
|
ry: borderRadius,
|
|
5665
5273
|
style: {
|
|
5666
|
-
width:
|
|
5274
|
+
width: `${boxWidth * multiplier}px`,
|
|
5667
5275
|
// @ts-expect-error -- y is fine but x apparently isn't!
|
|
5668
5276
|
x: actualX - xOffset,
|
|
5669
|
-
y:
|
|
5670
|
-
height:
|
|
5671
|
-
opacity: opacityIndicator
|
|
5277
|
+
y: 22,
|
|
5278
|
+
height: "calc(100% - 38px)"
|
|
5672
5279
|
}
|
|
5673
5280
|
}
|
|
5674
5281
|
);
|
|
5675
5282
|
};
|
|
5676
5283
|
|
|
5677
5284
|
// src/components/ProfitAndLossChart/ProfitAndLossChart.tsx
|
|
5678
|
-
var
|
|
5679
|
-
var import_date_fns13 = require("date-fns");
|
|
5285
|
+
var import_date_fns11 = require("date-fns");
|
|
5680
5286
|
var import_recharts = require("recharts");
|
|
5681
5287
|
var barGap = 4;
|
|
5682
5288
|
var barSize = 20;
|
|
5683
5289
|
var ProfitAndLossChart = () => {
|
|
5684
5290
|
const { getColor } = useLayerContext();
|
|
5685
|
-
const { changeDateRange, dateRange } = (0,
|
|
5686
|
-
const
|
|
5687
|
-
width: 0,
|
|
5688
|
-
height: 0,
|
|
5689
|
-
x: 0
|
|
5690
|
-
});
|
|
5691
|
-
const [barAnimActive, setBarAnimActive] = (0, import_react54.useState)(true);
|
|
5291
|
+
const { changeDateRange, dateRange } = (0, import_react53.useContext)(ProfitAndLoss.Context);
|
|
5292
|
+
const thisMonth = (0, import_date_fns11.startOfMonth)(Date.now());
|
|
5692
5293
|
const startSelectionMonth = dateRange.startDate.getMonth();
|
|
5693
5294
|
const endSelectionMonth = dateRange.endDate.getMonth();
|
|
5694
|
-
const
|
|
5695
|
-
|
|
5696
|
-
|
|
5697
|
-
|
|
5698
|
-
|
|
5699
|
-
|
|
5700
|
-
|
|
5701
|
-
|
|
5702
|
-
|
|
5703
|
-
|
|
5704
|
-
|
|
5295
|
+
const monthData = [];
|
|
5296
|
+
monthData.push(
|
|
5297
|
+
useProfitAndLoss({
|
|
5298
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 11 })),
|
|
5299
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 11 }))
|
|
5300
|
+
})?.data
|
|
5301
|
+
);
|
|
5302
|
+
monthData.push(
|
|
5303
|
+
useProfitAndLoss({
|
|
5304
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 10 })),
|
|
5305
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 10 }))
|
|
5306
|
+
})?.data
|
|
5307
|
+
);
|
|
5308
|
+
monthData.push(
|
|
5309
|
+
useProfitAndLoss({
|
|
5310
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 9 })),
|
|
5311
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 9 }))
|
|
5312
|
+
})?.data
|
|
5313
|
+
);
|
|
5314
|
+
monthData.push(
|
|
5315
|
+
useProfitAndLoss({
|
|
5316
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 8 })),
|
|
5317
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 8 }))
|
|
5318
|
+
})?.data
|
|
5319
|
+
);
|
|
5320
|
+
monthData.push(
|
|
5321
|
+
useProfitAndLoss({
|
|
5322
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 7 })),
|
|
5323
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 7 }))
|
|
5324
|
+
})?.data
|
|
5325
|
+
);
|
|
5326
|
+
monthData.push(
|
|
5327
|
+
useProfitAndLoss({
|
|
5328
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 6 })),
|
|
5329
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 6 }))
|
|
5330
|
+
})?.data
|
|
5331
|
+
);
|
|
5332
|
+
monthData.push(
|
|
5333
|
+
useProfitAndLoss({
|
|
5334
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 5 })),
|
|
5335
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 5 }))
|
|
5336
|
+
})?.data
|
|
5337
|
+
);
|
|
5338
|
+
monthData.push(
|
|
5339
|
+
useProfitAndLoss({
|
|
5340
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 4 })),
|
|
5341
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 4 }))
|
|
5342
|
+
})?.data
|
|
5343
|
+
);
|
|
5344
|
+
monthData.push(
|
|
5345
|
+
useProfitAndLoss({
|
|
5346
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 3 })),
|
|
5347
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 3 }))
|
|
5348
|
+
})?.data
|
|
5349
|
+
);
|
|
5350
|
+
monthData.push(
|
|
5351
|
+
useProfitAndLoss({
|
|
5352
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 2 })),
|
|
5353
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 2 }))
|
|
5354
|
+
})?.data
|
|
5355
|
+
);
|
|
5356
|
+
monthData.push(
|
|
5357
|
+
useProfitAndLoss({
|
|
5358
|
+
startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 1 })),
|
|
5359
|
+
endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 1 }))
|
|
5360
|
+
})?.data
|
|
5361
|
+
);
|
|
5362
|
+
monthData.push(
|
|
5363
|
+
useProfitAndLoss({
|
|
5364
|
+
startDate: thisMonth,
|
|
5365
|
+
endDate: (0, import_date_fns11.endOfMonth)(thisMonth)
|
|
5366
|
+
})?.data
|
|
5367
|
+
);
|
|
5368
|
+
const getMonthName = (pnl) => pnl ? (0, import_date_fns11.format)((0, import_date_fns11.parseISO)(pnl.start_date), "LLL") : "";
|
|
5705
5369
|
const summarizePnL = (pnl) => ({
|
|
5706
5370
|
name: getMonthName(pnl),
|
|
5707
5371
|
revenue: pnl?.income.value || 0,
|
|
5708
5372
|
expenses: Math.abs((pnl?.income.value || 0) - (pnl?.net_profit || 0)),
|
|
5709
5373
|
netProfit: pnl?.net_profit || 0,
|
|
5710
|
-
selected: !!pnl && (0,
|
|
5374
|
+
selected: !!pnl && (0, import_date_fns11.parseISO)(pnl.start_date).getMonth() >= startSelectionMonth && (0, import_date_fns11.parseISO)(pnl.end_date).getMonth() <= endSelectionMonth
|
|
5711
5375
|
});
|
|
5712
5376
|
const onClick = ({ activeTooltipIndex }) => {
|
|
5713
|
-
const selection =
|
|
5714
|
-
if (selection
|
|
5715
|
-
const { start_date, end_date } = selection
|
|
5377
|
+
const selection = monthData[activeTooltipIndex || -1];
|
|
5378
|
+
if (selection) {
|
|
5379
|
+
const { start_date: startDate, end_date: endDate } = selection;
|
|
5716
5380
|
changeDateRange({
|
|
5717
|
-
startDate: (0,
|
|
5718
|
-
endDate: (0,
|
|
5381
|
+
startDate: (0, import_date_fns11.parseISO)(startDate),
|
|
5382
|
+
endDate: (0, import_date_fns11.parseISO)(endDate)
|
|
5719
5383
|
});
|
|
5720
5384
|
}
|
|
5721
5385
|
};
|
|
5722
|
-
const CustomTooltip = ({
|
|
5386
|
+
const CustomTooltip = ({
|
|
5387
|
+
active,
|
|
5388
|
+
payload,
|
|
5389
|
+
label
|
|
5390
|
+
}) => {
|
|
5723
5391
|
if (active && payload && payload.length) {
|
|
5724
5392
|
const netProfit = payload[0].payload.netProfit ?? 0;
|
|
5725
5393
|
const netProfitClass = netProfit > 0 ? "positive" : netProfit < 0 ? "negative" : "";
|
|
5726
|
-
return /* @__PURE__ */
|
|
5727
|
-
"span",
|
|
5728
|
-
{
|
|
5729
|
-
className: `Layer__chart__tooltip-value ${netProfitClass}`
|
|
5730
|
-
},
|
|
5731
|
-
"$",
|
|
5732
|
-
centsToDollars(netProfit)
|
|
5733
|
-
))));
|
|
5394
|
+
return /* @__PURE__ */ import_react53.default.createElement("div", { className: "Layer__chart__tooltip" }, /* @__PURE__ */ import_react53.default.createElement("ul", { className: "Layer__chart__tooltip-list" }, /* @__PURE__ */ import_react53.default.createElement("li", null, /* @__PURE__ */ import_react53.default.createElement("label", { className: "Layer__chart__tooltip-label" }, capitalizeFirstLetter(payload[0].name ?? "")), /* @__PURE__ */ import_react53.default.createElement("span", { className: "Layer__chart__tooltip-value" }, "$", centsToDollars(Math.abs(payload[0].value ?? 0)))), /* @__PURE__ */ import_react53.default.createElement("li", null, /* @__PURE__ */ import_react53.default.createElement("label", { className: "Layer__chart__tooltip-label" }, capitalizeFirstLetter(payload[1].name ?? "")), /* @__PURE__ */ import_react53.default.createElement("span", { className: "Layer__chart__tooltip-value" }, "$", centsToDollars(Math.abs(payload[1].value ?? 0)))), /* @__PURE__ */ import_react53.default.createElement("li", null, /* @__PURE__ */ import_react53.default.createElement("label", { className: "Layer__chart__tooltip-label" }, "Net Profit"), /* @__PURE__ */ import_react53.default.createElement("span", { className: `Layer__chart__tooltip-value ${netProfitClass}` }, "$", centsToDollars(netProfit)))));
|
|
5734
5395
|
}
|
|
5735
5396
|
return null;
|
|
5736
5397
|
};
|
|
5737
5398
|
const CustomizedCursor = (props) => {
|
|
5738
|
-
const { x,
|
|
5739
|
-
|
|
5740
|
-
const offsetX = width * 0.1;
|
|
5741
|
-
return /* @__PURE__ */ import_react54.default.createElement(
|
|
5399
|
+
const { x, width, height } = props;
|
|
5400
|
+
return /* @__PURE__ */ import_react53.default.createElement(
|
|
5742
5401
|
import_recharts.Rectangle,
|
|
5743
5402
|
{
|
|
5744
|
-
fill: "#
|
|
5403
|
+
fill: getColor(900)?.hex ?? "#333",
|
|
5745
5404
|
stroke: "none",
|
|
5746
|
-
x: x +
|
|
5747
|
-
y,
|
|
5748
|
-
|
|
5749
|
-
|
|
5750
|
-
|
|
5405
|
+
x: x + width / 2 - 11,
|
|
5406
|
+
y: height + 44,
|
|
5407
|
+
radius: 2,
|
|
5408
|
+
width: 22,
|
|
5409
|
+
height: 2,
|
|
5751
5410
|
className: "Layer__chart__tooltip-cursor"
|
|
5752
5411
|
}
|
|
5753
5412
|
);
|
|
5754
5413
|
};
|
|
5755
|
-
const
|
|
5756
|
-
|
|
5757
|
-
|
|
5758
|
-
|
|
5759
|
-
|
|
5760
|
-
|
|
5761
|
-
|
|
5762
|
-
|
|
5763
|
-
|
|
5764
|
-
|
|
5765
|
-
return data?.map((x) => summarizePnL(x.data));
|
|
5766
|
-
}, [startSelectionMonth, endSelectionMonth, loaded]);
|
|
5767
|
-
const [animateFrom, setAnimateFrom] = (0, import_react54.useState)(-1);
|
|
5768
|
-
return /* @__PURE__ */ import_react54.default.createElement(
|
|
5414
|
+
const data = (0, import_react53.useMemo)(
|
|
5415
|
+
() => monthData.map(summarizePnL),
|
|
5416
|
+
[
|
|
5417
|
+
startSelectionMonth,
|
|
5418
|
+
endSelectionMonth,
|
|
5419
|
+
...monthData.map((m) => m?.net_profit)
|
|
5420
|
+
]
|
|
5421
|
+
);
|
|
5422
|
+
const [animateFrom, setAnimateFrom] = (0, import_react53.useState)(-1);
|
|
5423
|
+
return /* @__PURE__ */ import_react53.default.createElement(
|
|
5769
5424
|
import_recharts.ResponsiveContainer,
|
|
5770
5425
|
{
|
|
5771
|
-
className:
|
|
5772
|
-
"Layer__chart-container",
|
|
5773
|
-
loaded !== "complete" && "Layer__chart-container--loading"
|
|
5774
|
-
),
|
|
5426
|
+
className: "Layer__chart-container",
|
|
5775
5427
|
width: "100%",
|
|
5776
5428
|
height: "100%",
|
|
5777
5429
|
minHeight: 200
|
|
5778
5430
|
},
|
|
5779
|
-
/* @__PURE__ */
|
|
5431
|
+
/* @__PURE__ */ import_react53.default.createElement(
|
|
5780
5432
|
import_recharts.BarChart,
|
|
5781
5433
|
{
|
|
5782
5434
|
margin: { left: 12, right: 12, bottom: 12 },
|
|
5783
|
-
data
|
|
5435
|
+
data,
|
|
5784
5436
|
onClick,
|
|
5785
5437
|
barGap,
|
|
5786
5438
|
className: "Layer__profit-and-loss-chart"
|
|
5787
5439
|
},
|
|
5788
|
-
/* @__PURE__ */
|
|
5440
|
+
/* @__PURE__ */ import_react53.default.createElement(
|
|
5789
5441
|
import_recharts.Tooltip,
|
|
5790
5442
|
{
|
|
5791
5443
|
wrapperClassName: "Layer__chart__tooltip-wrapper",
|
|
5792
|
-
content: /* @__PURE__ */
|
|
5793
|
-
cursor: /* @__PURE__ */
|
|
5444
|
+
content: /* @__PURE__ */ import_react53.default.createElement(CustomTooltip, null),
|
|
5445
|
+
cursor: /* @__PURE__ */ import_react53.default.createElement(CustomizedCursor, null),
|
|
5794
5446
|
animationDuration: 100,
|
|
5795
5447
|
animationEasing: "ease-out"
|
|
5796
5448
|
}
|
|
5797
5449
|
),
|
|
5798
|
-
/* @__PURE__ */
|
|
5450
|
+
/* @__PURE__ */ import_react53.default.createElement(
|
|
5799
5451
|
import_recharts.CartesianGrid,
|
|
5800
5452
|
{
|
|
5801
5453
|
vertical: false,
|
|
@@ -5803,12 +5455,12 @@ var ProfitAndLossChart = () => {
|
|
|
5803
5455
|
strokeDasharray: "5 5"
|
|
5804
5456
|
}
|
|
5805
5457
|
),
|
|
5806
|
-
/* @__PURE__ */
|
|
5458
|
+
/* @__PURE__ */ import_react53.default.createElement(
|
|
5807
5459
|
import_recharts.Legend,
|
|
5808
5460
|
{
|
|
5809
|
-
verticalAlign: "
|
|
5461
|
+
verticalAlign: "top",
|
|
5810
5462
|
align: "left",
|
|
5811
|
-
wrapperStyle: {
|
|
5463
|
+
wrapperStyle: { top: -24 },
|
|
5812
5464
|
payload: [
|
|
5813
5465
|
{
|
|
5814
5466
|
value: "Revenue",
|
|
@@ -5823,50 +5475,46 @@ var ProfitAndLossChart = () => {
|
|
|
5823
5475
|
]
|
|
5824
5476
|
}
|
|
5825
5477
|
),
|
|
5826
|
-
/* @__PURE__ */
|
|
5827
|
-
/* @__PURE__ */
|
|
5478
|
+
/* @__PURE__ */ import_react53.default.createElement(import_recharts.XAxis, { dataKey: "name", tickLine: false }),
|
|
5479
|
+
/* @__PURE__ */ import_react53.default.createElement(
|
|
5828
5480
|
import_recharts.Bar,
|
|
5829
5481
|
{
|
|
5830
5482
|
dataKey: "revenue",
|
|
5831
5483
|
barSize,
|
|
5832
|
-
isAnimationActive:
|
|
5484
|
+
isAnimationActive: false,
|
|
5833
5485
|
radius: [2, 2, 0, 0],
|
|
5834
5486
|
className: "Layer__profit-and-loss-chart__bar--income"
|
|
5835
5487
|
},
|
|
5836
|
-
/* @__PURE__ */
|
|
5488
|
+
/* @__PURE__ */ import_react53.default.createElement(
|
|
5837
5489
|
import_recharts.LabelList,
|
|
5838
5490
|
{
|
|
5839
|
-
content: /* @__PURE__ */
|
|
5491
|
+
content: /* @__PURE__ */ import_react53.default.createElement(
|
|
5840
5492
|
Indicator,
|
|
5841
5493
|
{
|
|
5842
|
-
setCustomCursorSize: (width, height, x) => setCustomCursorSize({ width, height, x }),
|
|
5843
|
-
customCursorSize,
|
|
5844
5494
|
animateFrom,
|
|
5845
5495
|
setAnimateFrom
|
|
5846
5496
|
}
|
|
5847
5497
|
)
|
|
5848
5498
|
}
|
|
5849
5499
|
),
|
|
5850
|
-
|
|
5851
|
-
|
|
5852
|
-
|
|
5853
|
-
|
|
5854
|
-
|
|
5855
|
-
|
|
5856
|
-
|
|
5857
|
-
);
|
|
5858
|
-
})
|
|
5500
|
+
data.map((entry) => /* @__PURE__ */ import_react53.default.createElement(
|
|
5501
|
+
import_recharts.Cell,
|
|
5502
|
+
{
|
|
5503
|
+
key: entry.name,
|
|
5504
|
+
className: entry.selected ? "Layer__profit-and-loss-chart__cell--selected" : ""
|
|
5505
|
+
}
|
|
5506
|
+
))
|
|
5859
5507
|
),
|
|
5860
|
-
/* @__PURE__ */
|
|
5508
|
+
/* @__PURE__ */ import_react53.default.createElement(
|
|
5861
5509
|
import_recharts.Bar,
|
|
5862
5510
|
{
|
|
5863
5511
|
dataKey: "expenses",
|
|
5864
5512
|
barSize,
|
|
5865
|
-
isAnimationActive:
|
|
5513
|
+
isAnimationActive: false,
|
|
5866
5514
|
radius: [2, 2, 0, 0],
|
|
5867
5515
|
className: "Layer__profit-and-loss-chart__bar--expenses"
|
|
5868
5516
|
},
|
|
5869
|
-
|
|
5517
|
+
data.map((entry) => /* @__PURE__ */ import_react53.default.createElement(
|
|
5870
5518
|
import_recharts.Cell,
|
|
5871
5519
|
{
|
|
5872
5520
|
key: entry.name,
|
|
@@ -5879,19 +5527,19 @@ var ProfitAndLossChart = () => {
|
|
|
5879
5527
|
};
|
|
5880
5528
|
|
|
5881
5529
|
// src/components/ProfitAndLossDatePicker/ProfitAndLossDatePicker.tsx
|
|
5882
|
-
var
|
|
5883
|
-
var
|
|
5530
|
+
var import_react54 = __toESM(require("react"));
|
|
5531
|
+
var import_date_fns12 = require("date-fns");
|
|
5884
5532
|
var ProfitAndLossDatePicker = () => {
|
|
5885
|
-
const { changeDateRange, dateRange } = (0,
|
|
5886
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
5887
|
-
const [localDate, setLocalDate] = (0,
|
|
5888
|
-
const [nextOpacity, setNextOpacity] = (0,
|
|
5889
|
-
const [currentOpacity, setCurrentOpacity] = (0,
|
|
5890
|
-
const [transformStyle, setTransformStyle] = (0,
|
|
5533
|
+
const { changeDateRange, dateRange } = (0, import_react54.useContext)(ProfitAndLoss.Context);
|
|
5534
|
+
const [isAnimating, setIsAnimating] = (0, import_react54.useState)(false);
|
|
5535
|
+
const [localDate, setLocalDate] = (0, import_react54.useState)(dateRange.startDate);
|
|
5536
|
+
const [nextOpacity, setNextOpacity] = (0, import_react54.useState)(0);
|
|
5537
|
+
const [currentOpacity, setCurrentOpacity] = (0, import_react54.useState)(1);
|
|
5538
|
+
const [transformStyle, setTransformStyle] = (0, import_react54.useState)({
|
|
5891
5539
|
transform: "translateX(33%)",
|
|
5892
5540
|
transition: "ease"
|
|
5893
5541
|
});
|
|
5894
|
-
(0,
|
|
5542
|
+
(0, import_react54.useEffect)(() => {
|
|
5895
5543
|
if (dateRange.startDate !== localDate && !isAnimating) {
|
|
5896
5544
|
setLocalDate(dateRange.startDate);
|
|
5897
5545
|
setTransformStyle({ transform: "translateX(33%)", transition: "none" });
|
|
@@ -5902,13 +5550,13 @@ var ProfitAndLossDatePicker = () => {
|
|
|
5902
5550
|
return;
|
|
5903
5551
|
setIsAnimating(true);
|
|
5904
5552
|
setNextOpacity(1);
|
|
5905
|
-
const newDate = (0,
|
|
5553
|
+
const newDate = (0, import_date_fns12.add)(localDate, { months: monthsToAdd });
|
|
5906
5554
|
if (monthsToAdd === -1) {
|
|
5907
5555
|
setCurrentOpacity(0);
|
|
5908
5556
|
}
|
|
5909
5557
|
changeDateRange({
|
|
5910
|
-
startDate: (0,
|
|
5911
|
-
endDate: (0,
|
|
5558
|
+
startDate: (0, import_date_fns12.startOfMonth)(newDate),
|
|
5559
|
+
endDate: (0, import_date_fns12.endOfMonth)(newDate)
|
|
5912
5560
|
});
|
|
5913
5561
|
const translateXValue = monthsToAdd > 0 ? "0%" : "66%";
|
|
5914
5562
|
setTransformStyle({
|
|
@@ -5926,67 +5574,67 @@ var ProfitAndLossDatePicker = () => {
|
|
|
5926
5574
|
setCurrentOpacity(1);
|
|
5927
5575
|
}, 300);
|
|
5928
5576
|
};
|
|
5929
|
-
const currentLabel = (0,
|
|
5930
|
-
const prevLabel = (0,
|
|
5931
|
-
const nextLabel = (0,
|
|
5932
|
-
return /* @__PURE__ */
|
|
5577
|
+
const currentLabel = (0, import_date_fns12.format)(localDate, "LLLL, y");
|
|
5578
|
+
const prevLabel = (0, import_date_fns12.format)((0, import_date_fns12.add)(localDate, { months: -1 }), "LLLL, y");
|
|
5579
|
+
const nextLabel = (0, import_date_fns12.format)((0, import_date_fns12.add)(localDate, { months: 1 }), "LLLL, y");
|
|
5580
|
+
return /* @__PURE__ */ import_react54.default.createElement(
|
|
5933
5581
|
"div",
|
|
5934
5582
|
{
|
|
5935
|
-
className: "Layer__profit-and-loss-date-
|
|
5936
|
-
style: transformStyle
|
|
5583
|
+
className: "Layer__profit-and-loss-date-picker"
|
|
5937
5584
|
},
|
|
5938
|
-
/* @__PURE__ */
|
|
5939
|
-
/* @__PURE__ */ import_react55.default.createElement(
|
|
5585
|
+
/* @__PURE__ */ import_react54.default.createElement("div", { className: "Layer__profit-and-loss-date-picker__labels-container", style: transformStyle }, /* @__PURE__ */ import_react54.default.createElement("span", { className: "Layer__profit-and-loss-date-picker__label" }, prevLabel), /* @__PURE__ */ import_react54.default.createElement(
|
|
5940
5586
|
"span",
|
|
5941
5587
|
{
|
|
5942
5588
|
className: "Layer__profit-and-loss-date-picker__label",
|
|
5943
5589
|
style: { opacity: currentOpacity }
|
|
5944
5590
|
},
|
|
5945
5591
|
currentLabel
|
|
5946
|
-
),
|
|
5947
|
-
/* @__PURE__ */ import_react55.default.createElement(
|
|
5592
|
+
), /* @__PURE__ */ import_react54.default.createElement(
|
|
5948
5593
|
"span",
|
|
5949
5594
|
{
|
|
5950
5595
|
className: "Layer__profit-and-loss-date-picker__label",
|
|
5951
5596
|
style: { opacity: nextOpacity }
|
|
5952
5597
|
},
|
|
5953
5598
|
nextLabel
|
|
5954
|
-
)
|
|
5955
|
-
|
|
5956
|
-
|
|
5957
|
-
{
|
|
5958
|
-
"aria-label": "View Previous Month",
|
|
5959
|
-
className: "Layer__profit-and-loss-date-picker__button",
|
|
5960
|
-
onClick: () => change(-1),
|
|
5961
|
-
disabled: isAnimating
|
|
5962
|
-
},
|
|
5963
|
-
/* @__PURE__ */ import_react55.default.createElement(
|
|
5964
|
-
ChevronLeft_default,
|
|
5599
|
+
)),
|
|
5600
|
+
/* @__PURE__ */ import_react54.default.createElement(
|
|
5601
|
+
"button",
|
|
5965
5602
|
{
|
|
5966
|
-
|
|
5967
|
-
|
|
5968
|
-
|
|
5969
|
-
|
|
5970
|
-
|
|
5971
|
-
|
|
5972
|
-
|
|
5973
|
-
|
|
5974
|
-
|
|
5975
|
-
|
|
5976
|
-
|
|
5977
|
-
|
|
5978
|
-
|
|
5979
|
-
|
|
5603
|
+
"aria-label": "View Previous Month",
|
|
5604
|
+
className: "Layer__profit-and-loss-date-picker__button",
|
|
5605
|
+
onClick: () => change(-1),
|
|
5606
|
+
disabled: isAnimating
|
|
5607
|
+
},
|
|
5608
|
+
/* @__PURE__ */ import_react54.default.createElement(
|
|
5609
|
+
ChevronLeft_default,
|
|
5610
|
+
{
|
|
5611
|
+
className: "Layer__profit-and-loss-date-picker__button-icon",
|
|
5612
|
+
size: 16
|
|
5613
|
+
}
|
|
5614
|
+
)
|
|
5615
|
+
),
|
|
5616
|
+
/* @__PURE__ */ import_react54.default.createElement(
|
|
5617
|
+
"button",
|
|
5980
5618
|
{
|
|
5981
|
-
|
|
5982
|
-
|
|
5983
|
-
|
|
5984
|
-
|
|
5985
|
-
|
|
5619
|
+
"aria-label": "View Next Month",
|
|
5620
|
+
className: "Layer__profit-and-loss-date-picker__button",
|
|
5621
|
+
onClick: () => change(1),
|
|
5622
|
+
disabled: isAnimating
|
|
5623
|
+
},
|
|
5624
|
+
/* @__PURE__ */ import_react54.default.createElement(
|
|
5625
|
+
ChevronRight_default,
|
|
5626
|
+
{
|
|
5627
|
+
className: "Layer__profit-and-loss-date-picker__button-icon",
|
|
5628
|
+
size: 16
|
|
5629
|
+
}
|
|
5630
|
+
)
|
|
5631
|
+
),
|
|
5632
|
+
/* @__PURE__ */ import_react54.default.createElement("div", { className: "Layer__profit-and-loss-date-picker__effect-blur" })
|
|
5633
|
+
);
|
|
5986
5634
|
};
|
|
5987
5635
|
|
|
5988
5636
|
// src/components/ProfitAndLossDetailedCharts/ProfitAndLossDetailedCharts.tsx
|
|
5989
|
-
var
|
|
5637
|
+
var import_react58 = __toESM(require("react"));
|
|
5990
5638
|
|
|
5991
5639
|
// src/icons/X.tsx
|
|
5992
5640
|
var React68 = __toESM(require("react"));
|
|
@@ -6022,7 +5670,7 @@ var X = ({ size = 18, ...props }) => /* @__PURE__ */ React68.createElement(
|
|
|
6022
5670
|
var X_default = X;
|
|
6023
5671
|
|
|
6024
5672
|
// src/components/ProfitAndLossDetailedCharts/DetailedChart.tsx
|
|
6025
|
-
var
|
|
5673
|
+
var import_react55 = __toESM(require("react"));
|
|
6026
5674
|
|
|
6027
5675
|
// src/config/charts.ts
|
|
6028
5676
|
var INACTIVE_OPACITY_LEVELS = [
|
|
@@ -6121,7 +5769,7 @@ var DetailedChart = ({
|
|
|
6121
5769
|
date,
|
|
6122
5770
|
isLoading
|
|
6123
5771
|
}) => {
|
|
6124
|
-
const chartData = (0,
|
|
5772
|
+
const chartData = (0, import_react55.useMemo)(() => {
|
|
6125
5773
|
if (!filteredData) {
|
|
6126
5774
|
return [];
|
|
6127
5775
|
}
|
|
@@ -6139,7 +5787,7 @@ var DetailedChart = ({
|
|
|
6139
5787
|
});
|
|
6140
5788
|
}, [filteredData, isLoading]);
|
|
6141
5789
|
const noValue = chartData.length === 0 || !chartData.find((x) => x.value !== 0);
|
|
6142
|
-
return /* @__PURE__ */
|
|
5790
|
+
return /* @__PURE__ */ import_react55.default.createElement("div", { className: "chart-field" }, /* @__PURE__ */ import_react55.default.createElement("div", { className: "header--tablet" }, /* @__PURE__ */ import_react55.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, humanizeTitle(sidebarScope)), /* @__PURE__ */ import_react55.default.createElement(ProfitAndLossDatePicker, null)), /* @__PURE__ */ import_react55.default.createElement("div", { className: "chart-container" }, /* @__PURE__ */ import_react55.default.createElement(import_recharts2.ResponsiveContainer, null, /* @__PURE__ */ import_react55.default.createElement(import_recharts2.PieChart, null, !isLoading && !noValue ? /* @__PURE__ */ import_react55.default.createElement(
|
|
6143
5791
|
import_recharts2.Pie,
|
|
6144
5792
|
{
|
|
6145
5793
|
data: chartData,
|
|
@@ -6164,7 +5812,7 @@ var DetailedChart = ({
|
|
|
6164
5812
|
fill = void 0;
|
|
6165
5813
|
opacity = INACTIVE_OPACITY_LEVELS[index % INACTIVE_OPACITY_LEVELS.length];
|
|
6166
5814
|
}
|
|
6167
|
-
return /* @__PURE__ */
|
|
5815
|
+
return /* @__PURE__ */ import_react55.default.createElement(
|
|
6168
5816
|
import_recharts2.Cell,
|
|
6169
5817
|
{
|
|
6170
5818
|
key: `cell-${index}`,
|
|
@@ -6176,7 +5824,7 @@ var DetailedChart = ({
|
|
|
6176
5824
|
}
|
|
6177
5825
|
);
|
|
6178
5826
|
}),
|
|
6179
|
-
/* @__PURE__ */
|
|
5827
|
+
/* @__PURE__ */ import_react55.default.createElement(
|
|
6180
5828
|
import_recharts2.Label,
|
|
6181
5829
|
{
|
|
6182
5830
|
position: "center",
|
|
@@ -6197,7 +5845,7 @@ var DetailedChart = ({
|
|
|
6197
5845
|
if (hoveredItem) {
|
|
6198
5846
|
text = hoveredItem;
|
|
6199
5847
|
}
|
|
6200
|
-
return /* @__PURE__ */
|
|
5848
|
+
return /* @__PURE__ */ import_react55.default.createElement(
|
|
6201
5849
|
import_recharts2.Text,
|
|
6202
5850
|
{
|
|
6203
5851
|
...positioningProps,
|
|
@@ -6208,7 +5856,7 @@ var DetailedChart = ({
|
|
|
6208
5856
|
}
|
|
6209
5857
|
}
|
|
6210
5858
|
),
|
|
6211
|
-
/* @__PURE__ */
|
|
5859
|
+
/* @__PURE__ */ import_react55.default.createElement(
|
|
6212
5860
|
import_recharts2.Label,
|
|
6213
5861
|
{
|
|
6214
5862
|
position: "center",
|
|
@@ -6231,7 +5879,7 @@ var DetailedChart = ({
|
|
|
6231
5879
|
(x) => x.display_name === hoveredItem
|
|
6232
5880
|
)?.value;
|
|
6233
5881
|
}
|
|
6234
|
-
return /* @__PURE__ */
|
|
5882
|
+
return /* @__PURE__ */ import_react55.default.createElement(
|
|
6235
5883
|
import_recharts2.Text,
|
|
6236
5884
|
{
|
|
6237
5885
|
...positioningProps,
|
|
@@ -6242,7 +5890,7 @@ var DetailedChart = ({
|
|
|
6242
5890
|
}
|
|
6243
5891
|
}
|
|
6244
5892
|
),
|
|
6245
|
-
/* @__PURE__ */
|
|
5893
|
+
/* @__PURE__ */ import_react55.default.createElement(
|
|
6246
5894
|
import_recharts2.Label,
|
|
6247
5895
|
{
|
|
6248
5896
|
position: "center",
|
|
@@ -6261,7 +5909,7 @@ var DetailedChart = ({
|
|
|
6261
5909
|
verticalAnchor: "middle"
|
|
6262
5910
|
};
|
|
6263
5911
|
if (hoveredItem) {
|
|
6264
|
-
return /* @__PURE__ */
|
|
5912
|
+
return /* @__PURE__ */ import_react55.default.createElement(
|
|
6265
5913
|
import_recharts2.Text,
|
|
6266
5914
|
{
|
|
6267
5915
|
...positioningProps,
|
|
@@ -6278,7 +5926,7 @@ var DetailedChart = ({
|
|
|
6278
5926
|
}
|
|
6279
5927
|
}
|
|
6280
5928
|
)
|
|
6281
|
-
) : null, !isLoading && noValue ? /* @__PURE__ */
|
|
5929
|
+
) : null, !isLoading && noValue ? /* @__PURE__ */ import_react55.default.createElement(
|
|
6282
5930
|
import_recharts2.Pie,
|
|
6283
5931
|
{
|
|
6284
5932
|
data: [{ name: "Total", value: 1 }],
|
|
@@ -6293,7 +5941,7 @@ var DetailedChart = ({
|
|
|
6293
5941
|
animationDuration: 200,
|
|
6294
5942
|
animationEasing: "ease-in-out"
|
|
6295
5943
|
},
|
|
6296
|
-
/* @__PURE__ */
|
|
5944
|
+
/* @__PURE__ */ import_react55.default.createElement(
|
|
6297
5945
|
import_recharts2.Label,
|
|
6298
5946
|
{
|
|
6299
5947
|
position: "center",
|
|
@@ -6314,7 +5962,7 @@ var DetailedChart = ({
|
|
|
6314
5962
|
if (hoveredItem) {
|
|
6315
5963
|
text = hoveredItem;
|
|
6316
5964
|
}
|
|
6317
|
-
return /* @__PURE__ */
|
|
5965
|
+
return /* @__PURE__ */ import_react55.default.createElement(
|
|
6318
5966
|
import_recharts2.Text,
|
|
6319
5967
|
{
|
|
6320
5968
|
...positioningProps,
|
|
@@ -6325,7 +5973,7 @@ var DetailedChart = ({
|
|
|
6325
5973
|
}
|
|
6326
5974
|
}
|
|
6327
5975
|
),
|
|
6328
|
-
/* @__PURE__ */
|
|
5976
|
+
/* @__PURE__ */ import_react55.default.createElement(
|
|
6329
5977
|
import_recharts2.Label,
|
|
6330
5978
|
{
|
|
6331
5979
|
position: "center",
|
|
@@ -6348,7 +5996,7 @@ var DetailedChart = ({
|
|
|
6348
5996
|
(x) => x.display_name === hoveredItem
|
|
6349
5997
|
)?.value;
|
|
6350
5998
|
}
|
|
6351
|
-
return /* @__PURE__ */
|
|
5999
|
+
return /* @__PURE__ */ import_react55.default.createElement(
|
|
6352
6000
|
import_recharts2.Text,
|
|
6353
6001
|
{
|
|
6354
6002
|
...positioningProps,
|
|
@@ -6359,7 +6007,7 @@ var DetailedChart = ({
|
|
|
6359
6007
|
}
|
|
6360
6008
|
}
|
|
6361
6009
|
)
|
|
6362
|
-
) : null, isLoading ? /* @__PURE__ */
|
|
6010
|
+
) : null, isLoading ? /* @__PURE__ */ import_react55.default.createElement(
|
|
6363
6011
|
import_recharts2.Pie,
|
|
6364
6012
|
{
|
|
6365
6013
|
data: [{ name: "loading...", value: 1 }],
|
|
@@ -6378,7 +6026,7 @@ var DetailedChart = ({
|
|
|
6378
6026
|
};
|
|
6379
6027
|
|
|
6380
6028
|
// src/components/ProfitAndLossDetailedCharts/DetailedTable.tsx
|
|
6381
|
-
var
|
|
6029
|
+
var import_react56 = __toESM(require("react"));
|
|
6382
6030
|
|
|
6383
6031
|
// src/icons/SortArrows.tsx
|
|
6384
6032
|
var React70 = __toESM(require("react"));
|
|
@@ -6392,7 +6040,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React70.createElem
|
|
|
6392
6040
|
width: size,
|
|
6393
6041
|
height: size
|
|
6394
6042
|
},
|
|
6395
|
-
/* @__PURE__ */ React70.createElement("g", {
|
|
6043
|
+
/* @__PURE__ */ React70.createElement("g", { "clip-path": "url(#clip0_1758_75388)" }, /* @__PURE__ */ React70.createElement(
|
|
6396
6044
|
"path",
|
|
6397
6045
|
{
|
|
6398
6046
|
d: "M1.33325 8.5L3.99992 11.1667L6.66659 8.5",
|
|
@@ -6442,7 +6090,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React70.createElem
|
|
|
6442
6090
|
var SortArrows_default = SortArrows;
|
|
6443
6091
|
|
|
6444
6092
|
// src/components/ProfitAndLossDetailedCharts/DetailedTable.tsx
|
|
6445
|
-
var
|
|
6093
|
+
var import_classnames27 = __toESM(require("classnames"));
|
|
6446
6094
|
var DetailedTable = ({
|
|
6447
6095
|
filteredData,
|
|
6448
6096
|
sidebarScope,
|
|
@@ -6452,52 +6100,52 @@ var DetailedTable = ({
|
|
|
6452
6100
|
setHoveredItem
|
|
6453
6101
|
}) => {
|
|
6454
6102
|
const buildColClass = (column) => {
|
|
6455
|
-
return (0,
|
|
6103
|
+
return (0, import_classnames27.default)(
|
|
6456
6104
|
"Layer__sortable-col",
|
|
6457
6105
|
sidebarScope && filters[sidebarScope]?.sortBy === column ? `sort--${(sidebarScope && filters[sidebarScope]?.sortDirection) ?? "desc"}` : ""
|
|
6458
6106
|
);
|
|
6459
6107
|
};
|
|
6460
|
-
return /* @__PURE__ */
|
|
6108
|
+
return /* @__PURE__ */ import_react56.default.createElement("div", { className: "details-container" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "table" }, /* @__PURE__ */ import_react56.default.createElement("table", null, /* @__PURE__ */ import_react56.default.createElement("thead", null, /* @__PURE__ */ import_react56.default.createElement("tr", null, /* @__PURE__ */ import_react56.default.createElement(
|
|
6461
6109
|
"th",
|
|
6462
6110
|
{
|
|
6463
6111
|
className: buildColClass("category"),
|
|
6464
6112
|
onClick: () => sortBy(sidebarScope ?? "expenses", "category")
|
|
6465
6113
|
},
|
|
6466
6114
|
"Expense/Sale ",
|
|
6467
|
-
/* @__PURE__ */
|
|
6468
|
-
), /* @__PURE__ */
|
|
6115
|
+
/* @__PURE__ */ import_react56.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
|
|
6116
|
+
), /* @__PURE__ */ import_react56.default.createElement(
|
|
6469
6117
|
"th",
|
|
6470
6118
|
{
|
|
6471
6119
|
className: buildColClass("type"),
|
|
6472
6120
|
onClick: () => sortBy(sidebarScope ?? "expenses", "type")
|
|
6473
6121
|
},
|
|
6474
6122
|
"Type ",
|
|
6475
|
-
/* @__PURE__ */
|
|
6476
|
-
), /* @__PURE__ */
|
|
6123
|
+
/* @__PURE__ */ import_react56.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
|
|
6124
|
+
), /* @__PURE__ */ import_react56.default.createElement("th", null), /* @__PURE__ */ import_react56.default.createElement(
|
|
6477
6125
|
"th",
|
|
6478
6126
|
{
|
|
6479
6127
|
className: buildColClass("value"),
|
|
6480
6128
|
onClick: () => sortBy(sidebarScope ?? "expenses", "value")
|
|
6481
6129
|
},
|
|
6482
6130
|
"Value ",
|
|
6483
|
-
/* @__PURE__ */
|
|
6484
|
-
))), /* @__PURE__ */
|
|
6131
|
+
/* @__PURE__ */ import_react56.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
|
|
6132
|
+
))), /* @__PURE__ */ import_react56.default.createElement("tbody", null, filteredData.filter((x) => !x.hidden).map((item, idx) => {
|
|
6485
6133
|
const colorConfig = DEFAULT_CHART_COLORS[idx % DEFAULT_CHART_COLORS.length];
|
|
6486
|
-
return /* @__PURE__ */
|
|
6134
|
+
return /* @__PURE__ */ import_react56.default.createElement(
|
|
6487
6135
|
"tr",
|
|
6488
6136
|
{
|
|
6489
6137
|
key: `pl-side-table-item-${idx}`,
|
|
6490
|
-
className: (0,
|
|
6138
|
+
className: (0, import_classnames27.default)(
|
|
6491
6139
|
"Layer__profit-and-loss-detailed-table__row",
|
|
6492
6140
|
hoveredItem && hoveredItem === item.display_name ? "active" : ""
|
|
6493
6141
|
),
|
|
6494
6142
|
onMouseEnter: () => setHoveredItem(item.display_name),
|
|
6495
6143
|
onMouseLeave: () => setHoveredItem(void 0)
|
|
6496
6144
|
},
|
|
6497
|
-
/* @__PURE__ */
|
|
6498
|
-
/* @__PURE__ */
|
|
6499
|
-
/* @__PURE__ */
|
|
6500
|
-
/* @__PURE__ */
|
|
6145
|
+
/* @__PURE__ */ import_react56.default.createElement("td", { className: "category-col" }, item.display_name),
|
|
6146
|
+
/* @__PURE__ */ import_react56.default.createElement("td", { className: "type-col" }, item.type),
|
|
6147
|
+
/* @__PURE__ */ import_react56.default.createElement("td", { className: "value-col" }, "$", centsToDollars(item.value)),
|
|
6148
|
+
/* @__PURE__ */ import_react56.default.createElement("td", { className: "share-col" }, /* @__PURE__ */ import_react56.default.createElement("span", { className: "share-cell-content" }, formatPercent(item.share), "%", /* @__PURE__ */ import_react56.default.createElement(
|
|
6501
6149
|
"div",
|
|
6502
6150
|
{
|
|
6503
6151
|
className: "share-icon",
|
|
@@ -6512,7 +6160,7 @@ var DetailedTable = ({
|
|
|
6512
6160
|
};
|
|
6513
6161
|
|
|
6514
6162
|
// src/components/ProfitAndLossDetailedCharts/Filters.tsx
|
|
6515
|
-
var
|
|
6163
|
+
var import_react57 = __toESM(require("react"));
|
|
6516
6164
|
var import_react_select3 = __toESM(require("react-select"));
|
|
6517
6165
|
var Filters = ({
|
|
6518
6166
|
filteredData,
|
|
@@ -6520,7 +6168,7 @@ var Filters = ({
|
|
|
6520
6168
|
filters,
|
|
6521
6169
|
setFilterTypes
|
|
6522
6170
|
}) => {
|
|
6523
|
-
return /* @__PURE__ */
|
|
6171
|
+
return /* @__PURE__ */ import_react57.default.createElement("div", { className: "filters" }, /* @__PURE__ */ import_react57.default.createElement(Text, { size: "sm" /* sm */, className: "Layer__label" }, "Filters"), /* @__PURE__ */ import_react57.default.createElement(
|
|
6524
6172
|
import_react_select3.default,
|
|
6525
6173
|
{
|
|
6526
6174
|
className: "Layer__select type-select",
|
|
@@ -6542,15 +6190,15 @@ var Filters = ({
|
|
|
6542
6190
|
);
|
|
6543
6191
|
},
|
|
6544
6192
|
components: {
|
|
6545
|
-
DropdownIndicator: (props) => /* @__PURE__ */
|
|
6546
|
-
Placeholder: (props) => /* @__PURE__ */
|
|
6193
|
+
DropdownIndicator: (props) => /* @__PURE__ */ import_react57.default.createElement(import_react_select3.components.DropdownIndicator, { ...props }, /* @__PURE__ */ import_react57.default.createElement(ChevronDown_default, null)),
|
|
6194
|
+
Placeholder: (props) => /* @__PURE__ */ import_react57.default.createElement(import_react_select3.components.Placeholder, { ...props }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "Layer__select__multi-all-placeholder-badge" }, "All"))
|
|
6547
6195
|
}
|
|
6548
6196
|
}
|
|
6549
6197
|
));
|
|
6550
6198
|
};
|
|
6551
6199
|
|
|
6552
6200
|
// src/components/ProfitAndLossDetailedCharts/ProfitAndLossDetailedCharts.tsx
|
|
6553
|
-
var
|
|
6201
|
+
var import_date_fns13 = require("date-fns");
|
|
6554
6202
|
var ProfitAndLossDetailedCharts = ({
|
|
6555
6203
|
scope,
|
|
6556
6204
|
hideClose = false,
|
|
@@ -6568,20 +6216,20 @@ var ProfitAndLossDetailedCharts = ({
|
|
|
6568
6216
|
sidebarScope,
|
|
6569
6217
|
setSidebarScope,
|
|
6570
6218
|
setFilterTypes
|
|
6571
|
-
} = (0,
|
|
6219
|
+
} = (0, import_react58.useContext)(ProfitAndLoss.Context);
|
|
6572
6220
|
const theScope = scope ? scope : sidebarScope;
|
|
6573
6221
|
const data = theScope === "revenue" ? filteredDataRevenue : filteredDataExpenses;
|
|
6574
6222
|
const total = theScope === "revenue" ? filteredTotalRevenue : filteredTotalExpenses;
|
|
6575
|
-
const [hoveredItem, setHoveredItem] = (0,
|
|
6576
|
-
return /* @__PURE__ */
|
|
6223
|
+
const [hoveredItem, setHoveredItem] = (0, import_react58.useState)();
|
|
6224
|
+
return /* @__PURE__ */ import_react58.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts" }, /* @__PURE__ */ import_react58.default.createElement("header", { className: "Layer__profit-and-loss-detailed-charts__header" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__head" }, /* @__PURE__ */ import_react58.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, humanizeTitle(theScope)), /* @__PURE__ */ import_react58.default.createElement(Text, { size: "sm" /* sm */, className: "date" }, (0, import_date_fns13.format)(dateRange.startDate, "LLLL, y")), showDatePicker && /* @__PURE__ */ import_react58.default.createElement(ProfitAndLossDatePicker, null)), !hideClose && /* @__PURE__ */ import_react58.default.createElement(
|
|
6577
6225
|
Button,
|
|
6578
6226
|
{
|
|
6579
|
-
rightIcon: /* @__PURE__ */
|
|
6227
|
+
rightIcon: /* @__PURE__ */ import_react58.default.createElement(X_default, null),
|
|
6580
6228
|
iconOnly: true,
|
|
6581
6229
|
onClick: () => setSidebarScope(void 0),
|
|
6582
6230
|
variant: "secondary" /* secondary */
|
|
6583
6231
|
}
|
|
6584
|
-
)), /* @__PURE__ */
|
|
6232
|
+
)), /* @__PURE__ */ import_react58.default.createElement("header", { className: "Layer__profit-and-loss-detailed-charts__header--tablet" }, /* @__PURE__ */ import_react58.default.createElement(BackButton, { onClick: () => setSidebarScope(void 0) })), /* @__PURE__ */ import_react58.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__content" }, /* @__PURE__ */ import_react58.default.createElement(
|
|
6585
6233
|
DetailedChart,
|
|
6586
6234
|
{
|
|
6587
6235
|
filteredData: data,
|
|
@@ -6592,7 +6240,7 @@ var ProfitAndLossDetailedCharts = ({
|
|
|
6592
6240
|
date: dateRange.startDate,
|
|
6593
6241
|
isLoading
|
|
6594
6242
|
}
|
|
6595
|
-
), /* @__PURE__ */
|
|
6243
|
+
), /* @__PURE__ */ import_react58.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__table-wrapper" }, /* @__PURE__ */ import_react58.default.createElement(
|
|
6596
6244
|
Filters,
|
|
6597
6245
|
{
|
|
6598
6246
|
filteredData: data,
|
|
@@ -6600,7 +6248,7 @@ var ProfitAndLossDetailedCharts = ({
|
|
|
6600
6248
|
filters,
|
|
6601
6249
|
setFilterTypes
|
|
6602
6250
|
}
|
|
6603
|
-
), /* @__PURE__ */
|
|
6251
|
+
), /* @__PURE__ */ import_react58.default.createElement(
|
|
6604
6252
|
DetailedTable,
|
|
6605
6253
|
{
|
|
6606
6254
|
filteredData: data,
|
|
@@ -6614,28 +6262,28 @@ var ProfitAndLossDetailedCharts = ({
|
|
|
6614
6262
|
};
|
|
6615
6263
|
|
|
6616
6264
|
// src/components/ProfitAndLossSummaries/ProfitAndLossSummaries.tsx
|
|
6617
|
-
var
|
|
6265
|
+
var import_react61 = __toESM(require("react"));
|
|
6618
6266
|
|
|
6619
6267
|
// src/components/SkeletonLoader/SkeletonLoader.tsx
|
|
6620
|
-
var
|
|
6621
|
-
var
|
|
6268
|
+
var import_react59 = __toESM(require("react"));
|
|
6269
|
+
var import_classnames28 = __toESM(require("classnames"));
|
|
6622
6270
|
var SkeletonLoader = ({
|
|
6623
6271
|
height,
|
|
6624
6272
|
width,
|
|
6625
6273
|
className
|
|
6626
6274
|
}) => {
|
|
6627
|
-
const baseClassName = (0,
|
|
6275
|
+
const baseClassName = (0, import_classnames28.default)(
|
|
6628
6276
|
"Layer__skeleton-loader Layer__anim--skeleton-loading",
|
|
6629
6277
|
className
|
|
6630
6278
|
);
|
|
6631
|
-
return /* @__PURE__ */
|
|
6279
|
+
return /* @__PURE__ */ import_react59.default.createElement("div", { className: baseClassName, style: { width, height } });
|
|
6632
6280
|
};
|
|
6633
6281
|
|
|
6634
6282
|
// src/components/ProfitAndLossSummaries/MiniChart.tsx
|
|
6635
|
-
var
|
|
6283
|
+
var import_react60 = __toESM(require("react"));
|
|
6636
6284
|
var import_recharts3 = require("recharts");
|
|
6637
6285
|
var MiniChart = ({ data }) => {
|
|
6638
|
-
return /* @__PURE__ */
|
|
6286
|
+
return /* @__PURE__ */ import_react60.default.createElement(import_recharts3.PieChart, { width: 48, height: 48, className: "mini-chart" }, /* @__PURE__ */ import_react60.default.createElement(
|
|
6639
6287
|
import_recharts3.Pie,
|
|
6640
6288
|
{
|
|
6641
6289
|
data,
|
|
@@ -6654,7 +6302,7 @@ var MiniChart = ({ data }) => {
|
|
|
6654
6302
|
},
|
|
6655
6303
|
data.map((entry, index) => {
|
|
6656
6304
|
const colorConfig = DEFAULT_CHART_COLORS[index % DEFAULT_CHART_COLORS.length];
|
|
6657
|
-
return /* @__PURE__ */
|
|
6305
|
+
return /* @__PURE__ */ import_react60.default.createElement(
|
|
6658
6306
|
import_recharts3.Cell,
|
|
6659
6307
|
{
|
|
6660
6308
|
key: `cell-${index}`,
|
|
@@ -6668,7 +6316,7 @@ var MiniChart = ({ data }) => {
|
|
|
6668
6316
|
};
|
|
6669
6317
|
|
|
6670
6318
|
// src/components/ProfitAndLossSummaries/ProfitAndLossSummaries.tsx
|
|
6671
|
-
var
|
|
6319
|
+
var import_classnames29 = __toESM(require("classnames"));
|
|
6672
6320
|
var CHART_PLACEHOLDER = [
|
|
6673
6321
|
{
|
|
6674
6322
|
name: "placeholder",
|
|
@@ -6705,27 +6353,26 @@ var ProfitAndLossSummaries = ({
|
|
|
6705
6353
|
isLoading,
|
|
6706
6354
|
setSidebarScope,
|
|
6707
6355
|
sidebarScope
|
|
6708
|
-
} = (0,
|
|
6709
|
-
const
|
|
6710
|
-
|
|
6711
|
-
return buildMiniChartData("expenses", dataItem);
|
|
6356
|
+
} = (0, import_react61.useContext)(ProfitAndLoss.Context);
|
|
6357
|
+
const expensesChartData = (0, import_react61.useMemo)(() => {
|
|
6358
|
+
return buildMiniChartData("expenses", storedData);
|
|
6712
6359
|
}, [storedData]);
|
|
6713
|
-
const revenueChartData = (0,
|
|
6714
|
-
return buildMiniChartData("revenue",
|
|
6360
|
+
const revenueChartData = (0, import_react61.useMemo)(() => {
|
|
6361
|
+
return buildMiniChartData("revenue", storedData);
|
|
6715
6362
|
}, [storedData]);
|
|
6716
|
-
const data =
|
|
6363
|
+
const data = storedData ? storedData : { income: { value: NaN }, net_profit: NaN };
|
|
6717
6364
|
const incomeDirectionClass = (data.income.value ?? NaN) < 0 ? "Layer__profit-and-loss-summaries__amount--negative" : "Layer__profit-and-loss-summaries__amount--positive";
|
|
6718
6365
|
const expensesDirectionClass = (data?.income?.value ?? NaN) - data.net_profit < 0 ? "Layer__profit-and-loss-summaries__amount--negative" : "Layer__profit-and-loss-summaries__amount--positive";
|
|
6719
6366
|
const netProfitDirectionClass = data.net_profit < 0 ? "Layer__profit-and-loss-summaries__amount--negative" : "Layer__profit-and-loss-summaries__amount--positive";
|
|
6720
|
-
return /* @__PURE__ */
|
|
6367
|
+
return /* @__PURE__ */ import_react61.default.createElement(
|
|
6721
6368
|
"div",
|
|
6722
6369
|
{
|
|
6723
6370
|
className: `Layer__profit-and-loss-summaries ${vertical ? "flex-col" : ""}`
|
|
6724
6371
|
},
|
|
6725
|
-
/* @__PURE__ */
|
|
6372
|
+
/* @__PURE__ */ import_react61.default.createElement(
|
|
6726
6373
|
"div",
|
|
6727
6374
|
{
|
|
6728
|
-
className: (0,
|
|
6375
|
+
className: (0, import_classnames29.default)(
|
|
6729
6376
|
"Layer__profit-and-loss-summaries__summary",
|
|
6730
6377
|
actionable && "Layer__actionable",
|
|
6731
6378
|
"Layer__profit-and-loss-summaries__summary--income",
|
|
@@ -6735,8 +6382,8 @@ var ProfitAndLossSummaries = ({
|
|
|
6735
6382
|
actionable && setSidebarScope("revenue");
|
|
6736
6383
|
}
|
|
6737
6384
|
},
|
|
6738
|
-
/* @__PURE__ */
|
|
6739
|
-
/* @__PURE__ */
|
|
6385
|
+
/* @__PURE__ */ import_react61.default.createElement(MiniChart, { data: revenueChartData }),
|
|
6386
|
+
/* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react61.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, revenueLabel), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react61.default.createElement(SkeletonLoader, null)) : /* @__PURE__ */ import_react61.default.createElement(
|
|
6740
6387
|
"span",
|
|
6741
6388
|
{
|
|
6742
6389
|
className: `Layer__profit-and-loss-summaries__amount ${incomeDirectionClass}`
|
|
@@ -6744,10 +6391,10 @@ var ProfitAndLossSummaries = ({
|
|
|
6744
6391
|
centsToDollars(Math.abs(data?.income?.value ?? NaN))
|
|
6745
6392
|
))
|
|
6746
6393
|
),
|
|
6747
|
-
/* @__PURE__ */
|
|
6394
|
+
/* @__PURE__ */ import_react61.default.createElement(
|
|
6748
6395
|
"div",
|
|
6749
6396
|
{
|
|
6750
|
-
className: (0,
|
|
6397
|
+
className: (0, import_classnames29.default)(
|
|
6751
6398
|
"Layer__profit-and-loss-summaries__summary",
|
|
6752
6399
|
actionable && "Layer__actionable",
|
|
6753
6400
|
"Layer__profit-and-loss-summaries__summary--expenses",
|
|
@@ -6757,8 +6404,8 @@ var ProfitAndLossSummaries = ({
|
|
|
6757
6404
|
actionable && setSidebarScope("expenses");
|
|
6758
6405
|
}
|
|
6759
6406
|
},
|
|
6760
|
-
/* @__PURE__ */
|
|
6761
|
-
/* @__PURE__ */
|
|
6407
|
+
/* @__PURE__ */ import_react61.default.createElement(MiniChart, { data: expensesChartData }),
|
|
6408
|
+
/* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react61.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, "Expenses"), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react61.default.createElement(SkeletonLoader, { className: "Layer__profit-and-loss-summaries__loader" })) : /* @__PURE__ */ import_react61.default.createElement(
|
|
6762
6409
|
"span",
|
|
6763
6410
|
{
|
|
6764
6411
|
className: `Layer__profit-and-loss-summaries__amount ${expensesDirectionClass}`
|
|
@@ -6768,15 +6415,15 @@ var ProfitAndLossSummaries = ({
|
|
|
6768
6415
|
)
|
|
6769
6416
|
))
|
|
6770
6417
|
),
|
|
6771
|
-
/* @__PURE__ */
|
|
6418
|
+
/* @__PURE__ */ import_react61.default.createElement(
|
|
6772
6419
|
"div",
|
|
6773
6420
|
{
|
|
6774
|
-
className: (0,
|
|
6421
|
+
className: (0, import_classnames29.default)(
|
|
6775
6422
|
"Layer__profit-and-loss-summaries__summary net-profit Layer__profit-and-loss-summaries__summary--net-profit",
|
|
6776
6423
|
actionable && "Layer__actionable"
|
|
6777
6424
|
)
|
|
6778
6425
|
},
|
|
6779
|
-
/* @__PURE__ */
|
|
6426
|
+
/* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react61.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, "Net Profit"), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react61.default.createElement(SkeletonLoader, { className: "Layer__profit-and-loss-summaries__loader" })) : /* @__PURE__ */ import_react61.default.createElement(
|
|
6780
6427
|
"span",
|
|
6781
6428
|
{
|
|
6782
6429
|
className: `Layer__profit-and-loss-summaries__amount ${netProfitDirectionClass}`
|
|
@@ -6788,10 +6435,10 @@ var ProfitAndLossSummaries = ({
|
|
|
6788
6435
|
};
|
|
6789
6436
|
|
|
6790
6437
|
// src/components/ProfitAndLossTable/ProfitAndLossTable.tsx
|
|
6791
|
-
var
|
|
6438
|
+
var import_react63 = __toESM(require("react"));
|
|
6792
6439
|
|
|
6793
6440
|
// src/components/ProfitAndLossRow/ProfitAndLossRow.tsx
|
|
6794
|
-
var
|
|
6441
|
+
var import_react62 = __toESM(require("react"));
|
|
6795
6442
|
|
|
6796
6443
|
// src/icons/PieChart.tsx
|
|
6797
6444
|
var React77 = __toESM(require("react"));
|
|
@@ -6840,7 +6487,7 @@ var ProfitAndLossRow = ({
|
|
|
6840
6487
|
return null;
|
|
6841
6488
|
}
|
|
6842
6489
|
const { value, display_name, line_items } = lineItem;
|
|
6843
|
-
const [expanded, setExpanded] = (0,
|
|
6490
|
+
const [expanded, setExpanded] = (0, import_react62.useState)(true);
|
|
6844
6491
|
const amount = value ?? 0;
|
|
6845
6492
|
const amountString = centsToDollars(Math.abs(amount));
|
|
6846
6493
|
const labelClasses = [
|
|
@@ -6871,20 +6518,20 @@ var ProfitAndLossRow = ({
|
|
|
6871
6518
|
);
|
|
6872
6519
|
displayChildren && expanded && labelClasses.push("Layer__profit-and-loss-row__label--expanded");
|
|
6873
6520
|
displayChildren && expanded && valueClasses.push("Layer__profit-and-loss-row__value--expanded");
|
|
6874
|
-
return /* @__PURE__ */
|
|
6521
|
+
return /* @__PURE__ */ import_react62.default.createElement(import_react62.default.Fragment, null, /* @__PURE__ */ import_react62.default.createElement(
|
|
6875
6522
|
"div",
|
|
6876
6523
|
{
|
|
6877
6524
|
className: labelClasses.join(" "),
|
|
6878
6525
|
onClick: () => !lockExpanded && toggleExpanded()
|
|
6879
6526
|
},
|
|
6880
|
-
/* @__PURE__ */
|
|
6527
|
+
/* @__PURE__ */ import_react62.default.createElement("span", { className: "Layer__profit-and-loss-row__label__title" }, !lockExpanded && variant !== "summation" ? /* @__PURE__ */ import_react62.default.createElement(
|
|
6881
6528
|
ChevronDownFill_default,
|
|
6882
6529
|
{
|
|
6883
6530
|
size: 16,
|
|
6884
6531
|
className: "Layer__profit-and-loss-row__label__chevron"
|
|
6885
6532
|
}
|
|
6886
|
-
) : null, /* @__PURE__ */
|
|
6887
|
-
setSidebarScope && /* @__PURE__ */
|
|
6533
|
+
) : null, /* @__PURE__ */ import_react62.default.createElement(Text, null, display_name)),
|
|
6534
|
+
setSidebarScope && /* @__PURE__ */ import_react62.default.createElement(
|
|
6888
6535
|
"span",
|
|
6889
6536
|
{
|
|
6890
6537
|
className: "Layer__profit-and-loss-row__detailed-chart-btn",
|
|
@@ -6893,14 +6540,14 @@ var ProfitAndLossRow = ({
|
|
|
6893
6540
|
setSidebarScope && setSidebarScope(scope ?? "expenses");
|
|
6894
6541
|
}
|
|
6895
6542
|
},
|
|
6896
|
-
/* @__PURE__ */
|
|
6543
|
+
/* @__PURE__ */ import_react62.default.createElement(PieChart_default, null)
|
|
6897
6544
|
)
|
|
6898
|
-
), /* @__PURE__ */
|
|
6545
|
+
), /* @__PURE__ */ import_react62.default.createElement("div", { className: valueClasses.join(" ") }, /* @__PURE__ */ import_react62.default.createElement(Text, null, amountString)), canGoDeeper && hasChildren && /* @__PURE__ */ import_react62.default.createElement(
|
|
6899
6546
|
"div",
|
|
6900
6547
|
{
|
|
6901
6548
|
className: `Layer__profit-and-loss-row__children ${expanded && "Layer__profit-and-loss-row__children--expanded"}`
|
|
6902
6549
|
},
|
|
6903
|
-
/* @__PURE__ */
|
|
6550
|
+
/* @__PURE__ */ import_react62.default.createElement("div", { className: "Layer__profit-and-loss-row__children--content" }, (line_items || []).map((line_item) => /* @__PURE__ */ import_react62.default.createElement(
|
|
6904
6551
|
ProfitAndLossRow,
|
|
6905
6552
|
{
|
|
6906
6553
|
key: line_item.display_name,
|
|
@@ -6962,36 +6609,35 @@ var empty_profit_and_loss_report_default = {
|
|
|
6962
6609
|
};
|
|
6963
6610
|
|
|
6964
6611
|
// src/components/ProfitAndLossTable/ProfitAndLossTable.tsx
|
|
6965
|
-
var
|
|
6612
|
+
var import_classnames30 = __toESM(require("classnames"));
|
|
6966
6613
|
var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
6967
6614
|
const {
|
|
6968
6615
|
data: actualData,
|
|
6969
6616
|
isLoading,
|
|
6970
6617
|
setSidebarScope
|
|
6971
|
-
} = (0,
|
|
6972
|
-
const
|
|
6973
|
-
const data = !currentData || isLoading ? empty_profit_and_loss_report_default : currentData;
|
|
6618
|
+
} = (0, import_react63.useContext)(ProfitAndLoss.Context);
|
|
6619
|
+
const data = !actualData || isLoading ? empty_profit_and_loss_report_default : actualData;
|
|
6974
6620
|
if (isLoading || actualData === void 0) {
|
|
6975
|
-
return /* @__PURE__ */
|
|
6621
|
+
return /* @__PURE__ */ import_react63.default.createElement(
|
|
6976
6622
|
"div",
|
|
6977
6623
|
{
|
|
6978
|
-
className: (0,
|
|
6624
|
+
className: (0, import_classnames30.default)(
|
|
6979
6625
|
"Layer__profit-and-loss-table__loader-container",
|
|
6980
6626
|
asContainer && "Layer__component-container"
|
|
6981
6627
|
)
|
|
6982
6628
|
},
|
|
6983
|
-
/* @__PURE__ */
|
|
6629
|
+
/* @__PURE__ */ import_react63.default.createElement(Loader2, null)
|
|
6984
6630
|
);
|
|
6985
6631
|
}
|
|
6986
|
-
return /* @__PURE__ */
|
|
6632
|
+
return /* @__PURE__ */ import_react63.default.createElement(import_react63.default.Fragment, null, /* @__PURE__ */ import_react63.default.createElement(
|
|
6987
6633
|
"div",
|
|
6988
6634
|
{
|
|
6989
|
-
className: (0,
|
|
6635
|
+
className: (0, import_classnames30.default)(
|
|
6990
6636
|
"Layer__profit-and-loss-table Layer__profit-and-loss-table--main",
|
|
6991
6637
|
asContainer && "Layer__component-container"
|
|
6992
6638
|
)
|
|
6993
6639
|
},
|
|
6994
|
-
/* @__PURE__ */
|
|
6640
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
6995
6641
|
ProfitAndLossRow,
|
|
6996
6642
|
{
|
|
6997
6643
|
lineItem: data.income,
|
|
@@ -7001,7 +6647,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7001
6647
|
setSidebarScope
|
|
7002
6648
|
}
|
|
7003
6649
|
),
|
|
7004
|
-
/* @__PURE__ */
|
|
6650
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
7005
6651
|
ProfitAndLossRow,
|
|
7006
6652
|
{
|
|
7007
6653
|
lineItem: data.cost_of_goods_sold,
|
|
@@ -7011,7 +6657,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7011
6657
|
setSidebarScope
|
|
7012
6658
|
}
|
|
7013
6659
|
),
|
|
7014
|
-
/* @__PURE__ */
|
|
6660
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
7015
6661
|
ProfitAndLossRow,
|
|
7016
6662
|
{
|
|
7017
6663
|
lineItem: {
|
|
@@ -7025,7 +6671,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7025
6671
|
setSidebarScope
|
|
7026
6672
|
}
|
|
7027
6673
|
),
|
|
7028
|
-
/* @__PURE__ */
|
|
6674
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
7029
6675
|
ProfitAndLossRow,
|
|
7030
6676
|
{
|
|
7031
6677
|
lineItem: data.expenses,
|
|
@@ -7035,7 +6681,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7035
6681
|
setSidebarScope
|
|
7036
6682
|
}
|
|
7037
6683
|
),
|
|
7038
|
-
/* @__PURE__ */
|
|
6684
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
7039
6685
|
ProfitAndLossRow,
|
|
7040
6686
|
{
|
|
7041
6687
|
lineItem: {
|
|
@@ -7049,7 +6695,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7049
6695
|
setSidebarScope
|
|
7050
6696
|
}
|
|
7051
6697
|
),
|
|
7052
|
-
/* @__PURE__ */
|
|
6698
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
7053
6699
|
ProfitAndLossRow,
|
|
7054
6700
|
{
|
|
7055
6701
|
lineItem: data.taxes,
|
|
@@ -7059,7 +6705,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7059
6705
|
setSidebarScope
|
|
7060
6706
|
}
|
|
7061
6707
|
),
|
|
7062
|
-
/* @__PURE__ */
|
|
6708
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
7063
6709
|
ProfitAndLossRow,
|
|
7064
6710
|
{
|
|
7065
6711
|
lineItem: {
|
|
@@ -7071,14 +6717,14 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7071
6717
|
lockExpanded
|
|
7072
6718
|
}
|
|
7073
6719
|
)
|
|
7074
|
-
), data.other_outflows || data.personal_expenses ? /* @__PURE__ */
|
|
6720
|
+
), data.other_outflows || data.personal_expenses ? /* @__PURE__ */ import_react63.default.createElement("div", { className: "Layer__profit-and-loss-table Layer__profit-and-loss-table__outflows" }, /* @__PURE__ */ import_react63.default.createElement(
|
|
7075
6721
|
ProfitAndLossRow,
|
|
7076
6722
|
{
|
|
7077
6723
|
lineItem: data.other_outflows,
|
|
7078
6724
|
direction: "DEBIT" /* DEBIT */,
|
|
7079
6725
|
lockExpanded
|
|
7080
6726
|
}
|
|
7081
|
-
), /* @__PURE__ */
|
|
6727
|
+
), /* @__PURE__ */ import_react63.default.createElement(
|
|
7082
6728
|
ProfitAndLossRow,
|
|
7083
6729
|
{
|
|
7084
6730
|
lineItem: data.personal_expenses,
|
|
@@ -7089,8 +6735,8 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
|
|
|
7089
6735
|
};
|
|
7090
6736
|
|
|
7091
6737
|
// src/components/ProfitAndLoss/ProfitAndLoss.tsx
|
|
7092
|
-
var
|
|
7093
|
-
var PNLContext = (0,
|
|
6738
|
+
var import_date_fns14 = require("date-fns");
|
|
6739
|
+
var PNLContext = (0, import_react64.createContext)({
|
|
7094
6740
|
data: void 0,
|
|
7095
6741
|
filteredDataRevenue: [],
|
|
7096
6742
|
filteredTotalRevenue: void 0,
|
|
@@ -7100,8 +6746,8 @@ var PNLContext = (0, import_react65.createContext)({
|
|
|
7100
6746
|
isValidating: false,
|
|
7101
6747
|
error: void 0,
|
|
7102
6748
|
dateRange: {
|
|
7103
|
-
startDate: (0,
|
|
7104
|
-
endDate: (0,
|
|
6749
|
+
startDate: (0, import_date_fns14.startOfMonth)(/* @__PURE__ */ new Date()),
|
|
6750
|
+
endDate: (0, import_date_fns14.endOfMonth)(/* @__PURE__ */ new Date())
|
|
7105
6751
|
},
|
|
7106
6752
|
changeDateRange: () => {
|
|
7107
6753
|
},
|
|
@@ -7126,7 +6772,7 @@ var ProfitAndLoss = ({
|
|
|
7126
6772
|
asContainer = true
|
|
7127
6773
|
}) => {
|
|
7128
6774
|
const contextData = useProfitAndLoss({ tagFilter, reportingBasis });
|
|
7129
|
-
return /* @__PURE__ */
|
|
6775
|
+
return /* @__PURE__ */ import_react64.default.createElement(PNLContext.Provider, { value: contextData }, asContainer ? /* @__PURE__ */ import_react64.default.createElement(Container, { name: "profit-and-loss" }, children) : children);
|
|
7130
6776
|
};
|
|
7131
6777
|
ProfitAndLoss.Chart = ProfitAndLossChart;
|
|
7132
6778
|
ProfitAndLoss.Context = PNLContext;
|
|
@@ -7136,11 +6782,11 @@ ProfitAndLoss.Table = ProfitAndLossTable;
|
|
|
7136
6782
|
ProfitAndLoss.DetailedCharts = ProfitAndLossDetailedCharts;
|
|
7137
6783
|
|
|
7138
6784
|
// src/components/ProfitAndLossView/ProfitAndLossView.tsx
|
|
7139
|
-
var
|
|
6785
|
+
var import_react66 = __toESM(require("react"));
|
|
7140
6786
|
|
|
7141
6787
|
// src/components/Panel/Panel.tsx
|
|
7142
|
-
var
|
|
7143
|
-
var
|
|
6788
|
+
var import_react65 = __toESM(require("react"));
|
|
6789
|
+
var import_classnames31 = __toESM(require("classnames"));
|
|
7144
6790
|
var Panel = ({
|
|
7145
6791
|
children,
|
|
7146
6792
|
className,
|
|
@@ -7149,23 +6795,23 @@ var Panel = ({
|
|
|
7149
6795
|
sidebarIsOpen,
|
|
7150
6796
|
parentRef
|
|
7151
6797
|
}) => {
|
|
7152
|
-
const [sidebarHeight, setSidebarHeight] = (0,
|
|
7153
|
-
(0,
|
|
6798
|
+
const [sidebarHeight, setSidebarHeight] = (0, import_react65.useState)(0);
|
|
6799
|
+
(0, import_react65.useEffect)(() => {
|
|
7154
6800
|
if (parentRef?.current?.offsetHeight) {
|
|
7155
6801
|
setSidebarHeight(parentRef?.current?.offsetHeight - 1);
|
|
7156
6802
|
}
|
|
7157
6803
|
}, [parentRef?.current?.offsetHeight, sidebarIsOpen]);
|
|
7158
|
-
return /* @__PURE__ */
|
|
6804
|
+
return /* @__PURE__ */ import_react65.default.createElement(
|
|
7159
6805
|
"div",
|
|
7160
6806
|
{
|
|
7161
|
-
className: (0,
|
|
6807
|
+
className: (0, import_classnames31.default)(
|
|
7162
6808
|
"Layer__panel",
|
|
7163
6809
|
className,
|
|
7164
6810
|
sidebarIsOpen && "Layer__panel--open"
|
|
7165
6811
|
)
|
|
7166
6812
|
},
|
|
7167
|
-
/* @__PURE__ */
|
|
7168
|
-
sidebar && /* @__PURE__ */
|
|
6813
|
+
/* @__PURE__ */ import_react65.default.createElement("div", { className: "Layer__panel__content" }, header, children),
|
|
6814
|
+
sidebar && /* @__PURE__ */ import_react65.default.createElement(
|
|
7169
6815
|
"div",
|
|
7170
6816
|
{
|
|
7171
6817
|
className: "Layer__panel__sidebar",
|
|
@@ -7173,7 +6819,7 @@ var Panel = ({
|
|
|
7173
6819
|
maxHeight: sidebarHeight > 0 && sidebarIsOpen ? sidebarHeight : 0
|
|
7174
6820
|
}
|
|
7175
6821
|
},
|
|
7176
|
-
/* @__PURE__ */
|
|
6822
|
+
/* @__PURE__ */ import_react65.default.createElement("div", { className: "Layer__panel__sidebar-content" }, sidebar)
|
|
7177
6823
|
)
|
|
7178
6824
|
);
|
|
7179
6825
|
};
|
|
@@ -7181,34 +6827,34 @@ var Panel = ({
|
|
|
7181
6827
|
// src/components/ProfitAndLossView/ProfitAndLossView.tsx
|
|
7182
6828
|
var COMPONENT_NAME3 = "profit-and-loss";
|
|
7183
6829
|
var ProfitAndLossView = (props) => {
|
|
7184
|
-
const containerRef = (0,
|
|
7185
|
-
return /* @__PURE__ */
|
|
6830
|
+
const containerRef = (0, import_react66.useRef)(null);
|
|
6831
|
+
return /* @__PURE__ */ import_react66.default.createElement(Container, { name: COMPONENT_NAME3, ref: containerRef }, /* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss, null, /* @__PURE__ */ import_react66.default.createElement(ProfitAndLossPanel, { containerRef, ...props })));
|
|
7186
6832
|
};
|
|
7187
6833
|
var ProfitAndLossPanel = ({
|
|
7188
6834
|
containerRef,
|
|
7189
6835
|
...props
|
|
7190
6836
|
}) => {
|
|
7191
|
-
const { sidebarScope } = (0,
|
|
7192
|
-
return /* @__PURE__ */
|
|
6837
|
+
const { sidebarScope } = (0, import_react66.useContext)(ProfitAndLoss.Context);
|
|
6838
|
+
return /* @__PURE__ */ import_react66.default.createElement(
|
|
7193
6839
|
Panel,
|
|
7194
6840
|
{
|
|
7195
|
-
sidebar: /* @__PURE__ */
|
|
6841
|
+
sidebar: /* @__PURE__ */ import_react66.default.createElement(ProfitAndLossDetailedCharts, null),
|
|
7196
6842
|
sidebarIsOpen: Boolean(sidebarScope),
|
|
7197
6843
|
parentRef: containerRef
|
|
7198
6844
|
},
|
|
7199
|
-
/* @__PURE__ */
|
|
7200
|
-
/* @__PURE__ */
|
|
6845
|
+
/* @__PURE__ */ import_react66.default.createElement(Header, { className: `Layer__${COMPONENT_NAME3}__header` }, /* @__PURE__ */ import_react66.default.createElement(Heading, { className: "Layer__profit-and-loss__title" }, "Profit & Loss")),
|
|
6846
|
+
/* @__PURE__ */ import_react66.default.createElement(Components, { ...props })
|
|
7201
6847
|
);
|
|
7202
6848
|
};
|
|
7203
6849
|
var Components = ({
|
|
7204
6850
|
hideChart = false,
|
|
7205
6851
|
hideTable = false
|
|
7206
6852
|
}) => {
|
|
7207
|
-
const { error, isLoading, isValidating, refetch } = (0,
|
|
6853
|
+
const { error, isLoading, isValidating, refetch } = (0, import_react66.useContext)(
|
|
7208
6854
|
ProfitAndLoss.Context
|
|
7209
6855
|
);
|
|
7210
6856
|
if (!isLoading && error) {
|
|
7211
|
-
return /* @__PURE__ */
|
|
6857
|
+
return /* @__PURE__ */ import_react66.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react66.default.createElement(
|
|
7212
6858
|
DataState,
|
|
7213
6859
|
{
|
|
7214
6860
|
status: "failed" /* failed */,
|
|
@@ -7219,27 +6865,27 @@ var Components = ({
|
|
|
7219
6865
|
}
|
|
7220
6866
|
));
|
|
7221
6867
|
}
|
|
7222
|
-
return /* @__PURE__ */
|
|
6868
|
+
return /* @__PURE__ */ import_react66.default.createElement(import_react66.default.Fragment, null, !hideChart && /* @__PURE__ */ import_react66.default.createElement("div", { className: `Layer__${COMPONENT_NAME3}__chart_with_summaries` }, /* @__PURE__ */ import_react66.default.createElement(
|
|
7223
6869
|
"div",
|
|
7224
6870
|
{
|
|
7225
6871
|
className: `Layer__${COMPONENT_NAME3}__chart_with_summaries__summary-col`
|
|
7226
6872
|
},
|
|
7227
|
-
/* @__PURE__ */
|
|
7228
|
-
/* @__PURE__ */
|
|
7229
|
-
), /* @__PURE__ */
|
|
6873
|
+
/* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss.DatePicker, null),
|
|
6874
|
+
/* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss.Summaries, { vertical: true })
|
|
6875
|
+
), /* @__PURE__ */ import_react66.default.createElement(
|
|
7230
6876
|
"div",
|
|
7231
6877
|
{
|
|
7232
6878
|
className: `Layer__${COMPONENT_NAME3}__chart_with_summaries__chart-col`
|
|
7233
6879
|
},
|
|
7234
|
-
/* @__PURE__ */
|
|
7235
|
-
)), !hideTable && /* @__PURE__ */
|
|
6880
|
+
/* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss.Chart, null)
|
|
6881
|
+
)), !hideTable && /* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss.Table, null));
|
|
7236
6882
|
};
|
|
7237
6883
|
|
|
7238
6884
|
// src/components/ChartOfAccounts/ChartOfAccounts.tsx
|
|
7239
|
-
var
|
|
6885
|
+
var import_react81 = __toESM(require("react"));
|
|
7240
6886
|
|
|
7241
6887
|
// src/hooks/useChartOfAccounts/useChartOfAccounts.tsx
|
|
7242
|
-
var
|
|
6888
|
+
var import_react67 = require("react");
|
|
7243
6889
|
|
|
7244
6890
|
// src/components/ChartOfAccountsForm/constants.ts
|
|
7245
6891
|
var LEDGER_ACCOUNT_TYPES = [
|
|
@@ -7523,9 +7169,9 @@ var validateName = (formData) => {
|
|
|
7523
7169
|
var flattenAccounts = (accounts) => accounts.flatMap((a) => [a, flattenAccounts(a.sub_accounts || [])]).flat().filter((id) => id);
|
|
7524
7170
|
var useChartOfAccounts = () => {
|
|
7525
7171
|
const { auth, businessId, apiUrl } = useLayerContext();
|
|
7526
|
-
const [form, setForm] = (0,
|
|
7527
|
-
const [sendingForm, setSendingForm] = (0,
|
|
7528
|
-
const [apiError, setApiError] = (0,
|
|
7172
|
+
const [form, setForm] = (0, import_react67.useState)();
|
|
7173
|
+
const [sendingForm, setSendingForm] = (0, import_react67.useState)(false);
|
|
7174
|
+
const [apiError, setApiError] = (0, import_react67.useState)(void 0);
|
|
7529
7175
|
const { data, isLoading, isValidating, error, mutate } = (0, import_swr6.default)(
|
|
7530
7176
|
businessId && auth?.access_token && `chart-of-accounts-${businessId}`,
|
|
7531
7177
|
Layer.getLedgerAccountBalances(apiUrl, auth?.access_token, {
|
|
@@ -7709,12 +7355,12 @@ var useChartOfAccounts = () => {
|
|
|
7709
7355
|
};
|
|
7710
7356
|
|
|
7711
7357
|
// src/hooks/useLedgerAccounts/useLedgerAccounts.tsx
|
|
7712
|
-
var
|
|
7358
|
+
var import_react68 = require("react");
|
|
7713
7359
|
var import_swr7 = __toESM(require("swr"));
|
|
7714
7360
|
var useLedgerAccounts = () => {
|
|
7715
7361
|
const { auth, businessId, apiUrl } = useLayerContext();
|
|
7716
|
-
const [accountId, setAccountId] = (0,
|
|
7717
|
-
const [selectedEntryId, setSelectedEntryId] = (0,
|
|
7362
|
+
const [accountId, setAccountId] = (0, import_react68.useState)();
|
|
7363
|
+
const [selectedEntryId, setSelectedEntryId] = (0, import_react68.useState)();
|
|
7718
7364
|
const { data, isLoading, isValidating, error, mutate } = (0, import_swr7.default)(
|
|
7719
7365
|
businessId && accountId && auth?.access_token && `ledger-accounts-lines-${businessId}-${accountId}`,
|
|
7720
7366
|
Layer.getLedgerAccountsLines(apiUrl, auth?.access_token, {
|
|
@@ -7757,10 +7403,10 @@ var useLedgerAccounts = () => {
|
|
|
7757
7403
|
};
|
|
7758
7404
|
|
|
7759
7405
|
// src/components/ChartOfAccountsTable/ChartOfAccountsTable.tsx
|
|
7760
|
-
var
|
|
7406
|
+
var import_react73 = __toESM(require("react"));
|
|
7761
7407
|
|
|
7762
7408
|
// src/components/ChartOfAccountsRow/ChartOfAccountsRow.tsx
|
|
7763
|
-
var
|
|
7409
|
+
var import_react69 = __toESM(require("react"));
|
|
7764
7410
|
|
|
7765
7411
|
// src/icons/Edit2.tsx
|
|
7766
7412
|
var React83 = __toESM(require("react"));
|
|
@@ -7787,7 +7433,7 @@ var Edit2 = ({ size = 18, ...props }) => /* @__PURE__ */ React83.createElement(
|
|
|
7787
7433
|
var Edit2_default = Edit2;
|
|
7788
7434
|
|
|
7789
7435
|
// src/components/ChartOfAccountsRow/ChartOfAccountsRow.tsx
|
|
7790
|
-
var
|
|
7436
|
+
var import_classnames32 = __toESM(require("classnames"));
|
|
7791
7437
|
var INDENTATION = 24;
|
|
7792
7438
|
var MOBILE_INDENTATION = 12;
|
|
7793
7439
|
var EXPANDED_STYLE = {
|
|
@@ -7818,10 +7464,10 @@ var ChartOfAccountsRow = ({
|
|
|
7818
7464
|
acountsLength,
|
|
7819
7465
|
view
|
|
7820
7466
|
}) => {
|
|
7821
|
-
const { form, editAccount } = (0,
|
|
7822
|
-
const { setAccountId } = (0,
|
|
7467
|
+
const { form, editAccount } = (0, import_react69.useContext)(ChartOfAccountsContext);
|
|
7468
|
+
const { setAccountId } = (0, import_react69.useContext)(LedgerAccountsContext);
|
|
7823
7469
|
const baseStyle = view === "desktop" ? EXPANDED_STYLE : EXPANDED_MOBILE_STYLE;
|
|
7824
|
-
const [isOpen, setIsOpen] = (0,
|
|
7470
|
+
const [isOpen, setIsOpen] = (0, import_react69.useState)(defaultOpen);
|
|
7825
7471
|
const style = expanded ? {
|
|
7826
7472
|
...baseStyle,
|
|
7827
7473
|
transitionDelay: `${15 * index}ms`
|
|
@@ -7829,14 +7475,14 @@ var ChartOfAccountsRow = ({
|
|
|
7829
7475
|
...COLLAPSED_STYLE,
|
|
7830
7476
|
transitionDelay: `${acountsLength - 15 * index}ms`
|
|
7831
7477
|
};
|
|
7832
|
-
const [showComponent, setShowComponent] = (0,
|
|
7833
|
-
(0,
|
|
7478
|
+
const [showComponent, setShowComponent] = (0, import_react69.useState)(false);
|
|
7479
|
+
(0, import_react69.useEffect)(() => {
|
|
7834
7480
|
const timeoutId = setTimeout(() => {
|
|
7835
7481
|
setShowComponent(true);
|
|
7836
7482
|
}, cumulativeIndex * 50);
|
|
7837
7483
|
return () => clearTimeout(timeoutId);
|
|
7838
7484
|
}, []);
|
|
7839
|
-
const baseClass = (0,
|
|
7485
|
+
const baseClass = (0, import_classnames32.default)(
|
|
7840
7486
|
"Layer__table-row",
|
|
7841
7487
|
isOpen ? "Layer__table-row--expanded" : "Layer__table-row--collapsed",
|
|
7842
7488
|
!expanded && "Layer__table-row--hidden",
|
|
@@ -7844,15 +7490,15 @@ var ChartOfAccountsRow = ({
|
|
|
7844
7490
|
form?.accountId === account.id && "Layer__table-row--active",
|
|
7845
7491
|
!showComponent && "Layer__table-row--anim-starting-state"
|
|
7846
7492
|
);
|
|
7847
|
-
const desktopRowClass = (0,
|
|
7493
|
+
const desktopRowClass = (0, import_classnames32.default)(
|
|
7848
7494
|
baseClass,
|
|
7849
7495
|
"Layer__chart-of-accounts__row---desktop"
|
|
7850
7496
|
);
|
|
7851
|
-
const mobileRowClass = (0,
|
|
7497
|
+
const mobileRowClass = (0, import_classnames32.default)(
|
|
7852
7498
|
baseClass,
|
|
7853
7499
|
"Layer__chart-of-accounts__row---mobile"
|
|
7854
7500
|
);
|
|
7855
|
-
return /* @__PURE__ */
|
|
7501
|
+
return /* @__PURE__ */ import_react69.default.createElement(import_react69.default.Fragment, null, view === "desktop" && /* @__PURE__ */ import_react69.default.createElement(
|
|
7856
7502
|
"tr",
|
|
7857
7503
|
{
|
|
7858
7504
|
className: desktopRowClass,
|
|
@@ -7862,7 +7508,7 @@ var ChartOfAccountsRow = ({
|
|
|
7862
7508
|
setAccountId(account.id);
|
|
7863
7509
|
}
|
|
7864
7510
|
},
|
|
7865
|
-
/* @__PURE__ */
|
|
7511
|
+
/* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__name" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__table-cell-content", style }, /* @__PURE__ */ import_react69.default.createElement(
|
|
7866
7512
|
"span",
|
|
7867
7513
|
{
|
|
7868
7514
|
className: "Layer__table-cell-content-indentation",
|
|
@@ -7870,7 +7516,7 @@ var ChartOfAccountsRow = ({
|
|
|
7870
7516
|
paddingLeft: INDENTATION * depth + 16
|
|
7871
7517
|
}
|
|
7872
7518
|
},
|
|
7873
|
-
account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */
|
|
7519
|
+
account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */ import_react69.default.createElement(
|
|
7874
7520
|
ChevronDownFill_default,
|
|
7875
7521
|
{
|
|
7876
7522
|
size: 16,
|
|
@@ -7881,22 +7527,22 @@ var ChartOfAccountsRow = ({
|
|
|
7881
7527
|
}
|
|
7882
7528
|
}
|
|
7883
7529
|
),
|
|
7884
|
-
/* @__PURE__ */
|
|
7530
|
+
/* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__coa__name__text" }, account.name)
|
|
7885
7531
|
))),
|
|
7886
|
-
/* @__PURE__ */
|
|
7532
|
+
/* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__type" }, /* @__PURE__ */ import_react69.default.createElement(
|
|
7887
7533
|
"span",
|
|
7888
7534
|
{
|
|
7889
7535
|
className: "Layer__table-cell-content Layer__mobile--hidden",
|
|
7890
7536
|
style
|
|
7891
7537
|
},
|
|
7892
7538
|
account.account_type?.display_name
|
|
7893
|
-
), /* @__PURE__ */
|
|
7539
|
+
), /* @__PURE__ */ import_react69.default.createElement(
|
|
7894
7540
|
"span",
|
|
7895
7541
|
{
|
|
7896
7542
|
className: "Layer__table-cell-content Layer__desktop--hidden",
|
|
7897
7543
|
style
|
|
7898
7544
|
},
|
|
7899
|
-
/* @__PURE__ */
|
|
7545
|
+
/* @__PURE__ */ import_react69.default.createElement(
|
|
7900
7546
|
Text,
|
|
7901
7547
|
{
|
|
7902
7548
|
weight: "bold" /* bold */,
|
|
@@ -7904,10 +7550,10 @@ var ChartOfAccountsRow = ({
|
|
|
7904
7550
|
},
|
|
7905
7551
|
account.normality
|
|
7906
7552
|
),
|
|
7907
|
-
/* @__PURE__ */
|
|
7553
|
+
/* @__PURE__ */ import_react69.default.createElement(Text, { className: "Layer__coa__subtype--mobile" }, account.account_subtype?.display_name)
|
|
7908
7554
|
)),
|
|
7909
|
-
/* @__PURE__ */
|
|
7910
|
-
/* @__PURE__ */
|
|
7555
|
+
/* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__subtype Layer__mobile--hidden" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__table-cell-content", style }, account.account_subtype?.display_name)),
|
|
7556
|
+
/* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__balance" }, /* @__PURE__ */ import_react69.default.createElement(
|
|
7911
7557
|
"span",
|
|
7912
7558
|
{
|
|
7913
7559
|
className: "Layer__table-cell-content Layer__table-cell--amount",
|
|
@@ -7916,11 +7562,11 @@ var ChartOfAccountsRow = ({
|
|
|
7916
7562
|
"$",
|
|
7917
7563
|
centsToDollars(Math.abs(account.balance || 0))
|
|
7918
7564
|
)),
|
|
7919
|
-
/* @__PURE__ */
|
|
7565
|
+
/* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__actions" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__table-cell-content", style }, /* @__PURE__ */ import_react69.default.createElement(
|
|
7920
7566
|
Button,
|
|
7921
7567
|
{
|
|
7922
7568
|
variant: "secondary" /* secondary */,
|
|
7923
|
-
rightIcon: /* @__PURE__ */
|
|
7569
|
+
rightIcon: /* @__PURE__ */ import_react69.default.createElement(Edit2_default, { size: 12 }),
|
|
7924
7570
|
iconOnly: true,
|
|
7925
7571
|
onClick: (e) => {
|
|
7926
7572
|
e.preventDefault();
|
|
@@ -7930,7 +7576,7 @@ var ChartOfAccountsRow = ({
|
|
|
7930
7576
|
},
|
|
7931
7577
|
"Edit"
|
|
7932
7578
|
)))
|
|
7933
|
-
), view === "mobile" || view === "tablet" ? /* @__PURE__ */
|
|
7579
|
+
), view === "mobile" || view === "tablet" ? /* @__PURE__ */ import_react69.default.createElement(
|
|
7934
7580
|
"tr",
|
|
7935
7581
|
{
|
|
7936
7582
|
className: mobileRowClass,
|
|
@@ -7940,7 +7586,7 @@ var ChartOfAccountsRow = ({
|
|
|
7940
7586
|
setAccountId(account.id);
|
|
7941
7587
|
}
|
|
7942
7588
|
},
|
|
7943
|
-
/* @__PURE__ */
|
|
7589
|
+
/* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell", colSpan: 5 }, /* @__PURE__ */ import_react69.default.createElement(
|
|
7944
7590
|
"span",
|
|
7945
7591
|
{
|
|
7946
7592
|
className: "Layer__table-cell-content Layer__table-cell-content-indentation",
|
|
@@ -7949,7 +7595,7 @@ var ChartOfAccountsRow = ({
|
|
|
7949
7595
|
...style
|
|
7950
7596
|
}
|
|
7951
7597
|
},
|
|
7952
|
-
account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */
|
|
7598
|
+
account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */ import_react69.default.createElement(
|
|
7953
7599
|
ChevronDownFill_default,
|
|
7954
7600
|
{
|
|
7955
7601
|
size: 16,
|
|
@@ -7960,14 +7606,14 @@ var ChartOfAccountsRow = ({
|
|
|
7960
7606
|
}
|
|
7961
7607
|
}
|
|
7962
7608
|
),
|
|
7963
|
-
/* @__PURE__ */
|
|
7609
|
+
/* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__top-row" }, /* @__PURE__ */ import_react69.default.createElement(
|
|
7964
7610
|
Text,
|
|
7965
7611
|
{
|
|
7966
7612
|
as: "span",
|
|
7967
7613
|
className: "Layer__chart-of-accounts__mobile-row-content__name"
|
|
7968
7614
|
},
|
|
7969
7615
|
account.name
|
|
7970
|
-
), /* @__PURE__ */
|
|
7616
|
+
), /* @__PURE__ */ import_react69.default.createElement(
|
|
7971
7617
|
TextButton,
|
|
7972
7618
|
{
|
|
7973
7619
|
onClick: (e) => {
|
|
@@ -7977,7 +7623,7 @@ var ChartOfAccountsRow = ({
|
|
|
7977
7623
|
}
|
|
7978
7624
|
},
|
|
7979
7625
|
"Edit"
|
|
7980
|
-
)), /* @__PURE__ */
|
|
7626
|
+
)), /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__bottom-row" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__types" }, /* @__PURE__ */ import_react69.default.createElement(Text, { as: "span" }, account.normality), /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__chart-of-accounts__mobile-row-content__separator" }), /* @__PURE__ */ import_react69.default.createElement(Text, { as: "span" }, "Sub-Type")), /* @__PURE__ */ import_react69.default.createElement(
|
|
7981
7627
|
Text,
|
|
7982
7628
|
{
|
|
7983
7629
|
as: "span",
|
|
@@ -7987,7 +7633,7 @@ var ChartOfAccountsRow = ({
|
|
|
7987
7633
|
centsToDollars(Math.abs(account.balance || 0))
|
|
7988
7634
|
)))
|
|
7989
7635
|
))
|
|
7990
|
-
) : null, (account.sub_accounts || []).map((subAccount, idx) => /* @__PURE__ */
|
|
7636
|
+
) : null, (account.sub_accounts || []).map((subAccount, idx) => /* @__PURE__ */ import_react69.default.createElement(
|
|
7991
7637
|
ChartOfAccountsRow,
|
|
7992
7638
|
{
|
|
7993
7639
|
key: subAccount.id,
|
|
@@ -8003,14 +7649,14 @@ var ChartOfAccountsRow = ({
|
|
|
8003
7649
|
};
|
|
8004
7650
|
|
|
8005
7651
|
// src/components/ChartOfAccountsSidebar/ChartOfAccountsSidebar.tsx
|
|
8006
|
-
var
|
|
7652
|
+
var import_react72 = __toESM(require("react"));
|
|
8007
7653
|
|
|
8008
7654
|
// src/components/ChartOfAccountsForm/ChartOfAccountsForm.tsx
|
|
8009
|
-
var
|
|
7655
|
+
var import_react71 = __toESM(require("react"));
|
|
8010
7656
|
|
|
8011
7657
|
// src/components/ChartOfAccountsForm/useParentOptions.ts
|
|
8012
|
-
var
|
|
8013
|
-
var useParentOptions = (data) => (0,
|
|
7658
|
+
var import_react70 = require("react");
|
|
7659
|
+
var useParentOptions = (data) => (0, import_react70.useMemo)(
|
|
8014
7660
|
() => flattenAccounts(data?.accounts || []).sort((a, b) => a?.name && b?.name ? a.name.localeCompare(b.name) : 0).map((x) => {
|
|
8015
7661
|
return {
|
|
8016
7662
|
label: x.name,
|
|
@@ -8030,9 +7676,9 @@ var ChartOfAccountsForm = () => {
|
|
|
8030
7676
|
submitForm,
|
|
8031
7677
|
sendingForm,
|
|
8032
7678
|
apiError
|
|
8033
|
-
} = (0,
|
|
7679
|
+
} = (0, import_react71.useContext)(ChartOfAccountsContext);
|
|
8034
7680
|
const parentOptions = useParentOptions(data);
|
|
8035
|
-
const entry = (0,
|
|
7681
|
+
const entry = (0, import_react71.useMemo)(() => {
|
|
8036
7682
|
if (form?.action === "edit" && form.accountId) {
|
|
8037
7683
|
return flattenAccounts(data?.accounts || []).find(
|
|
8038
7684
|
(x) => x.id === form.accountId
|
|
@@ -8043,7 +7689,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8043
7689
|
if (!form) {
|
|
8044
7690
|
return;
|
|
8045
7691
|
}
|
|
8046
|
-
return /* @__PURE__ */
|
|
7692
|
+
return /* @__PURE__ */ import_react71.default.createElement(
|
|
8047
7693
|
"form",
|
|
8048
7694
|
{
|
|
8049
7695
|
className: "Layer__form",
|
|
@@ -8052,7 +7698,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8052
7698
|
submitForm();
|
|
8053
7699
|
}
|
|
8054
7700
|
},
|
|
8055
|
-
/* @__PURE__ */
|
|
7701
|
+
/* @__PURE__ */ import_react71.default.createElement("div", { className: "Layer__chart-of-accounts__sidebar__header" }, /* @__PURE__ */ import_react71.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, form?.action === "edit" ? "Edit" : "Add New", " Account"), /* @__PURE__ */ import_react71.default.createElement("div", { className: "actions" }, /* @__PURE__ */ import_react71.default.createElement(
|
|
8056
7702
|
Button,
|
|
8057
7703
|
{
|
|
8058
7704
|
type: "button",
|
|
@@ -8061,7 +7707,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8061
7707
|
disabled: sendingForm
|
|
8062
7708
|
},
|
|
8063
7709
|
"Cancel"
|
|
8064
|
-
), apiError && /* @__PURE__ */
|
|
7710
|
+
), apiError && /* @__PURE__ */ import_react71.default.createElement(
|
|
8065
7711
|
RetryButton,
|
|
8066
7712
|
{
|
|
8067
7713
|
type: "submit",
|
|
@@ -8070,7 +7716,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8070
7716
|
disabled: sendingForm
|
|
8071
7717
|
},
|
|
8072
7718
|
"Retry"
|
|
8073
|
-
), !apiError && /* @__PURE__ */
|
|
7719
|
+
), !apiError && /* @__PURE__ */ import_react71.default.createElement(
|
|
8074
7720
|
SubmitButton,
|
|
8075
7721
|
{
|
|
8076
7722
|
type: "submit",
|
|
@@ -8080,7 +7726,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8080
7726
|
},
|
|
8081
7727
|
"Save"
|
|
8082
7728
|
))),
|
|
8083
|
-
apiError && /* @__PURE__ */
|
|
7729
|
+
apiError && /* @__PURE__ */ import_react71.default.createElement(
|
|
8084
7730
|
Text,
|
|
8085
7731
|
{
|
|
8086
7732
|
size: "sm" /* sm */,
|
|
@@ -8088,8 +7734,8 @@ var ChartOfAccountsForm = () => {
|
|
|
8088
7734
|
},
|
|
8089
7735
|
apiError
|
|
8090
7736
|
),
|
|
8091
|
-
entry && /* @__PURE__ */
|
|
8092
|
-
/* @__PURE__ */
|
|
7737
|
+
entry && /* @__PURE__ */ import_react71.default.createElement("div", { className: "Layer__chart-of-accounts__form-edit-entry" }, /* @__PURE__ */ import_react71.default.createElement(Text, { weight: "bold" /* bold */ }, entry.name), /* @__PURE__ */ import_react71.default.createElement(Text, { weight: "bold" /* bold */ }, "$", centsToDollars(entry.balance || 0))),
|
|
7738
|
+
/* @__PURE__ */ import_react71.default.createElement("div", { className: "Layer__chart-of-accounts__form" }, /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "parent", label: "Parent", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
|
|
8093
7739
|
Select2,
|
|
8094
7740
|
{
|
|
8095
7741
|
options: parentOptions,
|
|
@@ -8097,7 +7743,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8097
7743
|
onChange: (sel) => changeFormData("parent", sel),
|
|
8098
7744
|
disabled: sendingForm
|
|
8099
7745
|
}
|
|
8100
|
-
)), /* @__PURE__ */
|
|
7746
|
+
)), /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "name", label: "Name", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
|
|
8101
7747
|
Input,
|
|
8102
7748
|
{
|
|
8103
7749
|
name: "name",
|
|
@@ -8108,7 +7754,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8108
7754
|
disabled: sendingForm,
|
|
8109
7755
|
onChange: (e) => changeFormData("name", e.target.value)
|
|
8110
7756
|
}
|
|
8111
|
-
)), /* @__PURE__ */
|
|
7757
|
+
)), /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "type", label: "Type", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
|
|
8112
7758
|
Select2,
|
|
8113
7759
|
{
|
|
8114
7760
|
options: LEDGER_ACCOUNT_TYPES,
|
|
@@ -8118,7 +7764,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8118
7764
|
errorMessage: form?.errors?.find((x) => x.field === "type")?.message,
|
|
8119
7765
|
disabled: sendingForm || form.action === "edit" || form.data.parent !== void 0
|
|
8120
7766
|
}
|
|
8121
|
-
)), /* @__PURE__ */
|
|
7767
|
+
)), /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "subType", label: "Sub-Type", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
|
|
8122
7768
|
Select2,
|
|
8123
7769
|
{
|
|
8124
7770
|
options: form?.data.type?.value !== void 0 ? LEDGER_ACCOUNT_SUBTYPES_FOR_TYPE[form?.data.type?.value] : LEDGER_ACCOUNT_SUBTYPES,
|
|
@@ -8126,7 +7772,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8126
7772
|
onChange: (sel) => changeFormData("subType", sel),
|
|
8127
7773
|
disabled: sendingForm
|
|
8128
7774
|
}
|
|
8129
|
-
)), /* @__PURE__ */
|
|
7775
|
+
)), /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "normality", label: "Normality", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
|
|
8130
7776
|
Select2,
|
|
8131
7777
|
{
|
|
8132
7778
|
options: NORMALITY_OPTIONS,
|
|
@@ -8146,7 +7792,7 @@ var ChartOfAccountsForm = () => {
|
|
|
8146
7792
|
var ChartOfAccountsSidebar = ({
|
|
8147
7793
|
parentRef: _parentRef
|
|
8148
7794
|
}) => {
|
|
8149
|
-
return /* @__PURE__ */
|
|
7795
|
+
return /* @__PURE__ */ import_react72.default.createElement(ChartOfAccountsForm, null);
|
|
8150
7796
|
};
|
|
8151
7797
|
|
|
8152
7798
|
// src/components/ChartOfAccountsTable/ChartOfAccountsTable.tsx
|
|
@@ -8155,29 +7801,29 @@ var ChartOfAccountsTable = ({
|
|
|
8155
7801
|
view,
|
|
8156
7802
|
containerRef
|
|
8157
7803
|
}) => {
|
|
8158
|
-
const { data, isLoading, addAccount, error, isValidating, refetch, form } = (0,
|
|
7804
|
+
const { data, isLoading, addAccount, error, isValidating, refetch, form } = (0, import_react73.useContext)(ChartOfAccountsContext);
|
|
8159
7805
|
let cumulativeIndex = 0;
|
|
8160
7806
|
const accountsLength = data?.accounts.length ?? 0;
|
|
8161
|
-
return /* @__PURE__ */
|
|
7807
|
+
return /* @__PURE__ */ import_react73.default.createElement(
|
|
8162
7808
|
Panel,
|
|
8163
7809
|
{
|
|
8164
|
-
sidebar: /* @__PURE__ */
|
|
7810
|
+
sidebar: /* @__PURE__ */ import_react73.default.createElement(ChartOfAccountsSidebar, { parentRef: containerRef }),
|
|
8165
7811
|
sidebarIsOpen: Boolean(form),
|
|
8166
7812
|
parentRef: containerRef
|
|
8167
7813
|
},
|
|
8168
|
-
/* @__PURE__ */
|
|
7814
|
+
/* @__PURE__ */ import_react73.default.createElement(Header, { className: `Layer__${COMPONENT_NAME4}__header` }, /* @__PURE__ */ import_react73.default.createElement(Heading, { className: `Layer__${COMPONENT_NAME4}__title` }, "Chart of Accounts"), /* @__PURE__ */ import_react73.default.createElement("div", { className: `Layer__${COMPONENT_NAME4}__actions` }, /* @__PURE__ */ import_react73.default.createElement(
|
|
8169
7815
|
Button,
|
|
8170
7816
|
{
|
|
8171
7817
|
variant: "secondary" /* secondary */,
|
|
8172
7818
|
disabled: isLoading,
|
|
8173
|
-
rightIcon: /* @__PURE__ */
|
|
7819
|
+
rightIcon: /* @__PURE__ */ import_react73.default.createElement(DownloadCloud_default, { size: 12 })
|
|
8174
7820
|
},
|
|
8175
7821
|
"Download"
|
|
8176
|
-
), /* @__PURE__ */
|
|
8177
|
-
/* @__PURE__ */
|
|
7822
|
+
), /* @__PURE__ */ import_react73.default.createElement(Button, { onClick: () => addAccount(), disabled: isLoading }, "Add Account"))),
|
|
7823
|
+
/* @__PURE__ */ import_react73.default.createElement("table", { className: "Layer__chart-of-accounts__table" }, /* @__PURE__ */ import_react73.default.createElement("thead", null, /* @__PURE__ */ import_react73.default.createElement("tr", { className: "Layer__table-row--header" }, /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__name" }, "Name"), /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__type" }, "Type"), /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__subtype Layer__mobile--hidden" }, "Sub-Type"), /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__balance" }, "Balance"), /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__actions" }))), /* @__PURE__ */ import_react73.default.createElement("tbody", null, !error && data?.accounts.map((account, idx) => {
|
|
8178
7824
|
const currentCumulativeIndex = cumulativeIndex;
|
|
8179
7825
|
cumulativeIndex = (account.sub_accounts?.length || 0) + cumulativeIndex + 1;
|
|
8180
|
-
return /* @__PURE__ */
|
|
7826
|
+
return /* @__PURE__ */ import_react73.default.createElement(
|
|
8181
7827
|
ChartOfAccountsRow,
|
|
8182
7828
|
{
|
|
8183
7829
|
key: account.id,
|
|
@@ -8192,7 +7838,7 @@ var ChartOfAccountsTable = ({
|
|
|
8192
7838
|
}
|
|
8193
7839
|
);
|
|
8194
7840
|
}))),
|
|
8195
|
-
error ? /* @__PURE__ */
|
|
7841
|
+
error ? /* @__PURE__ */ import_react73.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react73.default.createElement(
|
|
8196
7842
|
DataState,
|
|
8197
7843
|
{
|
|
8198
7844
|
status: "failed" /* failed */,
|
|
@@ -8202,8 +7848,8 @@ var ChartOfAccountsTable = ({
|
|
|
8202
7848
|
isLoading: isValidating || isLoading
|
|
8203
7849
|
}
|
|
8204
7850
|
)) : null,
|
|
8205
|
-
(!data || isLoading) && !error ? /* @__PURE__ */
|
|
8206
|
-
!isLoading && !error && data?.accounts.length === 0 ? /* @__PURE__ */
|
|
7851
|
+
(!data || isLoading) && !error ? /* @__PURE__ */ import_react73.default.createElement("div", { className: `Layer__${COMPONENT_NAME4}__loader-container` }, /* @__PURE__ */ import_react73.default.createElement(Loader2, null)) : null,
|
|
7852
|
+
!isLoading && !error && data?.accounts.length === 0 ? /* @__PURE__ */ import_react73.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react73.default.createElement(
|
|
8207
7853
|
DataState,
|
|
8208
7854
|
{
|
|
8209
7855
|
status: "info" /* info */,
|
|
@@ -8217,21 +7863,21 @@ var ChartOfAccountsTable = ({
|
|
|
8217
7863
|
};
|
|
8218
7864
|
|
|
8219
7865
|
// src/components/LedgerAccount/LedgerAccountIndex.tsx
|
|
8220
|
-
var
|
|
7866
|
+
var import_react80 = __toESM(require("react"));
|
|
8221
7867
|
|
|
8222
7868
|
// src/components/LedgerAccountEntryDetails/LedgerAccountEntryDetails.tsx
|
|
8223
|
-
var
|
|
7869
|
+
var import_react78 = __toESM(require("react"));
|
|
8224
7870
|
|
|
8225
7871
|
// src/components/Card/Card.tsx
|
|
8226
|
-
var
|
|
8227
|
-
var
|
|
7872
|
+
var import_react74 = __toESM(require("react"));
|
|
7873
|
+
var import_classnames33 = __toESM(require("classnames"));
|
|
8228
7874
|
var Card = ({ children, className }) => {
|
|
8229
|
-
return /* @__PURE__ */
|
|
7875
|
+
return /* @__PURE__ */ import_react74.default.createElement("div", { className: (0, import_classnames33.default)("Layer__card", className) }, children);
|
|
8230
7876
|
};
|
|
8231
7877
|
|
|
8232
7878
|
// src/components/DateTime/DateTime.tsx
|
|
8233
|
-
var
|
|
8234
|
-
var
|
|
7879
|
+
var import_react75 = __toESM(require("react"));
|
|
7880
|
+
var import_date_fns15 = require("date-fns");
|
|
8235
7881
|
var DateTime = ({
|
|
8236
7882
|
value,
|
|
8237
7883
|
format: format7,
|
|
@@ -8241,11 +7887,11 @@ var DateTime = ({
|
|
|
8241
7887
|
onlyTime
|
|
8242
7888
|
}) => {
|
|
8243
7889
|
if (format7) {
|
|
8244
|
-
return /* @__PURE__ */
|
|
7890
|
+
return /* @__PURE__ */ import_react75.default.createElement(Text, { className: "Layer__datetime" }, (0, import_date_fns15.format)((0, import_date_fns15.parseISO)(value), format7));
|
|
8245
7891
|
}
|
|
8246
|
-
const date = (0,
|
|
8247
|
-
const time = (0,
|
|
8248
|
-
return /* @__PURE__ */
|
|
7892
|
+
const date = (0, import_date_fns15.format)((0, import_date_fns15.parseISO)(value), dateFormat ?? DATE_FORMAT);
|
|
7893
|
+
const time = (0, import_date_fns15.format)((0, import_date_fns15.parseISO)(value), timeFormat ?? TIME_FORMAT);
|
|
7894
|
+
return /* @__PURE__ */ import_react75.default.createElement(Text, { className: "Layer__datetime" }, !onlyTime && /* @__PURE__ */ import_react75.default.createElement(
|
|
8249
7895
|
Text,
|
|
8250
7896
|
{
|
|
8251
7897
|
as: "span",
|
|
@@ -8254,7 +7900,7 @@ var DateTime = ({
|
|
|
8254
7900
|
className: "Layer__datetime__date"
|
|
8255
7901
|
},
|
|
8256
7902
|
date
|
|
8257
|
-
), !onlyDate && /* @__PURE__ */
|
|
7903
|
+
), !onlyDate && /* @__PURE__ */ import_react75.default.createElement(
|
|
8258
7904
|
Text,
|
|
8259
7905
|
{
|
|
8260
7906
|
as: "span",
|
|
@@ -8267,22 +7913,22 @@ var DateTime = ({
|
|
|
8267
7913
|
};
|
|
8268
7914
|
|
|
8269
7915
|
// src/components/DetailsList/DetailsList.tsx
|
|
8270
|
-
var
|
|
8271
|
-
var
|
|
7916
|
+
var import_react76 = __toESM(require("react"));
|
|
7917
|
+
var import_classnames34 = __toESM(require("classnames"));
|
|
8272
7918
|
var DetailsList = ({
|
|
8273
7919
|
title,
|
|
8274
7920
|
children,
|
|
8275
7921
|
className,
|
|
8276
7922
|
actions
|
|
8277
7923
|
}) => {
|
|
8278
|
-
return /* @__PURE__ */
|
|
7924
|
+
return /* @__PURE__ */ import_react76.default.createElement("div", { className: (0, import_classnames34.default)("Layer__details-list", className) }, title && /* @__PURE__ */ import_react76.default.createElement(Header, null, /* @__PURE__ */ import_react76.default.createElement(Heading, { size: "secondary" /* secondary */ }, title), actions && /* @__PURE__ */ import_react76.default.createElement("div", { className: "Layer__details-list__actions" }, actions)), /* @__PURE__ */ import_react76.default.createElement("ul", { className: "Layer__details-list__list" }, children));
|
|
8279
7925
|
};
|
|
8280
7926
|
|
|
8281
7927
|
// src/components/DetailsList/DetailsListItem.tsx
|
|
8282
|
-
var
|
|
7928
|
+
var import_react77 = __toESM(require("react"));
|
|
8283
7929
|
var renderValue = (value) => {
|
|
8284
7930
|
if (typeof value === "string") {
|
|
8285
|
-
return /* @__PURE__ */
|
|
7931
|
+
return /* @__PURE__ */ import_react77.default.createElement(Text, { weight: "bold" /* bold */, size: "sm" /* sm */ }, value);
|
|
8286
7932
|
}
|
|
8287
7933
|
return value;
|
|
8288
7934
|
};
|
|
@@ -8291,7 +7937,7 @@ var DetailsListItem = ({
|
|
|
8291
7937
|
children,
|
|
8292
7938
|
isLoading
|
|
8293
7939
|
}) => {
|
|
8294
|
-
return /* @__PURE__ */
|
|
7940
|
+
return /* @__PURE__ */ import_react77.default.createElement("li", { className: "Layer__details-list-item" }, /* @__PURE__ */ import_react77.default.createElement("label", { className: "Layer__details-list-item__label" }, label), /* @__PURE__ */ import_react77.default.createElement("span", { className: "Layer__details-list-item__value" }, isLoading ? /* @__PURE__ */ import_react77.default.createElement(SkeletonLoader, null) : renderValue(children)));
|
|
8295
7941
|
};
|
|
8296
7942
|
|
|
8297
7943
|
// src/components/LedgerAccountEntryDetails/LedgerAccountEntryDetails.tsx
|
|
@@ -8299,39 +7945,39 @@ var SourceDetailView = ({ source }) => {
|
|
|
8299
7945
|
switch (source.type) {
|
|
8300
7946
|
case "Transaction_Ledger_Entry_Source": {
|
|
8301
7947
|
const transactionSource = source;
|
|
8302
|
-
return /* @__PURE__ */
|
|
7948
|
+
return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Account name" }, transactionSource.account_name), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Date" }, /* @__PURE__ */ import_react78.default.createElement(DateTime, { value: transactionSource.date })), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(transactionSource.amount)}`), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Direction" }, transactionSource.direction), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Counterparty" }, transactionSource.counterparty));
|
|
8303
7949
|
}
|
|
8304
7950
|
case "Invoice_Ledger_Entry_Source": {
|
|
8305
7951
|
const invoiceSource = source;
|
|
8306
|
-
return /* @__PURE__ */
|
|
7952
|
+
return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Invoice number" }, invoiceSource.invoice_number), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Recipient name" }, invoiceSource.recipient_name), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Date" }, /* @__PURE__ */ import_react78.default.createElement(DateTime, { value: invoiceSource.date })), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(invoiceSource.amount)}`));
|
|
8307
7953
|
}
|
|
8308
7954
|
case "Manual_Ledger_Entry_Source": {
|
|
8309
7955
|
const manualSource = source;
|
|
8310
|
-
return /* @__PURE__ */
|
|
7956
|
+
return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Memo" }, manualSource.memo), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Created by" }, manualSource.created_by));
|
|
8311
7957
|
}
|
|
8312
7958
|
case "Invoice_Payment_Ledger_Entry_Source": {
|
|
8313
7959
|
const invoicePaymentSource = source;
|
|
8314
|
-
return /* @__PURE__ */
|
|
7960
|
+
return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Invoice number" }, invoicePaymentSource.invoice_number), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(invoicePaymentSource.amount)}`));
|
|
8315
7961
|
}
|
|
8316
7962
|
case "Refund_Ledger_Entry_Source": {
|
|
8317
7963
|
const refundSource = source;
|
|
8318
|
-
return /* @__PURE__ */
|
|
7964
|
+
return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(refundSource.refunded_to_customer_amount)}`), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Recipient name" }, refundSource.recipient_name));
|
|
8319
7965
|
}
|
|
8320
7966
|
case "Opening_Balance_Ledger_Entry_Source": {
|
|
8321
7967
|
const openingBalanceSource = source;
|
|
8322
|
-
return /* @__PURE__ */
|
|
7968
|
+
return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Account name" }, openingBalanceSource.account_name));
|
|
8323
7969
|
}
|
|
8324
7970
|
case "Payout_Ledger_Entry_Source": {
|
|
8325
7971
|
const payoutSource = source;
|
|
8326
|
-
return /* @__PURE__ */
|
|
7972
|
+
return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(payoutSource.paid_out_amount)}`), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Processor" }, payoutSource.processor));
|
|
8327
7973
|
}
|
|
8328
7974
|
default:
|
|
8329
7975
|
return null;
|
|
8330
7976
|
}
|
|
8331
7977
|
};
|
|
8332
7978
|
var LedgerAccountEntryDetails = () => {
|
|
8333
|
-
const { entryData, isLoadingEntry, closeSelectedEntry, errorEntry } = (0,
|
|
8334
|
-
const { totalDebit, totalCredit } = (0,
|
|
7979
|
+
const { entryData, isLoadingEntry, closeSelectedEntry, errorEntry } = (0, import_react78.useContext)(LedgerAccountsContext);
|
|
7980
|
+
const { totalDebit, totalCredit } = (0, import_react78.useMemo)(() => {
|
|
8335
7981
|
let totalDebit2 = 0;
|
|
8336
7982
|
let totalCredit2 = 0;
|
|
8337
7983
|
entryData?.line_items?.forEach((item) => {
|
|
@@ -8343,47 +7989,47 @@ var LedgerAccountEntryDetails = () => {
|
|
|
8343
7989
|
});
|
|
8344
7990
|
return { totalDebit: totalDebit2, totalCredit: totalCredit2 };
|
|
8345
7991
|
}, [entryData]);
|
|
8346
|
-
return /* @__PURE__ */
|
|
7992
|
+
return /* @__PURE__ */ import_react78.default.createElement("div", { className: "Layer__ledger-account__entry-details" }, /* @__PURE__ */ import_react78.default.createElement("div", { className: "Layer__ledger-account__entry-details__back-btn" }, /* @__PURE__ */ import_react78.default.createElement(BackButton, { onClick: () => closeSelectedEntry() })), /* @__PURE__ */ import_react78.default.createElement(
|
|
8347
7993
|
DetailsList,
|
|
8348
7994
|
{
|
|
8349
7995
|
title: "Transaction source",
|
|
8350
|
-
actions: /* @__PURE__ */
|
|
7996
|
+
actions: /* @__PURE__ */ import_react78.default.createElement(
|
|
8351
7997
|
IconButton,
|
|
8352
7998
|
{
|
|
8353
|
-
icon: /* @__PURE__ */
|
|
7999
|
+
icon: /* @__PURE__ */ import_react78.default.createElement(X_default, null),
|
|
8354
8000
|
onClick: () => closeSelectedEntry(),
|
|
8355
8001
|
className: "Layer__hidden-sm Layer__hidden-xs"
|
|
8356
8002
|
}
|
|
8357
8003
|
)
|
|
8358
8004
|
},
|
|
8359
|
-
/* @__PURE__ */
|
|
8360
|
-
entryData?.source?.display_description && /* @__PURE__ */
|
|
8361
|
-
), /* @__PURE__ */
|
|
8005
|
+
/* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Source", isLoading: isLoadingEntry }, /* @__PURE__ */ import_react78.default.createElement(Badge, null, entryData?.source?.entity_name)),
|
|
8006
|
+
entryData?.source?.display_description && /* @__PURE__ */ import_react78.default.createElement(SourceDetailView, { source: entryData?.source })
|
|
8007
|
+
), /* @__PURE__ */ import_react78.default.createElement(
|
|
8362
8008
|
DetailsList,
|
|
8363
8009
|
{
|
|
8364
8010
|
title: `Journal Entry ${entryData?.id.substring(0, 5)}`,
|
|
8365
8011
|
className: "Layer__border-top"
|
|
8366
8012
|
},
|
|
8367
|
-
/* @__PURE__ */
|
|
8368
|
-
/* @__PURE__ */
|
|
8369
|
-
/* @__PURE__ */
|
|
8370
|
-
entryData?.reversal_id && /* @__PURE__ */
|
|
8371
|
-
), !isLoadingEntry && !errorEntry ? /* @__PURE__ */
|
|
8013
|
+
/* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Entry type", isLoading: isLoadingEntry }, humanizeEnum(entryData?.entry_type ?? "")),
|
|
8014
|
+
/* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Date", isLoading: isLoadingEntry }, entryData?.entry_at && /* @__PURE__ */ import_react78.default.createElement(DateTime, { value: entryData?.entry_at })),
|
|
8015
|
+
/* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Creation date", isLoading: isLoadingEntry }, entryData?.date && /* @__PURE__ */ import_react78.default.createElement(DateTime, { value: entryData?.date })),
|
|
8016
|
+
entryData?.reversal_id && /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Reversal", isLoading: isLoadingEntry }, entryData?.reversal_id.substring(0, 5))
|
|
8017
|
+
), !isLoadingEntry && !errorEntry ? /* @__PURE__ */ import_react78.default.createElement("div", { className: "Layer__ledger-account__entry-details__line-items" }, /* @__PURE__ */ import_react78.default.createElement(Card, null, /* @__PURE__ */ import_react78.default.createElement("table", { className: "Layer__table Layer__ledger-account__entry-details__table" }, /* @__PURE__ */ import_react78.default.createElement("thead", null, /* @__PURE__ */ import_react78.default.createElement("tr", null, /* @__PURE__ */ import_react78.default.createElement("th", { className: "Layer__table-header" }, "Line items"), /* @__PURE__ */ import_react78.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react78.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"))), /* @__PURE__ */ import_react78.default.createElement("tbody", null, entryData?.line_items?.map((item) => /* @__PURE__ */ import_react78.default.createElement("tr", { key: `ledger-line-item-${item.id}` }, /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell" }, item.account?.name || ""), /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "DEBIT" /* DEBIT */ && /* @__PURE__ */ import_react78.default.createElement(Badge, { variant: "warning" /* WARNING */ }, "$", centsToDollars(item.amount || 0))), /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "CREDIT" /* CREDIT */ && /* @__PURE__ */ import_react78.default.createElement(Badge, { variant: "success" /* SUCCESS */ }, "$", centsToDollars(item.amount || 0))))), /* @__PURE__ */ import_react78.default.createElement("tr", { className: "Layer__table Layer__ledger-account__entry-details__table__total-row" }, /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell" }, "Total"), /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(totalDebit || 0)), /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(totalCredit || 0))))))) : null);
|
|
8372
8018
|
};
|
|
8373
8019
|
|
|
8374
8020
|
// src/components/LedgerAccount/LedgerAccountRow.tsx
|
|
8375
|
-
var
|
|
8376
|
-
var
|
|
8377
|
-
var
|
|
8021
|
+
var import_react79 = __toESM(require("react"));
|
|
8022
|
+
var import_classnames35 = __toESM(require("classnames"));
|
|
8023
|
+
var import_date_fns16 = require("date-fns");
|
|
8378
8024
|
var LedgerAccountRow = ({
|
|
8379
8025
|
row,
|
|
8380
8026
|
index,
|
|
8381
8027
|
initialLoad,
|
|
8382
8028
|
view
|
|
8383
8029
|
}) => {
|
|
8384
|
-
const { selectedEntryId, setSelectedEntryId, closeSelectedEntry } = (0,
|
|
8385
|
-
const [showComponent, setShowComponent] = (0,
|
|
8386
|
-
(0,
|
|
8030
|
+
const { selectedEntryId, setSelectedEntryId, closeSelectedEntry } = (0, import_react79.useContext)(LedgerAccountsContext);
|
|
8031
|
+
const [showComponent, setShowComponent] = (0, import_react79.useState)(false);
|
|
8032
|
+
(0, import_react79.useEffect)(() => {
|
|
8387
8033
|
if (initialLoad) {
|
|
8388
8034
|
const timeoutId = setTimeout(() => {
|
|
8389
8035
|
setShowComponent(true);
|
|
@@ -8394,10 +8040,10 @@ var LedgerAccountRow = ({
|
|
|
8394
8040
|
}
|
|
8395
8041
|
}, []);
|
|
8396
8042
|
if (view === "tablet") {
|
|
8397
|
-
return /* @__PURE__ */
|
|
8043
|
+
return /* @__PURE__ */ import_react79.default.createElement(
|
|
8398
8044
|
"tr",
|
|
8399
8045
|
{
|
|
8400
|
-
className: (0,
|
|
8046
|
+
className: (0, import_classnames35.default)(
|
|
8401
8047
|
"Layer__table-row",
|
|
8402
8048
|
row.entry_id === selectedEntryId && "Layer__table-row--active",
|
|
8403
8049
|
initialLoad && "initial-load",
|
|
@@ -8413,24 +8059,24 @@ var LedgerAccountRow = ({
|
|
|
8413
8059
|
}
|
|
8414
8060
|
}
|
|
8415
8061
|
},
|
|
8416
|
-
/* @__PURE__ */
|
|
8062
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ import_react79.default.createElement(Text, null, row.date && (0, import_date_fns16.format)((0, import_date_fns16.parseISO)(row.date), DATE_FORMAT)), /* @__PURE__ */ import_react79.default.createElement(
|
|
8417
8063
|
Text,
|
|
8418
8064
|
{
|
|
8419
8065
|
weight: "normal" /* normal */,
|
|
8420
8066
|
className: "Layer__ledger_account-table__journal-id"
|
|
8421
8067
|
},
|
|
8422
8068
|
row.entry_id.substring(0, 5)
|
|
8423
|
-
)), /* @__PURE__ */
|
|
8424
|
-
/* @__PURE__ */
|
|
8425
|
-
/* @__PURE__ */
|
|
8426
|
-
/* @__PURE__ */
|
|
8069
|
+
)), /* @__PURE__ */ import_react79.default.createElement(Text, null, row.source?.display_description ?? ""))),
|
|
8070
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)),
|
|
8071
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)),
|
|
8072
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, `$${centsToDollars(row.running_balance)}`))
|
|
8427
8073
|
);
|
|
8428
8074
|
}
|
|
8429
8075
|
if (view === "mobile") {
|
|
8430
|
-
return /* @__PURE__ */
|
|
8076
|
+
return /* @__PURE__ */ import_react79.default.createElement(
|
|
8431
8077
|
"tr",
|
|
8432
8078
|
{
|
|
8433
|
-
className: (0,
|
|
8079
|
+
className: (0, import_classnames35.default)(
|
|
8434
8080
|
"Layer__table-row",
|
|
8435
8081
|
row.entry_id === selectedEntryId && "Layer__table-row--active",
|
|
8436
8082
|
initialLoad && "initial-load",
|
|
@@ -8446,20 +8092,20 @@ var LedgerAccountRow = ({
|
|
|
8446
8092
|
}
|
|
8447
8093
|
}
|
|
8448
8094
|
},
|
|
8449
|
-
/* @__PURE__ */
|
|
8095
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ import_react79.default.createElement(Text, null, row.date && (0, import_date_fns16.format)((0, import_date_fns16.parseISO)(row.date), DATE_FORMAT)), /* @__PURE__ */ import_react79.default.createElement(
|
|
8450
8096
|
Text,
|
|
8451
8097
|
{
|
|
8452
8098
|
weight: "normal" /* normal */,
|
|
8453
8099
|
className: "Layer__ledger_account-table__journal-id"
|
|
8454
8100
|
},
|
|
8455
8101
|
row.entry_id.substring(0, 5)
|
|
8456
|
-
)), /* @__PURE__ */
|
|
8102
|
+
)), /* @__PURE__ */ import_react79.default.createElement(Text, null, row.source?.display_description ?? ""), /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger_account-table__balances-mobile" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Debit"), /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, " ", row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)), /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Credit"), /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)), /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Running balance"), /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, `$${centsToDollars(row.running_balance)}`)))))
|
|
8457
8103
|
);
|
|
8458
8104
|
}
|
|
8459
|
-
return /* @__PURE__ */
|
|
8105
|
+
return /* @__PURE__ */ import_react79.default.createElement(
|
|
8460
8106
|
"tr",
|
|
8461
8107
|
{
|
|
8462
|
-
className: (0,
|
|
8108
|
+
className: (0, import_classnames35.default)(
|
|
8463
8109
|
"Layer__table-row",
|
|
8464
8110
|
row.entry_id === selectedEntryId && "Layer__table-row--active",
|
|
8465
8111
|
initialLoad && "initial-load",
|
|
@@ -8475,25 +8121,25 @@ var LedgerAccountRow = ({
|
|
|
8475
8121
|
}
|
|
8476
8122
|
}
|
|
8477
8123
|
},
|
|
8478
|
-
/* @__PURE__ */
|
|
8479
|
-
/* @__PURE__ */
|
|
8480
|
-
/* @__PURE__ */
|
|
8481
|
-
/* @__PURE__ */
|
|
8482
|
-
/* @__PURE__ */
|
|
8483
|
-
/* @__PURE__ */
|
|
8124
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, row.date && (0, import_date_fns16.format)((0, import_date_fns16.parseISO)(row.date), DATE_FORMAT))),
|
|
8125
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, row.entry_id.substring(0, 5))),
|
|
8126
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, row.source?.display_description ?? "")),
|
|
8127
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)),
|
|
8128
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)),
|
|
8129
|
+
/* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, `$${centsToDollars(row.running_balance)}`))
|
|
8484
8130
|
);
|
|
8485
8131
|
};
|
|
8486
8132
|
|
|
8487
8133
|
// src/components/LedgerAccount/LedgerAccountIndex.tsx
|
|
8488
|
-
var
|
|
8134
|
+
var import_classnames36 = __toESM(require("classnames"));
|
|
8489
8135
|
var LedgerAccount = ({
|
|
8490
8136
|
containerRef,
|
|
8491
8137
|
pageSize = 15,
|
|
8492
8138
|
view
|
|
8493
8139
|
}) => {
|
|
8494
|
-
const [currentPage, setCurrentPage] = (0,
|
|
8495
|
-
const [initialLoad, setInitialLoad] = (0,
|
|
8496
|
-
const { data: accountData } = (0,
|
|
8140
|
+
const [currentPage, setCurrentPage] = (0, import_react80.useState)(1);
|
|
8141
|
+
const [initialLoad, setInitialLoad] = (0, import_react80.useState)(true);
|
|
8142
|
+
const { data: accountData } = (0, import_react80.useContext)(ChartOfAccountsContext);
|
|
8497
8143
|
const {
|
|
8498
8144
|
data: rawData,
|
|
8499
8145
|
error,
|
|
@@ -8504,8 +8150,8 @@ var LedgerAccount = ({
|
|
|
8504
8150
|
selectedEntryId,
|
|
8505
8151
|
closeSelectedEntry,
|
|
8506
8152
|
refetch
|
|
8507
|
-
} = (0,
|
|
8508
|
-
(0,
|
|
8153
|
+
} = (0, import_react80.useContext)(LedgerAccountsContext);
|
|
8154
|
+
(0, import_react80.useEffect)(() => {
|
|
8509
8155
|
if (!isLoading) {
|
|
8510
8156
|
const timeoutLoad = setTimeout(() => {
|
|
8511
8157
|
setInitialLoad(false);
|
|
@@ -8513,16 +8159,16 @@ var LedgerAccount = ({
|
|
|
8513
8159
|
return () => clearTimeout(timeoutLoad);
|
|
8514
8160
|
}
|
|
8515
8161
|
}, [isLoading]);
|
|
8516
|
-
const baseClassName = (0,
|
|
8162
|
+
const baseClassName = (0, import_classnames36.default)(
|
|
8517
8163
|
"Layer__ledger-account__index",
|
|
8518
8164
|
accountId && "open"
|
|
8519
8165
|
);
|
|
8520
|
-
const entry = (0,
|
|
8166
|
+
const entry = (0, import_react80.useMemo)(() => {
|
|
8521
8167
|
return flattenAccounts(accountData?.accounts || []).find(
|
|
8522
8168
|
(x) => x.id === accountId
|
|
8523
8169
|
);
|
|
8524
8170
|
}, [accountId]);
|
|
8525
|
-
const data = (0,
|
|
8171
|
+
const data = (0, import_react80.useMemo)(() => {
|
|
8526
8172
|
const firstPageIndex = (currentPage - 1) * pageSize;
|
|
8527
8173
|
const lastPageIndex = firstPageIndex + pageSize;
|
|
8528
8174
|
return rawData?.sort((a, b) => Date.parse(b.date) - Date.parse(a.date))?.slice(firstPageIndex, lastPageIndex);
|
|
@@ -8531,36 +8177,36 @@ var LedgerAccount = ({
|
|
|
8531
8177
|
setAccountId(void 0);
|
|
8532
8178
|
closeSelectedEntry();
|
|
8533
8179
|
};
|
|
8534
|
-
return /* @__PURE__ */
|
|
8180
|
+
return /* @__PURE__ */ import_react80.default.createElement(
|
|
8535
8181
|
Panel,
|
|
8536
8182
|
{
|
|
8537
|
-
sidebar: /* @__PURE__ */
|
|
8183
|
+
sidebar: /* @__PURE__ */ import_react80.default.createElement(LedgerAccountEntryDetails, null),
|
|
8538
8184
|
sidebarIsOpen: Boolean(selectedEntryId),
|
|
8539
8185
|
parentRef: containerRef,
|
|
8540
8186
|
className: "Layer__ledger-account__panel"
|
|
8541
8187
|
},
|
|
8542
|
-
/* @__PURE__ */
|
|
8188
|
+
/* @__PURE__ */ import_react80.default.createElement("div", { className: baseClassName }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account__header" }, /* @__PURE__ */ import_react80.default.createElement(BackButton, { onClick: close }), /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account__title-container" }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8543
8189
|
Text,
|
|
8544
8190
|
{
|
|
8545
8191
|
weight: "bold" /* bold */,
|
|
8546
8192
|
className: "Layer__ledger-account__title"
|
|
8547
8193
|
},
|
|
8548
8194
|
entry?.name ?? ""
|
|
8549
|
-
), /* @__PURE__ */
|
|
8195
|
+
), /* @__PURE__ */ import_react80.default.createElement(
|
|
8550
8196
|
Button,
|
|
8551
8197
|
{
|
|
8552
8198
|
variant: "secondary" /* secondary */,
|
|
8553
|
-
rightIcon: /* @__PURE__ */
|
|
8199
|
+
rightIcon: /* @__PURE__ */ import_react80.default.createElement(DownloadCloud_default, { size: 12 })
|
|
8554
8200
|
},
|
|
8555
8201
|
"Download"
|
|
8556
|
-
)), /* @__PURE__ */
|
|
8202
|
+
)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account__balance-container" }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8557
8203
|
Text,
|
|
8558
8204
|
{
|
|
8559
8205
|
weight: "bold" /* bold */,
|
|
8560
8206
|
className: "Layer__ledger-account__balance-label"
|
|
8561
8207
|
},
|
|
8562
8208
|
"Current balance"
|
|
8563
|
-
), /* @__PURE__ */
|
|
8209
|
+
), /* @__PURE__ */ import_react80.default.createElement(
|
|
8564
8210
|
Text,
|
|
8565
8211
|
{
|
|
8566
8212
|
weight: "bold" /* bold */,
|
|
@@ -8568,7 +8214,7 @@ var LedgerAccount = ({
|
|
|
8568
8214
|
},
|
|
8569
8215
|
"$",
|
|
8570
8216
|
centsToDollars(entry?.balance || 0)
|
|
8571
|
-
))), /* @__PURE__ */
|
|
8217
|
+
))), /* @__PURE__ */ import_react80.default.createElement("table", { className: "Layer__table Layer__table--hover-effect Layer__ledger-account-table" }, /* @__PURE__ */ import_react80.default.createElement("thead", null, /* @__PURE__ */ import_react80.default.createElement("tr", null, view !== "desktop" && /* @__PURE__ */ import_react80.default.createElement("th", null), view === "desktop" && /* @__PURE__ */ import_react80.default.createElement(import_react80.default.Fragment, null, /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header" }, "Date"), /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header" }, "Journal id #"), /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header" }, "Source")), view !== "mobile" && /* @__PURE__ */ import_react80.default.createElement(import_react80.default.Fragment, null, /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"), /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Running balance")))), /* @__PURE__ */ import_react80.default.createElement("tbody", null, data?.map((x, index) => /* @__PURE__ */ import_react80.default.createElement(
|
|
8572
8218
|
LedgerAccountRow,
|
|
8573
8219
|
{
|
|
8574
8220
|
key: x.id,
|
|
@@ -8577,7 +8223,7 @@ var LedgerAccount = ({
|
|
|
8577
8223
|
initialLoad,
|
|
8578
8224
|
view
|
|
8579
8225
|
}
|
|
8580
|
-
)))), data && /* @__PURE__ */
|
|
8226
|
+
)))), data && /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account__pagination" }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8581
8227
|
Pagination,
|
|
8582
8228
|
{
|
|
8583
8229
|
currentPage,
|
|
@@ -8585,7 +8231,7 @@ var LedgerAccount = ({
|
|
|
8585
8231
|
pageSize,
|
|
8586
8232
|
onPageChange: (page) => setCurrentPage(page)
|
|
8587
8233
|
}
|
|
8588
|
-
)), error ? /* @__PURE__ */
|
|
8234
|
+
)), error ? /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8589
8235
|
DataState,
|
|
8590
8236
|
{
|
|
8591
8237
|
status: "failed" /* failed */,
|
|
@@ -8594,7 +8240,7 @@ var LedgerAccount = ({
|
|
|
8594
8240
|
onRefresh: () => refetch(),
|
|
8595
8241
|
isLoading: isValidating || isLoading
|
|
8596
8242
|
}
|
|
8597
|
-
)) : null, (!data || isLoading) && !error ? /* @__PURE__ */
|
|
8243
|
+
)) : null, (!data || isLoading) && !error ? /* @__PURE__ */ import_react80.default.createElement("div", { className: `Layer__ledger-account__loader-container` }, /* @__PURE__ */ import_react80.default.createElement(Loader2, null)) : null, !isLoading && !error && data?.length === 0 ? /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react80.default.createElement(
|
|
8598
8244
|
DataState,
|
|
8599
8245
|
{
|
|
8600
8246
|
status: "info" /* info */,
|
|
@@ -8607,7 +8253,7 @@ var LedgerAccount = ({
|
|
|
8607
8253
|
};
|
|
8608
8254
|
|
|
8609
8255
|
// src/components/ChartOfAccounts/ChartOfAccounts.tsx
|
|
8610
|
-
var ChartOfAccountsContext = (0,
|
|
8256
|
+
var ChartOfAccountsContext = (0, import_react81.createContext)(
|
|
8611
8257
|
{
|
|
8612
8258
|
data: void 0,
|
|
8613
8259
|
isLoading: false,
|
|
@@ -8632,7 +8278,7 @@ var ChartOfAccountsContext = (0, import_react82.createContext)(
|
|
|
8632
8278
|
}
|
|
8633
8279
|
}
|
|
8634
8280
|
);
|
|
8635
|
-
var LedgerAccountsContext = (0,
|
|
8281
|
+
var LedgerAccountsContext = (0, import_react81.createContext)({
|
|
8636
8282
|
data: void 0,
|
|
8637
8283
|
entryData: void 0,
|
|
8638
8284
|
isLoading: false,
|
|
@@ -8655,11 +8301,11 @@ var LedgerAccountsContext = (0, import_react82.createContext)({
|
|
|
8655
8301
|
var ChartOfAccounts = (props) => {
|
|
8656
8302
|
const chartOfAccountsContextData = useChartOfAccounts();
|
|
8657
8303
|
const ledgerAccountsContextData = useLedgerAccounts();
|
|
8658
|
-
return /* @__PURE__ */
|
|
8304
|
+
return /* @__PURE__ */ import_react81.default.createElement(ChartOfAccountsContext.Provider, { value: chartOfAccountsContextData }, /* @__PURE__ */ import_react81.default.createElement(LedgerAccountsContext.Provider, { value: ledgerAccountsContextData }, /* @__PURE__ */ import_react81.default.createElement(ChartOfAccountsContent, null)));
|
|
8659
8305
|
};
|
|
8660
8306
|
var ChartOfAccountsContent = ({ asWidget }) => {
|
|
8661
|
-
const { accountId } = (0,
|
|
8662
|
-
const [view, setView] = (0,
|
|
8307
|
+
const { accountId } = (0, import_react81.useContext)(LedgerAccountsContext);
|
|
8308
|
+
const [view, setView] = (0, import_react81.useState)("desktop");
|
|
8663
8309
|
const containerRef = useElementSize((_a, _b, { width }) => {
|
|
8664
8310
|
if (width) {
|
|
8665
8311
|
if (width >= BREAKPOINTS.TABLET && view !== "desktop") {
|
|
@@ -8671,12 +8317,12 @@ var ChartOfAccountsContent = ({ asWidget }) => {
|
|
|
8671
8317
|
}
|
|
8672
8318
|
}
|
|
8673
8319
|
});
|
|
8674
|
-
return /* @__PURE__ */
|
|
8320
|
+
return /* @__PURE__ */ import_react81.default.createElement(Container, { name: "chart-of-accounts", ref: containerRef, asWidget }, accountId ? /* @__PURE__ */ import_react81.default.createElement(LedgerAccount, { view, containerRef }) : /* @__PURE__ */ import_react81.default.createElement(ChartOfAccountsTable, { view, containerRef }));
|
|
8675
8321
|
};
|
|
8676
8322
|
|
|
8677
8323
|
// src/providers/LayerProvider/LayerProvider.tsx
|
|
8678
|
-
var
|
|
8679
|
-
var
|
|
8324
|
+
var import_react82 = __toESM(require("react"));
|
|
8325
|
+
var import_date_fns17 = require("date-fns");
|
|
8680
8326
|
var import_swr8 = __toESM(require("swr"));
|
|
8681
8327
|
var reducer = (state, action) => {
|
|
8682
8328
|
switch (action.type) {
|
|
@@ -8717,7 +8363,7 @@ var LayerProvider = ({
|
|
|
8717
8363
|
};
|
|
8718
8364
|
const colors = buildColorsPalette(theme);
|
|
8719
8365
|
const { url, scope, apiUrl } = LayerEnvironment[environment];
|
|
8720
|
-
const [state, dispatch] = (0,
|
|
8366
|
+
const [state, dispatch] = (0, import_react82.useReducer)(reducer, {
|
|
8721
8367
|
auth: {
|
|
8722
8368
|
access_token: "",
|
|
8723
8369
|
token_type: "",
|
|
@@ -8731,7 +8377,7 @@ var LayerProvider = ({
|
|
|
8731
8377
|
colors
|
|
8732
8378
|
});
|
|
8733
8379
|
const { data: auth } = appId !== void 0 && appSecret !== void 0 ? (0, import_swr8.default)(
|
|
8734
|
-
businessAccessToken === void 0 && appId !== void 0 && appSecret !== void 0 && (0,
|
|
8380
|
+
businessAccessToken === void 0 && appId !== void 0 && appSecret !== void 0 && (0, import_date_fns17.isBefore)(state.auth.expires_at, /* @__PURE__ */ new Date()) && "authenticate",
|
|
8735
8381
|
Layer.authenticate({
|
|
8736
8382
|
appId,
|
|
8737
8383
|
appSecret,
|
|
@@ -8740,7 +8386,7 @@ var LayerProvider = ({
|
|
|
8740
8386
|
}),
|
|
8741
8387
|
defaultSWRConfig
|
|
8742
8388
|
) : { data: void 0 };
|
|
8743
|
-
(0,
|
|
8389
|
+
(0, import_react82.useEffect)(() => {
|
|
8744
8390
|
if (businessAccessToken) {
|
|
8745
8391
|
dispatch({
|
|
8746
8392
|
type: "LayerContext.setAuth" /* setAuth */,
|
|
@@ -8749,7 +8395,7 @@ var LayerProvider = ({
|
|
|
8749
8395
|
access_token: businessAccessToken,
|
|
8750
8396
|
token_type: "Bearer",
|
|
8751
8397
|
expires_in: 3600,
|
|
8752
|
-
expires_at: (0,
|
|
8398
|
+
expires_at: (0, import_date_fns17.add)(/* @__PURE__ */ new Date(), { seconds: 3600 })
|
|
8753
8399
|
}
|
|
8754
8400
|
}
|
|
8755
8401
|
});
|
|
@@ -8759,7 +8405,7 @@ var LayerProvider = ({
|
|
|
8759
8405
|
payload: {
|
|
8760
8406
|
auth: {
|
|
8761
8407
|
...auth,
|
|
8762
|
-
expires_at: (0,
|
|
8408
|
+
expires_at: (0, import_date_fns17.add)(/* @__PURE__ */ new Date(), { seconds: auth.expires_in })
|
|
8763
8409
|
}
|
|
8764
8410
|
}
|
|
8765
8411
|
});
|
|
@@ -8814,7 +8460,7 @@ var LayerProvider = ({
|
|
|
8814
8460
|
}
|
|
8815
8461
|
return;
|
|
8816
8462
|
};
|
|
8817
|
-
return /* @__PURE__ */
|
|
8463
|
+
return /* @__PURE__ */ import_react82.default.createElement(import_swr8.SWRConfig, { value: defaultSWRConfig }, /* @__PURE__ */ import_react82.default.createElement(
|
|
8818
8464
|
LayerContext.Provider,
|
|
8819
8465
|
{
|
|
8820
8466
|
value: { ...state, setTheme, getColor, setLightColor, setDarkColor, setColors }
|
|
@@ -8824,53 +8470,53 @@ var LayerProvider = ({
|
|
|
8824
8470
|
};
|
|
8825
8471
|
|
|
8826
8472
|
// src/views/AccountingOverview/AccountingOverview.tsx
|
|
8827
|
-
var
|
|
8473
|
+
var import_react85 = __toESM(require("react"));
|
|
8828
8474
|
|
|
8829
8475
|
// src/components/View/View.tsx
|
|
8830
|
-
var
|
|
8476
|
+
var import_react84 = __toESM(require("react"));
|
|
8831
8477
|
|
|
8832
8478
|
// src/components/ViewHeader/ViewHeader.tsx
|
|
8833
|
-
var
|
|
8479
|
+
var import_react83 = __toESM(require("react"));
|
|
8834
8480
|
var ViewHeader = ({ title, controls }) => {
|
|
8835
|
-
return /* @__PURE__ */
|
|
8481
|
+
return /* @__PURE__ */ import_react83.default.createElement("div", { className: "Layer__view-header" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "Layer__view-header__content" }, /* @__PURE__ */ import_react83.default.createElement(Heading, null, title), controls && /* @__PURE__ */ import_react83.default.createElement("div", { className: "Layer__view-header__controls" }, controls)));
|
|
8836
8482
|
};
|
|
8837
8483
|
|
|
8838
8484
|
// src/components/View/View.tsx
|
|
8839
8485
|
var View6 = ({ title, children, headerControls }) => {
|
|
8840
8486
|
const { theme } = useLayerContext();
|
|
8841
8487
|
const styles = parseStylesFromThemeConfig(theme);
|
|
8842
|
-
return /* @__PURE__ */
|
|
8488
|
+
return /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__view", style: { ...styles } }, /* @__PURE__ */ import_react84.default.createElement(ViewHeader, { title, controls: headerControls }), /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__view-main" }, children));
|
|
8843
8489
|
};
|
|
8844
8490
|
|
|
8845
8491
|
// src/views/AccountingOverview/AccountingOverview.tsx
|
|
8846
8492
|
var AccountingOverview = ({
|
|
8847
8493
|
title = "Accounting overview"
|
|
8848
8494
|
}) => {
|
|
8849
|
-
return /* @__PURE__ */
|
|
8495
|
+
return /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react85.default.createElement(View6, { title, headerControls: /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.DatePicker, null) }, /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.Summaries, { actionable: false }), /* @__PURE__ */ import_react85.default.createElement(
|
|
8850
8496
|
Container,
|
|
8851
8497
|
{
|
|
8852
8498
|
name: "accounting-overview-profit-and-loss",
|
|
8853
8499
|
asWidget: true,
|
|
8854
8500
|
elevated: true
|
|
8855
8501
|
},
|
|
8856
|
-
/* @__PURE__ */
|
|
8857
|
-
/* @__PURE__ */
|
|
8858
|
-
), /* @__PURE__ */
|
|
8502
|
+
/* @__PURE__ */ import_react85.default.createElement(Header, null, /* @__PURE__ */ import_react85.default.createElement(Heading, { size: "secondary" /* secondary */ }, "Profit & Loss")),
|
|
8503
|
+
/* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.Chart, null)
|
|
8504
|
+
), /* @__PURE__ */ import_react85.default.createElement("div", { className: "accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ import_react85.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "revenue", hideClose: true })), /* @__PURE__ */ import_react85.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "expenses", hideClose: true })))));
|
|
8859
8505
|
};
|
|
8860
8506
|
|
|
8861
8507
|
// src/views/BankTransactionsWithLinkedAccounts/BankTransactionsWithLinkedAccounts.tsx
|
|
8862
|
-
var
|
|
8508
|
+
var import_react86 = __toESM(require("react"));
|
|
8863
8509
|
var BankTransactionsWithLinkedAccounts = ({
|
|
8864
8510
|
title = "Bank transactions"
|
|
8865
8511
|
}) => {
|
|
8866
|
-
return /* @__PURE__ */
|
|
8512
|
+
return /* @__PURE__ */ import_react86.default.createElement(View6, { title }, /* @__PURE__ */ import_react86.default.createElement(LinkedAccounts, { elevated: true }), /* @__PURE__ */ import_react86.default.createElement(BankTransactions, { asWidget: true }));
|
|
8867
8513
|
};
|
|
8868
8514
|
|
|
8869
8515
|
// src/views/Reports/Reports.tsx
|
|
8870
|
-
var
|
|
8516
|
+
var import_react87 = __toESM(require("react"));
|
|
8871
8517
|
var Reports = ({ title = "Reports" }) => {
|
|
8872
|
-
const containerRef = (0,
|
|
8873
|
-
return /* @__PURE__ */
|
|
8518
|
+
const containerRef = (0, import_react87.useRef)(null);
|
|
8519
|
+
return /* @__PURE__ */ import_react87.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react87.default.createElement(View6, { title, headerControls: /* @__PURE__ */ import_react87.default.createElement(ProfitAndLoss.DatePicker, null) }, /* @__PURE__ */ import_react87.default.createElement(
|
|
8874
8520
|
Toggle,
|
|
8875
8521
|
{
|
|
8876
8522
|
name: "reports-tabs",
|
|
@@ -8888,18 +8534,18 @@ var Reports = ({ title = "Reports" }) => {
|
|
|
8888
8534
|
selected: "profitAndLoss",
|
|
8889
8535
|
onChange: () => null
|
|
8890
8536
|
}
|
|
8891
|
-
), /* @__PURE__ */
|
|
8537
|
+
), /* @__PURE__ */ import_react87.default.createElement(Container, { name: "reports", ref: containerRef }, /* @__PURE__ */ import_react87.default.createElement(ReportsPanel, { containerRef }))));
|
|
8892
8538
|
};
|
|
8893
8539
|
var ReportsPanel = ({ containerRef }) => {
|
|
8894
|
-
const { sidebarScope } = (0,
|
|
8895
|
-
return /* @__PURE__ */
|
|
8540
|
+
const { sidebarScope } = (0, import_react87.useContext)(ProfitAndLoss.Context);
|
|
8541
|
+
return /* @__PURE__ */ import_react87.default.createElement(
|
|
8896
8542
|
Panel,
|
|
8897
8543
|
{
|
|
8898
|
-
sidebar: /* @__PURE__ */
|
|
8544
|
+
sidebar: /* @__PURE__ */ import_react87.default.createElement(ProfitAndLoss.DetailedCharts, null),
|
|
8899
8545
|
sidebarIsOpen: Boolean(sidebarScope),
|
|
8900
8546
|
parentRef: containerRef
|
|
8901
8547
|
},
|
|
8902
|
-
/* @__PURE__ */
|
|
8548
|
+
/* @__PURE__ */ import_react87.default.createElement(ProfitAndLoss.Table, { asContainer: false })
|
|
8903
8549
|
);
|
|
8904
8550
|
};
|
|
8905
8551
|
// Annotate the CommonJS export names for ESM import in node:
|