@visns-studio/visns-components 2.1.4 → 2.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,6 +3,7 @@ import React, {
3
3
  useCallback,
4
4
  useEffect,
5
5
  useImperativeHandle,
6
+ useRef,
6
7
  useState,
7
8
  } from 'react';
8
9
  import { useNavigate } from 'react-router-dom';
@@ -32,6 +33,7 @@ import {
32
33
  Ribbon,
33
34
  Search,
34
35
  ShippingBoxV1,
36
+ SoundOn,
35
37
  TriangleAlert,
36
38
  } from 'akar-icons';
37
39
 
@@ -111,6 +113,10 @@ const DataGrid = forwardRef(
111
113
  ) => {
112
114
  const navigate = useNavigate();
113
115
 
116
+ /** Audio */
117
+ const audioRef = useRef(null);
118
+ const [audioSource, setAudioSource] = useState('');
119
+
114
120
  /** Modal States */
115
121
  const [formData, setFormData] = useState({});
116
122
  const [formType, setFormType] = useState('');
@@ -178,9 +184,6 @@ const DataGrid = forwardRef(
178
184
 
179
185
  const handleSettingClick = (s, d) => {
180
186
  switch (s.id) {
181
- case 'update':
182
- modalOpen('update', d.id);
183
- break;
184
187
  case 'delete':
185
188
  confirmAlert({
186
189
  title: 'Delete Item',
@@ -234,6 +237,26 @@ const DataGrid = forwardRef(
234
237
  ],
235
238
  });
236
239
  break;
240
+ case 'sound':
241
+ const soundRelation = s.relation.reduce((acc, id) => {
242
+ if (acc === '') {
243
+ return d[id];
244
+ } else {
245
+ if (acc && acc[id]) {
246
+ return acc[id];
247
+ } else {
248
+ return '';
249
+ }
250
+ }
251
+ }, '');
252
+
253
+ if (soundRelation && soundRelation[d[s.path]]) {
254
+ setAudioSource(soundRelation[d[s.path]]);
255
+ }
256
+ break;
257
+ case 'update':
258
+ modalOpen('update', d.id);
259
+ break;
237
260
  default:
238
261
  confirmAlert({
239
262
  title: s.title,
@@ -587,6 +610,8 @@ const DataGrid = forwardRef(
587
610
  return getIconComponent(Ribbon);
588
611
  case 'restore':
589
612
  return getIconComponent(ArrowCounterClockwise);
613
+ case 'sound':
614
+ return getIconComponent(SoundOn);
590
615
  case 'ssa':
591
616
  return getIconComponent(Clock);
592
617
  case 'update':
@@ -1744,41 +1769,49 @@ const DataGrid = forwardRef(
1744
1769
  {renderSearch()}
1745
1770
  {renderCreateButton()}
1746
1771
  {limit && limit > 0 && (
1747
- <ReactDataGrid
1748
- columns={gridColumns}
1749
- dataSource={data}
1750
- filterValue={filterValue}
1751
- limit={limit}
1752
- enableColumnAutosize={false}
1753
- enableColumnFilterContextMenu={false}
1754
- enableSelection={false}
1755
- headerProps={headerProps}
1756
- idProperty={`visns-datagrid-${ajaxSetting.url.replace(
1757
- /\//g,
1758
- '-'
1759
- )}`}
1760
- minRowHeight={40}
1761
- onFilterValueChange={(filterValue) => {
1762
- handleFilterChange(filterValue);
1763
- }}
1764
- onLimitChange={setLimit}
1765
- onSortInfoChange={handleSort}
1766
- onRenderRow={onRenderRow}
1767
- pagination
1768
- renderColumnContextMenu={renderColumnContextMenu}
1769
- rowClassName="vs-datagrid--row"
1770
- rowHeight={null}
1771
- showZebraRows={true}
1772
- sortInfo={
1773
- ajaxSetting.sortBy && ajaxSetting.sort
1774
- ? {
1775
- name: ajaxSetting.sortBy,
1776
- dir: ajaxSetting.sort === 'asc' ? 1 : -1,
1777
- }
1778
- : null
1779
- }
1780
- style={gridStyle}
1781
- />
1772
+ <>
1773
+ <ReactDataGrid
1774
+ columns={gridColumns}
1775
+ dataSource={data}
1776
+ filterValue={filterValue}
1777
+ limit={limit}
1778
+ enableColumnAutosize={false}
1779
+ enableColumnFilterContextMenu={false}
1780
+ enableSelection={false}
1781
+ headerProps={headerProps}
1782
+ idProperty={`visns-datagrid-${ajaxSetting.url.replace(
1783
+ /\//g,
1784
+ '-'
1785
+ )}`}
1786
+ minRowHeight={40}
1787
+ onFilterValueChange={(filterValue) => {
1788
+ handleFilterChange(filterValue);
1789
+ }}
1790
+ onLimitChange={setLimit}
1791
+ onSortInfoChange={handleSort}
1792
+ onRenderRow={onRenderRow}
1793
+ pagination
1794
+ renderColumnContextMenu={renderColumnContextMenu}
1795
+ rowClassName="vs-datagrid--row"
1796
+ rowHeight={null}
1797
+ showZebraRows={true}
1798
+ sortInfo={
1799
+ ajaxSetting.sortBy && ajaxSetting.sort
1800
+ ? {
1801
+ name: ajaxSetting.sortBy,
1802
+ dir:
1803
+ ajaxSetting.sort === 'asc'
1804
+ ? 1
1805
+ : -1,
1806
+ }
1807
+ : null
1808
+ }
1809
+ style={gridStyle}
1810
+ />
1811
+ {audioSource && (
1812
+ <audio src={audioSource} ref={audioRef} />
1813
+ )}
1814
+ </>
1782
1815
  )}
1783
1816
  <Popup
1784
1817
  open={modalShow}
@@ -12,6 +12,7 @@ import {
12
12
  Grid,
13
13
  Home,
14
14
  LightBulb,
15
+ Microphone,
15
16
  Newspaper,
16
17
  PeopleGroup,
17
18
  PeopleMultiple,
@@ -102,6 +103,7 @@ function Navigation({ logo, logout, navConfig, setSystemAuth, userProfile }) {
102
103
  grid: Grid,
103
104
  home: Home,
104
105
  lightBulb: LightBulb,
106
+ microphone: Microphone,
105
107
  newspaper: Newspaper,
106
108
  peopleGroup: PeopleGroup,
107
109
  peopleMultiple: PeopleMultiple,
package/package.json CHANGED
@@ -40,7 +40,7 @@
40
40
  "react-dom": "^17.0.1"
41
41
  },
42
42
  "name": "@visns-studio/visns-components",
43
- "version": "2.1.4",
43
+ "version": "2.2.0",
44
44
  "description": "Various packages to assist in the development of our Custom Applications.",
45
45
  "main": "index.js",
46
46
  "scripts": {