mobigrid-module 1.1.6 → 1.1.9
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/CustomTable/CustomTable.d.ts +8 -0
- package/dist/components/CustomTable/Pagination.d.ts +8 -0
- package/dist/components/Icon.d.ts +6 -0
- package/dist/components/InvalidConfig.d.ts +2 -0
- package/dist/components/Layout/PageHeader.d.ts +13 -0
- package/dist/components/LoadingConfig.d.ts +2 -0
- package/dist/components/ui/alert.d.ts +8 -0
- package/dist/components/ui/button.d.ts +11 -0
- package/dist/components/ui/calendar.d.ts +8 -0
- package/dist/components/ui/date-picker-with-range.d.ts +7 -0
- package/dist/components/ui/dialog.d.ts +19 -0
- package/dist/components/ui/input.d.ts +3 -0
- package/dist/components/ui/pagination.d.ts +28 -0
- package/dist/components/ui/popover.d.ts +7 -0
- package/dist/components/ui/select.d.ts +13 -0
- package/dist/components/ui/sonner.d.ts +5 -0
- package/dist/components/ui/table.d.ts +10 -0
- package/dist/index.cjs +53 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.ts +9 -0
- package/dist/index.esm.js +70 -0
- package/dist/index.esm.js.map +1 -0
- package/dist/index.js +53 -0
- package/dist/index.js.map +1 -0
- package/dist/lib/utils.d.ts +2 -0
- package/dist/vite.config.d.ts +2 -0
- package/package.json +14 -10
- package/components/CustomTable/CustomTable.tsx +0 -182
- package/components/CustomTable/Pagination.tsx +0 -136
- package/components/Icon.tsx +0 -27
- package/components/InvalidConfig.tsx +0 -26
- package/components/Layout/PageHeader.tsx +0 -270
- package/components/LoadingConfig.tsx +0 -38
- package/components/ui/alert.tsx +0 -59
- package/components/ui/button.tsx +0 -57
- package/components/ui/calendar.tsx +0 -99
- package/components/ui/date-picker-with-range.tsx +0 -176
- package/components/ui/dialog.tsx +0 -132
- package/components/ui/input.tsx +0 -22
- package/components/ui/pagination.tsx +0 -142
- package/components/ui/popover.tsx +0 -31
- package/components/ui/select.tsx +0 -208
- package/components/ui/sonner.tsx +0 -30
- package/components/ui/table.tsx +0 -120
- package/index.d.ts +0 -55
- package/index.tsx +0 -209
- package/lib/utils.ts +0 -6
- package/tsconfig.json +0 -36
package/index.tsx
DELETED
@@ -1,209 +0,0 @@
|
|
1
|
-
import React from "react";
|
2
|
-
import { useEffect, useState } from "react";
|
3
|
-
import { format } from "date-fns";
|
4
|
-
import axios from "axios";
|
5
|
-
import { Alert, AlertTitle, AlertDescription } from "./components/ui/alert";
|
6
|
-
import { PageHeader } from "./components/Layout/PageHeader";
|
7
|
-
import { CustomTable } from "./components/CustomTable/CustomTable";
|
8
|
-
import Pagination from "./components/CustomTable/Pagination";
|
9
|
-
import LoadingConfig from "./components/LoadingConfig";
|
10
|
-
import InvalidConfig from "./components/InvalidConfig";
|
11
|
-
|
12
|
-
const ITEMS_PER_PAGE = 14;
|
13
|
-
|
14
|
-
interface ContainerProps {
|
15
|
-
configUrl: string;
|
16
|
-
preJsUrl: string;
|
17
|
-
itemsPerPage?: number;
|
18
|
-
children?: React.ReactNode;
|
19
|
-
}
|
20
|
-
|
21
|
-
const MobigridModule = ({
|
22
|
-
configUrl,
|
23
|
-
preJsUrl,
|
24
|
-
itemsPerPage = ITEMS_PER_PAGE,
|
25
|
-
children,
|
26
|
-
}: ContainerProps) => {
|
27
|
-
const [config, setConfig] = useState<any>(null);
|
28
|
-
const [invalidConfig, setInvalidConfig] = useState(false);
|
29
|
-
const [errors, setErrors] = useState<
|
30
|
-
Array<{
|
31
|
-
title: string;
|
32
|
-
message: string;
|
33
|
-
}>
|
34
|
-
>([]);
|
35
|
-
const [isLoading, setIsLoading] = useState(false);
|
36
|
-
const [data, setData] = useState([]);
|
37
|
-
const [count, setCount] = useState(0);
|
38
|
-
const [currentPage, setCurrentPage] = useState(1);
|
39
|
-
const [totalPages, setTotalPages] = useState(1);
|
40
|
-
const [filters, setFilters] = useState({
|
41
|
-
fromDate: new Date(
|
42
|
-
new Date().getFullYear(),
|
43
|
-
new Date().getMonth(),
|
44
|
-
1
|
45
|
-
).toLocaleString(),
|
46
|
-
toDate: new Date(
|
47
|
-
new Date().getFullYear(),
|
48
|
-
new Date().getMonth() + 1,
|
49
|
-
0,
|
50
|
-
23,
|
51
|
-
59,
|
52
|
-
59
|
53
|
-
).toLocaleString(),
|
54
|
-
});
|
55
|
-
const [filterOptions, setFilterOptions] = useState<any[]>([]);
|
56
|
-
|
57
|
-
useEffect(() => {
|
58
|
-
const loadConfig = async () => {
|
59
|
-
try {
|
60
|
-
const response = await fetch(configUrl);
|
61
|
-
const data = await response.json();
|
62
|
-
if (data && data.title && data.data_url && data.colomns) {
|
63
|
-
setConfig(data);
|
64
|
-
setFilterOptions(data.Filters?.flat() || []);
|
65
|
-
} else {
|
66
|
-
setInvalidConfig(true);
|
67
|
-
}
|
68
|
-
} catch (error) {
|
69
|
-
setInvalidConfig(true);
|
70
|
-
}
|
71
|
-
};
|
72
|
-
|
73
|
-
const loadFunctions = async () => {
|
74
|
-
const response = await fetch(preJsUrl);
|
75
|
-
const script = document.createElement("script");
|
76
|
-
script.textContent = await response.text();
|
77
|
-
document.head.appendChild(script);
|
78
|
-
};
|
79
|
-
|
80
|
-
if (configUrl && preJsUrl) {
|
81
|
-
loadConfig();
|
82
|
-
loadFunctions();
|
83
|
-
}
|
84
|
-
}, [configUrl, preJsUrl]);
|
85
|
-
|
86
|
-
useEffect(() => {
|
87
|
-
const controller = new AbortController();
|
88
|
-
|
89
|
-
const initializeFilters = async () => {
|
90
|
-
const filters = config?.Filters?.flat() || [];
|
91
|
-
for (const filter of filters) {
|
92
|
-
if (filter.type === "Select" && filter.urlSource) {
|
93
|
-
await fetchFilterOptions(filter, controller.signal);
|
94
|
-
}
|
95
|
-
}
|
96
|
-
};
|
97
|
-
|
98
|
-
if (config) initializeFilters();
|
99
|
-
|
100
|
-
return () => controller.abort();
|
101
|
-
}, [config]);
|
102
|
-
|
103
|
-
const getData = async () => {
|
104
|
-
setErrors([]);
|
105
|
-
const postBody = {
|
106
|
-
page: currentPage,
|
107
|
-
filters: {
|
108
|
-
...filters,
|
109
|
-
fromDate: format(filters.fromDate, "MM-dd-yyyy HH:mm"),
|
110
|
-
toDate: format(filters.toDate, "MM-dd-yyyy HH:mm"),
|
111
|
-
},
|
112
|
-
};
|
113
|
-
|
114
|
-
setIsLoading(true);
|
115
|
-
try {
|
116
|
-
const response = await axios.post(config.data_url, postBody);
|
117
|
-
setIsLoading(false);
|
118
|
-
|
119
|
-
if (response?.data) {
|
120
|
-
setData(response.data?.DATA);
|
121
|
-
setCount(response.data?.PAGESNUM);
|
122
|
-
setTotalPages(Math.ceil(response.data?.PAGESNUM / itemsPerPage) || 1);
|
123
|
-
} else {
|
124
|
-
setInvalidConfig(true);
|
125
|
-
}
|
126
|
-
} catch (error) {
|
127
|
-
setIsLoading(false);
|
128
|
-
setErrors((prev) => [
|
129
|
-
...prev,
|
130
|
-
{
|
131
|
-
title: "Erreur",
|
132
|
-
message: "Une erreur est survenue",
|
133
|
-
},
|
134
|
-
]);
|
135
|
-
}
|
136
|
-
};
|
137
|
-
|
138
|
-
const fetchFilterOptions = async (filter: any, signal?: AbortSignal) => {
|
139
|
-
if (filter.type === "Select" && filter.urlSource) {
|
140
|
-
try {
|
141
|
-
const response = await axios.get(filter.urlSource, { signal });
|
142
|
-
if (response?.status === 200 && response?.data) {
|
143
|
-
const options = Array.isArray(response.data) ? response.data : [];
|
144
|
-
setFilterOptions((prev) =>
|
145
|
-
prev.map((f) => (f.name === filter.name ? { ...f, options } : f))
|
146
|
-
);
|
147
|
-
}
|
148
|
-
} catch (error) {
|
149
|
-
if (!axios.isCancel(error)) {
|
150
|
-
setErrors((prev) => [
|
151
|
-
...prev,
|
152
|
-
{
|
153
|
-
title: "Erreur",
|
154
|
-
message: `Une erreur est survenue lors de la récupération des options pour ${filter.name}`,
|
155
|
-
},
|
156
|
-
]);
|
157
|
-
console.error(`Error fetching options for ${filter.name}:`, error);
|
158
|
-
}
|
159
|
-
}
|
160
|
-
}
|
161
|
-
};
|
162
|
-
|
163
|
-
if (invalidConfig) return <InvalidConfig />;
|
164
|
-
if (!config) return <LoadingConfig />;
|
165
|
-
return (
|
166
|
-
<div className="flex flex-col gap-4 p-4 max-w-[1300px] mx-auto mt-8 mb-">
|
167
|
-
<PageHeader
|
168
|
-
title={config.title}
|
169
|
-
configFilters={filterOptions}
|
170
|
-
filters={filters}
|
171
|
-
setFilters={setFilters}
|
172
|
-
onSearch={() => getData()}
|
173
|
-
count={count}
|
174
|
-
isLoading={isLoading}
|
175
|
-
setCurrentPage={setCurrentPage}
|
176
|
-
/>
|
177
|
-
{errors.map((error, index) => (
|
178
|
-
<Alert key={index} variant="destructive">
|
179
|
-
<svg
|
180
|
-
xmlns="http://www.w3.org/2000/svg"
|
181
|
-
fill="none"
|
182
|
-
viewBox="0 0 24 24"
|
183
|
-
strokeWidth="1.5"
|
184
|
-
stroke="currentColor"
|
185
|
-
className="size-6"
|
186
|
-
>
|
187
|
-
<path
|
188
|
-
strokeLinecap="round"
|
189
|
-
strokeLinejoin="round"
|
190
|
-
d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
|
191
|
-
/>
|
192
|
-
</svg>
|
193
|
-
|
194
|
-
<AlertTitle>{error.title}</AlertTitle>
|
195
|
-
<AlertDescription>{error.message}</AlertDescription>
|
196
|
-
</Alert>
|
197
|
-
))}
|
198
|
-
<CustomTable data={data} columns={config.colomns} isLoading={isLoading} />
|
199
|
-
<Pagination
|
200
|
-
currentPage={currentPage}
|
201
|
-
totalPages={totalPages}
|
202
|
-
onPageChange={setCurrentPage}
|
203
|
-
/>
|
204
|
-
{children}
|
205
|
-
</div>
|
206
|
-
);
|
207
|
-
};
|
208
|
-
|
209
|
-
export { MobigridModule as default };
|
package/lib/utils.ts
DELETED
package/tsconfig.json
DELETED
@@ -1,36 +0,0 @@
|
|
1
|
-
{
|
2
|
-
"compilerOptions": {
|
3
|
-
"target": "ES5",
|
4
|
-
"module": "ESNext",
|
5
|
-
"declaration": true,
|
6
|
-
"declarationDir": "dist/types",
|
7
|
-
"outDir": "dist",
|
8
|
-
"jsx": "react",
|
9
|
-
"strict": true,
|
10
|
-
"esModuleInterop": true,
|
11
|
-
"skipLibCheck": true,
|
12
|
-
"moduleResolution": "node",
|
13
|
-
"baseUrl": "./",
|
14
|
-
"paths": {
|
15
|
-
"*": [
|
16
|
-
"node_modules/*"
|
17
|
-
]
|
18
|
-
},
|
19
|
-
"typeRoots": [
|
20
|
-
"./node_modules/@types",
|
21
|
-
"./typings"
|
22
|
-
],
|
23
|
-
},
|
24
|
-
"include": [
|
25
|
-
"./**/*",
|
26
|
-
"typings",
|
27
|
-
"components",
|
28
|
-
"lib",
|
29
|
-
"types",
|
30
|
-
"index.tsx"
|
31
|
-
],
|
32
|
-
"exclude": [
|
33
|
-
"node_modules",
|
34
|
-
"dist"
|
35
|
-
]
|
36
|
-
}
|