inboxlookup_screen 1.0.16 → 1.0.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -13,22 +13,12 @@ import CustomStore from 'devextreme/data/custom_store';
|
|
|
13
13
|
import Popup from 'devextreme-react/popup';
|
|
14
14
|
import 'devextreme/dist/css/dx.light.css';
|
|
15
15
|
|
|
16
|
-
const STORAGE_KEY = "ORDERS_MASTER_DETAIL_SEARCH_HISTORY";
|
|
17
|
-
|
|
18
16
|
|
|
19
17
|
const OrdersMasterDetail = ({ dataSource, keyExpr, token, BaseUrl, ProjectId }) => {
|
|
20
|
-
const DEFAULT_SERVICE = {
|
|
21
|
-
projectId: ProjectId,
|
|
22
|
-
id: 4,
|
|
23
|
-
status: "Active" // optional for left list rendering
|
|
24
|
-
};
|
|
25
18
|
const [orders, setOrders] = useState([]);
|
|
26
19
|
const [selectedOrder, setSelectedOrder] = useState(null);
|
|
27
|
-
const [selectedService, setSelectedService] = useState(DEFAULT_SERVICE);
|
|
28
|
-
const saveButtonRef = useRef(null);
|
|
29
20
|
const [rowDetailsVisible, setRowDetailsVisible] = useState(false);
|
|
30
21
|
const [selectedRow, setSelectedRow] = useState(null);
|
|
31
|
-
const [searchPopupVisible, setSearchPopupVisible] = useState(false);
|
|
32
22
|
const [searchText, setSearchText] = useState("");
|
|
33
23
|
const [category, setCategory] = useState(0);
|
|
34
24
|
const [status, setStatus] = useState(0);
|
|
@@ -60,8 +50,6 @@ const OrdersMasterDetail = ({ dataSource, keyExpr, token, BaseUrl, ProjectId })
|
|
|
60
50
|
|
|
61
51
|
// RIGHT SIDE SEARCH
|
|
62
52
|
const [gridSearchText, setGridSearchText] = useState("");
|
|
63
|
-
const [searchHistory, setSearchHistory] = useState([]);
|
|
64
|
-
const searchHistoryRef = useRef([]);
|
|
65
53
|
|
|
66
54
|
|
|
67
55
|
useEffect(() => {
|
|
@@ -94,6 +82,36 @@ const OrdersMasterDetail = ({ dataSource, keyExpr, token, BaseUrl, ProjectId })
|
|
|
94
82
|
|
|
95
83
|
}, [ProjectId, BaseUrl, token]); // ✅ FIXED
|
|
96
84
|
|
|
85
|
+
useEffect(() => {
|
|
86
|
+
// ⛔ Project changed → FULL RESET
|
|
87
|
+
|
|
88
|
+
setOrders([]);
|
|
89
|
+
setFilteredOrders([]);
|
|
90
|
+
|
|
91
|
+
setSelectedOrder(null);
|
|
92
|
+
|
|
93
|
+
setGridStore(null);
|
|
94
|
+
setColumns([]);
|
|
95
|
+
|
|
96
|
+
setSelectedRow(null);
|
|
97
|
+
setRowDetailsVisible(false);
|
|
98
|
+
|
|
99
|
+
setSearchText("");
|
|
100
|
+
setGridSearchText("");
|
|
101
|
+
|
|
102
|
+
setSelectedRowKeys([]);
|
|
103
|
+
setExcludedKeys([]);
|
|
104
|
+
setSelectAll(false);
|
|
105
|
+
setWasFullyDeselected(false);
|
|
106
|
+
setFinalCount(0);
|
|
107
|
+
|
|
108
|
+
if (gridInstance) {
|
|
109
|
+
gridInstance.clearSelection();
|
|
110
|
+
gridInstance.searchByText("");
|
|
111
|
+
gridInstance.pageIndex(0);
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
}, [ProjectId]); // 🔥 THIS is the key
|
|
97
115
|
|
|
98
116
|
useEffect(() => {
|
|
99
117
|
if (!orders) return;
|
|
@@ -120,7 +138,6 @@ const OrdersMasterDetail = ({ dataSource, keyExpr, token, BaseUrl, ProjectId })
|
|
|
120
138
|
|
|
121
139
|
if (!sheet) return;
|
|
122
140
|
setSelectedOrder(sheet);
|
|
123
|
-
setSelectedService(sheet);
|
|
124
141
|
|
|
125
142
|
await loadColumns(sheet.id);
|
|
126
143
|
|
|
@@ -519,53 +536,6 @@ const OrdersMasterDetail = ({ dataSource, keyExpr, token, BaseUrl, ProjectId })
|
|
|
519
536
|
};
|
|
520
537
|
|
|
521
538
|
|
|
522
|
-
useEffect(() => {
|
|
523
|
-
fetch(`/api/search-history/1`)
|
|
524
|
-
.then(res => res.ok ? res.json() : [])
|
|
525
|
-
.then(data => {
|
|
526
|
-
if (data.length) {
|
|
527
|
-
setSearchHistory(data);
|
|
528
|
-
searchHistoryRef.current = data;
|
|
529
|
-
sessionStorage.setItem(STORAGE_KEY, JSON.stringify(data));
|
|
530
|
-
} else {
|
|
531
|
-
const stored = JSON.parse(sessionStorage.getItem(STORAGE_KEY)) || [];
|
|
532
|
-
setSearchHistory(stored);
|
|
533
|
-
searchHistoryRef.current = stored;
|
|
534
|
-
}
|
|
535
|
-
})
|
|
536
|
-
.catch(() => {
|
|
537
|
-
const stored = JSON.parse(sessionStorage.getItem(STORAGE_KEY)) || [];
|
|
538
|
-
setSearchHistory(stored);
|
|
539
|
-
searchHistoryRef.current = stored;
|
|
540
|
-
});
|
|
541
|
-
}, []);
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
useEffect(() => {
|
|
546
|
-
const handleStorageChange = (e) => {
|
|
547
|
-
if (e.key === STORAGE_KEY) {
|
|
548
|
-
const updated = JSON.parse(e.newValue) || [];
|
|
549
|
-
setSearchHistory(updated);
|
|
550
|
-
searchHistoryRef.current = updated;
|
|
551
|
-
}
|
|
552
|
-
};
|
|
553
|
-
window.addEventListener("storage", handleStorageChange);
|
|
554
|
-
return () => window.removeEventListener("storage", handleStorageChange);
|
|
555
|
-
}, []);
|
|
556
|
-
|
|
557
|
-
const updateSearchHistoryAPI = () => {
|
|
558
|
-
if (!searchHistoryRef.current.length) return;
|
|
559
|
-
|
|
560
|
-
navigator.sendBeacon(
|
|
561
|
-
"/api/search-history",
|
|
562
|
-
JSON.stringify({
|
|
563
|
-
userId: 1,
|
|
564
|
-
history: searchHistoryRef.current
|
|
565
|
-
})
|
|
566
|
-
);
|
|
567
|
-
};
|
|
568
|
-
|
|
569
539
|
useEffect(() => {
|
|
570
540
|
const handleVisibilityChange = () => {
|
|
571
541
|
if (document.visibilityState === "hidden") {
|
|
@@ -634,7 +604,6 @@ const OrdersMasterDetail = ({ dataSource, keyExpr, token, BaseUrl, ProjectId })
|
|
|
634
604
|
|
|
635
605
|
// ✅ Update selected service
|
|
636
606
|
setSelectedOrder(sheet);
|
|
637
|
-
setSelectedService(sheet);
|
|
638
607
|
await loadColumns(sheet.id);
|
|
639
608
|
|
|
640
609
|
// ✅ Reset grid state BEFORE assigning new store
|
|
@@ -816,92 +785,6 @@ const OrdersMasterDetail = ({ dataSource, keyExpr, token, BaseUrl, ProjectId })
|
|
|
816
785
|
</div>
|
|
817
786
|
</Popup>
|
|
818
787
|
)}
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
<Popup
|
|
822
|
-
visible={searchPopupVisible}
|
|
823
|
-
onHiding={() => setSearchPopupVisible(false)}
|
|
824
|
-
showTitle
|
|
825
|
-
title="Search History"
|
|
826
|
-
width={360}
|
|
827
|
-
height="100%"
|
|
828
|
-
dragEnabled={false}
|
|
829
|
-
closeOnOutsideClick
|
|
830
|
-
showCloseButton
|
|
831
|
-
position={{
|
|
832
|
-
my: "right top",
|
|
833
|
-
at: "right top",
|
|
834
|
-
of: window
|
|
835
|
-
}}
|
|
836
|
-
wrapperAttr={{ class: "right-search-popup" }}
|
|
837
|
-
>
|
|
838
|
-
<div style={{ padding: 16, height: "100%" }}>
|
|
839
|
-
{searchHistory.length > 0 ? (
|
|
840
|
-
<ul
|
|
841
|
-
style={{
|
|
842
|
-
listStyle: "none",
|
|
843
|
-
padding: 0,
|
|
844
|
-
margin: 0,
|
|
845
|
-
height: "100%",
|
|
846
|
-
overflowY: "auto"
|
|
847
|
-
}}
|
|
848
|
-
>
|
|
849
|
-
{searchHistory.map((s, i) => (
|
|
850
|
-
<li
|
|
851
|
-
key={i}
|
|
852
|
-
onClick={() => {
|
|
853
|
-
setGridSearchText(s);
|
|
854
|
-
setSearchPopupVisible(false);
|
|
855
|
-
}}
|
|
856
|
-
style={{
|
|
857
|
-
display: "flex",
|
|
858
|
-
alignItems: "center",
|
|
859
|
-
gap: 10,
|
|
860
|
-
padding: "10px 12px",
|
|
861
|
-
marginBottom: 8,
|
|
862
|
-
borderRadius: 8,
|
|
863
|
-
cursor: "pointer",
|
|
864
|
-
backgroundColor: "#f5f7fa",
|
|
865
|
-
transition: "all 0.2s ease"
|
|
866
|
-
}}
|
|
867
|
-
onMouseEnter={e => e.currentTarget.style.background = "#e6f0ff"}
|
|
868
|
-
onMouseLeave={e => e.currentTarget.style.background = "#f5f7fa"}
|
|
869
|
-
>
|
|
870
|
-
<span style={{ fontSize: 16, color: "#1976d2" }}>🔍</span>
|
|
871
|
-
<span
|
|
872
|
-
style={{
|
|
873
|
-
fontSize: 14,
|
|
874
|
-
color: "#333",
|
|
875
|
-
overflow: "hidden",
|
|
876
|
-
textOverflow: "ellipsis",
|
|
877
|
-
whiteSpace: "nowrap"
|
|
878
|
-
}}
|
|
879
|
-
title={s}
|
|
880
|
-
>
|
|
881
|
-
{s}
|
|
882
|
-
</span>
|
|
883
|
-
</li>
|
|
884
|
-
))}
|
|
885
|
-
</ul>
|
|
886
|
-
) : (
|
|
887
|
-
<div
|
|
888
|
-
style={{
|
|
889
|
-
height: "100%",
|
|
890
|
-
display: "flex",
|
|
891
|
-
alignItems: "center",
|
|
892
|
-
justifyContent: "center",
|
|
893
|
-
color: "#999",
|
|
894
|
-
fontSize: 14
|
|
895
|
-
}}
|
|
896
|
-
>
|
|
897
|
-
🔍 No search history available
|
|
898
|
-
</div>
|
|
899
|
-
)}
|
|
900
|
-
</div>
|
|
901
|
-
</Popup>
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
788
|
</div>
|
|
906
789
|
)}
|
|
907
790
|
</div>
|