datastake-daf 0.6.734 → 0.6.736

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/components/index.js +13 -9
  2. package/dist/hooks/index.js +19 -4658
  3. package/dist/layouts/index.js +13 -9
  4. package/dist/style/datastake/mapbox-gl.css +330 -0
  5. package/package.json +1 -1
  6. package/src/@daf/core/components/Sidenav/Menu.jsx +271 -267
package/src/@daf/core/components/Sidenav/Menu.jsx CHANGED
@@ -14,7 +14,7 @@ export const featureIsNotAvailable = (t, isDemo) => {
14
14
  ? "This feature is not available in demo mode."
15
15
  : "This feature is not available to you.",
16
16
  okText: "Ok",
17
- onOk: () => {},
17
+ onOk: () => { },
18
18
  maskClosable: true,
19
19
  });
20
20
  };
@@ -36,7 +36,7 @@ export default function SidenavMenu({
36
36
  isDemo,
37
37
  isDev,
38
38
  t = (s) => s,
39
- checkOnClick = () => {},
39
+ checkOnClick = () => { },
40
40
  project,
41
41
  showSettings = false,
42
42
  // eslint-disable-next-line no-unused-vars
@@ -145,12 +145,12 @@ export default function SidenavMenu({
145
145
  children: [
146
146
  isCollapsed
147
147
  ? {
148
- disabled: true,
149
- icon: <CustomIcon width={15} height={15} name={item.icon} />,
150
- className: "title",
151
- key: `${item.path}`,
152
- label: t(item.name),
153
- }
148
+ disabled: true,
149
+ icon: <CustomIcon width={15} height={15} name={item.icon} />,
150
+ className: "title",
151
+ key: `${item.path}`,
152
+ label: t(item.name),
153
+ }
154
154
  : null,
155
155
  ...item.items
156
156
  .filter((item) => (item.visible ? item.visible(user, project) : false))
@@ -161,11 +161,11 @@ export default function SidenavMenu({
161
161
  className: formatClassname([
162
162
  typeof selectedKeys[0] === "string"
163
163
  ? !!(
164
- selectedKeys[0].includes(subitem.path) ||
165
- (subitem.subPath || []).find((p) =>
166
- matchPath(p, selectedKeys[0])
167
- )
168
- ) && "selected"
164
+ selectedKeys[0].includes(subitem.path) ||
165
+ (subitem.subPath || []).find((p) =>
166
+ matchPath(p, selectedKeys[0])
167
+ )
168
+ ) && "selected"
169
169
  : "",
170
170
  ]),
171
171
  onClick: () => {
@@ -223,11 +223,15 @@ export default function SidenavMenu({
223
223
  });
224
224
 
225
225
  if (ind >= 0) {
226
- setOpenKeys((p) => [...p, `item-${ind}`]);
226
+ const item = moduleItems[ind];
227
+ const key = item.key || `item-${ind}`;
228
+ setOpenKeys((p) => [...p, key]);
227
229
  }
228
230
 
229
231
  if (labelInd >= 0) {
230
- setOpenKeys((p) => [...p, `item-${labelInd}`, label]);
232
+ const item = moduleItems[labelInd];
233
+ const key = item.key || `item-${labelInd}`;
234
+ setOpenKeys((p) => [...p, key, label]);
231
235
  }
232
236
  }
233
237
  }, [selectedKeys]);
@@ -257,162 +261,6 @@ export default function SidenavMenu({
257
261
  item.type === "link"
258
262
  ? isCollapsed
259
263
  ? {
260
- onMouseEnter: (e) => {
261
- if (isCollapsed && !item.isDisabled) {
262
- document.removeEventListener("mousemove", onMouseMove);
263
- setHoverItem(item);
264
- setTopHover(
265
- e.domEvent.currentTarget.getBoundingClientRect().top
266
- );
267
- setHoverOpen(true);
268
- }
269
- },
270
- className: formatClassname([
271
- !!(selectedKeys[0] && item.path
272
- ? matchPath(item.path, selectedKeys[0])
273
- : undefined) && "selected",
274
- ]),
275
- disabled: item.isDisabled,
276
- onMouseLeave: () => {
277
- if (isCollapsed) {
278
- document.addEventListener("mousemove", onMouseMove);
279
- }
280
- },
281
- key: item.name,
282
- onTitleClick: () => {
283
- checkOnClick({
284
- event: () => {
285
- if (
286
- isModuleApproved(user, module) ||
287
- isSuperAdmin(user)
288
- ) {
289
- if (
290
- (isDemo && !item.demo) ||
291
- (item.isDisabled && item.isDisabled(user) && !isDev)
292
- ) {
293
- featureIsNotAvailable(t, isDemo);
294
- return;
295
- }
296
- if (item.path) {
297
- goTo(item.path);
298
- }
299
-
300
- if (typeof item.onClick === "function") {
301
- item.onClick();
302
- }
303
- } else {
304
- notApprovedModal(item.path);
305
- }
306
- },
307
- });
308
- },
309
- label: t(item.name),
310
- icon: <CustomIcon width={15} height={15} name={item.icon} />,
311
- children: [
312
- {
313
- key: item.path || item.name,
314
- style: item.style ? item.style : {},
315
- icon: (
316
- <CustomIcon width={15} height={15} name={item.icon} />
317
- ),
318
- disabled: item.isDisabled,
319
- onClick: () => {
320
- checkOnClick({
321
- event: () => {
322
- if (
323
- isModuleApproved(user, module) ||
324
- isSuperAdmin(user)
325
- ) {
326
- if (
327
- (isDemo && !item.demo) ||
328
- (item.isDisabled &&
329
- item.isDisabled(user) &&
330
- !isDev)
331
- ) {
332
- featureIsNotAvailable(t, isDemo);
333
- return;
334
- }
335
- if (item.path) {
336
- goTo(item.path);
337
- }
338
-
339
- if (typeof item.onClick === "function") {
340
- item.onClick();
341
- }
342
- } else {
343
- notApprovedModal(item.path);
344
- }
345
- },
346
- });
347
- },
348
- label: t(item.name),
349
- },
350
- ],
351
- }
352
- : {
353
- key: item.path,
354
- style: item.style ? item.style : {},
355
- icon: <CustomIcon width={15} height={15} name={item.icon} />,
356
- disabled: item.isDisabled,
357
- onClick: () => {
358
- checkOnClick({
359
- event: () => {
360
- if (
361
- isModuleApproved(user, module) ||
362
- isSuperAdmin(user)
363
- ) {
364
- if (
365
- (isDemo && !item.demo) ||
366
- (item.isDisabled && item.isDisabled(user) && !isDev)
367
- ) {
368
- featureIsNotAvailable(t, isDemo);
369
- return;
370
- }
371
- if (item.path) {
372
- goTo(item.path);
373
- }
374
-
375
- if (typeof item.onClick === "function") {
376
- item.onClick();
377
- }
378
- } else {
379
- notApprovedModal(item.path);
380
- }
381
- },
382
- });
383
- },
384
- label: t(item.name),
385
- }
386
- : {
387
- key: `item-${i}`,
388
- icon: <CustomIcon width={15} height={15} name={item.icon} />,
389
- disabled: item.isDisabled,
390
- className: formatClassname([
391
- !!(selectedKeys[0] && Array.isArray(item.items)
392
- ? item.items.find((it) =>
393
- it.items
394
- ? it.items.find((item) =>
395
- (item.subPath || []).find((p) =>
396
- matchPath(p, selectedKeys[0])
397
- )
398
- )
399
- : (it.subPath || []).find((p) =>
400
- matchPath(p, selectedKeys[0])
401
- ) || matchPath(it.path, selectedKeys[0])
402
- )
403
- : undefined) && "selected",
404
- ]),
405
- onTitleClick: () => {
406
- checkOnClick({
407
- event: () => {
408
- // if (item.onTitleClick) {
409
- // if (item.onTitleClick === 'PUSH_TO_DD_ANALYSIS') {
410
- // goTo(`/app/${module}/analysis/dd`);
411
- // }
412
- // }
413
- },
414
- });
415
- },
416
264
  onMouseEnter: (e) => {
417
265
  if (isCollapsed && !item.isDisabled) {
418
266
  document.removeEventListener("mousemove", onMouseMove);
@@ -423,108 +271,264 @@ export default function SidenavMenu({
423
271
  setHoverOpen(true);
424
272
  }
425
273
  },
274
+ className: formatClassname([
275
+ !!(selectedKeys[0] && item.path
276
+ ? matchPath(item.path, selectedKeys[0])
277
+ : undefined) && "selected",
278
+ ]),
279
+ disabled: item.isDisabled,
426
280
  onMouseLeave: () => {
427
281
  if (isCollapsed) {
428
282
  document.addEventListener("mousemove", onMouseMove);
429
283
  }
430
284
  },
285
+ key: item.name,
286
+ onTitleClick: () => {
287
+ checkOnClick({
288
+ event: () => {
289
+ if (
290
+ isModuleApproved(user, module) ||
291
+ isSuperAdmin(user)
292
+ ) {
293
+ if (
294
+ (isDemo && !item.demo) ||
295
+ (item.isDisabled && item.isDisabled(user) && !isDev)
296
+ ) {
297
+ featureIsNotAvailable(t, isDemo);
298
+ return;
299
+ }
300
+ if (item.path) {
301
+ goTo(item.path);
302
+ }
303
+
304
+ if (typeof item.onClick === "function") {
305
+ item.onClick();
306
+ }
307
+ } else {
308
+ notApprovedModal(item.path);
309
+ }
310
+ },
311
+ });
312
+ },
431
313
  label: t(item.name),
314
+ icon: <CustomIcon width={15} height={15} name={item.icon} />,
432
315
  children: [
433
- isCollapsed
434
- ? {
435
- disabled: true,
436
- icon: (
437
- <CustomIcon width={15} height={15} name={item.icon} />
438
- ),
439
- className: "title",
440
- label: t(item.name),
441
- key: `${item.name}-link`,
316
+ {
317
+ key: item.path || item.name,
318
+ style: item.style ? item.style : {},
319
+ icon: (
320
+ <CustomIcon width={15} height={15} name={item.icon} />
321
+ ),
322
+ disabled: item.isDisabled,
323
+ onClick: () => {
324
+ checkOnClick({
325
+ event: () => {
326
+ if (
327
+ isModuleApproved(user, module) ||
328
+ isSuperAdmin(user)
329
+ ) {
330
+ if (
331
+ (isDemo && !item.demo) ||
332
+ (item.isDisabled &&
333
+ item.isDisabled(user) &&
334
+ !isDev)
335
+ ) {
336
+ featureIsNotAvailable(t, isDemo);
337
+ return;
338
+ }
339
+ if (item.path) {
340
+ goTo(item.path);
341
+ }
342
+
343
+ if (typeof item.onClick === "function") {
344
+ item.onClick();
345
+ }
346
+ } else {
347
+ notApprovedModal(item.path);
348
+ }
349
+ },
350
+ });
351
+ },
352
+ label: t(item.name),
353
+ },
354
+ ],
355
+ }
356
+ : {
357
+ key: item.path,
358
+ style: item.style ? item.style : {},
359
+ icon: <CustomIcon width={15} height={15} name={item.icon} />,
360
+ disabled: item.isDisabled,
361
+ onClick: () => {
362
+ checkOnClick({
363
+ event: () => {
364
+ if (
365
+ isModuleApproved(user, module) ||
366
+ isSuperAdmin(user)
367
+ ) {
368
+ if (
369
+ (isDemo && !item.demo) ||
370
+ (item.isDisabled && item.isDisabled(user) && !isDev)
371
+ ) {
372
+ featureIsNotAvailable(t, isDemo);
373
+ return;
374
+ }
375
+ if (item.path) {
376
+ goTo(item.path);
377
+ }
378
+
379
+ if (typeof item.onClick === "function") {
380
+ item.onClick();
381
+ }
382
+ } else {
383
+ notApprovedModal(item.path);
442
384
  }
443
- : null,
444
- ...item.items
445
- .filter((item) =>
446
- item.visible ? item.visible(user, project) : false
447
- )
448
- .map((subitem, j) =>
449
- subitem.items
450
- ? renderSubMenu(subitem, `${subitem.name}`)
451
- : {
452
- label: (
453
- <Typography.Text
454
- ellipsis={{ tooltip: t(subitem.name) }}
455
- // style={{ color: module === 'tazama' ? 'var(--base-gray-90)' : module === 'cukura' ? 'var(--base-gray-70)' : 'white' }}
456
- style={{
457
- color:
458
- subitem.color ||
459
- (module === "tazama"
460
- ? "var(--base-gray-90)"
461
- : module === "cukura"
462
- ? "var(--base-gray-70)"
463
- : "white"),
464
- }}
465
- className={formatClassname([
466
- typeof selectedKeys[0] === "string"
467
- ? !!(
468
- selectedKeys[0].includes(subitem.path) ||
469
- (subitem.subPath || []).find((p) =>
470
- matchPath(p, selectedKeys[0])
471
- )
472
- ) && "selected-label"
473
- : "",
474
- ])}
475
- >
476
- {t(subitem.name)}
477
- </Typography.Text>
478
- ),
479
- style: subitem.style ? subitem.style : {},
480
- icon: (
481
- <CustomIcon
482
- width={15}
483
- height={15}
484
- name={subitem?.icon}
485
- />
486
- ),
487
- key: `${subitem.path}-link-${j}`,
488
- disabled: item.isDisabled || subitem.isDisabled,
489
- className: formatClassname([
385
+ },
386
+ });
387
+ },
388
+ label: t(item.name),
389
+ }
390
+ : {
391
+ key: item.key || `item-${i}`,
392
+ icon: <CustomIcon width={15} height={15} name={item.icon} />,
393
+ disabled: item.isDisabled,
394
+ className: formatClassname([
395
+ !!(selectedKeys[0] && Array.isArray(item.items)
396
+ ? item.items.find((it) =>
397
+ it.items
398
+ ? it.items.find((item) =>
399
+ (item.subPath || []).find((p) =>
400
+ matchPath(p, selectedKeys[0])
401
+ )
402
+ )
403
+ : (it.subPath || []).find((p) =>
404
+ matchPath(p, selectedKeys[0])
405
+ ) || matchPath(it.path, selectedKeys[0])
406
+ )
407
+ : undefined) && "selected",
408
+ ]),
409
+ onTitleClick: () => {
410
+ checkOnClick({
411
+ event: () => {
412
+ // if (item.onTitleClick) {
413
+ // if (item.onTitleClick === 'PUSH_TO_DD_ANALYSIS') {
414
+ // goTo(`/app/${module}/analysis/dd`);
415
+ // }
416
+ // }
417
+ },
418
+ });
419
+ },
420
+ onMouseEnter: (e) => {
421
+ if (isCollapsed && !item.isDisabled) {
422
+ document.removeEventListener("mousemove", onMouseMove);
423
+ setHoverItem(item);
424
+ setTopHover(
425
+ e.domEvent.currentTarget.getBoundingClientRect().top
426
+ );
427
+ setHoverOpen(true);
428
+ }
429
+ },
430
+ onMouseLeave: () => {
431
+ if (isCollapsed) {
432
+ document.addEventListener("mousemove", onMouseMove);
433
+ }
434
+ },
435
+ label: t(item.name),
436
+ children: [
437
+ isCollapsed
438
+ ? {
439
+ disabled: true,
440
+ icon: (
441
+ <CustomIcon width={15} height={15} name={item.icon} />
442
+ ),
443
+ className: "title",
444
+ label: t(item.name),
445
+ key: `${item.name}-link`,
446
+ }
447
+ : null,
448
+ ...item.items
449
+ .filter((item) =>
450
+ item.visible ? item.visible(user, project) : false
451
+ )
452
+ .map((subitem, j) =>
453
+ subitem.items
454
+ ? renderSubMenu(subitem, `${subitem.name}`)
455
+ : {
456
+ label: (
457
+ <Typography.Text
458
+ ellipsis={{ tooltip: t(subitem.name) }}
459
+ // style={{ color: module === 'tazama' ? 'var(--base-gray-90)' : module === 'cukura' ? 'var(--base-gray-70)' : 'white' }}
460
+ style={{
461
+ color:
462
+ subitem.color ||
463
+ (module === "tazama"
464
+ ? "var(--base-gray-90)"
465
+ : module === "cukura"
466
+ ? "var(--base-gray-70)"
467
+ : "white"),
468
+ }}
469
+ className={formatClassname([
490
470
  typeof selectedKeys[0] === "string"
491
471
  ? !!(
492
- selectedKeys[0].includes(subitem.path) ||
493
- (subitem.subPath || []).find((p) =>
494
- matchPath(p, selectedKeys[0])
495
- )
496
- ) && "selected-it"
472
+ selectedKeys[0].includes(subitem.path) ||
473
+ (subitem.subPath || []).find((p) =>
474
+ matchPath(p, selectedKeys[0])
475
+ )
476
+ ) && "selected-label"
497
477
  : "",
498
- ]),
499
- onClick: () => {
500
- checkOnClick({
501
- event: () => {
502
- if (
503
- isModuleApproved(user, module) ||
504
- isSuperAdmin(user)
505
- ) {
506
- if (
507
- (isDemo && !subitem.demo) ||
508
- (subitem.isDisabled &&
509
- subitem.isDisabled(user) &&
510
- !isDev)
511
- ) {
512
- featureIsNotAvailable(t, isDemo);
513
- return;
514
- }
515
- if (subitem.path) {
516
- goTo(subitem.path);
517
- }
518
- } else {
519
- notApprovedModal(subitem.path);
520
- }
521
- },
522
- });
478
+ ])}
479
+ >
480
+ {t(subitem.name)}
481
+ </Typography.Text>
482
+ ),
483
+ style: subitem.style ? subitem.style : {},
484
+ icon: (
485
+ <CustomIcon
486
+ width={15}
487
+ height={15}
488
+ name={subitem?.icon}
489
+ />
490
+ ),
491
+ key: `${subitem.path}-link-${j}`,
492
+ disabled: item.isDisabled || subitem.isDisabled,
493
+ className: formatClassname([
494
+ typeof selectedKeys[0] === "string"
495
+ ? !!(
496
+ selectedKeys[0].includes(subitem.path) ||
497
+ (subitem.subPath || []).find((p) =>
498
+ matchPath(p, selectedKeys[0])
499
+ )
500
+ ) && "selected-it"
501
+ : "",
502
+ ]),
503
+ onClick: () => {
504
+ checkOnClick({
505
+ event: () => {
506
+ if (
507
+ isModuleApproved(user, module) ||
508
+ isSuperAdmin(user)
509
+ ) {
510
+ if (
511
+ (isDemo && !subitem.demo) ||
512
+ (subitem.isDisabled &&
513
+ subitem.isDisabled(user) &&
514
+ !isDev)
515
+ ) {
516
+ featureIsNotAvailable(t, isDemo);
517
+ return;
518
+ }
519
+ if (subitem.path) {
520
+ goTo(subitem.path);
521
+ }
522
+ } else {
523
+ notApprovedModal(subitem.path);
524
+ }
523
525
  },
524
- }
525
- ),
526
- ].filter((v) => !!v),
527
- }
526
+ });
527
+ },
528
+ }
529
+ ),
530
+ ].filter((v) => !!v),
531
+ }
528
532
  )}
529
533
  />
530
534
  );
@@ -545,6 +549,12 @@ export default function SidenavMenu({
545
549
  <span className="title-span">{t("core")}</span>
546
550
  {renderMenu(coreItems)}
547
551
  </div>
552
+ ) : null}
553
+ {operationsItems.length ? (
554
+ <div className="sidemenu-cont">
555
+ <span className="title-span">{t("operations")}</span>
556
+ {renderMenu(operationsItems)}
557
+ </div>
548
558
  ) : null}
549
559
  {activityItems.length ? (
550
560
  <div className="sidemenu-cont">
@@ -600,12 +610,6 @@ export default function SidenavMenu({
600
610
  {renderMenu(specificationsItems)}
601
611
  </div>
602
612
  ) : null}
603
- {operationsItems.length ? (
604
- <div className="sidemenu-cont">
605
- <span className="title-span">{t("operations")}</span>
606
- {renderMenu(operationsItems)}
607
- </div>
608
- ) : null}
609
613
  {projectDataItems.length ? (
610
614
  <div className="sidemenu-cont">
611
615
  <span className="title-span">{t("Project Data")}</span>